/* Веб-приложение Культроверта — экраны подбора (группа А). Токены и кнопки те же, что в журнале */
:root{
  --bone:#fffef7;--ink:#000;--charcoal:#4d4c4a;--graphite:#666;--ash:#aaa;--line:#d9d8d0;--paper:#efede4;
  --mist:#b4b8c6;--dline:rgba(255,254,247,.18);
  --serif:'Cormorant',Georgia,serif;--sans:'Onest',system-ui,sans-serif;
  --ease:cubic-bezier(.22,1,.36,1);
  --hh:64px;--g:16px;--bar:76px;
}
@media (min-width:768px){:root{--g:32px}}
@media (min-width:1280px){:root{--g:48px}}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scrollbar-gutter:stable}
body{margin:0;background:var(--bone);color:var(--ink);font-family:var(--sans);font-weight:300;font-size:16px;line-height:1.4;letter-spacing:-.018em;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:clip}
body.lock{overflow:hidden}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
em{font-style:italic}
button{font:inherit;color:inherit;letter-spacing:inherit;background:none;border:0;padding:0;cursor:pointer;text-align:inherit}
h1,h2,h3,p,ul,ol,dl,dd,figure{margin:0}
h1,h2,h3,h4{font-weight:400}   /* заголовки не должны получать жирное начертание браузера: у Cormorant его нет, получается подделка */
ul,ol{padding:0;list-style:none}
:focus-visible{outline:2px solid currentColor;outline-offset:3px}
[hidden]{display:none !important}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:16px;top:-60px;z-index:100;background:var(--ink);color:var(--bone);padding:10px 18px;border-radius:1440px}
.skip:focus-visible{top:12px}
.num{font-variant-numeric:tabular-nums lining-nums}
.on-dark{background:var(--ink);color:var(--bone)}
.kicker{font-size:12px;font-weight:400;text-transform:uppercase;letter-spacing:.04em;color:var(--graphite)}
.on-dark .kicker{color:var(--mist)}
.dir-tag{display:inline-flex;gap:6px;font-size:12px;font-weight:400;text-transform:uppercase;letter-spacing:.04em}
.dir-tag span + span::before{content:'/';margin-right:6px;opacity:.5}
.ic{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:1.25;stroke-linecap:round;stroke-linejoin:round}
.ic-f{fill:currentColor;stroke:none}

/* кнопки */
.pill{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 24px;border:1px solid currentColor;border-radius:1440px;background:transparent;font-size:16px;font-weight:400;white-space:nowrap;cursor:pointer;transition:background-color .25s ease-out,color .25s ease-out,border-color .25s ease-out,scale .2s ease-out}
.pill:active{scale:.97}
.pill-ink{background:var(--ink);color:var(--bone);border-color:var(--ink)}
.on-dark .pill-ink{background:var(--bone);color:var(--ink);border-color:var(--bone)}
.pill-s{min-height:40px;padding:0 18px;font-size:14px}
.txt{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-size:14px;font-weight:400;color:var(--graphite);transition:color .2s ease-out}
.txt[aria-pressed="true"]{color:var(--ink)}
@media (hover:hover){
  .pill:hover{background:var(--ink);color:var(--bone);border-color:var(--ink)}
  .pill-ink:hover{background:transparent;color:var(--ink)}
  .on-dark .pill:hover{background:var(--bone);color:var(--ink);border-color:var(--bone)}
  .on-dark .pill-ink:hover{background:transparent;color:var(--bone)}
  .txt:hover{color:var(--ink)}
}

/* шапка */
.ah{position:sticky;top:0;z-index:40;height:var(--hh);display:flex;align-items:center;gap:16px;padding:0 var(--g);background:var(--bone);border-bottom:1px solid var(--line)}
.ah-logo img{height:18px;width:auto}
.ah-nav{display:none;gap:28px;margin-left:auto;font-size:15px;font-weight:400}
.ah-nav a,.ah-nav button{min-height:44px;display:inline-flex;align-items:center;color:var(--graphite);transition:color .2s ease-out}
.ah-nav [aria-current="page"]{color:var(--ink)}
.ah-in{margin-left:auto;min-height:40px;padding:0 20px;font-size:15px}
@media (min-width:768px){.ah-nav{display:flex}.ah-in{margin-left:8px}}
@media (hover:hover){.ah-nav a:hover,.ah-nav button:hover{color:var(--ink)}}

/* общий каркас шага */
#view{display:block;min-height:calc(100svh - var(--hh));outline:none}
.step{padding:clamp(20px,3vw,40px) var(--g) clamp(48px,6vw,96px)}
.prog{display:flex;align-items:center;gap:14px}
.prog-bars{display:flex;gap:4px;flex:none}
.prog-bars i{width:28px;height:2px;background:var(--line)}
.prog-bars i[data-on]{background:var(--ink)}
.prog .txt{margin-left:auto}
.h1{margin-top:clamp(20px,2.4vw,36px);font-family:var(--serif);font-weight:400;font-size:clamp(52px,8.4vw,128px);line-height:.86;letter-spacing:-.04em;text-wrap:balance}
.lead{margin-top:18px;max-width:38ch;font-size:clamp(16px,1.3vw,19px);line-height:1.35;color:var(--graphite);text-wrap:pretty}
.step-head{display:grid;gap:0;margin-bottom:clamp(28px,3.6vw,56px)}
@media (min-width:1024px){.step-head{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);align-items:end;column-gap:64px}.step-head .prog{grid-column:1/-1}.step-head .lead{margin:0 0 .5em;justify-self:end}}
@media (prefers-reduced-motion:no-preference){.step > *{animation:rise .7s var(--ease) both}.step > :nth-child(2){animation-delay:.06s}.step > :nth-child(3){animation-delay:.12s}.step > :nth-child(4){animation-delay:.18s}}
@keyframes rise{from{opacity:0;translate:0 18px}}

/* 1. С чем помочь? */
.tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin:0 calc(-1 * var(--g));border-top:1px solid var(--ink)}
.tile{position:relative;display:flex;flex-direction:column;justify-content:space-between;gap:28px;min-height:clamp(148px,17vw,248px);padding:16px var(--g) 18px;border-bottom:1px solid var(--line);transition:background-color .25s ease-out,color .25s ease-out}
.tile:nth-child(2n){border-left:1px solid var(--line)}
.tile-n{font-size:12px;font-weight:400;color:var(--graphite);transition:color .25s ease-out}
.tile-t{display:block;font-family:var(--serif);font-size:clamp(26px,3.1vw,48px);line-height:.92;letter-spacing:-.03em;text-wrap:balance}
.tile-d{display:block;margin-top:8px;font-size:13px;line-height:1.25;color:var(--graphite);transition:color .25s ease-out}
.tile:active{background:var(--paper)}
@media (min-width:768px){.tile{padding:20px var(--g) 24px}.tile-d{font-size:15px}}
@media (min-width:1024px){
  .tiles{grid-template-columns:repeat(3,minmax(0,1fr))}
  .tile:nth-child(2n){border-left:0}
  .tile:not(:nth-child(3n+1)){border-left:1px solid var(--line)}
}
@media (hover:hover){.tile:hover{background:var(--ink);color:var(--bone)}.tile:hover .tile-n,.tile:hover .tile-d{color:var(--mist)}}
.s1-low{display:grid;margin:0 calc(-1 * var(--g))}
.check{display:flex;flex-direction:column;justify-content:space-between;gap:32px;padding:24px var(--g) 28px;min-height:200px}
.check-t{font-family:var(--serif);font-size:clamp(30px,3.4vw,52px);line-height:.92;letter-spacing:-.03em;text-wrap:balance;max-width:14ch}
.check-go{display:inline-flex;align-items:center;gap:10px;font-size:15px;font-weight:400}
.check-go .ic{transition:translate .3s var(--ease)}
@media (hover:hover){.check:hover .check-go .ic{translate:6px 0}}
.free{display:flex;flex-direction:column;justify-content:center;gap:14px;padding:28px var(--g) 0}
.free-t{font-family:var(--serif);font-size:clamp(26px,2.4vw,36px);line-height:.95;letter-spacing:-.025em}
.field{display:flex;align-items:center;gap:6px;padding:5px 5px 5px 22px;border:1px solid var(--ash);border-radius:1440px;transition:border-color .2s ease-out}
.field:focus-within{border-color:var(--ink)}
.field[data-bad]{border-color:#c4442f}
.field input{all:unset;flex:1;min-width:0;min-height:46px;font-size:16px}
.field input::placeholder{color:var(--ash)}
.field .pill{flex:none}
.free-h{font-size:13px;line-height:1.35;color:var(--graphite)}
.free-h b{font-weight:400;color:var(--ink)}
.free-ex{display:flex;flex-wrap:wrap;gap:8px}
@media (min-width:1024px){.s1-low{grid-template-columns:minmax(0,1fr) minmax(0,2fr)}.free{padding:28px var(--g) 28px clamp(32px,4vw,72px);border-bottom:1px solid var(--line)}.free .field{max-width:680px}}
@media (max-width:420px){.field .pill{padding:0 16px}}

/* чипы и варианты */
.chip{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 16px;border:1px solid var(--ash);border-radius:1440px;font-size:14px;font-weight:400;white-space:nowrap;transition:border-color .2s ease-out,background-color .2s ease-out,color .2s ease-out}
@media (hover:hover){button.chip:hover,a.chip:hover{border-color:var(--ink)}}
.sum{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.sum .chip{min-height:34px;padding:0 12px;font-size:13px;border-color:var(--line);background:var(--paper)}
.note{display:flex;gap:12px;align-items:flex-start;margin-top:20px;padding:14px 0;border-top:1px solid var(--ink);border-bottom:1px solid var(--line);font-size:14px;line-height:1.35}
.note b{font-weight:400}
.note .kicker{flex:none;padding-top:2px}

/* 2. Когда и с кем? */
.grp{margin:0 calc(-1 * var(--g));border-top:1px solid var(--ink)}
.grp + .grp{margin-top:clamp(28px,3vw,44px)}
.grp-h{display:flex;justify-content:space-between;align-items:baseline;padding:14px var(--g);border-bottom:1px solid var(--line)}
.opts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
.opt{position:relative;display:flex;align-items:flex-end;min-height:clamp(96px,11vw,168px);padding:14px var(--g) 16px;border-bottom:1px solid var(--line);font-family:var(--serif);font-size:clamp(28px,3.4vw,52px);line-height:.92;letter-spacing:-.03em;transition:background-color .25s ease-out,color .25s ease-out}
.opt:nth-child(2n){border-left:1px solid var(--line)}
.opt[aria-checked="true"]{background:var(--ink);color:var(--bone)}
.opt::after{content:'';position:absolute;right:var(--g);top:16px;width:18px;height:18px;border:1px solid var(--ash);border-radius:50%;transition:background-color .2s ease-out,border-color .2s ease-out}
.opt[aria-checked="true"]::after{background:var(--bone);border-color:var(--bone)}
.opts-4{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:1024px){.opts-4{grid-template-columns:repeat(4,minmax(0,1fr))}.opts-4 .opt:nth-child(2n){border-left:0}.opts-4 .opt:not(:first-child){border-left:1px solid var(--line)}}
@media (hover:hover){.opt:not([aria-checked="true"]):hover{background:var(--paper)}}
.ages{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:16px var(--g);border-bottom:1px solid var(--line)}
.ages .kicker{margin-right:8px}
.ages .chip[aria-checked="true"]{background:var(--ink);color:var(--bone);border-color:var(--ink)}
.next{position:sticky;bottom:0;z-index:5;display:flex;align-items:center;gap:16px;margin:clamp(28px,3vw,44px) calc(-1 * var(--g)) 0;padding:12px var(--g) calc(12px + env(safe-area-inset-bottom));background:var(--bone);border-top:1px solid var(--line)}
.next-h{flex:1;min-width:0;font-size:13px;line-height:1.3;color:var(--graphite)}
.next-h[data-err]{color:#c4442f}
.next .pill{min-width:160px}
@media (max-width:520px){.next .pill{min-width:132px}}

/* 3. Какой досуг? */
.moods{margin:0 calc(-1 * var(--g));border-top:1px solid var(--ink)}
.mood{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:8px 24px;width:100%;padding:clamp(20px,2.6vw,36px) var(--g);border-bottom:1px solid var(--line);transition:background-color .25s ease-out,color .25s ease-out}
.mood-t{font-family:var(--serif);font-size:clamp(36px,5.6vw,88px);line-height:.88;letter-spacing:-.035em;text-wrap:balance}
.mood-d{grid-column:1;font-size:clamp(14px,1.2vw,17px);line-height:1.3;color:var(--graphite);transition:color .25s ease-out}
.mood .ic{grid-column:2;grid-row:1 / span 2;align-self:center;width:28px;height:28px;transition:translate .3s var(--ease)}
.mood[aria-checked="true"]{background:var(--ink);color:var(--bone)}
.mood[aria-checked="true"] .mood-d{color:var(--mist)}
@media (hover:hover){.mood:hover{background:var(--ink);color:var(--bone)}.mood:hover .mood-d{color:var(--mist)}.mood:hover .ic{translate:8px 0}}
.skipline{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:20px}

/* 4. Подбираем */
.wait{display:flex;flex-direction:column;justify-content:center;gap:32px;min-height:calc(100svh - var(--hh));padding:0 var(--g) 12svh}
.wait-t{max-width:14ch;font-family:var(--serif);font-style:italic;font-size:clamp(48px,7.4vw,112px);line-height:.88;letter-spacing:-.035em;text-wrap:balance}
.wait-l{position:relative;height:1px;background:rgba(255,254,247,.25);max-width:520px}
.wait-l i{position:absolute;inset:0;background:var(--bone);transform-origin:left;transform:scaleX(0)}
.wait-s{display:flex;flex-direction:column;gap:6px;font-size:14px;color:var(--mist)}
.wait-s li{display:flex;gap:10px;align-items:center;opacity:.35;transition:opacity .4s ease-out}
.wait-s li[data-on]{opacity:1}
.wait-s li::before{content:'';width:6px;height:6px;border-radius:50%;background:currentColor}

/* 5. Три решения */
.pk-head{padding:clamp(20px,3vw,40px) var(--g) clamp(20px,2.4vw,36px)}
.pk-top{display:flex;align-items:center;justify-content:space-between;gap:16px}
.pk-h{margin-top:clamp(16px,2vw,28px);font-family:var(--serif);font-weight:400;font-size:clamp(46px,7vw,112px);line-height:.86;letter-spacing:-.04em;text-wrap:balance}
.pk-h em{display:block}
.pk-sum{margin-top:20px}
.pk-count{display:flex;align-items:center;gap:12px;padding:10px var(--g);border-top:1px solid var(--ink);font-size:13px;font-weight:400}
.pk-dots{display:flex;gap:4px;margin-left:auto}
.pk-dots i{width:20px;height:2px;background:var(--line);transition:background-color .2s ease-out}
.pk-dots i[data-on]{background:var(--ink)}
.picks{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;border-top:1px solid var(--line);border-bottom:1px solid var(--line);overscroll-behavior-x:contain}
.picks::-webkit-scrollbar{display:none}
.pk{position:relative;flex:none;width:min(86vw,420px);scroll-snap-align:start;display:flex;flex-direction:column;border-right:1px solid var(--line);background:var(--bone)}
.pk > *{padding-inline:16px}
.pk-ph{position:relative;padding:0;aspect-ratio:3/2;overflow:hidden;background:var(--paper)}
.pk-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:scale 1.2s var(--ease)}
.pk-badge{position:absolute;left:12px;top:12px;display:inline-flex;align-items:center;min-height:28px;padding:0 12px;border-radius:1440px;background:var(--bone);font-size:11px;font-weight:400;text-transform:uppercase;letter-spacing:.04em}
.pk-tag{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding-top:16px;color:var(--graphite)}
.pk-tag .dir-tag{color:var(--ink)}
.pk-t{padding-top:12px;font-family:var(--serif);font-weight:400;font-size:clamp(30px,2.5vw,38px);line-height:.92;letter-spacing:-.03em;text-wrap:balance}
.pk-p{padding-top:10px;font-size:15px;line-height:1.35;color:var(--charcoal);text-wrap:pretty}
.metas{display:flex;flex-wrap:wrap;gap:6px;padding-top:16px;align-content:flex-start}
.meta{display:inline-flex;align-items:center;min-height:28px;padding:0 10px;border:1px solid var(--line);border-radius:1440px;font-size:12px;font-weight:400;white-space:nowrap}
.meta-ink{background:var(--ink);border-color:var(--ink);color:var(--bone)}
.pk-why{margin-top:16px;padding-top:12px;padding-bottom:0;font-size:14px;line-height:1.35}
.pk-why::before{content:'';display:block;height:1px;background:var(--line);margin-bottom:12px}
.pk-why .kicker{display:block;margin-bottom:4px}
.pk-foot{display:flex;align-items:center;gap:10px;margin-top:auto;padding-top:20px}
.pk-cur{display:flex;align-items:center;gap:10px;min-width:0;font-size:13px;line-height:1.2}
.pk-cur img{width:36px;height:36px;border-radius:50%;object-fit:cover;flex:none;background:var(--paper)}
.pk-cur span span{display:block;color:var(--graphite)}
.pk-foot .pill{margin-left:auto;flex:none}
.pk-acts{display:flex;justify-content:space-between;gap:8px;margin-top:14px;border-top:1px solid var(--line)}
.pk-off{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;justify-content:center;gap:12px;padding:24px 16px;background:var(--bone)}
.pk-off-t{font-family:var(--serif);font-size:30px;line-height:.95;letter-spacing:-.025em}
.pk-off p{font-size:14px;color:var(--graphite)}
.pk-hint{justify-content:center;gap:16px;padding-block:28px;background:var(--paper)}
.pk-hint-t{font-family:var(--serif);font-size:clamp(30px,2.6vw,40px);line-height:.92;letter-spacing:-.03em;text-wrap:balance}
.pk-hint p{font-size:15px;line-height:1.35;color:var(--charcoal)}
.pk-hint ul{display:flex;flex-wrap:wrap;gap:8px}
.pk-hint .pill{align-self:flex-start}
@media (hover:hover){.pk:hover .pk-ph img{scale:1.03}}
@media (min-width:1024px){
  .pk-count{display:none}
  .picks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(8,auto);overflow:visible;border-top:1px solid var(--ink)}
  .pk{width:auto;display:grid;grid-row:span 8;grid-template-rows:subgrid;border-right:0;border-left:1px solid var(--line)}
  .pk:first-child{border-left:0}
  .pk > *{padding-inline:clamp(20px,1.9vw,28px)}
  .pk-ph{padding:0;aspect-ratio:4/3}
  .pk-foot{margin-top:0}
  .pk-hint{display:flex;grid-template-rows:none}
}
.pk-more{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px;padding:20px var(--g)}
.pk-more p{font-size:14px;color:var(--graphite)}
.none{padding:clamp(40px,6vw,96px) var(--g);border-top:1px solid var(--ink)}
.none-t{max-width:16ch;font-family:var(--serif);font-size:clamp(40px,5.4vw,80px);line-height:.88;letter-spacing:-.035em;text-wrap:balance}
.none p{margin-top:18px;max-width:44ch;font-size:16px;line-height:1.4;color:var(--charcoal)}
.none ul{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
.none-acts{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.asm{display:grid;gap:24px;align-items:end;padding:clamp(40px,5vw,80px) var(--g)}
.asm-t{margin-top:14px;font-family:var(--serif);font-size:clamp(40px,5.2vw,80px);line-height:.88;letter-spacing:-.035em;text-wrap:balance}
.asm-t em{display:block}
.asm p{max-width:42ch;font-size:16px;line-height:1.4;color:var(--mist)}
.asm-r{display:flex;flex-direction:column;align-items:flex-start;gap:20px}
@media (min-width:1024px){.asm{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);column-gap:64px}}

/* 6. Карточка сценария */
.sheet{position:fixed;inset:0;z-index:60}
.sheet-bg{position:absolute;inset:0;background:rgba(0,0,0,.5);opacity:0;transition:opacity .35s ease-out}
.sheet-box{position:absolute;inset:12px 0 0;display:flex;flex-direction:column;background:var(--bone);border-radius:20px 20px 0 0;overflow:hidden;translate:0 100%;transition:translate .5s var(--ease)}
.sheet[data-open] .sheet-bg{opacity:1}
.sheet[data-open] .sheet-box{translate:0 0}
.sc-top{position:absolute;inset:0 0 auto;z-index:3;display:flex;justify-content:space-between;padding:12px;pointer-events:none}
.sc-top button{pointer-events:auto;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--bone);border:1px solid var(--line)}
.sc-scroll{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.sc-car{position:relative;background:var(--paper)}
.sc-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.sc-track::-webkit-scrollbar{display:none}
.sc-track img{flex:none;width:100%;aspect-ratio:4/3;object-fit:cover;scroll-snap-align:start}
.sc-cnt{position:absolute;right:12px;bottom:12px;min-height:28px;display:inline-flex;align-items:center;padding:0 10px;border-radius:1440px;background:rgba(0,0,0,.6);color:var(--bone);font-size:12px;font-weight:400}
.sc-b{padding:20px var(--g) 8px}
.sc-tags{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 16px;color:var(--graphite)}
.sc-tags .dir-tag{color:var(--ink)}
.sc-t{margin-top:14px;font-family:var(--serif);font-weight:400;font-size:clamp(38px,4vw,60px);line-height:.88;letter-spacing:-.035em;text-wrap:balance}
.sc-p{margin-top:14px;max-width:44ch;font-size:17px;line-height:1.35;color:var(--charcoal);text-wrap:pretty}
.sc-listen{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.sc-listen .pill{flex:1 1 auto}
.sc-sec{padding:22px 0;border-top:1px solid var(--line)}
.sc-sec:first-of-type{margin-top:26px;border-top-color:var(--ink)}
.sc-sec > .kicker{display:block;margin-bottom:12px}
.sc-sec p{max-width:60ch;font-size:16px;line-height:1.45;text-wrap:pretty}
.sc-big{font-family:var(--serif);font-size:clamp(24px,2.1vw,30px) !important;line-height:1.02 !important;letter-spacing:-.02em}
.sc-src{margin-top:10px;font-size:13px !important;color:var(--graphite)}
.sc-link{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-size:15px;font-weight:400;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.2em}
.seg{display:flex;flex-direction:column;gap:8px}
.seg + .seg{margin-top:16px}
.seg-row{display:flex;gap:0;border:1px solid var(--ash);border-radius:1440px;padding:3px}
.seg-row button{flex:1;min-height:40px;padding:0 12px;border-radius:1440px;font-size:14px;font-weight:400;text-align:center;white-space:nowrap;transition:background-color .2s ease-out,color .2s ease-out}
.seg-row button[aria-checked="true"]{background:var(--ink);color:var(--bone)}
.facts > div{display:grid;grid-template-columns:minmax(0,9fr) minmax(0,16fr);gap:16px;padding:13px 0;border-bottom:1px solid var(--line)}
.facts > div:first-child{padding-top:0}
.facts > div:last-child{border-bottom:0;padding-bottom:0}
.facts dt{padding-top:3px;font-size:12px;font-weight:400;text-transform:uppercase;letter-spacing:.04em;color:var(--graphite)}
.facts dd{font-size:16px;line-height:1.35}
.facts dd span{display:block;margin-top:2px;font-size:14px;color:var(--graphite)}
.facts dd .sc-link{min-height:44px;font-size:14px}
.sc-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.vd-mini{display:grid;gap:10px;padding:16px;background:var(--paper)}
.vd-mini b{font-family:var(--serif);font-weight:400;font-size:26px;line-height:.95;letter-spacing:-.02em}
.vd-mini .mark{align-self:flex-start;justify-self:start}
.mark{display:inline-flex;align-items:center;min-height:26px;padding:0 10px;border:1px solid var(--ink);border-radius:1440px;background:var(--ink);color:var(--bone);font-size:11px;font-weight:400;text-transform:uppercase;letter-spacing:.04em}
.steps{counter-reset:st}
.steps li{position:relative;display:grid;grid-template-columns:56px minmax(0,1fr);gap:0 12px;padding:14px 0;border-top:1px solid var(--line)}
.steps li:first-child{border-top:0;padding-top:0}
.steps time{padding-top:3px;font-size:13px;font-weight:400;color:var(--graphite)}
.steps b{display:block;font-family:var(--serif);font-weight:400;font-size:24px;line-height:1;letter-spacing:-.02em}
.steps span{display:block;margin-top:6px;font-size:15px;line-height:1.35;color:var(--charcoal)}
.steps li[data-lock] b{display:flex;align-items:center;gap:8px;color:var(--graphite)}
.steps li[data-lock] .ic{width:16px;height:16px}
.lockline{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:16px;padding:14px 16px;background:var(--paper);font-size:14px;line-height:1.3}
.near li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 16px;padding:12px 0;border-top:1px solid var(--line)}
.near li:first-child{border-top:0;padding-top:0}
.near b{font-weight:400;font-size:16px}
.near span{font-size:14px;color:var(--graphite)}
.near span:last-child{grid-column:1 / -1}
.near-n{margin-top:12px;font-size:13px !important;color:var(--graphite)}
.sc-cur{display:flex;align-items:center;gap:14px}
.sc-cur img:first-child{width:56px;height:56px;border-radius:50%;object-fit:cover;flex:none}
.sc-cur div{display:flex;flex-direction:column;gap:2px;font-size:15px;line-height:1.2}
.sc-cur div span{font-size:13px;color:var(--graphite)}
.sc-cur .sig{width:110px;margin-left:auto}
.sc-end{height:24px}
.sc-bar{flex:none;display:flex;align-items:center;gap:12px;padding:12px var(--g) calc(12px + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:var(--bone)}
.sc-price{display:flex;flex-direction:column;line-height:1}
.sc-price b{font-family:var(--serif);font-weight:400;font-size:30px;letter-spacing:-.02em}
.sc-price span{margin-top:4px;font-size:12px;color:var(--graphite)}
.sc-bar .pill-ink{flex:1;min-width:0}
.sc-save{display:grid;place-items:center;width:48px;height:48px;flex:none;border:1px solid var(--ash);border-radius:50%;transition:background-color .2s ease-out,color .2s ease-out,border-color .2s ease-out}
.sc-save[aria-pressed="true"]{background:var(--ink);color:var(--bone);border-color:var(--ink)}
.sc-save[aria-pressed="true"] .ic{fill:currentColor}
@media (min-width:1024px){
  .sheet-box{inset:auto;left:50%;top:50%;width:min(1180px,calc(100vw - 64px));height:min(860px,calc(100svh - 64px));border-radius:0;translate:-50% calc(-50% + 40px);opacity:0;transition:translate .5s var(--ease),opacity .3s ease-out;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);grid-template-rows:minmax(0,1fr) auto}
  .sheet[data-open] .sheet-box{translate:-50% -50%;opacity:1}
  .sc-scroll{display:contents}
  .sc-car{grid-column:1;grid-row:1 / span 2}
  .sc-track{height:100%}
  .sc-track img{height:100%;aspect-ratio:auto}
  .sc-b{grid-column:2;grid-row:1;overflow-y:auto;overscroll-behavior:contain;padding:28px clamp(28px,3vw,48px) 8px}
  .sc-bar{grid-column:2;grid-row:2;padding-inline:clamp(28px,3vw,48px)}
  .sc-top{justify-content:flex-end}
  .sc-top [data-handle]{display:none}
  .sc-listen .pill{flex:0 1 auto}
}

/* 7. Аудио */
.mini{position:fixed;left:0;right:0;bottom:0;z-index:55;display:flex;align-items:center;gap:12px;padding:10px var(--g) calc(10px + env(safe-area-inset-bottom));background:var(--ink);color:var(--bone)}
body.has-sheet .mini{z-index:65;bottom:calc(var(--bar) + env(safe-area-inset-bottom))}
.mini-l{position:absolute;left:0;right:0;top:0;height:2px;background:var(--dline)}
.mini-l i{position:absolute;inset:0;background:var(--bone);transform-origin:left;transform:scaleX(0)}
.rb{display:grid;place-items:center;width:44px;height:44px;flex:none;border-radius:50%;border:1px solid currentColor;transition:scale .2s ease-out}
.rb:active{scale:.95}
.mini-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;font-size:14px;line-height:1.2}
.mini-t b{font-weight:400;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.mini-t span{font-size:12px;color:var(--mist)}
.mini .txt{color:var(--mist);min-width:44px;justify-content:center}
@media (hover:hover){.mini .txt:hover{color:var(--bone)}}
@media (min-width:1024px){.mini{left:auto;right:24px;bottom:24px;width:420px;padding:12px 16px}body.has-sheet .mini{bottom:24px}}
.player{position:fixed;inset:0;z-index:70}
.player-box{position:absolute;inset:0;display:flex;flex-direction:column;background:var(--ink);color:var(--bone);translate:0 100%;transition:translate .5s var(--ease)}
.player[data-open] .player-box{translate:0 0}
.pl-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px var(--g);border-bottom:1px solid var(--dline)}
.pl-main{flex:1;min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr)}
.pl-now{padding:24px var(--g) 20px;border-bottom:1px solid var(--dline)}
.pl-t{margin-top:12px;font-family:var(--serif);font-weight:400;font-size:clamp(34px,4.4vw,64px);line-height:.9;letter-spacing:-.03em;text-wrap:balance}
.pl-by{display:flex;align-items:center;gap:10px;margin-top:16px;font-size:14px;color:var(--mist)}
.pl-by img{width:32px;height:32px;border-radius:50%;object-fit:cover}
.pl-range{width:100%;margin-top:26px;appearance:none;-webkit-appearance:none;height:24px;background:transparent;cursor:pointer}
.pl-range::-webkit-slider-runnable-track{height:2px;background:linear-gradient(to right,var(--bone) var(--p,0%),var(--dline) var(--p,0%))}
.pl-range::-moz-range-track{height:2px;background:var(--dline)}
.pl-range::-moz-range-progress{height:2px;background:var(--bone)}
.pl-range::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;margin-top:-6px;border-radius:50%;background:var(--bone)}
.pl-range::-moz-range-thumb{width:14px;height:14px;border:0;border-radius:50%;background:var(--bone)}
.pl-time{display:flex;justify-content:space-between;font-size:13px;color:var(--mist)}
.pl-ctl{display:flex;align-items:center;justify-content:center;gap:clamp(14px,3vw,28px);margin-top:14px}
.pl-ctl .rb{width:52px;height:52px;font-size:13px;font-weight:400}
.pl-ctl .rb-main{width:72px;height:72px;background:var(--bone);color:var(--ink);border-color:var(--bone)}
.pl-ctl .rb-main .ic{width:26px;height:26px}
.pl-speed{min-width:64px;min-height:44px;padding:0 12px;border:1px solid var(--dline);border-radius:1440px;font-size:14px;font-weight:400;text-align:center}
.pl-tr{overflow-y:auto;overscroll-behavior:contain;padding:8px var(--g) calc(32px + env(safe-area-inset-bottom))}
.pl-tr .kicker{display:block;padding:16px 0 8px}
.pl-tr li button{display:grid;grid-template-columns:48px minmax(0,1fr);gap:12px;width:100%;padding:14px 0;border-top:1px solid var(--dline);font-family:var(--serif);font-size:clamp(22px,2vw,28px);line-height:1.05;letter-spacing:-.015em;color:rgba(255,254,247,.45);transition:color .3s ease-out}
.pl-tr li button time{padding-top:5px;font-family:var(--sans);font-size:13px;font-weight:400;letter-spacing:0}
.pl-tr li button[data-on]{color:var(--bone)}
@media (min-width:1024px){
  .pl-main{grid-template-rows:none;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .pl-now{display:flex;flex-direction:column;justify-content:center;padding:48px var(--g);border-bottom:0;border-right:1px solid var(--dline)}
  .pl-tr{padding:24px clamp(32px,4vw,72px) 48px}
}

/* сообщения */
.toast{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom));z-index:90;translate:-50% 24px;max-width:min(520px,calc(100vw - 32px));padding:12px 18px;border-radius:14px;background:var(--ink);color:var(--bone);font-size:14px;line-height:1.3;text-align:center;opacity:0;pointer-events:none;transition:opacity .25s ease-out,translate .35s var(--ease)}
.toast[data-on]{opacity:1;translate:-50% 0}
body.has-mini .toast{bottom:calc(84px + env(safe-area-inset-bottom))}

