/* «Свидание с книгой» (2026-09-21): t/svidanie.tpl. Каркас и кнопки — c/avtoram.css
   (система .lp). Специфичность как у остальных посадочных: body.skin-a .lp .sv-… */

body.skin-a .lp .sv-hero{padding:64px 0 118px}
body.skin-a .lp .sv-hero .lp-wrap{grid-template-columns:minmax(0,1fr)}
body.skin-a .lp .sv-hero .lp-hero-text{max-width:760px}
body.skin-a .lp .sv-hero .lp-lead{margin-bottom:24px}

/* --- сцена: выбор и карточка ---------------------------------------- */
body.skin-a .lp .sv-stage{margin-top:-78px; padding:0 0 72px; position:relative; z-index:1}
body.skin-a .lp .sv-wrap{max-width:820px; display:flex; flex-direction:column; gap:22px}
body.skin-a .lp .sv-pick{
	background:#FFFFFF; border:1px solid var(--lp-line); border-radius:10px;
	padding:18px 20px; display:flex; flex-direction:column; gap:12px;
	box-shadow:0 18px 40px -26px rgba(38,57,10,.45);
}
body.skin-a .lp .sv-cap{
	font-size:11.5px; letter-spacing:.1em; text-transform:uppercase; font-weight:600;
	color:var(--lp-muted); margin:0 0 8px; padding:0;
}
body.skin-a .lp .sv-genres{border:0; margin:0; padding:0; min-width:0; max-width:none; width:auto; display:flex; flex-wrap:wrap; gap:8px}
body.skin-a .lp .sv-genres legend{width:100%}
body.skin-a .lp .sv-chip{position:relative; display:inline-flex; cursor:pointer}
body.skin-a .lp .sv-chip input{position:absolute; opacity:0; width:1px; height:1px}
body.skin-a .lp .sv-chip span{
	display:inline-flex; align-items:center; min-height:36px; padding:6px 14px;
	border:1px solid #D8CDB4; border-radius:999px; background:var(--lp-paper);
	font-size:14.5px; line-height:1.3; color:var(--lp-ink); transition:background .15s, border-color .15s;
}
body.skin-a .lp .sv-chip:hover span{border-color:var(--lp-green)}
body.skin-a .lp .sv-chip input:checked + span{background:var(--lp-forest); border-color:var(--lp-forest); color:#FBFAF8}
body.skin-a .lp .sv-chip input:focus-visible + span{outline:3px solid var(--lp-orange); outline-offset:2px}
body.skin-a .lp .sv-adult{display:inline-flex; align-items:center; gap:9px; font-size:14px; color:var(--lp-muted); cursor:pointer; align-self:flex-start}
body.skin-a .lp .sv-adult input{margin:0; width:17px; height:17px; accent-color:var(--lp-green)}

body.skin-a .lp .sv-card{
	background:#FFFEFA; border:1px solid var(--lp-line); border-radius:10px;
	padding:34px 44px 30px; box-shadow:0 1px 0 rgba(0,0,0,.02), 0 24px 50px -34px rgba(38,57,10,.5);
	outline:none;
}
body.skin-a .lp .sv-card-head{display:flex; flex-wrap:wrap; align-items:center; gap:8px 16px; margin-bottom:22px; padding-bottom:16px; border-bottom:1px solid var(--lp-line)}
body.skin-a .lp .sv-age{
	display:inline-flex; align-items:center; justify-content:center; min-width:40px; height:26px; padding:0 8px;
	border:1.5px solid var(--lp-ink); border-radius:5px; font-size:13px; font-weight:600; font-variant-numeric:lining-nums;
}
body.skin-a .lp .sv-age:empty{display:none}
body.skin-a .lp .sv-age.is-18{border-color:#A03A1E; color:#A03A1E}
body.skin-a .lp .sv-meta{font-size:13.5px; color:var(--lp-muted)}
body.skin-a .lp .sv-meta:empty{display:none}
body.skin-a .lp .sv-meta-src{margin-left:auto}

body.skin-a .lp .sv-text{
	font-family:Georgia,'PT Serif','Times New Roman',serif; font-size:19px; line-height:1.72; color:#26221C;
	max-width:62ch; min-height:260px; hyphens:auto; overflow-wrap:break-word;
}
body.skin-a .lp .sv-text p{margin:0 0 .9em; text-indent:1.4em}
body.skin-a .lp .sv-text p:first-child{text-indent:0}
body.skin-a .lp .sv-text p:first-child::first-letter{
	font-family:var(--lp-serif); font-weight:700; float:left; font-size:3.1em; line-height:.9;
	padding:.06em .08em 0 0; color:var(--lp-green);
}
body.skin-a .lp .sv-text .sv-wait{font-family:var(--lp-sans); font-size:16px; color:var(--lp-muted); text-indent:0}
body.skin-a .lp .sv-text .sv-wait::first-letter{all:unset}
body.skin-a .lp .sv-card[aria-busy="true"] .sv-text{opacity:.55; transition:opacity .2s}

body.skin-a .lp .sv-actions{display:flex; flex-wrap:wrap; gap:12px; margin-top:26px; padding-top:22px; border-top:1px solid var(--lp-line)}
body.skin-a .lp .sv-actions[hidden], body.skin-a .lp .sv-reveal[hidden], body.skin-a .lp .sv-liked[hidden]{display:none}
body.skin-a .lp .sv-actions .lp-btn{min-height:50px}
body.skin-a .lp .sv-actions .lp-btn:disabled{opacity:.45; cursor:default; transform:none}
body.skin-a .lp .sv-hook svg{width:19px; height:19px}
body.skin-a .lp .sv-hook:hover svg{transform:none}

/* --- раскрытие ------------------------------------------------------ */
body.skin-a .lp .sv-reveal{
	display:grid; grid-template-columns:150px minmax(0,1fr); gap:26px; align-items:start;
	margin-top:26px; padding:24px; border-radius:8px; background:var(--lp-tint); outline:none;
	animation:sv-in .35s cubic-bezier(.2,.7,.2,1) both;
}
@keyframes sv-in{from{opacity:0; transform:translateY(8px)} to{opacity:1; transform:none}}
body.skin-a .lp .sv-cover{display:block; border-radius:4px; overflow:hidden; box-shadow:0 10px 22px -12px rgba(0,0,0,.45); background:var(--lp-sand)}
body.skin-a .lp .sv-cover img{display:block; width:150px; height:auto}
body.skin-a .lp .sv-r-body{min-width:0}
body.skin-a .lp .sv-r-title{font-family:var(--lp-serif); font-weight:700; font-size:30px; line-height:1.12; margin:0 0 6px; text-wrap:balance}
body.skin-a .lp .sv-r-author{font-size:17px; font-weight:600; margin:0 0 8px}
body.skin-a .lp .sv-r-facts{font-size:14px; color:var(--lp-muted); margin:0 0 18px}
body.skin-a .lp .sv-r-actions{display:flex; flex-wrap:wrap; gap:10px}
body.skin-a .lp .sv-r-actions .lp-btn{min-height:46px; padding-left:18px; padding-right:18px}

/* --- меня зацепило -------------------------------------------------- */
body.skin-a .lp .sv-liked{background:#FFFFFF; border:1px solid var(--lp-line); border-radius:10px; padding:22px 24px}
body.skin-a .lp .sv-liked-head{display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:12px}
body.skin-a .lp .sv-h2{font-family:var(--lp-serif); font-weight:700; font-size:26px; line-height:1.2; margin:0; text-wrap:balance}
body.skin-a .lp .sv-link{background:none; border:0; padding:0; font-size:14px; color:var(--lp-muted); text-decoration:underline; text-underline-offset:3px; cursor:pointer}
body.skin-a .lp .sv-link:hover{color:var(--lp-green)}
body.skin-a .lp .sv-liked-list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column}
body.skin-a .lp .sv-liked-list li{display:flex; flex-wrap:wrap; gap:4px 12px; align-items:baseline; padding:10px 0; border-bottom:1px solid #EFEBE2}
body.skin-a .lp .sv-liked-list li:last-child{border-bottom:0}
body.skin-a .lp .sv-liked-list a{font-weight:600}
body.skin-a .lp .sv-liked-list span{font-size:14px; color:var(--lp-muted)}
body.skin-a .lp .sv-note{font-size:13px; color:var(--lp-muted); margin:10px 0 0}

/* --- как устроено --------------------------------------------------- */
body.skin-a .lp .sv-how{padding:64px 0 88px; background:var(--lp-paper); border-top:1px solid var(--lp-line)}
body.skin-a .lp .sv-how .sv-h2{margin-bottom:26px}
body.skin-a .lp .sv-how-grid{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:28px}
body.skin-a .lp .sv-how-grid h3{font-size:17px; font-weight:600; margin:0 0 8px}
body.skin-a .lp .sv-how-grid p{font-size:15.5px; line-height:1.6; color:#4A4438}

@media (max-width:767px){
	body.skin-a .lp .sv-hero{padding:40px 0 92px}
	body.skin-a .lp h1.lp-h1{font-size:40px}
	body.skin-a .lp .sv-stage{margin-top:-60px; padding-bottom:48px}
	body.skin-a .lp .sv-wrap{padding:0 12px}
	body.skin-a .lp .sv-pick{padding:14px}
	body.skin-a .lp .sv-card{padding:22px 18px 20px}
	body.skin-a .lp .sv-meta-src{margin-left:0; width:100%}
	body.skin-a .lp .sv-text{font-size:17.5px; line-height:1.66; min-height:200px}
	body.skin-a .lp .sv-actions .lp-btn{flex:1 1 140px; justify-content:center}
	body.skin-a .lp .sv-reveal{grid-template-columns:96px minmax(0,1fr); gap:16px; padding:16px}
	body.skin-a .lp .sv-cover img{width:96px}
	body.skin-a .lp .sv-r-title{font-size:22px}
	body.skin-a .lp .sv-r-actions .lp-btn{flex:1 1 100%; justify-content:center}
	body.skin-a .lp .sv-how-grid{grid-template-columns:minmax(0,1fr); gap:20px}
}
@media (prefers-reduced-motion:reduce){
	body.skin-a .lp .sv-reveal{animation:none}
}