/* навигация по экранам прототипа */
.proto{padding:24px var(--g) calc(28px + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:var(--paper)}
.proto-nav{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.proto-nav a{display:inline-flex;align-items:center;min-height:36px;padding:0 14px;border:1px solid var(--ash);border-radius:1440px;font-size:13px;font-weight:400;background:var(--bone)}
body.has-mini .proto{padding-bottom:96px}
@media (hover:hover){.proto-nav a:hover{border-color:var(--ink)}}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms !important;transition-duration:.01ms !important}}

/* правки после первого прогона */
.check-t{max-width:18ch}
.sc-top{justify-content:flex-end}
@media (min-width:1024px){
  .tile{min-height:clamp(150px,calc((100svh - var(--hh) - 440px) / 2),248px)}
  .check{min-height:0}
}
.s1-low{grid-template-columns:minmax(0,1fr)}
.free-ex .chip{white-space:normal;text-align:left;padding-block:9px;border-radius:20px;line-height:1.25}
@media (min-width:1024px){.s1-low{grid-template-columns:minmax(0,1fr) minmax(0,2fr)}}

/* ===== группа Б: вход, оплата, план, Telegram ===== */
.ah-me{margin-left:auto;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--ink);color:var(--bone);font-size:15px;font-weight:400}
@media (min-width:768px){.ah-me{margin-left:8px}}
.proto-box{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin-top:20px;padding:12px 14px;border:1px dashed var(--ash)}
.on-dark .proto-box{border-color:var(--dline)}

/* 8–9. Вход */
.modal{position:fixed;inset:0;z-index:80;display:flex;align-items:flex-end;justify-content:center}
.modal-bg{position:absolute;inset:0;background:rgba(0,0,0,.55);opacity:0;transition:opacity .3s ease-out}
.modal-box{position:relative;width:100%;max-height:calc(100svh - 24px);overflow-y:auto;overscroll-behavior:contain;padding:28px var(--g) calc(28px + env(safe-area-inset-bottom));background:var(--bone);border-radius:20px 20px 0 0;translate:0 100%;transition:translate .45s var(--ease),opacity .3s ease-out}
.modal[data-open] .modal-bg{opacity:1}
.modal[data-open] .modal-box{translate:0 0}
.modal-x{position:absolute;right:12px;top:12px;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;border:1px solid var(--line)}
.modal-t{margin-top:14px;max-width:13ch;font-family:var(--serif);font-weight:400;font-size:clamp(38px,4vw,52px);line-height:.9;letter-spacing:-.035em;text-wrap:balance;outline:none}
.modal-l{margin-top:14px;max-width:44ch;font-size:16px;line-height:1.4;color:var(--charcoal);text-wrap:pretty}
.modal-l b{font-weight:400;color:var(--ink);overflow-wrap:anywhere}
.modal form{margin-top:22px}
.ck{display:grid;grid-template-columns:22px minmax(0,1fr);gap:12px;align-items:start;padding:12px 0;border-top:1px solid var(--line);font-size:14px;line-height:1.35;cursor:pointer}
.ck:first-child{border-top-color:var(--ink)}
.ck input{appearance:none;-webkit-appearance:none;width:22px;height:22px;margin:0;border:1px solid var(--ash);border-radius:6px;background:var(--bone);display:grid;place-items:center;cursor:pointer;transition:background-color .15s ease-out,border-color .15s ease-out}
.ck input::after{content:'';width:10px;height:6px;border-left:1.5px solid var(--bone);border-bottom:1.5px solid var(--bone);rotate:-45deg;translate:0 -1px;opacity:0}
.ck input:checked{background:var(--ink);border-color:var(--ink)}
.ck input:checked::after{opacity:1}
.ck a,.next-h a,.modal-n a{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.18em}
.modal-w{width:100%;margin-top:16px}
.modal-or{display:flex;align-items:center;gap:12px;margin:18px 0 14px;font-size:12px;font-weight:400;text-transform:uppercase;letter-spacing:.04em;color:var(--graphite)}
.modal-or::before,.modal-or::after{content:'';flex:1;height:1px;background:var(--line)}
.modal-s{min-height:1.35em;margin-top:10px;font-size:13px;line-height:1.35;color:var(--graphite)}
.modal-s[data-err],.fl-h[data-err]{color:#c4442f}
.modal-n{margin-top:14px;padding-top:14px;border-top:1px solid var(--line);font-size:13px;line-height:1.35;color:var(--graphite)}
.modal-list{margin-top:18px;border-top:1px solid var(--ink)}
.modal-list li{padding:12px 0;border-bottom:1px solid var(--line);font-size:15px;line-height:1.35}
.modal-acts{display:flex;flex-wrap:wrap;align-items:center;gap:8px 20px;margin-top:20px}
.modal-line{position:relative;height:1px;margin-top:28px;background:var(--line);overflow:hidden}
.modal-line i{position:absolute;inset:0;background:var(--ink);transform-origin:left;animation:mline 1.6s cubic-bezier(.4,0,.2,1) forwards}
@keyframes mline{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media (min-width:768px){
  .modal{align-items:center}
  .modal-box{width:min(520px,calc(100vw - 48px));padding:40px 44px 36px;border-radius:0;translate:0 32px;opacity:0}
  .modal[data-open] .modal-box{opacity:1}
}
@media (max-width:420px){.modal .field .pill{padding:0 14px;font-size:15px}}

/* каркас экранов покупки */
.flow{padding:clamp(16px,2.4vw,32px) var(--g) clamp(48px,6vw,96px)}
.flow-top{display:flex;align-items:center;justify-content:space-between;gap:16px}
.flow-grid{display:grid;gap:28px;margin-top:clamp(12px,1.6vw,24px)}
.flow-a{min-width:0;order:2}
.flow-h{font-family:var(--serif);font-weight:400;font-size:clamp(48px,7vw,112px);line-height:.86;letter-spacing:-.04em;text-wrap:balance}
.flow-h em{display:block}
.flow-b{order:1;display:grid;grid-template-columns:88px minmax(0,1fr);gap:14px;align-items:center;padding:12px 0;border-top:1px solid var(--ink);border-bottom:1px solid var(--line)}
.flow-ph{position:relative;aspect-ratio:4/5;overflow:hidden;background:var(--paper)}
.flow-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.flow-bb{display:flex;flex-direction:column;gap:8px;min-width:0}
.flow-t{font-family:var(--serif);font-weight:400;font-size:22px;line-height:.98;letter-spacing:-.02em;text-wrap:balance}
.flow-b .metas{padding-top:2px}
.fl-sec{margin-top:clamp(28px,3vw,44px);padding-top:14px;border-top:1px solid var(--ink)}
.fl-sec-first{margin-top:clamp(24px,2.6vw,36px)}
.fl-sec > .kicker{display:block;margin-bottom:12px}
.fl-h{margin-top:10px;max-width:56ch;font-size:13px;line-height:1.35;color:var(--graphite)}
.field-solo{padding:5px 22px;max-width:520px}
.incl li{position:relative;padding:12px 0 12px 32px;border-bottom:1px solid var(--line);font-size:16px;line-height:1.35}
.incl li:first-child{padding-top:2px}
.incl li::before{content:'';position:absolute;left:3px;top:calc(12px + .42em);width:12px;height:7px;border-left:1.25px solid var(--ink);border-bottom:1.25px solid var(--ink);rotate:-45deg}
.incl li:first-child::before{top:calc(2px + .42em)}
.incl-n li::before{width:14px;height:0;border-left:0;rotate:0deg;top:calc(12px + .72em)}
.incl-n li:first-child::before{top:calc(2px + .72em)}
.incl-o{counter-reset:io}
.incl-o li{counter-increment:io}
.incl-o li::before{content:counter(io,decimal-leading-zero);width:auto;height:auto;border:0;rotate:0deg;left:0;top:14px;font-size:12px;font-weight:400;color:var(--graphite)}
.incl-o li:first-child::before{top:4px}
.incl b{font-weight:400}
.incl-o b{display:block}
.incl-t li{display:grid;grid-template-columns:minmax(0,10fr) minmax(0,16fr);gap:16px;padding-left:0}
.incl-t li::before{content:none}
.incl-t b{font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--graphite);padding-top:3px}
.sumry > div{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:10px 0;border-bottom:1px solid var(--line);font-size:16px}
.sumry > div:first-child{padding-top:0}
.sumry .tot{border-bottom:0;padding-bottom:0}
.sumry .tot dd{font-family:var(--serif);font-size:44px;line-height:.9;letter-spacing:-.03em}
.flow-acts{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin-top:clamp(24px,2.6vw,36px)}
.flow-acts-end{padding-top:clamp(24px,2.6vw,36px);border-top:1px solid var(--line)}
.flow .next-h a{color:var(--ink)}
.flow .next{align-items:center}
@media (max-width:640px){.flow .next{flex-direction:column;align-items:stretch;gap:10px}.flow .next .pill{width:100%}.flow-acts .pill{flex:1 1 auto}}
@media (min-width:1024px){
  .flow-grid{grid-template-columns:minmax(0,7fr) minmax(0,4fr);column-gap:clamp(48px,6vw,112px);align-items:start}
  .flow-a{order:1}
  .flow-b{order:2;position:sticky;top:calc(var(--hh) + 24px);display:block;padding:0;border:0}
  .flow-ph{aspect-ratio:4/3}
  .flow-bb{padding:18px 0 0;gap:12px;border-bottom:1px solid var(--line);padding-bottom:20px}
  .flow-t{font-size:clamp(28px,2.4vw,36px);line-height:.94}
  .flow .next{position:static;margin-inline:0;padding-inline:0;border-top:1px solid var(--ink);margin-top:clamp(28px,3vw,44px);padding-top:20px}
}

/* 12. Запланировать */
.slots{margin:clamp(24px,2.6vw,36px) calc(-1 * var(--g)) 0;border-top:1px solid var(--ink)}
.slot{position:relative;display:flex;flex-direction:column;gap:6px;width:100%;padding:18px calc(var(--g) + 40px) 20px var(--g);border-bottom:1px solid var(--line);transition:background-color .25s ease-out,color .25s ease-out}
.slot-d{font-family:var(--serif);font-size:clamp(34px,4.4vw,64px);line-height:.9;letter-spacing:-.03em}
.slot-w{font-size:15px;color:var(--graphite);transition:color .25s ease-out}
.slot::after{content:'';position:absolute;right:var(--g);top:50%;translate:0 -50%;width:20px;height:20px;border:1px solid var(--ash);border-radius:50%}
.slot[aria-checked="true"]{background:var(--ink);color:var(--bone)}
.slot[aria-checked="true"] .slot-w{color:var(--mist)}
.slot[aria-checked="true"]::after{background:var(--bone);border-color:var(--bone)}
@media (hover:hover){.slot:not([aria-checked="true"]):hover{background:var(--paper)}}
@media (min-width:1024px){.slots{margin-inline:0}.slot{padding-left:20px}.slot::after{right:20px}}
.days{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:0 calc(-1 * var(--g));padding:0 var(--g)}
.days::-webkit-scrollbar{display:none}
.day{flex:none;display:flex;flex-direction:column;align-items:center;gap:4px;min-width:68px;padding:10px 8px 12px;border:1px solid var(--ash);border-radius:18px;font-size:12px;color:var(--graphite);transition:background-color .2s ease-out,color .2s ease-out,border-color .2s ease-out}
.day b{font-family:var(--serif);font-weight:400;font-size:34px;line-height:.9;color:var(--ink);transition:color .2s ease-out}
.day[aria-checked="true"]{background:var(--ink);border-color:var(--ink);color:var(--mist)}
.day[aria-checked="true"] b{color:var(--bone)}
.times{display:flex;flex-wrap:wrap;gap:8px}
.times .chip[aria-checked="true"]{background:var(--ink);color:var(--bone);border-color:var(--ink)}
@media (hover:hover){.day:not([aria-checked="true"]):hover{border-color:var(--ink)}}
@media (min-width:1024px){.days{margin:0;padding:0;flex-wrap:wrap}}
.tg-ask{display:grid;gap:20px;margin:clamp(28px,3vw,44px) calc(-1 * var(--g)) 0;padding:28px var(--g) 32px}
.tg-ask-t{margin-top:12px;font-family:var(--serif);font-weight:400;font-size:clamp(34px,3.6vw,52px);line-height:.9;letter-spacing:-.03em;text-wrap:balance}
.tg-ask p{max-width:44ch;font-size:15px;line-height:1.4;color:var(--mist)}
.tg-ask .flow-acts{margin-top:18px}
@media (min-width:1024px){.tg-ask{margin-inline:0;padding:32px}}
.sc-plan{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;margin-top:16px;padding:10px 14px;background:var(--paper);font-size:15px}
.sc-plan .txt{margin-left:auto;min-height:44px;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.18em}

/* 13. Telegram */
.tg{display:grid;gap:24px;margin-top:clamp(24px,2.6vw,36px)}
.tg-steps{counter-reset:tg;border-top:1px solid var(--ink)}
.tg-steps li{counter-increment:tg;display:grid;grid-template-columns:44px minmax(0,1fr);gap:2px 8px;padding:14px 0;border-bottom:1px solid var(--line)}
.tg-steps li::before{content:counter(tg,decimal-leading-zero);grid-row:1 / span 2;padding-top:5px;font-size:12px;font-weight:400;color:var(--graphite)}
.tg-steps b{font-family:var(--serif);font-weight:400;font-size:26px;line-height:1;letter-spacing:-.02em}
.tg-steps span{grid-column:2;font-size:15px;color:var(--charcoal)}
.tg-qr{display:none;flex-direction:column;align-items:center;gap:10px;font-size:13px;color:var(--graphite)}
.tg-qr-box{width:176px;padding:10px;border:1px solid var(--line);background:#fff}
.tg-qr-box svg{display:block;width:100%;height:auto}
@media (min-width:768px){.tg{grid-template-columns:minmax(0,1fr) auto;align-items:start;column-gap:40px}.tg-qr{display:flex}}
.tg-wait{display:flex;align-items:center;gap:10px;margin-top:20px;font-size:14px;color:var(--graphite)}
.tg-wait i{width:8px;height:8px;border-radius:50%;background:var(--ink)}
@media (prefers-reduced-motion:no-preference){.tg-wait i{animation:pulse 1.4s ease-in-out infinite}}
@keyframes pulse{50%{opacity:.25;scale:.7}}
body.has-mini .flow{padding-bottom:120px}
/* сообщения — сверху, чтобы не перекрывать нижние кнопки */
.toast{top:calc(var(--hh) + 12px);bottom:auto;translate:-50% -16px}
.toast[data-on]{translate:-50% 0}
body.has-mini .toast{bottom:auto}

/* ===== группа В: сам вечер ===== */
/* 14. Введение в вечер */
.eve{min-height:calc(100svh - var(--hh));padding:clamp(16px,2.4vw,32px) var(--g) 0}
.eve .txt{color:var(--mist)}
.eve-grid{display:grid;gap:32px;margin-top:clamp(16px,2vw,28px)}
.eve-h{margin-top:14px;font-family:var(--serif);font-weight:400;font-size:clamp(56px,8.4vw,128px);line-height:.84;letter-spacing:-.04em}
.eve-h em{display:block}
.eve-t{margin-top:18px;max-width:20ch;font-family:var(--serif);font-size:clamp(26px,2.6vw,38px);line-height:.96;letter-spacing:-.025em;text-wrap:balance}
.eve-play{display:flex;align-items:center;gap:16px;width:100%;margin-top:28px;padding:14px 0;border-top:1px solid var(--bone);border-bottom:1px solid var(--dline);text-align:left}
.eve-play .rb-main{width:64px;height:64px;background:var(--bone);color:var(--ink);border-color:var(--bone)}
.eve-play .rb-main .ic{width:24px;height:24px}
.eve-play b{display:block;font-family:var(--serif);font-weight:400;font-size:28px;line-height:1;letter-spacing:-.02em}
.eve-play span span{display:block;margin-top:6px;font-size:13px;color:var(--mist)}
.eve-l{margin-top:20px;max-width:42ch;font-size:16px;line-height:1.4;color:var(--mist);text-wrap:pretty}
.eve-ph{position:relative;aspect-ratio:3/2;overflow:hidden;margin:0 calc(-1 * var(--g))}
.eve-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.eve-sec{padding:20px 0;border-top:1px solid var(--dline)}
.eve-ph + .eve-sec{border-top:0}
.eve-sec > .kicker{display:block;margin-bottom:10px}
.eve-sec p{max-width:56ch;font-size:16px;line-height:1.45;text-wrap:pretty}
.eve-sec b{font-weight:400}
.eve-sec .eve-s{margin-top:8px;font-size:14px;color:var(--mist)}
.eve-sec .pill{margin-top:14px}
.eve .incl li{border-bottom-color:var(--dline)}
.eve .incl li::before{border-color:var(--bone)}
.eve-next{background:var(--ink);border-top-color:var(--dline);margin-top:8px}
.eve-next .next-h{color:var(--mist)}
@media (max-width:640px){.eve-next{flex-wrap:wrap}.eve-next .next-h{flex-basis:100%}.eve-next .pill{flex:1}}
@media (min-width:1024px){
  .eve-grid{grid-template-columns:minmax(0,6fr) minmax(0,5fr);column-gap:clamp(48px,6vw,112px);align-items:start}
  .eve-a{position:sticky;top:calc(var(--hh) + 24px)}
  .eve-ph{margin:0}
}

/* 15. Шаг маршрута */
.wk{padding:0 var(--g)}
.wk-top{position:sticky;top:var(--hh);z-index:6;display:flex;align-items:center;gap:16px;margin:0 calc(-1 * var(--g));padding:6px var(--g);background:var(--bone);border-bottom:1px solid var(--line)}
.wk-prog{flex:1;display:flex;gap:4px}
.wk-prog i{flex:1;height:2px;background:var(--line)}
.wk-prog i[data-on]{background:var(--ink)}
.wk-grid{display:grid}
.wk-ph{position:relative;aspect-ratio:4/3;overflow:hidden;margin:0 calc(-1 * var(--g));background:var(--paper)}
.wk-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.wk-b{padding:20px 0 8px;min-width:0}
.wk-h{margin-top:12px;font-family:var(--serif);font-weight:400;font-size:clamp(46px,6.4vw,96px);line-height:.86;letter-spacing:-.04em;text-wrap:balance}
.wk-l{margin-top:14px;max-width:40ch;font-size:clamp(17px,1.4vw,20px);line-height:1.35;color:var(--charcoal);text-wrap:pretty}
.wk-au{display:flex;align-items:center;gap:14px;width:100%;margin-top:22px;padding:12px 0;border-top:1px solid var(--ink);border-bottom:1px solid var(--line);text-align:left}
.wk-au .rb{width:52px;height:52px;background:var(--ink);color:var(--bone);border-color:var(--ink)}
.wk-au b{display:block;font-weight:400;font-size:16px}
.wk-au span span{display:block;margin-top:3px;font-size:13px;color:var(--graphite)}
.wk-note{margin-top:20px;max-width:34ch;font-family:var(--serif);font-size:clamp(24px,2.1vw,30px);line-height:1.04;letter-spacing:-.018em;text-wrap:pretty}
.wk-sec{margin-top:28px;padding-top:14px;border-top:1px solid var(--ink)}
.wk-sec > .kicker{display:block;margin-bottom:10px}
.wk-nx{border-top-color:var(--line)}
.wk-nx p{font-family:var(--serif);font-size:24px;line-height:1;letter-spacing:-.02em}
.wk-nx p .num{font-family:var(--sans);font-size:13px;font-weight:400;letter-spacing:0;color:var(--graphite);margin-right:8px}
.wk-tr{margin-top:12px;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.2em}
.wk-bar{gap:10px}
.wk-bar .txt span{display:none}
.wk-bar .pill-ink{flex:1;min-width:0}
@media (min-width:768px){.wk-bar .txt span{display:inline}}
@media (min-width:1024px){
  .wk-grid{grid-template-columns:minmax(0,5fr) minmax(0,6fr);column-gap:clamp(40px,5vw,96px);align-items:start}
  .wk-ph{position:sticky;top:calc(var(--hh) + 57px);margin:0 0 0 calc(-1 * var(--g));aspect-ratio:auto;height:calc(100svh - var(--hh) - 57px)}
  .wk-b{padding:clamp(28px,3vw,48px) 0 8px}
  .wk-bar{position:sticky;margin-inline:0;margin-left:calc(45.45% + clamp(40px,5vw,96px) * .55 - var(--g) * .45);padding-inline:0;justify-content:flex-end}
  .wk-bar .pill-ink{flex:0 1 auto;min-width:240px}
}

/* 16. Что-то пошло не так */
.tr-list{margin-top:20px;border-top:1px solid var(--ink)}
.tr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 16px;align-items:center;width:100%;padding:14px 0;border-bottom:1px solid var(--line)}
.tr b{font-family:var(--serif);font-weight:400;font-size:26px;line-height:1;letter-spacing:-.02em}
.tr span{grid-column:1;font-size:14px;color:var(--graphite)}
.tr .ic{grid-column:2;grid-row:1 / span 2;transition:translate .3s var(--ease)}
@media (hover:hover){.tr:hover .ic{translate:6px 0}}

/* 17. Финал */
.fin{display:flex;flex-direction:column;justify-content:center;min-height:calc(100svh - var(--hh));padding:clamp(40px,6vw,96px) var(--g)}
.fin-h{margin-top:16px;font-family:var(--serif);font-weight:400;font-size:clamp(60px,9.6vw,152px);line-height:.84;letter-spacing:-.04em}
.fin-h em{display:block}
.fin-after{margin-top:clamp(32px,4vw,56px);padding-top:16px;border-top:1px solid var(--bone);max-width:720px}
.fin-after p{margin-top:12px;font-family:var(--serif);font-size:clamp(28px,3vw,44px);line-height:.98;letter-spacing:-.025em;text-wrap:balance}
.fin-acts{display:flex;flex-wrap:wrap;gap:10px;margin-top:clamp(28px,3.4vw,48px)}
.fin-n{margin-top:18px;max-width:44ch;font-size:14px;line-height:1.4;color:var(--mist)}
@media (max-width:520px){.fin-acts .pill{flex:1 1 100%}}

/* 18. Как прошло? */
.feel{margin:clamp(24px,2.6vw,36px) calc(-1 * var(--g)) 0;border-top:1px solid var(--ink)}
.feel-o{position:relative;display:flex;flex-direction:column;gap:4px;width:100%;padding:16px calc(var(--g) + 40px) 18px var(--g);border-bottom:1px solid var(--line);transition:background-color .25s ease-out,color .25s ease-out}
.feel-o b{font-family:var(--serif);font-weight:400;font-size:clamp(34px,3.8vw,56px);line-height:.9;letter-spacing:-.03em}
.feel-o span{font-size:14px;color:var(--graphite);transition:color .25s ease-out}
.feel-o::after{content:'';position:absolute;right:var(--g);top:50%;translate:0 -50%;width:20px;height:20px;border:1px solid var(--ash);border-radius:50%}
.feel-o[aria-checked="true"]{background:var(--ink);color:var(--bone)}
.feel-o[aria-checked="true"] span{color:var(--mist)}
.feel-o[aria-checked="true"]::after{background:var(--bone);border-color:var(--bone)}
.chip[aria-pressed="true"]{background:var(--ink);color:var(--bone);border-color:var(--ink)}
@media (hover:hover){.feel-o:not([aria-checked="true"]):hover{background:var(--paper)}}
@media (min-width:1024px){.feel{margin-inline:0}.feel-o{padding-left:20px}.feel-o::after{right:20px}}

/* 19. Открытка */
.thx-grid{display:grid;gap:32px;margin-top:clamp(12px,1.6vw,24px)}
.pc{position:relative;aspect-ratio:4/5;overflow:hidden;background:var(--ink);color:var(--bone);max-width:460px;width:100%}
.pc-ph{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.pc::after{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.82) 0%,rgba(0,0,0,.3) 42%,rgba(0,0,0,.28) 100%);pointer-events:none}
.pc-top,.pc-b{position:absolute;left:0;right:0;z-index:1;padding:18px 20px}
.pc-top{top:0}
.pc-b{bottom:0;display:flex;flex-direction:column;gap:10px}
.pc-b b{font-family:var(--serif);font-weight:400;font-size:clamp(30px,3vw,40px);line-height:.92;letter-spacing:-.03em;text-wrap:balance}
.pc-b span{font-size:13px;color:var(--mist)}
.pc-b img{width:100%;height:auto;margin-top:8px}
.nx{margin:clamp(40px,5vw,72px) calc(-1 * var(--g)) 0;border-top:1px solid var(--ink)}
.nx-h{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:4px 16px;padding:10px var(--g);border-bottom:1px solid var(--line)}
.nx-row{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.nx-row::-webkit-scrollbar{display:none}
.nx-c{flex:none;width:min(72vw,340px);scroll-snap-align:start;display:flex;flex-direction:column;gap:10px;padding-bottom:20px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.nx-c > :not(.nx-ph){padding-inline:16px}
.nx-ph{position:relative;aspect-ratio:3/2;overflow:hidden;background:var(--paper)}
.nx-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:scale 1.2s var(--ease)}
.nx-c b{font-family:var(--serif);font-weight:400;font-size:26px;line-height:.94;letter-spacing:-.025em;text-wrap:balance}
.nx-m{margin-top:auto;font-size:13px;color:var(--graphite)}
@media (hover:hover){.nx-c:hover .nx-ph img{scale:1.03}}
@media (min-width:1024px){
  .thx-grid{grid-template-columns:minmax(0,7fr) minmax(0,4fr);column-gap:clamp(48px,6vw,112px);align-items:end}
  .pc{justify-self:end}
  .nx-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));overflow:visible}
  .nx-c{width:auto;border-right:0;border-left:1px solid var(--line)}
  .nx-c:first-child{border-left:0}
  .nx-c > :not(.nx-ph){padding-inline:clamp(20px,1.9vw,28px)}
}
@media (min-width:1024px){.wk-bar{margin-left:calc(-1 * var(--g));margin-right:calc(-1 * var(--g));padding-inline:var(--g);justify-content:flex-end}}
.toast{border:1px solid var(--dline)}
/* мини-плеер не перекрывает нижние полосы с кнопками */
@media (max-width:1023px){body.has-mini:not(.has-sheet) .next{bottom:calc(64px + env(safe-area-inset-bottom))}}
@media (min-width:1024px){.mini{left:24px;right:auto}body.has-mini .eve-next .next-h{visibility:hidden}}

/* ===== группа Г: «Сходить или нет?» ===== */
.mark[data-k="maybe"]{background:transparent;color:var(--ink)}
.mark[data-k="no"]{background:transparent;color:var(--ink);border-style:dashed}
.lnk{display:inline;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.18em;color:var(--ink)}
.blk{margin:clamp(40px,5vw,72px) calc(-1 * var(--g)) 0;border-top:1px solid var(--ink)}
.blk-first{margin-top:0}
.blk-h{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:45px;padding:0 var(--g);border-bottom:1px solid var(--line)}
.blk > .incl,.blk > .mine,.blk > .how3{margin-inline:var(--g)}

/* 20. Запрос */
.ask{display:grid;gap:12px;padding-top:16px;border-top:1px solid var(--ink)}
.ask-field{padding-left:24px}
.ask-field input{min-height:56px;font-size:18px}
.ask-field .pill{min-height:56px;padding:0 28px}
@media (min-width:1024px){.ask{max-width:920px}.ask-field input{font-size:20px}}
@media (max-width:480px){.ask-field{padding-left:18px}.ask-field input{font-size:16px}.ask-field .pill{padding:0 18px}}
.mine li a{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 0;border-bottom:1px solid var(--line)}
.mine-t{font-family:var(--serif);font-size:24px;line-height:1;letter-spacing:-.02em}
.mine-s{flex:none;display:inline-flex;align-items:center;min-height:26px;padding:0 10px;border:1px solid var(--ink);border-radius:1440px;font-size:11px;font-weight:400;text-transform:uppercase;letter-spacing:.04em}
.mine-s[data-wait]{border-color:var(--ash);color:var(--graphite)}
.how3{display:grid;counter-reset:h3}
.how3 li{counter-increment:h3;display:grid;grid-template-columns:44px minmax(0,1fr);gap:4px 8px;padding:16px 0;border-bottom:1px solid var(--line)}
.how3 li::before{content:counter(h3,decimal-leading-zero);grid-row:1 / span 2;padding-top:6px;font-size:12px;font-weight:400;color:var(--graphite)}
.how3 b{font-family:var(--serif);font-weight:400;font-size:clamp(26px,2.4vw,34px);line-height:.96;letter-spacing:-.025em}
.how3 span{grid-column:2;max-width:40ch;font-size:15px;line-height:1.35;color:var(--charcoal)}
@media (min-width:1024px){.how3{grid-template-columns:repeat(3,minmax(0,1fr));margin-inline:0 !important}.how3 li{padding:20px var(--g) 28px;border-bottom:0;border-left:1px solid var(--line)}.how3 li:first-child{border-left:0}}

/* карточка разбора в ленте */
.vcs{display:grid}
.vc{display:flex;flex-direction:column;gap:14px;min-width:0;padding:24px var(--g) 26px;border-bottom:1px solid var(--line);transition:background-color .25s ease-out}
.vc-top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.vc-t{font-family:var(--serif);font-weight:400;font-size:clamp(30px,2.8vw,42px);line-height:.9;letter-spacing:-.03em;text-wrap:balance}
.vc-q{font-size:15px;line-height:1.4;color:var(--charcoal);text-wrap:pretty}
.vc-w{display:flex;flex-direction:column;gap:2px;margin-top:auto;padding-top:12px;border-top:1px solid var(--line);font-size:13px;line-height:1.3;color:var(--graphite)}
.vc-w span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.vc-w span:first-child{color:var(--ink)}
.vc .pk-cur{min-height:40px}
.blk .vcs .vc:last-child{border-bottom:0}
@media (hover:hover){.vc:hover{background:var(--paper)}.vc:hover .vc-t{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.12em}}
@media (min-width:768px){
  .vcs{grid-template-columns:repeat(2,minmax(0,1fr));overflow:hidden}
  .vc{margin-bottom:-1px;border-left:1px solid var(--line)}
  .vc:nth-child(2n+1){border-left:0}
  .blk .vcs .vc:last-child{border-bottom:1px solid var(--line)}
}
@media (min-width:1024px){
  .vcs{grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:auto}
  .vc{display:grid;grid-row:span 5;grid-template-rows:subgrid;gap:0;row-gap:14px;border-left:1px solid var(--line)}
  .vc:nth-child(2n+1){border-left:1px solid var(--line)}
  .vc:nth-child(3n+1){border-left:0}
  .vc-w{margin-top:0}
}

/* 21. Проверяем событие */
.wsteps{margin-top:clamp(24px,2.6vw,36px);border-top:1px solid var(--ink)}
.wsteps li{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:0 12px;align-items:start;padding:14px 0;border-bottom:1px solid var(--line);transition:opacity .4s ease-out}
.wsteps i{width:12px;height:12px;margin-top:7px;border:1px solid var(--ash);border-radius:50%;transition:background-color .3s ease-out,border-color .3s ease-out}
.wsteps b{display:block;font-family:var(--serif);font-weight:400;font-size:clamp(26px,2.4vw,34px);line-height:.96;letter-spacing:-.025em}
.wsteps div span{display:block;margin-top:5px;font-size:14px;line-height:1.3;color:var(--graphite)}
.ws-st{padding-top:6px;font-size:12px;font-weight:400;text-transform:uppercase;letter-spacing:.04em;color:var(--graphite);white-space:nowrap}
.wsteps li[data-s="off"]{opacity:.38}
.wsteps li[data-s="done"] i{background:var(--ink);border-color:var(--ink)}
.wsteps li[data-s="done"] .ws-st::after{content:'готово'}
.wsteps li[data-s="on"] i{border-color:var(--ink);background:var(--ink)}
.wsteps li[data-s="on"] .ws-st::after{content:'сейчас';color:var(--ink)}
@media (prefers-reduced-motion:no-preference){.wsteps li[data-s="on"] i{animation:pulse 1.4s ease-in-out infinite}}
.flow-m{font-size:13px;line-height:1.3;color:var(--graphite)}
.chk .flow-bb .txt{min-height:44px;align-self:flex-start;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.18em}
.chk .fl-sec .field{max-width:560px}

/* 22. Разбор */
.vd-new{margin-top:16px}
.vd-t{margin-top:12px;max-width:18ch;font-family:var(--serif);font-weight:400;font-size:clamp(46px,6.4vw,104px);line-height:.86;letter-spacing:-.04em;text-wrap:balance}
.vd-lead{max-width:48ch}
.vd-ph{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--paper)}
.vd-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.vd-card{padding:24px var(--g) 32px;min-width:0}
.vd-vk{display:flex;align-items:center;justify-content:space-between;gap:12px}
.vd-vk .mark{min-height:30px;padding:0 14px;font-size:12px}
.vd-v{margin-top:18px;font-family:var(--serif);font-weight:400;font-size:clamp(40px,4.2vw,64px);line-height:.88;letter-spacing:-.035em;text-wrap:balance}
.vd-q{margin-top:16px;max-width:42ch;font-size:17px;line-height:1.4;color:var(--charcoal);text-wrap:pretty}
.vd-by{margin-top:22px}
.vd-facts{margin-top:26px;padding-top:14px;border-top:1px solid var(--ink)}
.vd-sc{display:grid;grid-template-columns:104px minmax(0,1fr);gap:16px;align-items:center}
.vd-sc .flow-ph{display:block}
.vd-sc .flow-bb{padding:0;border:0}
.vd-more{margin-top:0}
@media (hover:hover){.vd-sc:hover .flow-t{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.12em}}
@media (min-width:1024px){
  .vd-ph{aspect-ratio:auto;min-height:clamp(520px,calc(100svh - var(--hh)),820px)}
  .vd-card{padding:clamp(28px,3vw,48px) var(--g) clamp(32px,3.4vw,56px) clamp(32px,4vw,72px);border-left:1px solid var(--line)}
}

/* 23. Все разборы */
.vflt{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px;padding-bottom:16px}
.vflt .chip .num{color:var(--graphite);font-size:12px}
.vflt .chip[aria-pressed="true"] .num{color:var(--mist)}
.vcs-all{margin:0 calc(-1 * var(--g));border-top:1px solid var(--ink);border-bottom:1px solid var(--line)}
.vcs-0{padding:40px var(--g);font-family:var(--serif);font-size:30px;letter-spacing:-.02em}
.asm-in{margin:0 calc(-1 * var(--g))}
.step:has(> .asm-in){padding-bottom:0}
.vd > .blk{margin-inline:0}

/* ===== группа Д: кураторы, куратор, заметка, автор ===== */
.nw{white-space:nowrap}
@media (max-width:1100px){.ah-j{display:none !important}}
.mono{display:grid;place-items:center;width:56px;height:56px;flex:none;border-radius:50%;background:var(--ink);color:var(--bone);font-family:var(--serif);font-size:22px;letter-spacing:-.02em}

/* 24. Кураторы */
.dirs{margin:0 calc(-1 * var(--g));border-top:1px solid var(--ink)}
.dr{display:grid;grid-template-columns:28px minmax(0,1fr) auto;grid-template-areas:"n d a" ". x x" ". c c" ". m m";gap:8px 8px;align-items:center;padding:18px var(--g) 20px;border-bottom:1px solid var(--line);transition:background-color .25s ease-out,color .25s ease-out}
.dr-n{grid-area:n;align-self:start;padding-top:8px;font-size:12px;font-weight:400;color:var(--graphite)}
.dr-d{grid-area:d;font-family:var(--serif);font-size:clamp(44px,5.6vw,84px);line-height:.86;letter-spacing:-.04em}
.dr-x{grid-area:x;font-size:15px;line-height:1.3;color:var(--charcoal)}
.dr-c{grid-area:c;display:flex;align-items:center;gap:12px;margin-top:6px;font-size:14px;line-height:1.2}
.dr-c img{width:44px;height:55px;object-fit:cover;flex:none;filter:grayscale(1);background:var(--paper)}
.dr-c span span{display:block;margin-top:2px;font-size:13px;color:var(--graphite)}
.dr-m{grid-area:m;font-size:13px;color:var(--graphite)}
.dr > .ic{grid-area:a;width:24px;height:24px;transition:translate .3s var(--ease)}
.dr-soon{color:var(--graphite)}
.dr-soon .dr-d{color:var(--ash)}
@media (hover:hover){a.dr:hover{background:var(--ink);color:var(--bone)}a.dr:hover .dr-n,a.dr:hover .dr-x,a.dr:hover .dr-m,a.dr:hover .dr-c span span{color:var(--mist)}a.dr:hover > .ic{translate:8px 0}}
@media (min-width:1024px){
  .dr{grid-template-columns:40px minmax(0,1.15fr) minmax(0,1.2fr) minmax(0,1.3fr) minmax(0,.9fr) 28px;grid-template-areas:"n d x c m a";gap:0 24px;padding-block:22px 26px}
  .dr-n{align-self:center;padding-top:0}
  .dr-c{margin-top:0}
  .dr-m{justify-self:end;text-align:right}
}

/* 25 и 27. Куратор и автор */
.cu-hero{display:grid;border-bottom:1px solid var(--line)}
.cu-ph{position:relative;aspect-ratio:4/5;overflow:hidden;background:#f2f1ec}
.cu-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(1)}
.cu-ph-0{display:grid;place-items:center;background:var(--paper);aspect-ratio:3/2}
.cu-ph-0 .mono{width:clamp(120px,22vw,220px);height:clamp(120px,22vw,220px);font-size:clamp(48px,9vw,96px)}
.cu-b{padding:16px var(--g) 36px;min-width:0;container-type:inline-size}
.cu-name{margin-top:clamp(18px,2.4vw,36px);font-family:var(--serif);font-weight:400;font-size:min(clamp(52px,6.6vw,108px),14.6cqi);line-height:.86;letter-spacing:-.04em}
.cu-sig{width:150px;margin-top:14px}
.cu-who{margin-top:14px;font-size:12px;font-weight:400;text-transform:uppercase;letter-spacing:.04em;color:var(--graphite)}
.cu-bio{margin-top:12px;max-width:34ch;font-family:var(--serif);font-size:clamp(22px,2vw,28px);line-height:1.06;letter-spacing:-.018em;text-wrap:pretty}
.cu-facts{margin-top:24px;padding-top:14px;border-top:1px solid var(--ink)}
.cu-stats{display:flex;flex-wrap:wrap;gap:20px 40px;margin-top:22px}
.cu-stats li{display:flex;flex-direction:column;gap:8px}
.cu-stats b{font-family:var(--serif);font-weight:400;font-size:52px;line-height:.9;letter-spacing:-.03em}
.cu-stats span{font-size:13px;color:var(--graphite)}
.cu-credo{padding:clamp(48px,7vw,112px) var(--g)}
.cu-credo blockquote{margin:16px 0 0;max-width:20ch;font-family:var(--serif);font-style:italic;font-size:clamp(40px,5.6vw,88px);line-height:.9;letter-spacing:-.035em;text-wrap:balance}
.cu-blk{margin-inline:0;margin-top:0}
.cu-blk + .cu-blk,.cu-credo + .cu-blk{margin-top:0}
.cu > .cu-blk{border-top:1px solid var(--ink)}
.cu-hero + .cu-blk{border-top:0}
.cu-others{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 16px;padding:20px var(--g) 32px}
.cu-others .pk-cur img{filter:grayscale(1)}
.cu-take{padding-bottom:8px}
.blk > .cu-take{margin-top:16px}
@media (min-width:768px){.cu-others{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (min-width:1024px){
  .cu-hero{grid-template-columns:minmax(0,5fr) minmax(0,6fr)}
  .cu-ph{aspect-ratio:auto;min-height:clamp(560px,calc(100svh - var(--hh)),860px)}
  .cu-b{padding:clamp(16px,2.4vw,32px) var(--g) clamp(32px,4vw,56px) clamp(32px,4vw,72px);border-left:1px solid var(--line)}
}
.nrows{margin:0 var(--g)}
.nrow{display:grid;gap:8px;padding:18px 0 20px;border-bottom:1px solid var(--line)}
.nrows li:last-child .nrow{border-bottom:0}
.nrow b{font-family:var(--serif);font-weight:400;font-size:clamp(28px,2.8vw,40px);line-height:.92;letter-spacing:-.03em;text-wrap:balance}
.nrow-l{max-width:60ch;font-size:15px;line-height:1.35;color:var(--charcoal)}
@media (hover:hover){.nrow:hover b{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.12em}}
@media (min-width:1024px){.nrow{grid-template-columns:minmax(0,3fr) minmax(0,7fr) minmax(0,6fr);gap:24px;align-items:baseline}}
.sc-au{margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}
.sc-au img:first-child,.sc-au .mono{width:56px;height:56px;border-radius:50%;object-fit:cover;filter:grayscale(1)}
.sc-au .ic{margin-left:auto}

/* 26. Заметка */
.nt-head{padding:clamp(16px,2.4vw,32px) var(--g) clamp(24px,3vw,40px)}
.nt-k{margin-top:clamp(20px,2.4vw,36px)}
.nt-t{margin-top:12px;max-width:20ch;font-family:var(--serif);font-weight:400;font-size:clamp(42px,5.8vw,96px);line-height:.86;letter-spacing:-.04em;text-wrap:balance}
.nt-lead{max-width:50ch}
.nt-by{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px;margin-top:24px;padding-top:14px;border-top:1px solid var(--ink)}
.nt-cover{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--paper)}
.nt-cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
@media (min-width:768px){.nt-cover{aspect-ratio:21/9}}
.nt-body{max-width:calc(680px + 2 * var(--g));margin:0 auto;padding:clamp(24px,3vw,40px) var(--g) clamp(48px,6vw,88px);font-size:19px;line-height:1.55;letter-spacing:-.012em}
.nt-body > .wk-au{margin:0 0 1.6em;font-size:16px;line-height:1.4;letter-spacing:-.018em}
.nt-body > p{margin:0 0 1.1em;text-wrap:pretty}
.nt-body em{font-family:var(--serif);font-size:1.12em;letter-spacing:-.01em}
.nt-body strong{font-weight:400;box-shadow:inset 0 -.5em 0 var(--paper)}
.nt-body a{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.18em}
.nt-first{font-size:1.1em;line-height:1.5}
.nt-first::first-letter{font-family:var(--serif);font-weight:400;font-size:3.6em;line-height:.62;letter-spacing:-.02em;margin-right:.03em}
.nt-h{margin:2.1em 0 .6em;font-family:var(--serif);font-weight:400;font-size:clamp(32px,3.2vw,44px);line-height:.92;letter-spacing:-.03em;text-wrap:balance}
.nt-q{margin:2em 0;padding:0}
.nt-q p{font-family:var(--serif);font-style:italic;font-size:clamp(30px,3.2vw,44px);line-height:.98;letter-spacing:-.025em;text-wrap:balance}
.nt-q cite{display:block;margin-top:14px;font-style:normal;font-size:12px;font-weight:400;text-transform:uppercase;letter-spacing:.04em;color:var(--graphite)}
.nt-img{margin:2.2em calc(-1 * var(--g))}
.nt-img img{width:100%;height:auto}
.nt-pair div{display:grid;grid-template-columns:1fr 1fr}
.nt-pair img{aspect-ratio:4/5;object-fit:cover;height:100%}
.nt-img figcaption{padding:10px var(--g) 0;font-size:13px;line-height:1.35;color:var(--graphite)}
.nt-tip{margin:2em 0;padding:16px 0 0;border-top:1px solid var(--ink)}
.nt-tip > .kicker{display:block;margin-bottom:10px}
.nt-tip p{font-family:var(--serif);font-size:clamp(24px,2.2vw,30px);line-height:1.04;letter-spacing:-.018em}
.nt-sum .incl{font-size:16px;line-height:1.4;letter-spacing:-.018em}
.nt-list{margin:1.4em 0 1.8em;border-top:1px solid var(--line);font-size:17px}
.nt-list li{padding-top:14px !important;padding-bottom:14px}
.nt-list li::before{top:17px !important}
.nt-list b{display:block;font-family:var(--serif);font-size:24px;line-height:1;letter-spacing:-.02em;margin-bottom:4px}
.nt-hr{height:1px;border:0;background:var(--ink);margin:2.4em 0}
.nt-route{display:grid;gap:18px;margin:2.4em calc(-1 * var(--g));padding:32px var(--g);font-size:16px;line-height:1.4;letter-spacing:-.018em}
.nt-route-t{font-family:var(--serif);font-weight:400;font-size:clamp(32px,3.4vw,48px);line-height:.9;letter-spacing:-.03em;text-wrap:balance}
.nt-route ol{border-top:1px solid var(--dline)}
.nt-route li{display:grid;grid-template-columns:64px minmax(0,1fr);gap:8px;padding:10px 0;border-bottom:1px solid var(--dline)}
.nt-route li .num{color:var(--mist)}
.nt-route .pill{justify-self:start}
.nt-end{display:flex;align-items:center;gap:16px;margin-top:2.4em;padding-top:18px;border-top:1px solid var(--ink);font-size:13px;color:var(--graphite)}
.nt-end img{width:120px}
@media (min-width:1024px){.nt-img,.nt-route{margin-inline:-120px}.nt-img figcaption{padding-inline:0}.nt-route{padding:48px;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);column-gap:56px;align-items:start}.nt-route ol{grid-column:2;grid-row:1 / span 3}.nt-route > .kicker{align-self:end}}
@media (min-width:1024px){
  .dr{grid-template-columns:40px minmax(0,1.55fr) minmax(0,1.05fr) minmax(0,1.3fr) minmax(0,.8fr) 28px}
  .dr-d{font-size:clamp(44px,4.6vw,72px);text-wrap:balance}
}

/* ===== группа Е: кабинет ===== */
html.big body{zoom:1.12}
.pill-danger{color:#b3261e;border-color:#b3261e}
@media (hover:hover){.pill-danger:hover{background:#b3261e;border-color:#b3261e;color:var(--bone)}}
.chip[data-on]{background:var(--ink);color:var(--bone);border-color:var(--ink)}
.chip-off{color:var(--ash);border-style:dashed}
.chip[role="radio"][aria-checked="true"]{background:var(--ink);color:var(--bone);border-color:var(--ink)}

.me{display:grid;min-height:calc(100svh - var(--hh))}
.me-side{position:sticky;top:var(--hh);z-index:6;display:flex;align-items:center;gap:8px;background:var(--bone);border-bottom:1px solid var(--line);min-width:0}
.me-who{display:none}
.me-nav{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;padding:8px var(--g);flex:1;min-width:0}
.me-nav::-webkit-scrollbar{display:none}
.me-nav a{flex:none;display:inline-flex;align-items:center;min-height:40px;padding:0 14px;border-radius:1440px;font-size:14px;font-weight:400;color:var(--graphite);white-space:nowrap;transition:background-color .2s ease-out,color .2s ease-out}
.me-nav a[aria-current]{background:var(--ink);color:var(--bone)}
.me-out{display:none}
.me-main{min-width:0;padding:clamp(20px,3vw,40px) var(--g) clamp(48px,6vw,96px)}
.me-h{font-family:var(--serif);font-weight:400;font-size:clamp(48px,6.6vw,104px);line-height:.86;letter-spacing:-.04em}
.me-main > .lead{max-width:52ch}
@media (hover:hover){.me-nav a:not([aria-current]):hover{color:var(--ink)}}
@media (min-width:1024px){
  .me{grid-template-columns:clamp(240px,20vw,300px) minmax(0,1fr)}
  .me-side{top:var(--hh);align-self:start;height:calc(100svh - var(--hh));flex-direction:column;align-items:stretch;gap:0;border-bottom:0;border-right:1px solid var(--line);padding:28px 0 24px}
  .me-nav{flex:0 0 auto;flex-direction:column;gap:0;overflow:visible;padding:0;border-top:1px solid var(--ink)}
  .me-nav a{min-height:48px;padding:0 var(--g);border-radius:0;border-bottom:1px solid var(--line);font-size:16px}
  .me-out{display:inline-flex;margin:auto var(--g) 0;align-self:flex-start}
  .me-main{padding-left:clamp(32px,4vw,72px)}
}

/* 28. Мои планы */
.me-next{display:grid;margin:clamp(20px,2.4vw,32px) calc(-1 * var(--g)) 0}
.me-next-ph{position:relative;aspect-ratio:3/2;overflow:hidden;background:#111}
.me-next-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.me-next-b{padding:24px var(--g) 30px;min-width:0}
.me-next-d{margin-top:12px;font-family:var(--serif);font-weight:400;font-size:clamp(46px,5.6vw,88px);line-height:.86;letter-spacing:-.04em}
.me-next-t{display:block;margin-top:16px;max-width:22ch;font-family:var(--serif);font-size:clamp(24px,2.3vw,32px);line-height:.98;letter-spacing:-.025em;text-wrap:balance}
.me-next-p{margin-top:8px;font-size:14px;color:var(--mist)}
.me-next .txt{color:var(--mist)}
@media (hover:hover){.me-next-t:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.12em}.me-next .txt:hover{color:var(--bone)}}
@media (min-width:768px){.me-next{grid-template-columns:minmax(0,4fr) minmax(0,6fr);margin-inline:0}.me-next-ph{aspect-ratio:auto;min-height:320px}.me-next-b{padding:32px clamp(24px,3vw,44px) 36px}}
.me-none{margin-top:clamp(20px,2.4vw,32px);padding:clamp(28px,4vw,56px) 0;border-top:1px solid var(--ink);border-bottom:1px solid var(--line)}
.me-none p{margin-top:16px;max-width:46ch;font-size:16px;line-height:1.4;color:var(--charcoal)}
.me-blk{margin-inline:0}
.me-blk .blk-h{padding-inline:0}
.me-blk > .mine,.me-blk > .incl,.me-pad{margin-inline:0 !important}
.me-note{padding:16px 0 4px;max-width:64ch;font-size:15px;line-height:1.45;color:var(--charcoal)}
.me-note b{font-weight:400;color:var(--ink)}
.me-stat{margin-top:18px;font-size:13px;font-weight:400;text-transform:uppercase;letter-spacing:.04em;color:var(--graphite)}
.mrows.me-top{margin-top:clamp(20px,2.4vw,32px);border-top:1px solid var(--ink)}
.mrow{display:grid;grid-template-columns:72px minmax(0,1fr);gap:10px 14px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}
.mrow-ph{position:relative;aspect-ratio:4/5;overflow:hidden;background:var(--paper)}
.mrow-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.mrow-b{display:flex;flex-direction:column;gap:6px;min-width:0}
.mrow-t{font-family:var(--serif);font-size:clamp(22px,2vw,28px);line-height:.98;letter-spacing:-.02em;text-wrap:balance}
.mrow-s{font-size:13px;line-height:1.3;color:var(--graphite)}
.mrow-a{grid-column:2;display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px}
@media (hover:hover){.mrow-t:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.12em}}
@media (min-width:768px){.mrow{grid-template-columns:72px minmax(0,1fr) auto}.mrow-a{grid-column:3;justify-content:flex-end}}
.me-subs li{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;padding:12px 0;border-bottom:1px solid var(--line)}
.me-subs .pk-cur img{filter:grayscale(1)}

/* 29. Архив */
.arch{display:grid;gap:32px 24px;margin-top:20px}
.arch-c{display:grid;gap:12px;min-width:0}
.arch-c .pc{max-width:none}
.arch-b{display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px}
@media (min-width:640px){.arch{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1280px){.arch{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* 31–32. Настройки и данные */
.set{display:grid;gap:14px;padding:22px 0 26px;border-top:1px solid var(--line)}
.me-main > .set:first-of-type{margin-top:clamp(24px,2.6vw,36px);border-top-color:var(--ink)}
.set-h h2{font-family:var(--serif);font-weight:400;font-size:clamp(28px,2.4vw,36px);line-height:.95;letter-spacing:-.025em}
.set-h p{margin-top:8px;max-width:32ch;font-size:14px;line-height:1.35;color:var(--graphite)}
.set-b{min-width:0}
.set-b > .me-note:first-child{padding-top:0}
@media (min-width:900px){.set{grid-template-columns:minmax(0,4fr) minmax(0,8fr);column-gap:clamp(24px,4vw,64px)}}
.sw,.quiet{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:13px 0;border-bottom:1px solid var(--line);cursor:pointer}
.sw:first-child{padding-top:0}
.sw > span,.quiet > span:first-child{display:flex;flex-direction:column;gap:3px;min-width:0}
.sw b,.quiet b{font-weight:400;font-size:16px}
.sw span span,.quiet span span{font-size:13px;line-height:1.3;color:var(--graphite)}
.sw input{appearance:none;-webkit-appearance:none;flex:none;position:relative;width:52px;height:32px;margin:0;border:1px solid var(--ash);border-radius:1440px;background:var(--bone);cursor:pointer;transition:background-color .2s ease-out,border-color .2s ease-out}
.sw input::after{content:'';position:absolute;left:3px;top:3px;width:24px;height:24px;border-radius:50%;background:var(--ash);transition:translate .2s ease-out,background-color .2s ease-out}
.sw input:checked{background:var(--ink);border-color:var(--ink)}
.sw input:checked::after{translate:20px 0;background:var(--bone)}
.quiet{cursor:default;border-bottom:0}
.quiet-r{flex:none;display:flex;align-items:center;gap:8px;font-size:14px}
.sel{appearance:none;-webkit-appearance:none;min-height:40px;padding:0 30px 0 14px;border:1px solid var(--ash);border-radius:1440px;background:var(--bone) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23000' stroke-width='1.25'%3E%3Cpath d='M5 8l5 5 5-5'/%3E%3C/svg%3E") no-repeat right 8px center/16px;font:inherit;font-size:14px;font-weight:400;color:inherit;cursor:pointer}
.sel-w{width:100%;max-width:560px;min-height:48px;padding-left:18px;font-size:16px;font-weight:300;overflow:hidden;text-overflow:ellipsis}

/* 33. Поддержка */
.sup{display:grid;gap:22px;margin-top:clamp(24px,2.6vw,36px);padding-top:16px;border-top:1px solid var(--ink)}
.sup-f{display:grid;gap:10px}
.area{all:unset;box-sizing:border-box;display:block;width:100%;max-width:720px;min-height:140px;padding:14px 18px;border:1px solid var(--ash);border-radius:20px;font-size:16px;line-height:1.4;white-space:pre-wrap;overflow-wrap:break-word;transition:border-color .2s ease-out}
.area::placeholder{color:var(--ash)}
.area:focus-visible{border-color:var(--ink)}
.area[aria-invalid="true"]{border-color:#c4442f}
.sup .next{margin-top:0}
.tks details{border-bottom:1px solid var(--line)}
.tks summary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 0;cursor:pointer;list-style:none}
.tks summary::-webkit-details-marker{display:none}
.tk-t{display:flex;flex-direction:column;gap:6px;min-width:0}
.tk-t b{font-family:var(--serif);font-weight:400;font-size:24px;line-height:1;letter-spacing:-.02em}
.tk-a{padding:0 0 18px;max-width:64ch}
.tk-a p{margin-top:6px;font-size:16px;line-height:1.45}
.mine a .ic{flex:none}
.arch-c .pc-b b{font-size:clamp(22px,1.9vw,28px)}
.arch-b{flex-wrap:nowrap;justify-content:space-between;min-height:44px}
.arch-l{display:flex;gap:16px;flex:none}
.arch-b .mark,.arch-b .pill{flex:none}
@media (min-width:1024px){.me .next{position:static;margin:0;padding:0;border-top:0;justify-content:flex-start;flex-direction:row-reverse}.me .next .next-h{flex:1}}

/* ===== группы Ж и З: заявки, поделиться, системные состояния, документы ===== */
.sup-0{margin-top:0}
.field-w{max-width:720px}
.field-w input{min-height:46px}
.how3-in{margin:0 calc(-1 * var(--g));border-top:1px solid var(--ink);border-bottom:1px solid var(--line);padding-inline:var(--g)}
@media (min-width:1024px){.how3-in{padding-inline:0}}
.how3-in + .sup{border-top:0;margin-top:clamp(20px,2.4vw,32px)}
.how3-in + .flow-acts{margin-top:28px}

/* 34. Собрать персонально: ответ куратора */
.asm-note{display:grid;gap:16px;padding:20px 0 24px;border-top:1px solid var(--ink)}
.asm-note .pk-cur img{filter:grayscale(1)}
.asm-note blockquote{margin:0;max-width:40ch;font-family:var(--serif);font-size:clamp(24px,2.3vw,34px);line-height:1.02;letter-spacing:-.02em;text-wrap:pretty}
.asm-opts{margin:0 calc(-1 * var(--g));border-top:1px solid var(--ink)}
.asm-opts > li{display:grid;grid-template-columns:96px minmax(0,1fr);gap:14px 16px;align-items:start;padding:18px var(--g) 22px;border-bottom:1px solid var(--line)}
.asm-ph{position:relative;aspect-ratio:4/5;overflow:hidden;background:var(--paper)}
.asm-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.asm-ob{display:flex;flex-direction:column;gap:10px;min-width:0}
.asm-ot{font-family:var(--serif);font-size:clamp(28px,2.8vw,42px);line-height:.92;letter-spacing:-.03em;text-wrap:balance}
.asm-why{max-width:56ch;font-size:15px;line-height:1.4}
.asm-why .kicker{display:block;margin-bottom:4px}
.asm-opts .metas{padding-top:2px}
.asm-opts .pill{grid-column:1 / -1}
@media (hover:hover){.asm-ot:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.12em}}
@media (min-width:768px){.asm-opts > li{grid-template-columns:140px minmax(0,1fr) auto;align-items:center;column-gap:28px}.asm-opts .pill{grid-column:3}}
@media (min-width:1024px){.asm-note{grid-template-columns:minmax(0,3fr) minmax(0,9fr);column-gap:48px;align-items:start}}

/* 35. Лист ожидания */
.wl{display:grid;margin:0 calc(-1 * var(--g));border-top:1px solid var(--ink)}
.wl-a{padding:20px var(--g) 28px;min-width:0}
.wl-a > .kicker{display:block;margin-bottom:12px}
.wl-price{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 14px;margin-top:22px}
.wl-price b{font-family:var(--serif);font-weight:400;font-size:clamp(48px,5vw,72px);line-height:.9;letter-spacing:-.03em}
.wl-price span{max-width:34ch;font-size:14px;line-height:1.35;color:var(--graphite)}
.wl-b{display:flex;flex-direction:column;gap:14px;padding:28px var(--g) 32px;min-width:0}
.wl-b p{max-width:40ch;font-size:15px;line-height:1.4;color:var(--mist)}
.wl-b form{display:grid;gap:12px;margin-top:6px}
.wl-b .field{border-color:var(--dline);max-width:520px}
.wl-b .field:focus-within{border-color:var(--bone)}
.wl-b .field input::placeholder{color:rgba(255,254,247,.45)}
.wl-go{justify-self:start}
.ck-dark{border-top-color:var(--dline) !important;max-width:520px}
.ck-dark input{background:transparent;border-color:rgba(255,254,247,.5)}
.ck-dark input:checked{background:var(--bone);border-color:var(--bone)}
.ck-dark input::after{border-color:var(--ink)}
.wl-b .modal-s{color:var(--mist);margin-top:0}
.wl-b .modal-s[data-err]{color:#ff9d8a}
@media (min-width:1024px){.wl{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.wl-a{padding:28px var(--g) 40px}.wl-b{padding:40px clamp(32px,4vw,72px) 44px}}

/* 37. Поделиться */
.sh-pc{margin-top:18px;max-width:240px}
.sh-pc .pc-b b{font-size:22px}
.sh-l{display:block;margin:18px 0 8px}
.sc-flag{display:grid;gap:4px;margin-top:14px;padding:12px 14px;background:var(--paper);font-size:15px;line-height:1.35}
.sc-flag b{font-weight:400}
.sc-flag-w{background:transparent;border:1px dashed var(--ink)}
.fin-pc{display:grid;gap:32px;align-content:center}
.fin-pc .pc{max-width:420px}
@media (min-width:1024px){.fin-pc{grid-template-columns:minmax(0,7fr) minmax(0,4fr);column-gap:clamp(48px,6vw,112px);align-items:center}.fin-pc .pc{justify-self:end}}

/* 38. Системные состояния */
.sys{display:flex;flex-direction:column;justify-content:center;min-height:calc(100svh - var(--hh));padding:clamp(40px,6vw,96px) var(--g)}
.sys-h{margin-top:16px;font-family:var(--serif);font-weight:400;font-size:clamp(56px,9vw,144px);line-height:.84;letter-spacing:-.04em}
.sys-h em{display:block}
.netbar{position:fixed;left:0;right:0;top:var(--hh);z-index:45;padding:8px var(--g);background:var(--ink);color:var(--bone);font-size:13px;font-weight:400;text-align:center}
.slots-in{margin:0}

/* 39. Документы */
.docs{margin:0 calc(-1 * var(--g));border-top:1px solid var(--ink)}
.doc{grid-template-areas:"n d a" ". x x"}
.doc-t{grid-area:d;font-family:var(--serif);font-size:clamp(30px,3.4vw,52px);line-height:.92;letter-spacing:-.03em;text-wrap:balance}
@media (min-width:1024px){.doc{grid-template-columns:40px minmax(0,1.4fr) minmax(0,1fr) 28px;grid-template-areas:"n d x a"}}
.me-pad2{padding-inline:var(--g)}

/* подвал приложения */
body.lock .ft,body.lock .proto{visibility:hidden}
.sc-bar[data-hold] .sc-price b{font-size:20px;letter-spacing:-.01em}
.sc-bar[data-hold] .pill-ink{padding:0 16px}

/* ===== адаптация: iPhone, Android, веб-приложение на экране «Домой» ===== */
/* безопасные зоны: чёлка, скруглённые углы, полоса жестов */
:root{color-scheme:light;--sat:env(safe-area-inset-top,0px);--sal:env(safe-area-inset-left,0px);--sar:env(safe-area-inset-right,0px);--ph:#74736e}
@media (max-width:767px){:root{--hh:calc(56px + var(--sat));--g:max(16px,var(--sal),var(--sar))}}
@media (min-width:768px){:root{--hh:calc(64px + var(--sat));--g:max(32px,var(--sal),var(--sar))}}
@media (min-width:1280px){:root{--g:max(48px,var(--sal),var(--sar))}}
.ah{padding-top:var(--sat)}
.sheet-box{inset:calc(12px + var(--sat)) 0 0}
.player-box{padding-top:var(--sat)}
.modal-box{max-height:calc(100svh - 24px - var(--sat))}
@media (min-width:1024px){.sheet-box{inset:auto;left:50%;top:50%}}
html{-webkit-tap-highlight-color:transparent;text-size-adjust:100%}
body{overscroll-behavior-y:none}
a,button,[role="radio"],[role="switch"],label,summary,select{touch-action:manipulation}
button,.pill,.chip,.txt,.tile,.opt,.mood,.slot,.day,.feel-o,.tr,.dr,.vc,.pk-cur{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
img{-webkit-user-drag:none}
/* подсказки в полях читаются: контраст не ниже 4,5 к 1 */
.field input::placeholder,.area::placeholder{color:var(--ph)}
/* зоны нажатия: 44 пункта у Apple, 48 dp у Google */
@media (pointer:coarse),(max-width:1023px){
  .chip{min-height:44px}
  .sum .chip{min-height:34px}
  .pill-s{min-height:44px}
  .ah-in,.ah-me{min-height:44px;min-width:44px}
  .seg-row button{min-height:44px}
  .sel{min-height:44px;font-size:16px}
  .me-nav a{min-height:44px}
  .facts dd .sc-link,.sc-plan .txt,.chk .flow-bb .txt{min-height:44px}
  .proto-nav a{min-height:44px}
  .ck{padding-block:14px}
  .lnk{padding-block:6px}
}
/* нажатие видно сразу: на тач-экране нет наведения */
@media (hover:none){
  .tile:active,.opt:active,.mood:active,.slot:active,.feel-o:active,.dr:active,.vc:active,.tr:active{background:var(--paper)}
  .chip:active{border-color:var(--ink)}
}

/* шапка на телефоне и планшете: логотип, вход и «Меню» */
.ah-menu{display:none;min-height:44px;padding:0 18px;font-size:15px}
.amenu{position:fixed;inset:var(--hh) 0 0;z-index:39;display:flex;flex-direction:column;justify-content:space-between;gap:24px;padding:8px var(--g) calc(20px + env(safe-area-inset-bottom));background:var(--bone);overflow-y:auto;overscroll-behavior:contain;opacity:0;visibility:hidden;transition:opacity .3s ease-out,visibility 0s linear .3s}
.amenu[data-open]{opacity:1;visibility:visible;transition:opacity .3s ease-out}
.amenu-in{display:flex;flex-direction:column}
.amenu-in a{display:flex;align-items:center;justify-content:space-between;min-height:64px;border-bottom:1px solid var(--line);font-family:var(--serif);font-size:clamp(34px,9vw,48px);line-height:1;letter-spacing:-.03em}
.amenu-in a[aria-current]{font-style:italic}
.amenu-foot{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.amenu-foot .pill{padding:0 12px;white-space:normal;text-align:center;line-height:1.15}
@media (max-width:1023px){
  .ah-nav{display:none !important}
  .ah-menu{display:inline-flex}
  .ah-in{margin-left:auto}
  .ah .ah-in:not(.ah-me){display:none}
  .ah:not(:has(.ah-me)) .ah-menu{margin-left:auto}
}
@media (max-width:359px){.amenu-foot{grid-template-columns:1fr}.ah{gap:10px}}
/* в альбомной ориентации телефона экономим высоту */
@media (max-height:480px) and (orientation:landscape){
  :root{--hh:calc(48px + var(--sat))}
  .amenu-in a{min-height:48px;font-size:30px}
  .h1{font-size:clamp(40px,6vw,64px)}
  .wait,.fin,.sys{min-height:0;padding-block:32px}
  .modal-box{padding-block:20px}
}

/* правило баблов: ряд заполняет всю ширину, одинокий бабл на последней строке растягивается на ширину ряда */
.times,.free-ex{width:fit-content;max-width:100%}
.times > .chip,.free-ex > .chip{flex:1 1 auto;justify-content:center;text-align:center}
.free-ex .chip{text-align:center}
.ages .kicker{flex:1 0 100%;margin-right:0}
.ages .chip{flex:1 1 auto;justify-content:center}
@media (min-width:768px){.ages .kicker{flex:0 0 auto;margin-right:8px}.ages .chip{flex:0 0 auto}}
/* то же для кнопок на телефоне: одна кнопка на строке занимает всю строку */
@media (max-width:640px){
  .flow-acts > .pill,.none-acts > .pill,.fin-acts > .pill,.modal-acts > .pill,.sh-acts > .pill,.proto-box > .pill{flex:1 1 auto}
  .flow-acts > .txt{flex:1 0 100%;justify-content:center}
  .skipline .pill{flex:1}
  .vflt .times{width:100%}
}
/* зоны нажатия, найденные замером */
.skip{min-height:44px;display:inline-flex;align-items:center}
.ah-logo{display:flex;align-items:center;min-height:44px}
.mini-t{min-height:44px;justify-content:center}
.pl-range{height:44px}
.wk-bar .txt{min-width:44px;justify-content:center}
a.pk-cur{min-height:44px}
.mrow-t{display:block;padding-block:2px;position:relative}
/* зона нажатия заголовка строки 44px без сдвига вёрстки */
.mrow-t::after{content:"";position:absolute;inset:-9px 0}
button.lnk{padding-block:6px}
.mrow-b{gap:4px}
/* узкие экраны: 320–360 px (iPhone SE первого поколения, сложенный Galaxy Fold, небольшие Android) */
.ask{grid-template-columns:minmax(0,1fr)}
.tr{grid-template-columns:minmax(0,1fr) 20px}
.tr b{overflow-wrap:anywhere}
@media (max-width:400px){
  .sc-bar{gap:8px}
  .sc-price b{font-size:22px}
  .sc-price span{display:none}
  .sc-save{width:44px;height:44px}
  .sc-bar .pill-ink{padding:0 12px;font-size:15px}
  .sc-bar[data-hold] .sc-price{display:none}
  .wk-bar{flex-wrap:wrap}
  .wk-bar > .pill:not(.pill-ink){flex:1}
  .wk-bar > .pill-ink{flex:1 0 100%}
  .next .pill{min-width:0}
  .ask-field .pill{padding:0 16px}
  .field .pill{padding:0 14px;font-size:15px}
  .pk-foot .pill{padding:0 14px}
  .h1{font-size:clamp(44px,13.5vw,52px)}
  .flow-h,.pk-h,.me-h,.vd-t,.nt-t{font-size:clamp(40px,12.5vw,48px)}
  .sys-h,.fin-h,.eve-h{font-size:clamp(48px,15vw,60px)}
  .wait-t{font-size:clamp(40px,13vw,48px)}
  .facts > div{grid-template-columns:minmax(0,1fr);gap:4px}
  .incl-t li{grid-template-columns:minmax(0,1fr);gap:4px}
}
@media (max-width:400px){.seg-row{border-radius:26px}.seg-row button{white-space:normal;min-width:0;padding:6px 8px;line-height:1.15;border-radius:22px}}
/* телефон в альбомной ориентации: фото слева, содержимое справа, как на широком экране */
@media (orientation:landscape) and (max-height:480px) and (min-width:560px){
  .sheet-box{inset:calc(8px + var(--sat)) 0 0;display:grid;grid-template-columns:minmax(0,4fr) minmax(0,6fr);grid-template-rows:minmax(0,1fr) auto}
  .sc-scroll{display:contents}
  .sc-car{grid-column:1;grid-row:1 / span 2}
  .sc-track{height:100%}
  .sc-track img{height:100%;aspect-ratio:auto}
  .sc-b{grid-column:2;grid-row:1;overflow-y:auto;overscroll-behavior:contain;padding-top:16px}
  .sc-bar{grid-column:2;grid-row:2;padding-block:8px}
  .sc-t{font-size:34px}
  .wk-grid,.vd-top,.cu-hero{grid-template-columns:minmax(0,4fr) minmax(0,6fr);align-items:start}
  .wk-ph,.vd-ph,.cu-ph{position:sticky;top:var(--hh);aspect-ratio:auto;height:calc(100svh - var(--hh));margin:0}
  .wk-ph{top:calc(var(--hh) + 57px);height:calc(100svh - var(--hh) - 57px);margin-left:calc(-1 * var(--g))}
  .wk-b,.vd-card,.cu-b{padding-left:24px}
  .wk-h{font-size:40px}
  .cu-name,.vd-t,.nt-t,.flow-h,.pk-h,.me-h{font-size:44px}
  .nt-cover,.eve-ph,.me-next-ph{aspect-ratio:auto;height:56svh}
  .pl-main{grid-template-rows:none;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .pl-now{padding:12px var(--g);border-bottom:0;border-right:1px solid var(--dline);overflow-y:auto}
  .pl-t{font-size:28px}
  .pl-range{margin-top:10px}
  .pl-ctl .rb-main{width:56px;height:56px}
  .pc{max-width:min(460px,46svh * 1.25)}
}
@media (min-width:1024px){.free .free-ex{max-width:680px}.ask .free-ex{max-width:920px}}

/* ===== финальный проход по правилам интерфейса ===== */
/* шкала шага: отрезки на всю ширину, заполняются по мере прохождения */
.prog-steps{flex-wrap:wrap;gap:6px 14px}
.prog-steps .prog-bars{flex:1 0 100%;gap:6px}
.prog-steps .prog-bars i{flex:1;width:auto;height:3px;position:relative;background:var(--line);overflow:hidden}
.prog-steps .prog-bars i[data-on]{background:var(--ink)}
.prog-steps .prog-bars i[data-cur]::after{content:'';position:absolute;inset:0;background:var(--ink);transform-origin:left}
.prog-steps .txt{margin-left:0}
.wk-top{flex-wrap:wrap;gap:0 16px;padding-bottom:0}
.wk-top .kicker{margin-left:auto}
.wk-prog{flex:1 0 100%;gap:6px;margin:0 calc(-1 * var(--g))}
.wk-prog i{height:3px;position:relative;overflow:hidden}
.wk-prog i[data-cur]::after{content:'';position:absolute;inset:0;background:var(--ink);transform-origin:left}
@media (prefers-reduced-motion:no-preference){.nav .prog-steps i[data-cur]::after,.nav .wk-prog i[data-cur]::after{animation:fill .6s var(--ease) both}}
@keyframes fill{from{transform:scaleX(0)}}
@media (min-width:1024px){.wk-ph{top:calc(var(--hh) + 48px);height:calc(100svh - var(--hh) - 48px)}}

/* V2, V3: оптика значков */
.ic-play{translate:1.5px 0}
.pill:has(> .ic:first-child){padding-left:20px}
.pill:has(> .ic:last-child){padding-right:20px}
/* V5: у фото на светлом фоне есть край */
.pk-ph,.flow-ph,.mrow-ph,.nx-ph,.asm-ph,.vd-ph,.wk-ph,.nt-cover,.eve-ph,.me-next-ph,.sc-car,.pc{outline:1px solid rgba(0,0,0,.06);outline-offset:-1px}
.on-dark .eve-ph,.on-dark .me-next-ph,.fin .pc{outline-color:rgba(255,255,255,.08)}
[data-go]{cursor:pointer}
/* M5, M6: нажатие и смена значка */
.chip,.tile,.opt,.mood,.slot,.feel-o,.day{transition:background-color .2s ease-out,color .2s ease-out,border-color .2s ease-out,scale .2s ease-out}
.chip:active,.day:active{scale:.97}
@media (prefers-reduced-motion:no-preference){.rb > .ic{animation:icin .22s ease-out}}
@keyframes icin{from{opacity:0;scale:.25;filter:blur(4px)}}
/* T2, T9: цифры одной высоты, подчёркивание не режет буквы */
body{font-variant-numeric:lining-nums}
.num,.meta,.kicker,time,.mrow-s,.nx-m,.flow-m{font-variant-numeric:lining-nums tabular-nums}
a,.lnk,.txt,.sc-link{text-underline-position:from-font;text-decoration-skip-ink:auto}
/* T5: длинные слова и ссылки, введённые человеком, не ломают строку */
.lead,.mine-t,.tk-t b,.me-note,.modal-l,.asm-note blockquote,.note{overflow-wrap:anywhere}
/* C5: неактивное читается */
.dr-soon .dr-d{color:#8f8e89}
.chip-off{color:var(--ph)}

/* ===== состояния: загрузка, нет сети, отправка ===== */
.sk{display:block;flex:none;max-width:100%;background:var(--paper);border-radius:6px}
.sk-h{border-radius:4px}
.sk-p{border-radius:1440px}
.sk-img{width:100%;aspect-ratio:4/3;border-radius:0}
.on-dark .sk{background:rgba(255,254,247,.1)}
figure.sk,.pk-ph.sk,.flow-ph.sk,.cu-ph.sk,.nt-cover.sk,.eve-ph.sk{border-radius:0;outline-color:transparent}
.skv > *{pointer-events:none}
.skv .pk-head,.skv .flow-a,.skv .cu-b,.skv .nt-head,.skv .nt-body,.skv .me-main,.skv .eve-a,.skv .eve-b,.skv .step-head,.sk-b,.sheet-box[aria-busy] .sc-b{display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.skv .step-head{display:flex}
.sk-b{padding:16px;min-width:0;width:100%}
.sk-row{display:flex;flex-wrap:wrap;gap:8px}
.sk-sp{justify-content:space-between;width:100%}
.sk-gap{height:12px}
.sk-picks .pk{pointer-events:none}
.sk-list{margin:0 calc(-1 * var(--g));border-top:1px solid var(--ink)}
.sk-li{display:flex;align-items:center;gap:20px;padding:22px var(--g);border-bottom:1px solid var(--line)}
.sk-li2{padding-inline:0;gap:14px}
@media (max-width:640px){.sk-li{gap:12px}.sk-li > .sk{flex:0 1 auto}.sk-li:not(.sk-li2) > .sk:last-child{display:none}}
.skv .me-nav{pointer-events:none}
.skv .flow-bb{display:flex;flex-direction:column;gap:10px}
@media (prefers-reduced-motion:no-preference){.sk{animation:skp 1.4s ease-in-out infinite}.sk:nth-child(2n){animation-delay:.15s}}
@keyframes skp{50%{opacity:.55}}
[data-busy]{pointer-events:none;opacity:.72}
/* нет сети */
.netbar{position:fixed;left:0;right:0;top:var(--hh);z-index:45;padding:8px var(--g);background:var(--ink);color:var(--bone);font-size:13px;font-weight:400;line-height:1.3;text-align:center}
body.is-off #view{padding-top:34px}
body.is-off .toast{top:calc(var(--hh) + 46px)}
body.is-off .wk-top,body.is-off .me-side{top:calc(var(--hh) + 34px)}
.off .tg-wait{margin-top:20px}
.wk-off{margin:0 0 18px}
/* переключатель связи в полосе прототипа */
.proto-nav button{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border:1px solid var(--ash);border-radius:1440px;font-size:13px;font-weight:400;background:var(--bone)}
.proto-nav button[aria-checked="true"]{background:var(--ink);color:var(--bone);border-color:var(--ink)}

/* ===== главный экран ===== */
.strip{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 16px;align-items:center;margin:calc(-1 * clamp(20px,3vw,40px)) calc(-1 * var(--g)) clamp(20px,3vw,40px);padding:14px var(--g);border-bottom:1px solid var(--line);background:var(--paper)}
.strip.on-dark{background:var(--ink);border-bottom-color:var(--ink)}
.strip b{grid-column:1;font-family:var(--serif);font-weight:400;font-size:clamp(22px,2.2vw,30px);line-height:1;letter-spacing:-.02em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.strip-go{grid-column:2;grid-row:1 / span 2;display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:400;white-space:nowrap}
.strip-go .ic{transition:translate .3s var(--ease)}
@media (hover:hover){.strip:hover .strip-go .ic{translate:6px 0}}
@media (max-width:640px){.strip{grid-template-columns:minmax(0,1fr)}.strip b{white-space:normal}.strip-go{grid-column:1;grid-row:auto;margin-top:6px}}
.home .s1-low + .blk{margin-top:clamp(48px,6vw,88px)}
.wkk{display:grid;min-width:0}
.wkk-ph{position:relative;display:block;aspect-ratio:3/2;overflow:hidden;background:var(--paper)}
.wkk-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:scale 1.2s var(--ease)}
.wkk-b{display:flex;flex-direction:column;gap:12px;padding:20px var(--g) 26px;min-width:0}
.wkk-t{font-family:var(--serif);font-weight:400;font-size:clamp(34px,4.4vw,64px);line-height:.9;letter-spacing:-.035em;text-wrap:balance}
.wkk-p{max-width:46ch;font-size:16px;line-height:1.4;color:var(--charcoal);text-wrap:pretty}
.wkk .metas{padding-top:0}
@media (hover:hover){.wkk:hover .wkk-ph img{scale:1.03}.wkk:hover .wkk-t{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.1em}}
@media (min-width:1024px){.wkk{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.wkk-ph{aspect-ratio:auto;min-height:420px}.wkk-b{justify-content:center;padding:40px clamp(32px,4vw,72px)}}
.home > .blk:last-of-type{margin-bottom:0}

/* ===== переходы между экранами ===== */
html:not(.nav) .step > *{animation:none}
[data-picked]{background:var(--ink) !important;color:var(--bone) !important}
[data-picked] .tile-n,[data-picked] .tile-d,[data-picked] .mood-d{color:var(--mist) !important}
@media (prefers-reduced-motion:no-preference){
  html.nav #view.in > :not(.step):not(.skv){animation:view-in .34s var(--ease) both}
  html.nav #view.in > .skv{animation:view-fade .2s ease-out both}
  html.nav #view.in .me-main > *{animation:rise .5s var(--ease) both}
  html.nav #view.in .me-main > :nth-child(2){animation-delay:.05s}
  html.nav #view.in .me-main > :nth-child(n+3){animation-delay:.1s}
}
@keyframes view-in{from{opacity:0;translate:0 12px}}
@keyframes view-fade{from{opacity:0}}

/* ===== Telegram: макет чата ===== */
.tgl{margin:0 calc(-1 * var(--g) * 0);padding:0 var(--g)}
.blk > .tgl{margin-inline:0}
.tgl > li{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;padding:22px 0 26px;border-bottom:1px solid var(--line)}
.tgl > li:last-child{border-bottom:0}
.tgl-m{display:flex;flex-direction:column;gap:6px;min-width:0}
.tgl-m b{font-family:var(--serif);font-weight:400;font-size:clamp(26px,2.4vw,34px);line-height:.96;letter-spacing:-.025em;text-wrap:balance}
.tgl-m > span:last-child{max-width:40ch;font-size:14px;line-height:1.35;color:var(--graphite)}
.tgc{display:flex;flex-direction:column;align-items:flex-start;gap:6px;width:100%;max-width:440px;padding:16px;background:var(--paper)}
.tgc-out{align-items:flex-end}
.tgb{position:relative;display:flex;flex-direction:column;gap:10px;max-width:100%;width:340px;padding:12px 14px 22px;background:#fff;border:1px solid var(--line);border-radius:16px 16px 16px 4px;font-size:15px;line-height:1.38}
.tgb-out{border-radius:16px 16px 4px 16px;background:var(--bone);border-color:var(--ash)}
.tgb b{font-weight:400}
.tgb-t b{font-size:16px}
.tgb-u{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.18em;overflow-wrap:anywhere}
.tgb-h{position:absolute;right:12px;bottom:6px;font-size:11px;color:var(--graphite)}
.tga{display:flex;align-items:center;gap:12px}
.tga .rb{width:44px;height:44px;background:var(--ink);color:var(--bone);border-color:var(--ink)}
.tga span span{display:block;font-size:13px;color:var(--graphite)}
.tga b{display:block}
.tgb-pc,.tgp-pc{display:block;width:100%;max-width:none;aspect-ratio:4/5}
.tgb-pc .pc-b b,.tgp-pc .pc-b b{font-size:22px}
.tgk{display:grid;gap:6px;width:340px;max-width:100%}
.tgk > div{display:flex;gap:6px}
.tgk-b{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;min-height:40px;padding:0 10px;border:1px solid var(--ash);border-radius:10px;background:var(--bone);font-size:14px;font-weight:400;text-align:center;line-height:1.15}
.tgk-b:not(.tgk-cb)::after{content:'↗';font-size:12px;color:var(--graphite)}
.tgp{display:flex;flex-direction:column;gap:4px;padding-left:10px;border-left:2px solid var(--ink)}
.tgp-ph{position:relative;display:block;aspect-ratio:1200/630;overflow:hidden;background:var(--paper);margin-bottom:4px}
.tgp-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tgp-pc{margin-bottom:4px}
.tgp-s{font-size:13px;color:var(--graphite)}
.tgp-d{font-size:14px;line-height:1.35;color:var(--charcoal);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.tg-rules{padding-top:6px}
@media (min-width:900px){.tgl > li{grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:clamp(32px,5vw,96px);align-items:start}}

/* ===== карта экранов ===== */
.mapl{padding:0 var(--g)}
.mapl li{display:grid;grid-template-columns:32px minmax(0,1fr);gap:4px 8px;align-items:baseline;padding:4px 0 12px;border-bottom:1px solid var(--line)}
.mapl li:last-child{border-bottom:0}
.mapl-t{font-family:var(--serif);font-size:clamp(24px,2.2vw,30px);line-height:1;letter-spacing:-.02em}
.mapl-r{grid-column:2;font-size:13px;color:var(--graphite);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.mapl-s{grid-column:2;display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.mapl-s:empty{display:none}
.mapl-s .chip{min-height:44px;padding:0 14px;font-size:13px}
.mapl-t{display:inline-flex;align-items:center;min-height:44px}
.mapl-s .chip{flex:1 1 auto;justify-content:center}
@media (min-width:1024px){.mapl-s .chip{min-height:40px;flex:0 0 auto}}
@media (hover:hover){.mapl-t:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.12em}}
@media (min-width:1024px){.mapl li{grid-template-columns:40px minmax(0,4fr) minmax(0,2fr) minmax(0,6fr);align-items:center;padding:8px 0}.mapl-r,.mapl-s{grid-column:auto;margin-top:0}}
.spec{padding:16px 0 8px}
.spec > div{grid-template-columns:minmax(0,4fr) minmax(0,8fr)}
.spec dd{max-width:70ch;font-size:15px;line-height:1.45}

.tgl-m,.tgc{min-width:0}
@media (max-width:400px){.pill{white-space:normal;text-align:center;line-height:1.15;padding-block:8px;min-width:0}.next{flex-wrap:wrap}.next .pill{flex:1 1 auto}.asm-opts .metas{min-width:0}}

/* ===== недостающие состояния: аудио, фото, пустой куратор, письма ===== */
/* аудио грузится и не загрузилось */
.rb:disabled{cursor:default}
.rb-load{display:block;width:16px;height:16px;border-radius:50%;border:1.5px solid currentColor;border-right-color:transparent}
.rb-main .rb-load{width:24px;height:24px;border-width:2px}
@keyframes turn{to{rotate:360deg}}
@media (prefers-reduced-motion:no-preference){.rb-load{animation:turn .9s linear infinite}}
@media (prefers-reduced-motion:reduce){.rb-load{border-right-color:currentColor;opacity:.4}}
.mini[data-err] .mini-l i{background:transparent}
.pl-fail{display:none}
.player-box[data-st="err"] .pl-fail{display:flex;flex-direction:column;align-items:flex-start;gap:12px;margin-top:22px;padding-top:18px;border-top:1px solid var(--dline)}
.player-box[data-st="err"] :is(.pl-range,.pl-time,.pl-ctl){display:none}
.pl-fail b{font-family:var(--serif);font-weight:400;font-size:clamp(28px,2.6vw,36px);line-height:.95;letter-spacing:-.025em}
.pl-fail p{max-width:44ch;font-size:15px;line-height:1.35;color:var(--mist)}
.pl-fail .pill{margin-top:6px;background:var(--bone);color:var(--ink);border-color:var(--bone)}
.player-box[data-st="load"] :is(.pl-range,.pl-speed,.rb:not(.rb-main)){opacity:.35}
.player-box:is([data-st="err"],[data-st="load"]) .pl-tr li button{cursor:default}
.player-box[data-st="load"] .pl-tr li button[data-on]{color:inherit}
/* без звука расшифровка становится основным содержимым: все строки одной яркости */
.player-box[data-st="err"] .pl-tr li button{color:var(--bone)}
.pl-range:disabled{cursor:default}
/* фото не загрузилось: заглушка держит размеры блока */
img[data-noimg]{outline-color:transparent}
/* куратор без заметок */
.cu-0{display:grid;gap:16px;padding:28px var(--g) 36px}
.cu-0-t{font-family:var(--serif);font-size:clamp(34px,3.6vw,52px);line-height:.92;letter-spacing:-.03em}
.cu-0-r{display:flex;flex-direction:column;gap:18px;align-items:flex-start}
.cu-0-r p{max-width:46ch;font-size:16px;line-height:1.35;color:var(--charcoal);text-wrap:pretty}
@media (min-width:900px){.cu-0{grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:clamp(32px,5vw,96px);align-items:start;padding-block:36px 48px}}
@media (max-width:640px){.cu-0 .flow-acts{width:100%}.cu-0 .flow-acts .pill{flex:1 1 auto}}
/* письма: макет того, что человек видит в почте */
.eml{display:block;width:100%;max-width:520px;min-width:0;border:1px solid var(--line);background:#fff;font-size:15px;line-height:1.35}
.eml-h{display:grid;gap:8px;padding:14px 16px 16px;border-bottom:1px solid var(--line)}
.eml-from{display:flex;align-items:center;gap:10px;margin-bottom:4px;font-size:13px;line-height:1.25;color:var(--graphite)}
.eml-from img{width:36px;height:36px;border-radius:50%;flex:none}
.eml-from b{display:block;font-size:15px;color:var(--ink)}
.eml b{font-weight:400}
.eml-row{display:grid;grid-template-columns:64px minmax(0,1fr);gap:10px;align-items:baseline}
.eml-row b{font-size:16px;line-height:1.25}
.eml-row > span:last-child{font-size:14px;color:var(--graphite)}
.eml-b{display:flex;flex-direction:column;align-items:flex-start;gap:16px;padding:24px 20px 18px;background:var(--bone)}
.eml-logo{height:13px;width:auto;margin-bottom:6px}
.eml-t{font-family:var(--serif);font-size:clamp(32px,3vw,40px);line-height:.94;letter-spacing:-.03em;text-wrap:balance}
.eml-x{max-width:44ch;color:var(--charcoal)}
.eml-x b{font-size:16px;color:var(--ink)}
.eml-list{display:grid;width:100%;border-top:1px solid var(--line)}
.eml-list > span{display:grid;gap:4px;padding:12px 0;border-bottom:1px solid var(--line)}
.eml-list > span > span{font-size:13px;color:var(--graphite)}
.eml-list b{font-family:var(--serif);font-size:22px;line-height:1;letter-spacing:-.02em}
.eml-ans{display:flex;flex-wrap:wrap;gap:6px;width:100%}
.eml-ans span{flex:1 1 auto;display:flex;align-items:center;justify-content:center;min-height:44px;padding:0 16px;border:1px solid var(--ink);border-radius:1440px;white-space:nowrap}
.eml-acts{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px}
.eml-btn{display:inline-flex;align-items:center;min-height:48px;padding:0 26px;border-radius:1440px;background:var(--ink);color:var(--bone)}
.eml-l,.eml-f u{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.18em;text-underline-position:from-font}
.eml-f{width:100%;margin-top:4px;padding-top:14px;border-top:1px solid var(--line);font-size:12px;line-height:1.45;color:var(--graphite)}
.eml .tga .rb{background:var(--ink);color:var(--bone);border-color:var(--ink)}
@media (max-width:400px){.eml-row{grid-template-columns:minmax(0,1fr);gap:2px}.eml-b{padding-inline:16px}.eml-btn{padding-inline:20px}}
#mail{scroll-margin-top:calc(var(--hh) + 8px)}

/* ===== профиль культроверта, герои, знакомство, живое меню кабинета ===== */
/* аватар: герой или фото внутри кольца. Кольцо показывает шкалу культроверта */
.ava{--s:56px;--p:0;display:grid;place-items:center;flex:none;width:var(--s);height:var(--s);border-radius:50%;background:conic-gradient(var(--ink) calc(var(--p) * 1%),var(--line) 0)}
.ava > span{display:block;width:calc(var(--s) - 8px);height:calc(var(--s) - 8px);border-radius:50%;background:var(--bone);box-shadow:0 0 0 2px var(--bone);overflow:hidden}
.ava > span > *{display:block;width:100%;height:100%;border-radius:50%;object-fit:cover}
.ava-xs{--s:28px}
.ava-xs > span{width:calc(var(--s) - 6px);height:calc(var(--s) - 6px);box-shadow:0 0 0 1.5px var(--bone)}
.ava-xs .hero-r{display:none}
.ava-s{--s:48px}
.ava-l{--s:clamp(88px,9vw,120px)}
.ava-l > span{width:calc(var(--s) - 14px);height:calc(var(--s) - 14px);box-shadow:0 0 0 4px var(--bone)}
.hero{display:block;width:100%;height:100%;border-radius:50%}
.hero[data-v="0"]{background:var(--ink);color:var(--bone)}
.hero[data-v="1"]{background:var(--paper);color:var(--ink)}
.hero[data-v="2"]{background:var(--bone);color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink)}
.hero-r path{fill:currentColor;opacity:.14}
.hero-g{fill:none;stroke:currentColor;stroke-width:3;stroke-linejoin:round;stroke-linecap:round}
/* шапка и меню телефона */
.ah-me.ava{--s:44px;padding:0;border:0;background:conic-gradient(var(--ink) calc(var(--p) * 1%),var(--line) 0)}
.amenu-in a.amenu-me{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:14px;align-items:center;min-height:84px;font-family:var(--sans);font-size:15px;line-height:1.2;font-style:normal}
.amenu-in a.amenu-me[hidden]{display:none}
.amenu-me b{display:block;font-family:var(--serif);font-weight:400;font-size:32px;line-height:1;letter-spacing:-.02em}
.amenu-me b + span{display:block;margin-top:5px;font-size:13px;color:var(--graphite)}
.amenu-me .ic{width:20px;height:20px}
/* меню кабинета: подписи из данных человека и счётчики */
.me-nav a{gap:8px}
.me-nav-t{display:inline-flex;align-items:center;gap:8px}
.me-nav-d{display:none}
.me-nav-n{font-size:12px;color:var(--graphite)}
.me-nav a[aria-current] .me-nav-n{color:var(--mist)}
.me-nav a[aria-current] .ava{background:conic-gradient(var(--bone) calc(var(--p) * 1%),rgba(255,254,247,.3) 0)}
.me-nav a[aria-current] .ava > span{box-shadow:0 0 0 1.5px var(--ink)}
@media (min-width:1024px){
  .me-who{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:14px;padding:0 var(--g) 24px;min-width:0}
  .me-who b{display:block;font-family:var(--serif);font-weight:400;font-size:28px;line-height:1;letter-spacing:-.02em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .me-who b + span{display:block;margin-top:5px;font-size:13px;color:var(--graphite);font-variant-numeric:lining-nums tabular-nums}
  .me-who .ic{width:18px;height:18px;color:var(--graphite);transition:translate .3s var(--ease)}
  .me-who[aria-current] .ic{visibility:hidden}
  .me-nav a{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:3px 12px;min-height:62px;padding:10px var(--g)}
  .me-nav-t{grid-column:1;align-self:end;font-size:16px;line-height:1.1}
  .me-nav-d{display:block;grid-column:1;align-self:start;font-size:12px;line-height:1.2;color:var(--graphite);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .me-nav-n{grid-column:2;grid-row:1 / span 2;font-family:var(--serif);font-size:28px;line-height:1;letter-spacing:-.02em;color:var(--ink);font-variant-numeric:lining-nums}
  .me-nav a[aria-current] .me-nav-d{color:var(--mist)}
  .me-nav a[aria-current] .me-nav-n{color:var(--bone)}
  .me-nav a:not(:has(.me-nav-d)) .me-nav-t{grid-row:1 / span 2;align-self:center}
  .me-nav-p{display:none !important}
}
@media (hover:hover) and (min-width:1024px){.me-who:hover .ic{translate:4px 0}}
/* профиль: герой, шкала, следующий шаг */
.me-h{font-variant-numeric:lining-nums}
.pf-me{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:14px 18px;margin-top:clamp(22px,2.6vw,36px);padding:18px 0;border-top:1px solid var(--ink);border-bottom:1px solid var(--line)}
.pf-ava{border-radius:50%;transition:scale .2s ease-out}
.pf-ava:active{scale:.97}
.pf-me-b{display:flex;flex-direction:column;gap:4px;min-width:0}
.pf-me-b b{font-family:var(--serif);font-weight:400;font-size:clamp(34px,3.4vw,48px);line-height:.92;letter-spacing:-.03em}
.pf-me-b > span:last-child{font-size:14px;line-height:1.3;color:var(--graphite)}
.pf-me .flow-acts{grid-column:1 / -1;margin-top:0}
@media (min-width:768px){.pf-me{grid-template-columns:auto minmax(0,1fr) auto}.pf-me .flow-acts{grid-column:auto}}
@media (max-width:640px){.pf-me .flow-acts .pill{flex:1 1 auto}}
.lvw{margin-top:clamp(22px,2.6vw,36px)}
.lv-bar{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
.lv-bar i{height:6px;background:var(--line)}
.lv-bar i[data-on]{background:var(--ink)}
.lv-bar i[data-plan]{background:repeating-linear-gradient(90deg,var(--ink) 0 6px,transparent 6px 12px)}
.lv{margin-top:6px}
.lv li{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:11px 0;border-bottom:1px solid var(--line)}
.lv b{font-weight:400;font-size:15px}
.lv span{font-size:13px;color:var(--graphite);font-variant-numeric:lining-nums tabular-nums}
.lv li:not([data-on]) b{color:var(--graphite)}
@media (min-width:768px){
  .lv{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;margin-top:10px}
  .lv li{flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:3px;padding:0;border-bottom:0;min-width:0}
  .lv b{font-size:14px;line-height:1.2}
}
.lvl{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:14px;margin-top:22px;padding:12px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);max-width:560px}
.lvl b{display:block;font-weight:400;font-size:16px;line-height:1.25}
.lvl b + span{display:block;margin-top:3px;font-size:13px;line-height:1.3;color:var(--graphite);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lvl .ic{transition:translate .3s var(--ease)}
@media (hover:hover){.lvl:hover .ic{translate:4px 0}}
.lvl-next{max-width:none;margin-top:16px;border-top:0}
.hr-d{display:block;flex:none;width:48px;height:48px;border-radius:50%}
.hr-lock .hero{box-shadow:none;outline:1.5px dashed var(--ash);outline-offset:-1.5px}
.hr-lock .hero-g{stroke:var(--ash)}
.hr-lock .hero-r{display:none}
.pf-stats{margin-top:clamp(24px,3vw,40px)}
.pf-stats b{font-variant-numeric:lining-nums}
.pf-hello .fl-h{margin-top:14px}
/* герои: сетка для выбора и коллекции */
.heroes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:0;border-top:0}
.me-blk > .heroes,.modal-box .heroes{border-bottom:0}
.modal-box .heroes{margin-top:20px;border-top:1px solid var(--ink)}
.hr{display:grid;grid-template-columns:auto minmax(0,1fr);align-content:center;align-items:center;gap:2px 12px;min-height:76px;padding:12px 10px 12px 0;border-bottom:1px solid var(--line);text-align:left;transition:background-color .2s ease-out}
.hr:nth-child(2n){padding-left:12px;border-left:1px solid var(--line)}
.hr .hr-d{grid-row:1 / span 2;width:52px;height:52px}
.hr b{align-self:end;font-family:var(--serif);font-weight:400;font-size:24px;line-height:1;letter-spacing:-.02em}
.hr b + span{align-self:start;font-size:12px;line-height:1.25;color:var(--graphite)}
.hr[aria-checked="true"] .hr-d{box-shadow:0 0 0 2px var(--bone),0 0 0 4px var(--ink)}
.hr[aria-checked="true"] b::after{content:' / ваш';font-family:var(--sans);font-size:12px;letter-spacing:0;color:var(--graphite)}
.hr[aria-disabled="true"] b{color:var(--graphite)}
.hr[aria-disabled="true"] .hero{background:transparent;color:var(--ash);box-shadow:none;outline:1.5px dashed var(--ash);outline-offset:-1.5px}
.hr[aria-disabled="true"] .hero-r{display:none}
.hr:active{background:var(--paper)}
@media (min-width:768px){.heroes{grid-template-columns:repeat(3,minmax(0,1fr))}.hr:nth-child(2n){padding-left:0;border-left:0}.hr:not(:nth-child(3n+1)){padding-left:14px;border-left:1px solid var(--line)}}
@media (min-width:1280px){.me-blk > .heroes{grid-template-columns:repeat(4,minmax(0,1fr))}.me-blk > .heroes .hr:not(:nth-child(3n+1)){padding-left:0;border-left:0}.me-blk > .heroes .hr:not(:nth-child(4n+1)){padding-left:14px;border-left:1px solid var(--line)}}
.hr-acts .pill{flex:1 1 auto}
label.pill{cursor:pointer}
label.pill:focus-within{outline:2px solid var(--ink);outline-offset:2px}
/* ваши слова */
.ws{display:grid;gap:20px;padding:20px 0 4px}
.ws-g{display:grid;gap:10px}
.ws-row{display:flex;flex-wrap:wrap;gap:8px;width:fit-content;max-width:100%}
.ws-row > .chip{flex:1 1 auto;justify-content:space-between}
.ws-c{min-height:44px;padding:0 0 0 16px;gap:0;font-size:15px}
.ws-c:not(:has(button)){padding:0 18px;justify-content:center}
.ws-c button{display:grid;place-items:center;width:40px;height:44px;flex:none;color:var(--graphite);border-radius:50%}
.ws-c button .ic{width:13px;height:13px}
.ws-c[data-k="seen"]{border-style:dashed;border-color:var(--ink)}
.ws-c[data-k="own"]{background:var(--paper);border-color:var(--paper)}
.ws-big{margin-bottom:8px}
.ws-big .ws-c{min-height:54px;padding:0 24px;font-family:var(--serif);font-size:clamp(26px,2.6vw,36px);letter-spacing:-.02em;border-color:var(--ink)}
.ws-add{display:grid;gap:8px;max-width:520px;margin-top:4px}
.ws .me-note{padding-top:0}
.axs{display:grid;gap:18px;max-width:640px;padding:20px 0 8px}
.axs .seg + .seg{margin-top:0}
.pf-facts{margin-top:8px}
.pf-how{margin-inline:0 !important}
/* вам подойдёт: на десктопе три колонки с общими строками, на телефоне лента вбок */
.nx-why{font-size:14px;line-height:1.3;color:var(--charcoal);text-wrap:pretty}
.pf-recs .nx-c{border-bottom:0}
.me-blk > .pf-recs{margin-inline:calc(-1 * var(--g))}
@media (min-width:1024px){
  .me-blk > .pf-recs{margin-inline:0}
  .pf-recs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));overflow:visible}
  .pf-recs .nx-c{width:auto;display:grid;grid-row:span 5;grid-template-rows:subgrid;gap:10px}
  .pf-recs .nx-c:last-child{border-right:0}
  .pf-recs .nx-c b{align-self:start}
  .pf-recs .nx-m{margin-top:0;align-self:end}
}
/* где вы были */
.been li{display:grid;grid-template-columns:minmax(0,1fr);gap:6px 20px;padding:16px 0 18px;border-bottom:1px solid var(--line)}
.been li:last-child{border-bottom:0}
.been-t{position:relative;justify-self:start;font-family:var(--serif);font-size:clamp(24px,2.2vw,30px);line-height:.98;letter-spacing:-.02em;text-wrap:balance}
.been-t::after{content:"";position:absolute;inset:-11px 0}
.been-p{max-width:62ch;font-size:14px;line-height:1.35;color:var(--graphite)}
.been-a{margin-top:6px}
@media (hover:hover){.been-t:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.12em}}
@media (min-width:768px){.been li{grid-template-columns:minmax(0,1fr) auto}.been time{grid-column:1 / -1}.been-t,.been-p{grid-column:1}.been-a{grid-column:2;grid-row:2 / span 2;align-self:center;margin-top:0}}
/* знакомство */
.hl-g{display:grid;gap:10px;max-width:720px;margin-top:clamp(22px,2.6vw,34px)}
.step-head + .hl-g{margin-top:0}
.hl-axs{padding-top:0}
.hl-tiles .tile{text-align:left}
.hl-tiles .tile[aria-pressed="true"]{background:var(--ink);color:var(--bone)}
.hl-tiles .tile[aria-pressed="true"] .tile-n,.hl-tiles .tile[aria-pressed="true"] .tile-d{color:var(--mist)}
.hl-tiles .tile[aria-pressed="true"] .tile-n::after{content:' / выбрано'}
.hl-next .txt{flex:none;min-height:44px}
.hl-ava-r{display:flex;align-items:center;gap:18px}
.hl-ava .flow-acts{margin-top:4px}
.hl-ava .flow-acts .pill{flex:1 1 auto}
@media (min-width:641px){.hl-ava .flow-acts .pill{flex:0 0 auto}}
.hl-open{margin-top:8px}
.hl-lv .lvw{margin-top:18px}
.hl-acts{margin-top:clamp(28px,3vw,44px)}
@media (max-width:640px){.hl-acts .pill{flex:1 1 auto}}
/* приглашение познакомиться на главной */
.strip-hello b{white-space:normal;text-wrap:balance}
.strip-hello .strip-go{gap:6px 14px}
.strip-hello .txt{min-height:44px}
@media (max-width:640px){.strip-hello{grid-template-columns:minmax(0,1fr)}.strip-hello .strip-go{grid-column:1;grid-row:auto;margin-top:8px;justify-content:space-between}}
/* карточка для историй */
.shc{display:grid;gap:24px;margin-top:clamp(22px,2.6vw,36px);padding-top:clamp(20px,2.4vw,32px);border-top:1px solid var(--ink)}
.shc-ph{justify-self:center;width:min(100%,320px);aspect-ratio:9/16;background:var(--ink);overflow:hidden}
.shc-ph[data-fmt="sq"]{aspect-ratio:1;width:min(100%,420px)}
.shc-ph img{display:block;width:100%;height:100%}
.shc-ph img:not([src]){visibility:hidden}
.shc-b{display:grid;gap:22px;align-content:start;min-width:0}
.shc-b .flow-acts{margin-top:0}
.shc-b .flow-acts .pill{flex:1 1 auto}
.shc-how li{font-size:14px}
.shc-how b{font-weight:400}
@media (min-width:900px){.shc{grid-template-columns:auto minmax(0,1fr);gap:clamp(32px,5vw,80px);align-items:start}.shc-ph{justify-self:start;width:320px}.shc-ph[data-fmt="sq"]{width:420px}.shc-b{max-width:520px}}
/* «как мы подбираем»: четыре пункта, по два в ряд */
@media (min-width:1024px){.pf-how{grid-template-columns:repeat(2,minmax(0,1fr))}.pf-how li{padding:20px 24px 24px 0;border-left:0;border-bottom:1px solid var(--line)}.pf-how li:nth-child(2n){padding-left:24px;border-left:1px solid var(--line)}.pf-how li:nth-last-child(-n+2){border-bottom:0}}
@media (min-width:1024px) and (max-width:1279px){.me-who .ic{display:none}.me-who{grid-template-columns:auto minmax(0,1fr)}}
/* герои на телефоне: три в ряд, диск и имя. Описание выбранного стоит в блоке «Ваш герой», условие закрытого приходит подсказкой */
@media (max-width:767px){
  .heroes{grid-template-columns:repeat(3,minmax(0,1fr))}
  .hr,.hr:nth-child(2n){grid-template-columns:minmax(0,1fr);justify-items:center;gap:8px;min-height:0;padding:14px 4px 12px;border-left:0;text-align:center}
  .hr:not(:nth-child(3n+1)){border-left:1px solid var(--line)}
  .hr .hr-d{grid-row:auto;width:60px;height:60px}
  .hr b{font-size:17px;letter-spacing:-.01em;overflow-wrap:anywhere}
  .hr b + span{display:none}
  .hr[aria-checked="true"] b::after{content:none}
  .hr[aria-checked="true"] b{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.16em}
}
.ws-row > .ws-c:not(:has(button)){justify-content:center}
.ws,.ws-g,.ws-add{grid-template-columns:minmax(0,1fr)}
.ws-row{min-width:0}

/* ===== пульт кабинета: сверху человек и ближайший вечер, затем главное, служебное прижато к низу ===== */
.me-up,.me-nav-k{display:none}
/* на телефоне служебные пункты идут в конце ленты и отделены тонкой чертой */
.me-nav-k + .me-nav-x{position:relative;margin-left:13px}
.me-nav-k + .me-nav-x::before{content:'';position:absolute;left:-9px;top:8px;bottom:8px;width:1px;background:var(--line)}
@media (min-width:1024px){
  .me-side{overflow-y:auto;scrollbar-width:none;padding-bottom:14px}
  .me-side::-webkit-scrollbar{display:none}
  .me-who{padding-bottom:22px}
  .me-up{display:grid;gap:7px;padding:14px var(--g) 16px;background:var(--paper)}
  .me-up.on-dark{background:var(--ink);color:var(--bone)}
  .me-up.on-dark .kicker{color:var(--mist)}
  .me-up b{font-family:var(--serif);font-weight:400;font-size:22px;line-height:1;letter-spacing:-.02em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-wrap:balance}
  .me-up.on-dark b{font-size:28px;font-variant-numeric:lining-nums}
  .me-up-t{font-size:13px;line-height:1.25;color:var(--mist);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .me-up-go{display:inline-flex;align-items:center;gap:8px;margin-top:3px;font-size:13px}
  .me-up-go .ic{width:16px;height:16px;transition:translate .3s var(--ease)}
  .me-up + .me-nav{border-top:0}
  .me-nav{flex:1 0 auto}
  .me-nav-k{display:block;margin-top:auto;padding:16px var(--g) 6px}
  .me-nav a:has(+ .me-nav-k){margin-bottom:28px}
  .me-nav-k + .me-nav-x{margin-left:0}
  .me-nav-k + .me-nav-x::before{content:none}
  .me-nav a.me-nav-x{min-height:40px;padding:0 var(--g);gap:0 12px;border-bottom:0}
  .me-nav a.me-nav-x .me-nav-t{grid-row:1;align-self:center;font-size:14px;color:var(--charcoal)}
  .me-nav a.me-nav-x{grid-template-columns:auto minmax(0,1fr)}
  .me-nav a.me-nav-x .me-nav-d{grid-column:2;grid-row:1;align-self:center;text-align:right}
  .me-nav a.me-nav-x[aria-current] .me-nav-t{color:var(--bone)}
  .me-out{margin:0;padding:0 var(--g);min-height:40px;align-self:stretch;justify-content:flex-start;font-size:14px;color:var(--graphite)}
}
@media (hover:hover) and (min-width:1024px){.me-up:hover .me-up-go .ic{translate:4px 0}.me-nav a.me-nav-x:not([aria-current]):hover .me-nav-t{color:var(--ink)}.me-out:hover{color:var(--ink)}}

/* возврат в кабинет с экранов, где его меню нет */
.backbar{display:flex;align-items:center;gap:8px;min-height:44px;padding:0 var(--g);border-bottom:1px solid var(--line);background:var(--paper);font-size:14px;line-height:1.2}
.backbar[hidden]{display:none}
.backbar b{font-weight:400}
.backbar span{color:var(--graphite);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.backbar .ic{transition:translate .3s var(--ease)}
@media (hover:hover){.backbar:hover .ic{translate:-4px 0}}
body.is-off .backbar{margin-top:34px}
body.is-off .backbar:not([hidden]) + #view{padding-top:0}
body.has-sheet .backbar{visibility:hidden}
/* карточка человека в меню кабинета: на странице профиля видно, что вы здесь */
@media (min-width:1024px){
  .me-side{padding-top:0}
  .me-who{padding-top:26px}
  .me-who[aria-current]{background:var(--paper)}
}
.arch-note{margin-top:clamp(20px,2.4vw,32px);border-top:1px solid var(--line)}
.mine-s{white-space:nowrap}
@media (max-width:520px){.mine li a{flex-direction:column;align-items:flex-start;gap:10px}}

/* ===== подвал: тот же, что на основном сайте ===== */
.ft{--fl:rgba(255,254,247,.12);background:#000;color:var(--bone);border-top:1px solid var(--fl)}
.ft-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr))}
.ft-grid > *{display:flex;flex-direction:column;min-width:0;border-right:1px solid var(--fl)}
.ft-grid > :last-child{border-right:0}
.ft-tag{padding:32px var(--g)}
.ft-tag p{max-width:36ch;font-size:14px;line-height:1.25;color:var(--mist)}
.ft-k{padding:32px var(--g) 16px;border-bottom:1px solid var(--fl);font-size:12px;text-transform:uppercase;color:var(--mist)}
.f-link{position:relative;display:block;overflow:hidden;isolation:isolate;padding:16px var(--g);border-bottom:1px solid var(--fl);color:var(--bone);font-size:14px}
.ft-grid .f-link:last-child{border-bottom:0}
.f-link::before{content:'';position:absolute;inset:0;z-index:-1;background:var(--bone);transform:scaleY(0);transform-origin:bottom;transition:transform .5s var(--ease)}
.f-link span{display:inline-block;transition:transform .6s var(--ease)}
@media (hover:hover){.f-link:hover{color:var(--ink)}.f-link:hover::before{transform:scaleY(1)}.f-link:hover span{transform:translate3d(.5rem,0,0)}}
.ft-bar{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:stretch;border-top:1px solid var(--fl)}
.ft-req{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:0}
.ft-req > div{display:flex;flex-direction:column;gap:6px;padding:20px var(--g) 24px;border-right:1px solid var(--fl)}
.ft-req dt{font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--mist)}
.ft-req dd{margin:0;font-size:14px;color:var(--bone)}
.ft-copy{padding:20px var(--g) 24px;font-size:12px;line-height:1.5;text-transform:uppercase;letter-spacing:.04em;color:var(--mist);text-align:right;white-space:nowrap}
.ft-mark{display:none}
@media (max-width:1023px){
  .ft-bar{grid-template-columns:minmax(0,1fr)}
  .ft-req{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ft-req > div{border-bottom:1px solid var(--fl)}
  .ft-copy{text-align:left}
}
/* планшет и телефон: ссылки 2×2, логотип во всю ширину в самом низу */
@media (max-width:990px){
  .ft-tag{display:none}
  .ft-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ft-grid > *{border-right:0;padding-bottom:24px}
  .ft-grid > :nth-child(3),.ft-grid > :nth-child(5){border-left:1px solid var(--fl)}
  .ft-grid > :nth-child(4),.ft-grid > :nth-child(5){border-top:1px solid var(--fl)}
  .ft-k{padding:32px var(--g) 12px;border-bottom:0}
  .ft-grid .f-link{display:flex;align-items:center;min-height:44px;padding:8px var(--g);border-bottom:0;font-size:15px;line-height:1.25}
  .ft-mark{display:block;padding:72px 0 0;line-height:0;overflow:hidden}
  .ft-mark img{display:block;width:100%;height:auto;margin-bottom:-4.6%}
}
@media (max-width:767px){
  .ft-grid > *{padding-bottom:20px}
  .ft-k{padding:24px var(--g) 10px}
  .ft-grid .f-link{font-size:14px;overflow-wrap:anywhere}
  .ft-mark{padding-top:56px}
}

/* ===== «Сходить или нет?»: одно главное действие, второстепенное двумя спокойными колонками ===== */
}
/* шапка: фокус с клавиатуры показываем подчёркиванием, а не рамкой вокруг пункта */
.ah-nav a:focus-visible,.ah-nav button:focus-visible{outline-color:transparent;color:var(--ink);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:.4em}

/* ===== «Сходить или нет?» как разговор с помощником: всё по центру, одна колонка ===== */
.ag{padding:clamp(36px,7vh,96px) var(--g) clamp(48px,6vw,96px)}
.ag-col{width:100%;max-width:760px;margin-inline:auto}
.ag-hero{display:grid;justify-items:center;text-align:center}
.ag-h{margin-top:18px;font-family:var(--serif);font-weight:400;font-size:clamp(46px,6vw,88px);line-height:.88;letter-spacing:-.04em;text-wrap:balance}
.ag-lead{margin-top:16px;max-width:42ch;font-size:clamp(16px,1.3vw,18px);line-height:1.35;color:var(--graphite);text-wrap:pretty}
.ag .ask{width:100%;margin-top:clamp(26px,3.2vw,44px);padding-top:0;border-top:0;gap:14px;justify-items:center}
.ag .ask-field{width:100%;border-color:var(--ink)}
.ag .ask-field input{min-height:60px}
.ag .free-h{text-align:center}
.ag .free-ex{justify-content:center;margin-inline:auto}
/* лента: запрос человека справа, ответы слева без плашек */
.ag-th{padding-top:clamp(16px,2.4vw,32px)}
.ag-top{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:44px;margin-bottom:clamp(20px,3vw,40px)}
.th{display:grid;gap:clamp(22px,2.6vw,32px)}
.bub{justify-self:end;max-width:min(100%,520px);padding:13px 20px;border-radius:24px 24px 6px 24px;background:var(--ink);color:var(--bone);font-size:17px;line-height:1.3;overflow-wrap:anywhere}
.am{display:grid;grid-template-columns:40px minmax(0,1fr);gap:14px;align-items:start}
.am[hidden]{display:none}
.am-av{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--ink);color:var(--bone);overflow:hidden}
.am-av svg{width:20px;height:20px;fill:currentColor}
.am-av img{width:100%;height:100%;object-fit:cover;filter:grayscale(1)}
.am-b{display:grid;gap:12px;min-width:0;padding-top:11px}
.am-t{max-width:52ch;font-size:17px;line-height:1.4;text-wrap:pretty}
.am-big{font-family:var(--serif);font-size:clamp(36px,4vw,52px);line-height:.92;letter-spacing:-.03em}
.am-list{margin:0}
.am .flow-acts{margin-top:6px}
.am-ev{display:grid;grid-template-columns:88px minmax(0,1fr);gap:16px;align-items:center;padding:14px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.am-ev-ph{position:relative;aspect-ratio:4/5;overflow:hidden;background:var(--paper)}
.am-ev-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.am-ev-b{display:grid;gap:4px;justify-items:start;min-width:0}
.am-ev-b b{font-family:var(--serif);font-weight:400;font-size:clamp(24px,2.2vw,30px);line-height:.98;letter-spacing:-.02em;text-wrap:balance}
.am-ev-b > span{font-size:14px;color:var(--graphite)}
.am-ev-b .txt{min-height:44px;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.18em}
/* шаги проверки появляются по одному, как журнал работы */
.am-steps{margin-top:0;border-top:1px solid var(--line)}
.am-steps li[data-s="off"]{display:none}
.am-steps b{font-family:var(--sans);font-size:16px;line-height:1.25;letter-spacing:0}
.am-steps div span{margin-top:3px;font-size:13px}
.am-steps i{margin-top:5px}
.am-steps .ws-st{padding-top:3px}
.am-note{margin:0}
.am .fl-sec{margin-top:4px}
@media (prefers-reduced-motion:no-preference){.am-steps li:not([data-s="off"]),.am:not([hidden]){animation:view-in .4s var(--ease) both}}
@media (max-width:520px){.am{grid-template-columns:32px minmax(0,1fr);gap:10px}.am-av{width:32px;height:32px}.am-av svg{width:16px;height:16px}.am-b{padding-top:7px}.am-ev{grid-template-columns:72px minmax(0,1fr);gap:12px}}
.ag .ask-field input{text-align:left}

/* первый экран проверки открывается целиком: высота устройства минус шапка, как первый экран сайта */
.ag-full{padding-top:0}
.ag-first{display:grid;grid-template-rows:minmax(0,1fr) auto;min-height:calc(100vh - var(--hh));min-height:calc(100svh - var(--hh));margin-inline:calc(-1 * var(--g))}
.ag-first .ag-hero{align-self:center;padding:clamp(28px,6vh,72px) var(--g)}
.ag-full .ag-h{font-size:clamp(50px,7.4vw,120px)}
.ag-full .ag-lead{font-size:clamp(16px,1.4vw,20px)}
.ag-full .ask{max-width:820px}
/* «как это устроено» полосой у нижнего края первого экрана: те же три колонки, что у карточек ниже */
.ag-strip{border-top:1px solid var(--ink)}
.ag-strip .blk-h{display:none}
.ag-how{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));counter-reset:hw}
.ag-how li{counter-increment:hw;display:grid;align-content:start;gap:4px;min-width:0;padding:12px 10px 16px var(--g);border-left:1px solid var(--line)}
.ag-how li:first-child{border-left:0}
.ag-how li::before{content:counter(hw,decimal-leading-zero);font-size:12px;color:var(--graphite);font-variant-numeric:lining-nums tabular-nums}
.ag-how b{font-weight:400;font-size:14px;line-height:1.2;overflow-wrap:anywhere}
.ag-how span{display:none;max-width:38ch;font-size:13px;line-height:1.35;color:var(--graphite)}
@media (max-width:400px){.ag-how li{padding-left:12px}.ag-how li:first-child{padding-left:var(--g)}.ag-how b{font-size:13px}}
@media (min-width:768px){
  .ag-strip .blk-h{display:flex}
  .ag-how li{padding:18px var(--g) 26px;gap:6px}
  .ag-how b{font-size:16px}
  .ag-how span{display:block}
}
/* под первым экраном три блока разного веса: тихая полоса, тёмная личная секция, светлая витрина с крупным заголовком */
.ag-strip{border-bottom:1px solid var(--line)}
.sec-t{font-family:var(--serif);font-weight:400;font-size:clamp(44px,5.8vw,92px);line-height:.88;letter-spacing:-.04em;text-wrap:balance}
/* мои разборы: бумажная секция во всю ширину, слева заголовок, справа список. Первый экран над ней тёмный, витрина под ней светлая */
.myv{display:grid;gap:clamp(24px,3vw,40px);margin:0 calc(-1 * var(--g));padding:clamp(44px,6.4vw,96px) var(--g) clamp(48px,7vw,104px);background:var(--paper)}
.myv-h{display:grid;gap:16px;align-content:start;justify-items:start}
.myv-h p{max-width:30ch;font-size:15px;line-height:1.4;color:var(--charcoal)}
.myv-h .txt{min-height:44px;color:var(--ink)}
.myv-l{border-top:1px solid var(--ink)}
.myv-l a{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 20px;align-items:center;padding:20px 0 22px;border-bottom:1px solid rgba(0,0,0,.14)}
.myv-t{font-family:var(--serif);font-weight:400;font-size:clamp(26px,2.5vw,36px);line-height:.98;letter-spacing:-.025em;text-wrap:balance}
.myv-s{grid-column:1;font-size:14px;line-height:1.35;color:var(--charcoal)}
.myv-l .mark{grid-column:2;grid-row:1 / span 2;white-space:nowrap}
@media (hover:hover){.myv-l a:hover .myv-t{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.12em}}
@media (max-width:520px){.myv-l a{grid-template-columns:minmax(0,1fr)}.myv-l .mark{grid-column:1;grid-row:auto;justify-self:start;margin-top:6px}}
@media (min-width:900px){.myv{grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:clamp(32px,5vw,96px);align-items:start}}
/* свежие разборы: воздух сверху, крупный заголовок, карточки */
.fresh{margin-top:clamp(56px,8vw,128px)}
.sec-h{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:12px 24px;padding-bottom:clamp(22px,2.6vw,36px)}
.sec-h > div{display:grid;gap:14px}
.sec-h .txt{min-height:44px}
.fresh .vcs{margin:0 calc(-1 * var(--g));border-top:1px solid var(--ink);border-bottom:1px solid var(--line)}
.fresh .vcs .vc:last-child{border-bottom:0}
.mark[data-k="wait"]{background:transparent;color:var(--graphite);border-color:var(--ash)}
/* короткий экран (телефон на боку): первый экран не сжимается, а растёт */
@media (max-height:480px){.ag-first .ag-hero{padding-block:20px}}

/* первый экран проверки: фотографии во весь экран с плавной сменой, как на первом экране сайта. Текст светлый, поле светлой плашкой */
.ag-stage{position:relative;display:grid;align-items:center;min-width:0;overflow:hidden;background:#000}
.ag-bg{position:absolute;inset:0}
.ag-bg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0}
.ag-bg img:first-child{opacity:1}
.ag-bg::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(to bottom,rgba(0,0,0,.62) 0,rgba(0,0,0,.42) 38%,rgba(0,0,0,.5) 62%,rgba(0,0,0,.78) 100%)}
@keyframes ag-shot{0%{opacity:0}5%{opacity:1}33.3%{opacity:1}39%{opacity:0}100%{opacity:0}}
@media (prefers-reduced-motion:no-preference){
  .ag-bg img{animation:ag-shot 27s linear infinite both}
  .ag-bg img:first-child{animation-delay:-1.4s}
  .ag-bg img:nth-child(2){animation-delay:7.6s}
  .ag-bg img:nth-child(3){animation-delay:16.6s}
}
.ag-stage .ag-hero{position:relative}
.ag-stage .ag-h{color:var(--bone)}
.ag-stage .ag-lead{color:rgba(255,254,247,.82)}
.ag-stage .free-h{color:rgba(255,254,247,.72)}
.ag-stage .ask-field{background:var(--bone);border-color:var(--bone);color:var(--ink)}
.ag-stage .ask-field[data-bad]{border-color:#e0705c;box-shadow:0 0 0 1px #e0705c}
.ag-stage .ask-field .pill-ink{background:var(--ink);color:var(--bone);border-color:var(--ink)}
.ag-stage .chip{border-color:rgba(255,254,247,.55);color:var(--bone)}
.ag-stage .chip[aria-checked="true"]{background:var(--bone);border-color:var(--bone);color:var(--ink)}
.ag-stage .kicker{color:rgba(255,254,247,.72)}
.ag-stage img[data-noimg]{opacity:1;animation:none}
.ag-stage img[data-noimg] ~ img{display:none}

/* ===== разбор: нижняя часть на общей сетке страницы, а не узкой колонкой по центру ===== */
.vd-2{display:grid;border-top:1px solid var(--ink)}
.vd-sec{min-width:0;padding-bottom:clamp(22px,2.8vw,40px)}
.vd-sec + .vd-sec{border-top:1px solid var(--ink)}
.vd-in{margin:0 var(--g)}
ul.vd-in{padding-top:18px}
ul.vd-in li{font-size:17px}
ul.vd-in li:last-child{border-bottom:0}
@media (min-width:900px){
  .vd-2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .vd-sec + .vd-sec{border-top:0;border-left:1px solid var(--line)}
  .vd-2 > .vd-sec:only-child{grid-column:1 / -1}
}
/* совет куратора: главный вывод страницы, тёмной полосой во всю ширину */
.vd-tip{display:grid;gap:18px;padding:clamp(44px,6.4vw,96px) var(--g) clamp(48px,7vw,104px)}
.vd-tip-t{max-width:24ch;font-family:var(--serif);font-size:clamp(34px,4.6vw,72px);line-height:.92;letter-spacing:-.035em;text-wrap:balance}
@media (min-width:900px){.vd-tip{grid-template-columns:minmax(0,3fr) minmax(0,9fr);align-items:start}.vd-tip .kicker{padding-top:10px}}
/* что дальше: сценарий и статья рядом */
.vd-next{border-top:0}
.vd-next .vd-sc{padding-top:22px}
.vd-next .vd-sc .flow-t{text-decoration:none}
.vd-art{display:grid;gap:14px;justify-items:start;padding-top:22px}
.vd-art b{max-width:22ch;font-family:var(--serif);font-weight:400;font-size:clamp(28px,2.8vw,42px);line-height:.94;letter-spacing:-.03em;text-wrap:balance}
.vd-art-go{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-size:15px}
.vd-art-go .ic{transition:translate .3s var(--ease)}
@media (hover:hover){.vd-art:hover b,.vd-next .vd-sc:hover .flow-t{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.12em}.vd-art:hover .ic{translate:4px 0}}
@media (min-width:768px){.vd-next .vd-sc{grid-template-columns:clamp(140px,14vw,200px) minmax(0,1fr);gap:22px}}
.vd-end{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 24px;padding:clamp(26px,3.4vw,48px) var(--g);border-top:1px solid var(--ink)}
.vd-end b{font-family:var(--serif);font-weight:400;font-size:clamp(30px,3.4vw,52px);line-height:.92;letter-spacing:-.03em}
@media (max-width:640px){.vd-end .pill{flex:1 1 auto}}

/* ===== проверка как чат: лента занимает экран, поле для сообщений закреплено внизу ===== */
.ag-th{padding-bottom:0}
.ag-th .th{flex:1 1 auto;align-content:start;padding-bottom:clamp(20px,3vw,40px)}
.th > *{scroll-margin-bottom:112px}
.cmp{position:sticky;bottom:0;z-index:4;margin-inline:calc(-1 * var(--g));padding:12px var(--g) calc(14px + env(safe-area-inset-bottom));background:linear-gradient(to bottom,rgba(255,254,247,0) 0,var(--bone) 18px)}
.cmp-f{padding:5px 5px 5px 22px;border-color:var(--ink);background:var(--bone)}
.cmp-f input{min-height:48px}
.cmp-b{width:48px;height:48px;background:var(--ink);color:var(--bone);border-color:var(--ink);rotate:-90deg}
/* быстрые ответы под сообщением помощника */
.qr{display:flex;flex-wrap:wrap;gap:8px;width:fit-content;max-width:100%}
.qr > .chip{flex:1 1 auto;justify-content:center;min-height:44px;border-color:var(--ink)}
@media (hover:hover){.qr > .chip:hover{background:var(--ink);color:var(--bone)}}
/* помощник печатает */
.dots{display:inline-flex;align-items:center;gap:5px;min-height:28px;font-size:14px;color:var(--graphite)}
.dots i{width:6px;height:6px;border-radius:50%;background:var(--ink)}
.dots span{margin-left:8px}
@keyframes dot{0%,60%,100%{opacity:.25;translate:0 0}30%{opacity:1;translate:0 -3px}}
@media (prefers-reduced-motion:no-preference){.dots i{animation:dot 1.2s ease-in-out infinite}.dots i:nth-child(2){animation-delay:.15s}.dots i:nth-child(3){animation-delay:.3s}}
.am-facts{margin:0}
.am-ev-b{gap:6px}

/* первый экран проверки: фотография идёт до самого низа, полоса «как это устроено» лежит на ней */
.ag-first{grid-template-rows:minmax(0,1fr)}
.ag-stage{grid-template-rows:minmax(0,1fr) auto;align-items:stretch}
.ag-stage .ag-hero{align-self:center}
.ag-stage .ag-strip{position:relative;border-top:1px solid rgba(255,254,247,.3);border-bottom:0;color:var(--bone)}
.ag-stage .ag-strip .blk-h{border-bottom-color:rgba(255,254,247,.18)}
.ag-stage .ag-how li{border-left-color:rgba(255,254,247,.18)}
.ag-stage .ag-how li::before{color:rgba(255,254,247,.72)}
.ag-stage .ag-how span{color:rgba(255,254,247,.74)}
.ag-bg::after{background:linear-gradient(to bottom,rgba(0,0,0,.62) 0,rgba(0,0,0,.42) 34%,rgba(0,0,0,.52) 58%,rgba(0,0,0,.84) 82%,rgba(0,0,0,.9) 100%)}
/* «назад» в верхней строке экранов: стрелка в круге, как кнопка, рядом подпись, куда она ведёт */
.flow-top > .txt:first-child,.ag-top > .txt:first-child{gap:12px;color:inherit}
.flow-top > .txt:first-child .ic,.ag-top > .txt:first-child .ic{box-sizing:content-box;flex:none;width:16px;height:16px;padding:13px;border:1px solid color-mix(in srgb,currentColor 38%,transparent);border-radius:50%;transition:background-color .2s ease-out,border-color .2s ease-out,translate .3s var(--ease)}
@media (hover:hover){.flow-top > .txt:first-child:hover .ic,.ag-top > .txt:first-child:hover .ic{border-color:currentColor;translate:-3px 0}}

/* разговор с помощником — отдельный режим: подвала нет, сверху статус и крестик, внизу поле для сообщений */
body.chat-on .ft,body.chat-on .proto{display:none}
body.is-off .ag-th .ag-top{top:calc(var(--hh) + 34px)}
.ag-th{padding-top:0}
.ag-x{margin-left:auto}
@media (hover:hover){.ag-x:hover{background:var(--ink);color:var(--bone);border-color:var(--ink)}}

/* ===== чат проверки: на телефоне одна колонка, на десктопе разговор слева и закреплённая панель события справа ===== */
.ag-th{--bar:64px}
.ag-th .ag-top{position:sticky;top:var(--hh);z-index:5;min-height:var(--bar);margin:0 calc(-1 * var(--g));padding:0 var(--g);background:var(--bone);border-bottom:1px solid var(--line)}
.chat-main{display:flex;flex-direction:column;width:100%;max-width:760px;min-height:calc(100svh - var(--hh) - var(--bar));margin-inline:auto}
.chat-main .th{padding-top:clamp(20px,2.6vw,36px)}
.chat-side{display:none}
@media (min-width:1024px){
  .chat{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);margin-inline:calc(-1 * var(--g))}
  .chat-main{max-width:none;margin:0;padding:0 clamp(32px,4vw,72px) 0 var(--g)}
  .chat-main .cmp{margin-inline:0;padding-inline:0}
  .chat-main .th{max-width:880px}
  .chat-side{position:sticky;top:calc(var(--hh) + var(--bar));display:flex;flex-direction:column;height:calc(100svh - var(--hh) - var(--bar));border-left:1px solid var(--line);overflow-y:auto;scrollbar-width:none}
  .chat-side::-webkit-scrollbar{display:none}
  body.is-off .chat-side{top:calc(var(--hh) + var(--bar) + 34px);height:calc(100svh - var(--hh) - var(--bar) - 34px)}
  .cs-ph{position:relative;flex:1 1 0;min-height:clamp(200px,34vh,420px);margin:0;overflow:hidden;background:var(--paper)}
  .cs-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
  .cs-0{display:grid;place-items:center}
  .cs-0 svg{width:clamp(72px,8vw,120px);height:auto;fill:#cfcdc3}
  .cs-b{display:grid;gap:12px;align-content:start;padding:clamp(20px,2.4vw,32px) var(--g) clamp(24px,2.8vw,36px) clamp(24px,3vw,48px)}
  .cs-t{font-family:var(--serif);font-weight:400;font-size:clamp(30px,2.9vw,46px);line-height:.92;letter-spacing:-.03em;text-wrap:balance}
  .cs-f{margin-top:6px;border-top:1px solid var(--ink)}
  .cs-l{margin-top:6px}
  /* в самой ленте карточка события на десктопе компактнее: подробности стоят справа */
  .chat-main .am-ev{grid-template-columns:72px minmax(0,1fr)}
}
/* строка под полем проверки пустая, пока нет ошибки ввода */
.ag .free-h:empty{display:none}

/* верхняя строка чата: что проверяем */
.ag-ttl{display:flex;align-items:baseline;gap:14px;min-width:0}
.ag-ttl .kicker{flex:none}
.ag-ttl b{min-width:0;font-family:var(--serif);font-weight:400;font-size:clamp(20px,1.8vw,26px);line-height:1.1;letter-spacing:-.02em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (max-width:560px){.ag-ttl .kicker{display:none}}
/* справка в боковой панели: все строки с одинаковыми отступами, подпись и значение стоят на одной линии */
.cs-f > div,.cs-f > div:first-child,.cs-f > div:last-child{align-items:baseline;padding:14px 0;border-bottom:1px solid var(--line)}
.cs-f dt{padding-top:0}

/* ===== разбор: всё главное в первом экране. Слева фото во всю высоту окна, справа событие, решение куратора, справка и кнопки ===== */
.vd-hero{display:grid;border-bottom:1px solid var(--ink)}
.vd .vd-ph{aspect-ratio:16/10;min-height:0}
.vd .vd-card{display:flex;flex-direction:column;min-width:0;padding:10px var(--g) 28px;border-left:0}
.vd-k{margin-bottom:clamp(10px,1.6vh,18px)}
/* «назад» стоит на фото, в левом верхнем углу экрана: там его и ищут */
.vd .vd-ph::before{content:"";position:absolute;inset:0 0 auto;z-index:1;height:150px;background:linear-gradient(to bottom,rgba(0,0,0,.56),rgba(0,0,0,0));pointer-events:none}
.vd-back{position:absolute;z-index:2;top:clamp(12px,1.5vw,22px);left:var(--g);display:inline-flex;align-items:center;gap:12px;min-height:44px;color:var(--bone);font-size:15px;line-height:1.2;white-space:nowrap}
.vd-back .ic{box-sizing:content-box;flex:none;width:16px;height:16px;padding:13px;border-radius:50%;background:var(--bone);color:var(--ink);transition:translate .3s var(--ease)}
@media (hover:hover){.vd-back:hover .ic{translate:-3px 0}}
.vd .vd-t{margin:0;max-width:22ch;font-size:clamp(30px,min(2.8vw,4.6vh),46px);line-height:.92;letter-spacing:-.035em}
.vd .vd-lead{margin-top:clamp(6px,1vh,12px);max-width:60ch;font-size:14px;line-height:1.4;color:var(--graphite);text-wrap:pretty}
.vd-res{margin-top:clamp(12px,1.7vh,24px);padding-top:clamp(10px,1.5vh,18px);border-top:1px solid var(--ink)}
.vd .vd-v{margin-top:clamp(6px,1.2vh,14px);font-size:clamp(36px,min(3.8vw,6.2vh),60px)}
.vd .vd-q{margin-top:clamp(8px,1.4vh,16px);font-size:16px}
.vd .vd-by{margin-top:clamp(8px,1.4vh,16px)}
/* справка плиткой 2×2, пятая строка во всю ширину */
.vd .vd-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:clamp(12px,2vh,24px);padding-top:0;border-top:1px solid var(--ink)}
.vd-facts > div,.vd-facts > div:first-child,.vd-facts > div:last-child{display:flex;flex-direction:column;gap:3px;padding:clamp(7px,1vh,12px) 16px clamp(7px,1vh,12px) 0;border-bottom:1px solid var(--line)}
.vd-facts > div:nth-child(2n){padding-left:16px;border-left:1px solid var(--line)}
.vd-facts > div:last-child:nth-child(odd){grid-column:1 / -1}
.vd-facts dt{padding-top:0}
.vd-facts dd{font-size:15px;line-height:1.3}
.vd-facts dd span{margin-top:1px;font-size:13px}
.vd-acts{margin-top:clamp(12px,1.8vh,22px)}
@media (max-width:520px){.vd .vd-facts{grid-template-columns:minmax(0,1fr)}.vd-facts > div:nth-child(2n){padding-left:0;border-left:0}}
@media (max-width:640px){.vd-acts .pill{flex:1 1 auto}}
@media (min-width:1024px){
  .vd-hero{grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:calc(100svh - var(--hh))}
  .vd .vd-ph{position:sticky;top:var(--hh);aspect-ratio:auto;height:calc(100svh - var(--hh));min-height:0}
  .vd .vd-card{justify-content:center;padding:clamp(10px,1.6vh,20px) var(--g) clamp(14px,2.2vh,28px) clamp(28px,3.4vw,56px);border-left:1px solid var(--line)}
}
/* ===== «Поделиться»: широкое окно. Слева то, что увидит получатель, справа сети и ссылка ===== */
.shr{display:grid;gap:22px}
.shr-prev{display:grid;gap:12px;align-content:start;min-width:0}
.shr-card{display:grid;gap:4px;padding-left:12px;border-left:2px solid var(--ink)}
.shr-ph{position:relative;display:block;aspect-ratio:1200/630;margin-bottom:6px;overflow:hidden;background:var(--paper)}
.shr-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.shr-ph .mark{position:absolute;left:10px;top:10px}
.shr-s{font-size:13px;color:var(--graphite)}
.shr-card b{font-weight:400;font-size:16px;line-height:1.25}
.shr-d{font-size:14px;line-height:1.35;color:var(--charcoal);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.shr-b{min-width:0}
.shr-b .modal-t{max-width:none}
.shr-nets{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:20px}
.shr-nets .pill{min-width:0;padding-inline:14px}
.shr-nets > :last-child:nth-child(odd){grid-column:1 / -1}
.shr .sh-pc{margin-top:0}
@media (min-width:1024px){
  .modal-box:has(.shr){width:min(940px,calc(100vw - 48px))}
  .shr{grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(28px,3.6vw,56px);align-items:start}
  .shr-prev{padding-top:6px}
}
/* на невысоком окне справка может уйти ниже края: кнопки разбора остаются на виду */
@media (min-width:1024px){.vd-acts{position:sticky;bottom:0;z-index:2;margin-top:clamp(4px,1vh,12px);padding:clamp(8px,1.2vh,14px) 0;background:linear-gradient(to bottom,rgba(255,254,247,0) 0,var(--bone) 10px)}}

/* ===== проход глазами пользователя: правки по пути от главной до архива ===== */
/* «Когда»: три варианта. На телефоне столбцом, шире — в ряд */
.opts-3{grid-template-columns:minmax(0,1fr)}
.opts-3 .opt{min-height:clamp(76px,11vw,168px)}
.opts-3 .opt:nth-child(2n){border-left:0}
@media (min-width:640px){.opts-3{grid-template-columns:repeat(3,minmax(0,1fr))}.opts-3 .opt:not(:first-child){border-left:1px solid var(--line)}}
/* ошибка стоит у группы, в которой не хватает ответа */
.grp{scroll-margin-top:calc(var(--hh) + 16px)}
.grp-err{font-size:13px;line-height:1.3;color:#c4442f;text-align:right}
.grp[data-err]{border-top-color:#c4442f}
/* «назад» в шагах подбора и знакомства такой же, как на остальных экранах */
.prog-steps > .txt{gap:12px;color:inherit}
.prog-steps > .txt .ic{box-sizing:content-box;flex:none;width:16px;height:16px;padding:13px;border:1px solid color-mix(in srgb,currentColor 38%,transparent);border-radius:50%;transition:border-color .2s ease-out,translate .3s var(--ease)}
@media (hover:hover){.prog-steps > .txt:hover .ic{border-color:currentColor;translate:-3px 0}}
/* знакомство: наведение не выглядит как выбор */
@media (hover:hover){.hl-tiles .tile:not([aria-pressed="true"]):hover{background:var(--paper);color:inherit}.hl-tiles .tile:not([aria-pressed="true"]):hover .tile-n,.hl-tiles .tile:not([aria-pressed="true"]):hover .tile-d{color:var(--graphite)}}
/* финал вечера: справа шкала культроверта */
.fin-2{display:grid;gap:clamp(36px,5vw,64px);align-content:center}
.fin-a{min-width:0}
.fin-lv{display:grid;gap:10px;align-content:start;min-width:0;padding-top:16px;border-top:1px solid var(--bone)}
.fin-lv-n{font-family:var(--serif);font-weight:400;font-size:clamp(64px,8vw,128px);line-height:.84;letter-spacing:-.04em}
.fin-lv-t{font-size:15px;line-height:1.35;color:var(--mist)}
.fin-lv .lvw{margin-top:10px}
.fin-lv .lv-bar i{background:rgba(255,254,247,.2)}
.fin-lv .lv-bar i[data-on]{background:var(--bone)}
.fin-lv .lv-bar i[data-plan]{background:repeating-linear-gradient(90deg,var(--bone) 0 6px,transparent 6px 12px)}
.fin-lv .lv{display:block;margin-top:6px}
.fin-lv .lv li{flex-direction:row;align-items:baseline;justify-content:space-between;gap:12px;padding:11px 0;border-bottom:1px solid var(--dline)}
.fin-lv .lv b{font-size:15px}
.fin-lv .lv span,.fin-lv .lv li:not([data-on]) b{color:var(--mist)}
.fin-lv-go{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-size:15px}
.fin-lv-go .ic{transition:translate .3s var(--ease)}
@media (hover:hover){.fin-lv:hover .fin-lv-go .ic{translate:4px 0}}
@media (min-width:1024px){.fin-2{grid-template-columns:minmax(0,7fr) minmax(0,4fr);column-gap:clamp(48px,6vw,112px);align-items:end}}
/* чат: готовые разборы в ответ на пожелание */
.am-evs{display:grid}
.am-evs .am-ev + .am-ev{border-top:0}
a.am-ev .mark{min-height:22px;padding:0 8px;font-size:10px}
@media (hover:hover){a.am-ev:hover b{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.12em}}

/* ===== вход: широкое окно. Слева фото и то, что ждёт в кабинете, справа действие. На телефоне фото — полоса сверху ===== */
.modal-box:has(.au){padding:0}
.modal-box:has(.au) .modal-x{z-index:3;background:var(--bone)}
.au{display:grid}
.au-side{position:relative;min-height:128px;overflow:hidden;background:var(--ink)}
.au-side > img:first-child{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 73%}
.au-side::after{content:'';position:absolute;inset:0;background:linear-gradient(to bottom,rgba(0,0,0,.46),rgba(0,0,0,.06) 34%,rgba(0,0,0,.1) 46%,rgba(0,0,0,.8) 68%,rgba(0,0,0,.92));pointer-events:none}
.au-logo{position:absolute;z-index:1;left:var(--g);top:22px;width:136px;height:auto}
.au-side-b{display:none}
.au-b{min-width:0;padding:22px var(--g) calc(26px + env(safe-area-inset-bottom))}
/* форма стоит по центру колонки: заголовок, строка, поле и кнопки на одной оси */
.au-b{text-align:center}
.au-b > *{width:100%;max-width:400px;margin-inline:auto}
.au-b .modal-t{margin-top:0}
.au-t{font-size:clamp(30px,3.3vw,44px);line-height:1;white-space:nowrap}
.au-b .modal-l{margin-top:12px;max-width:32ch;font-size:15px;line-height:1.4;color:var(--graphite);text-wrap:balance}
.au-b form{display:grid;margin-top:clamp(22px,2.6vw,30px)}
.au-b form > .kicker{margin-bottom:8px}
.au-b .field-solo{max-width:none;padding-block:3px}
.au-b .field-solo input{text-align:center}
.au-b .modal-w{margin-top:10px}
.au-b .modal-or{margin:18px 0 12px}
.au-soc{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.au-soc .pill{padding:0 12px}
.au-ya{display:grid;place-items:center;flex:none;width:20px;height:20px;border:1px solid currentColor;border-radius:50%;font-size:11px;line-height:1}
.au-st{min-height:0;margin-top:0}
.au-st:not(:empty){margin-top:8px}
/* согласие: одна тихая строка под кнопками */
.au-ck{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;margin-top:8px;padding:0;border:0;font-size:12px;line-height:1.3;color:var(--graphite);white-space:nowrap}
.au-ck input{flex:none;width:18px;height:18px;border-radius:5px}
.au-ck a{color:var(--ink)}
.au-ck[data-bad] input{border-color:#c4442f}
@media (max-width:340px){.au-ck{white-space:normal;text-align:left}}
.au-b .modal-acts,.au-b .modal-list{margin-top:22px}
.au-b .modal-acts{justify-content:center}
.au-b .modal-line{margin-top:28px}
/* на телефоне полоса узкая: затемняем ровно, чтобы логотип читался */
@media (max-width:899px){.au-side::after{background:linear-gradient(to bottom,rgba(0,0,0,.5),rgba(0,0,0,.12))}}
@media (min-width:768px){.au-b{padding:30px 44px 34px}.au-logo{left:44px}}
@media (min-width:900px){
  .modal-box:has(.au){width:min(960px,calc(100vw - 48px))}
  .au{grid-template-columns:minmax(0,5fr) minmax(0,6fr);min-height:min(600px,calc(100svh - 48px))}
  .au-side{min-height:0}
  .au-side > img:first-child{object-position:50% 50%}
  .au-logo{left:36px;top:34px;width:150px}
  .au-side-b{display:grid;gap:18px;position:absolute;z-index:1;left:36px;right:36px;bottom:32px}
  .au-side-b b{font-family:var(--serif);font-weight:400;font-size:clamp(34px,3.1vw,46px);line-height:.92;letter-spacing:-.03em}
  .au-side-b em{display:block}
  .au-side-b ul{border-top:1px solid rgba(255,254,247,.5)}
  .au-side-b li{padding:10px 0;border-bottom:1px solid rgba(255,254,247,.24);font-size:14px;line-height:1.3}
  .au-b{display:flex;flex-direction:column;justify-content:center;padding:44px 52px 40px}
}
@media (max-width:899px) and (max-height:700px){.au-side{min-height:84px}.au-logo{top:14px}}

/* вход на телефоне занимает весь экран: под ним не видно чужого фото и второго крестика */
@media (max-width:767px){
  .modal-box:has(.au){height:100svh;max-height:none;border-radius:0}
  .modal-box:has(.au) .modal-x{top:calc(12px + var(--sat))}
  /* фото забирает всё свободное место, форма стоит внизу, под большим пальцем: пустот на экране нет */
  .au{min-height:100%;grid-template-rows:minmax(170px,1fr) auto}
  .au-side{min-height:0}
  .au-side > img:first-child{object-position:50% 68%}
  .au-logo{top:calc(22px + var(--sat))}
  .au-b{padding-block:28px calc(24px + env(safe-area-inset-bottom))}
}
@media (max-width:767px) and (max-height:700px){.au{grid-template-rows:minmax(104px,1fr) auto}.au-logo{top:calc(14px + var(--sat))}}
/* «Проверьте почту»: кнопка, ссылка и одна тихая строка */
.au-acts{display:grid;justify-items:center;gap:2px;margin-top:clamp(22px,2.6vw,30px)}
.au-acts .modal-w{margin-top:0;font-variant-numeric:tabular-nums}
.au-acts .pill[aria-disabled="true"]{border-color:var(--line);color:var(--graphite);cursor:default}
.au-hint{margin-top:10px;font-size:13px;line-height:1.4;color:var(--graphite);text-wrap:balance}
.au-proto{justify-content:center;margin-top:22px;padding:0 12px}
.au-proto .txt{white-space:normal}
/* под окном входа страница затемнена сильнее: чужие кнопки и фото не спорят с ним */
.modal:has(.au) .modal-bg{background:rgba(0,0,0,.74)}

/* ===== главная: первый экран на всю высоту. Вопрос, шесть поводов, поле для своих слов; внизу две карточки ===== */
.hm-hero .ag-lead{max-width:36ch}
.hm-tasks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;width:100%;max-width:760px;margin-top:clamp(24px,3.2vw,40px)}
.hm-tasks .chip{min-height:50px;justify-content:center;padding:8px 14px;font-size:16px;line-height:1.2;white-space:normal;text-align:center}
@media (min-width:640px){.hm-tasks{grid-template-columns:repeat(3,minmax(0,1fr))}.hm-tasks .chip{min-height:54px;font-size:17px}}
@media (hover:hover){.ag-stage .hm-tasks .chip:hover{background:var(--bone);border-color:var(--bone);color:var(--ink)}}
/* своё описание — второй путь: поле прозрачное, чтобы поводы оставались главными */
.hm-hero .ask{max-width:760px;margin-top:10px}
.ag-stage .hm-hero .ask-field{background:transparent;border-color:rgba(255,254,247,.42);color:var(--bone)}
.hm-hero .ask-field input{min-height:52px;font-size:16px}
.hm-hero .ask-field input::placeholder{color:rgba(255,254,247,.62)}
.hm-hero .ask-field .pill{min-height:46px;background:var(--bone);border-color:var(--bone);color:var(--ink)}
.hm-hero .free-h:empty{display:none}
.hm-strip{position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid rgba(255,254,247,.3)}
.hm-cell{display:grid;align-content:start;gap:6px;min-width:0;padding:14px var(--g) 18px;color:var(--bone)}
.hm-cell + .hm-cell{border-left:1px solid rgba(255,254,247,.18)}
.hm-cell b{font-family:var(--serif);font-weight:400;font-size:clamp(20px,2.1vw,30px);line-height:1;letter-spacing:-.02em;text-wrap:balance}
.hm-go{display:inline-flex;align-items:center;gap:8px;margin-top:2px;font-size:14px;color:rgba(255,254,247,.82)}
.hm-go .ic{transition:translate .3s var(--ease)}
@media (hover:hover){.hm-cell:hover b{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.12em}.hm-cell:hover .hm-go .ic{translate:4px 0}}
@media (min-width:1024px){.hm-cell{padding:20px var(--g) 26px}}
@media (max-width:420px){.hm-cell{padding-inline:16px 12px}.hm-cell b{font-size:19px}.hm-go{font-size:13px}}
.hm-more > .blk:first-child{margin-top:0;border-top:0}
/* приглашение к знакомству на экране трёх решений: светлая полоса перед тёмным «Соберём персонально» */
.pk-hello{display:grid;gap:18px;margin:0;padding:clamp(28px,3.6vw,48px) var(--g);background:var(--paper)}
.pk-hello .asm-r{display:grid;gap:14px;align-content:start}
.pk-hello .asm-r p{max-width:44ch;color:var(--charcoal)}
@media (min-width:900px){.pk-hello{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:end}}
/* невысокие телефоны: первый экран главной помещается целиком, без подзаголовка */
@media (max-width:767px) and (max-height:700px){
  .hm .ag-first .ag-hero{padding-block:14px}
  .hm .ag-h{font-size:clamp(38px,11vw,46px)}
  .hm-hero .ag-lead{display:none}
  .hm-tasks{margin-top:16px;gap:6px}
  .hm-tasks .chip{min-height:44px;font-size:15px}
  .hm-hero .ask-field input{min-height:44px}
  .hm-hero .ask-field .pill{min-height:44px}
  .hm-hero .ask-field{padding-block:2px}
  .hm .ag-lead{margin-top:8px}
  .hm-cell{padding-block:10px 12px}
  .hm-cell b{font-size:17px}
}

/* ===== низ главной: разделы с крупными заголовками, воздухом между ними и разным весом ===== */
.hm-more{padding-bottom:clamp(16px,2vw,32px)}
.hm-sec{padding-top:clamp(64px,8vw,128px)}
.hm-sec .sec-t{font-size:clamp(40px,4.8vw,76px)}
/* содержимое раздела идёт от края до края под чёрной линией: заголовок отделён от карточек сильнее, чем карточки друг от друга */
.hm-sec > .nx-row,.hm-sec > .wkk,.hm-sec > .vcs{margin-inline:calc(-1 * var(--g));border-top:1px solid var(--ink)}
.hm-sec > .vcs .vc:last-child{border-bottom:0}
/* разборы на бумажной полосе: между двумя светлыми разделами появляется третий вес */
.hm-paper{margin:clamp(64px,8vw,128px) calc(-1 * var(--g)) 0;padding:clamp(56px,6.4vw,104px) var(--g) clamp(8px,1vw,16px);background:var(--paper)}
.hm-paper > .vcs{border-bottom:0}
.hm-paper .vc{background:transparent}
@media (hover:hover){.hm-paper .vc:hover{background:var(--bone)}}
.hm-paper + .hm-sec{padding-top:clamp(64px,8vw,128px)}
@media (min-width:1024px){.hm-sec > .vcs .vc{padding-block:32px 34px}}

/* ===== заметки на главной: строка с фото. На телефоне фото слева, на десктопе три колонки ===== */
.ncs{border-top:1px solid var(--ink)}
.nc{display:grid;grid-template-columns:96px minmax(0,1fr);gap:8px 16px;align-items:start;padding:20px 0;border-bottom:1px solid var(--line)}
.ncs li:last-child .nc{border-bottom:0}
.nc-ph{position:relative;grid-row:span 2;aspect-ratio:4/5;overflow:hidden;background:var(--paper);outline:1px solid rgba(0,0,0,.06);outline-offset:-1px}
.nc-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:scale 1.2s var(--ease)}
.nc-b{display:grid;gap:8px;align-content:start;min-width:0}
.nc-b .kicker{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nc-t{max-width:28ch;font-family:var(--serif);font-weight:400;font-size:clamp(24px,2.6vw,40px);line-height:.95;letter-spacing:-.03em;text-wrap:balance}
.nc-l{display:none;max-width:56ch;font-size:15px;line-height:1.4;color:var(--charcoal);text-wrap:pretty}
.nc-s{display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px;min-width:0;font-size:13px;color:var(--graphite)}
.nc-s .pk-cur,.nc-go{display:none}
.nc-m{white-space:nowrap}
.nc-go .ic{transition:translate .3s var(--ease)}
@media (hover:hover){.nc:hover .nc-ph img{scale:1.04}.nc:hover .nc-t{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.12em}.nc:hover .nc-go .ic{translate:4px 0}}
@media (min-width:640px){.nc{grid-template-columns:160px minmax(0,1fr)}.nc-ph{aspect-ratio:4/3}.nc-l{display:block}}
@media (min-width:900px){
  .nc{grid-template-columns:clamp(200px,19vw,280px) minmax(0,1fr) clamp(200px,17vw,250px);gap:clamp(24px,3vw,48px);padding:clamp(24px,2.6vw,36px) 0}
  .nc-ph{grid-row:auto}
  .nc-b{gap:12px}
  .nc-s{flex-direction:column;flex-wrap:nowrap;align-items:flex-start;align-self:stretch;justify-content:space-between;gap:14px}
  .nc-s .pk-cur{display:flex}
  .nc-go{display:inline-flex;align-items:center;gap:8px;min-height:44px;margin-top:auto;font-size:15px;color:var(--ink)}
}
@media (max-width:360px){.nc{grid-template-columns:72px minmax(0,1fr);gap:6px 12px}.nc-t{font-size:21px}}
/* бумажная полоса первой под тёмным экраном: встаёт вплотную, без белой щели */
.hm-more > .hm-paper:first-child{margin-top:0}

/* ===== реальный куратор без подписи и с собственным письмом ===== */
img[src=""]{display:none}
/* на странице самого куратора портрет в цвете: ч/б остаётся в списках и мелких аватарах */
.cu-ph img{filter:none}

/* ===== «Слово куратора»: письмо как разворот журнала. Первый абзац крупно, остальное колонками, внизу подпись с портретом ===== */
.cu-letter{display:grid;gap:clamp(20px,3vw,40px);padding:clamp(56px,7.4vw,128px) var(--g) clamp(56px,7vw,112px)}
.cl-a{display:grid;align-content:start;gap:8px}
.cl-mark{height:.5em;font-family:var(--serif);font-size:clamp(140px,15vw,260px);line-height:.9;color:rgba(255,254,247,.28);margin-top:clamp(12px,1.6vw,28px)}
.cl-lead{max-width:30ch;font-family:var(--serif);font-weight:400;font-size:clamp(28px,3vw,46px);line-height:1.04;letter-spacing:-.02em;text-wrap:balance}
.cl-text{display:grid;gap:18px;margin-top:clamp(28px,3.4vw,48px);padding-top:clamp(20px,2.4vw,32px);border-top:1px solid rgba(255,254,247,.3)}
.cl-text p{max-width:58ch;font-size:17px;line-height:1.6;color:rgba(255,254,247,.8);text-wrap:pretty}
.cl-by{display:flex;align-items:center;gap:14px;margin-top:clamp(28px,3.4vw,48px)}
.cl-by img{flex:none;width:56px;height:56px;border-radius:50%;object-fit:cover;outline:1px solid rgba(255,255,255,.08);outline-offset:-1px}
.cl-by b{display:block;font-weight:400;font-size:16px;line-height:1.25}
.cl-by b + span{display:block;margin-top:2px;font-size:13px;line-height:1.3;color:var(--mist)}
@media (max-width:767px){.cl-a{grid-auto-flow:column;justify-content:space-between;align-items:start}.cl-mark{font-size:110px;margin-top:-8px}}
@media (min-width:900px){.cl-text{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(32px,4vw,64px)}}
@media (min-width:1024px){.cu-letter{grid-template-columns:minmax(0,4fr) minmax(0,8fr);column-gap:clamp(40px,5vw,96px)}}

/* ===== низ страницы куратора: те же разделы, что на главной — крупный заголовок, воздух, свой вес ===== */
.cu-more{padding:0 var(--g) clamp(64px,8vw,120px)}
.cu-more .vcs-0{padding:28px 0;border-top:1px solid var(--ink)}
.cu-more .cu-0{padding-inline:0;border-top:1px solid var(--ink)}
.cu-more .how3{border-top:1px solid var(--ink)}
.vcs-1{grid-template-columns:minmax(0,1fr) !important}
@media (min-width:768px){.vcs-2{grid-template-columns:repeat(2,minmax(0,1fr)) !important}}
/* другие кураторы — карточки с портретом, как в списке кураторов. На телефоне лентой вбок */
.cuo{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px clamp(16px,2vw,32px);padding-top:clamp(20px,2.4vw,32px);border-top:1px solid var(--ink)}
.cuo-c{display:grid;gap:6px;align-content:start;min-width:0}
.cuo-ph{position:relative;display:block;aspect-ratio:4/5;overflow:hidden;margin-bottom:8px;background:var(--paper);outline:1px solid rgba(0,0,0,.06);outline-offset:-1px}
.cuo-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:scale 1.2s var(--ease)}
.cuo-c b{font-family:var(--serif);font-weight:400;font-size:clamp(22px,2vw,30px);line-height:1;letter-spacing:-.02em;text-wrap:balance}
.cuo-w{font-size:13px;line-height:1.3;color:var(--graphite)}
@media (hover:hover){.cuo-c:hover .cuo-ph img{scale:1.04}.cuo-c:hover b{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.12em}}
@media (max-width:767px){.cuo{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin-inline:calc(-1 * var(--g));padding-inline:var(--g)}.cuo::-webkit-scrollbar{display:none}.cuo-c{flex:0 0 64%;scroll-snap-align:start;scroll-margin-left:var(--g)}}
/* портреты кураторов в приложении — в цвете везде, как прислали кураторы */
.cu-others .pk-cur img,.me-subs .pk-cur img,.asm-note .pk-cur img,.dr-c img,.sc-au img:first-child,.am-av img{filter:none}
/* на странице самого куратора его аватар в строке заметки лишний */
.cu-more .nc-s .pk-cur{display:none !important}

/* ===== аудит 21.10: как это работает, поделиться из карточки, мелочи доступности ===== */
.hw{display:grid;border-top:1px solid var(--ink);counter-reset:hw}
.hw li{counter-increment:hw;display:grid;gap:8px;align-content:start;padding:22px 0 26px;border-bottom:1px solid var(--line)}
.hw li::before{content:counter(hw,decimal-leading-zero);font-size:12px;color:var(--graphite);font-variant-numeric:lining-nums tabular-nums}
.hw b{font-family:var(--serif);font-weight:400;font-size:clamp(28px,2.6vw,40px);line-height:.95;letter-spacing:-.03em}
.hw span{max-width:42ch;font-size:15px;line-height:1.45;color:var(--charcoal);text-wrap:pretty}
@media (min-width:900px){.hw{grid-template-columns:repeat(3,minmax(0,1fr));column-gap:clamp(24px,3vw,48px)}.hw li{border-bottom:0;padding:28px 0 8px}}
.sc-share .ic{width:18px;height:18px}
.sc-plan .pill-s{min-height:44px}
/* подпись «назад» на фото читается на любом снимке */
.vd-back{text-shadow:0 1px 10px rgba(0,0,0,.55)}
.wait-t{font-weight:400}
/* метки в карточке подбора заполняют ряд: одинокая метка на последней строке растягивается */
.pk .metas{display:flex;flex-wrap:wrap}
.pk .metas > .meta{flex:1 1 auto;justify-content:center;text-align:center}

/* ===== мобильный проход 21.10 ===== */
/* подпись под шкалой не обрезаем: на телефоне она переносится на вторую строку */
.lvl b + span{white-space:normal;overflow:visible;text-overflow:clip}
/* разборы на телефоне — лентой вбок, как остальные подборки, а не длинной стопкой */
@media (max-width:767px){
  .hm-sec > .vcs{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain}
  .hm-sec > .vcs::-webkit-scrollbar{display:none}
  .hm-sec > .vcs .vc{flex:0 0 86%;scroll-snap-align:start;border-bottom:0;border-right:1px solid var(--line)}
  .hm-sec > .vcs .vc:last-child{border-right:0}
}

/* ===== навигация ленты: «1 из 3», полоски, стрелки. Появляется, только если карточки не помещаются ===== */
.lnav{display:flex;align-items:center;gap:12px;padding:0 0 14px}
.lnav[hidden]{display:none}
.lnav-n{min-width:48px;font-size:13px;font-weight:400}
.lnav-dots{display:flex;gap:4px;flex:1}
.lnav-dots i{width:20px;height:2px;background:var(--line);transition:background-color .2s ease-out}
.lnav-dots i[data-on]{background:var(--ink)}
.lnav-b{display:grid;place-items:center;flex:none;width:44px;height:44px;border:1px solid var(--ash);border-radius:50%;transition:border-color .2s ease-out,opacity .2s ease-out}
.lnav-b:disabled{opacity:.3;cursor:default}
@media (hover:hover){.lnav-b:not(:disabled):hover{border-color:var(--ink)}}
.hm-paper .lnav-b{background:var(--bone)}

/* ===== отдельный поток: шапка — логотип и крестик, без меню, кабинета и подвала ===== */
.ah-x{display:none}
body.flow-on .ah-nav,body.flow-on .ah-in,body.flow-on .ah-menu,body.flow-on .backbar,body.flow-on .ft,body.flow-on .proto{display:none !important}
body.flow-on .ah-x{display:grid;place-items:center;flex:none;width:44px;height:44px;margin-left:auto;border:1px solid var(--ink);border-radius:50%;transition:background-color .2s ease-out,color .2s ease-out}
@media (hover:hover){body.flow-on .ah-x:hover{background:var(--ink);color:var(--bone)}}
/* крестик в шапке уже ведёт к сценарию: дублирующее «К сценарию» и «Выйти» внутри экрана не нужны */
body.flow-on .flow-top > .txt:first-child,body.flow-on .wk-top > .txt:first-child{display:none}
body.flow-on .flow-top{justify-content:flex-start}

/* ===== шапка потока: «назад», логотип, крестик; полоски шагов — нижней кромкой шапки ===== */
.ah-b{display:none}
body.flow-on .ah-b:not([hidden]){display:grid;place-items:center;flex:none;width:44px;height:44px;margin-left:-6px;border-radius:50%;transition:background-color .2s ease-out}
@media (hover:hover){body.flow-on .ah-b:hover{background:var(--paper)}}
.ah-prog{display:none}
body.flow-on .ah-prog:not([hidden]){display:block;position:absolute;left:0;right:0;bottom:-1px}
.ah-prog .prog-bars{display:flex;gap:4px}
.ah-prog .prog-bars i{flex:1;height:3px;background:var(--line);position:relative;overflow:hidden}
.ah-prog .prog-bars i[data-on],.ah-prog .prog-bars i[data-cur]{background:var(--ink)}
body.flow-on .ah{position:sticky}
body.flow-on #view .prog-steps{display:none}
body.flow-on .step{padding-top:clamp(28px,4vw,56px)}
/* низ шага знакомства на телефоне: что выбрано — строкой сверху, кнопка «Дальше» во всю ширину */
@media (max-width:640px){.hl-next{flex-wrap:wrap;row-gap:8px}.hl-next .next-h{flex:1 0 100%;text-wrap:balance}.hl-next .next-h:empty{display:none}.hl-next .pill{flex:1 1 100%}}

/* ===== поток: шапка закреплена сверху, полоса с главной кнопкой — всегда у нижнего края экрана ===== */
body.flow-on #view .next{position:fixed;left:0;right:0;bottom:0;z-index:30;margin:0;padding:12px var(--g) calc(12px + env(safe-area-inset-bottom));background:var(--bone);border-top:1px solid var(--line)}
body.flow-on #view{padding-bottom:calc(140px + env(safe-area-inset-bottom))}
/* в потоке экран проявляется без сдвига: сдвиг увёл бы закреплённую полосу вместе с содержимым */
body.flow-on #view.in > :not(.step):not(.skv){animation-name:view-fade}

/* ===== «Профиль собран»: сначала рекомендации, ниже слова, герой и шкала ===== */
.hl-done .step-head{margin-bottom:clamp(20px,2.6vw,36px)}
.hl-recs{margin-inline:calc(-1 * var(--g));border-top:1px solid var(--ink);border-bottom:1px solid var(--line)}
.hl-done .lnav{padding-top:0}
.hl-sum{display:grid;gap:14px;max-width:720px;margin-top:clamp(28px,3.4vw,48px)}
.hl-sum-h{display:flex;align-items:center;justify-content:space-between;gap:12px}
.hl-sum .ws-row .ws-c{min-height:40px}
.hl-sum .hl-open{margin-top:6px;max-width:none}
.hl-sum .hl-lv .lvw{margin-top:10px}
.hl-done-bar{gap:10px}
.hl-done-bar .pill{flex:1 1 0;min-width:0}
@media (max-width:640px){.hl-done .hl-done-bar{flex-wrap:nowrap}.hl-done .hl-done-bar .pill{flex:1 1 0;padding:0 12px}}
@media (min-width:768px){.hl-done-bar{justify-content:flex-end}.hl-done-bar .pill{flex:0 0 auto;min-width:200px}}
body.no-ft .ft{display:none}
body.no-ft #view{padding-bottom:max(48px,env(safe-area-inset-bottom))}
body.flow-on #view{padding-bottom:calc(140px + env(safe-area-inset-bottom))}
.amenu-docs{display:flex;flex-wrap:wrap;gap:4px 20px;margin-top:-8px}
.amenu-docs a{display:inline-flex;align-items:center;min-height:44px;font-size:14px;color:var(--graphite)}
.hl-done-bar .pill{white-space:nowrap;font-size:15px}
@media (max-width:400px){.hl-done-bar .pill{padding:0 10px}}