/* ═══════════════════════════════════════════════════════════════════
   Кабинет клуба «СТАТУС» — конструкторское бюро космической программы. Облик 29.10.2026 13:30.
   Три страницы — три чертежа: kabinet.html (Чертёж 01 · Сборка корабля), dolgi.html (Чертёж 02 · Лишний вес),
   kalkulyator.html (Чертёж 03 · План полёта).
   Палитра нового облика витрины (обложка v6): чёрный космос #03050a, «синька» — тёмно-синяя чертёжная бумага
   #071a3a…#0d2f66 с белыми линиями и миллиметровой сеткой 8/40 px, графит #9aa3ad, один акцент — голубой
   атмосферы #5aa9ff. Текст белый: цифры — Unbounded 300 табличные, слова — Golos Text. Бронзы нет.
   Шапка и подвал — по устройству ../polyot (stanciya.css), в холодной палитре.
   Разметка данных (id полей, классы .svodka/.sposob/.bar/.cel…) — из живого сайта 08_Портал_подписка/sayt:
   расчётные скрипты dolgi.js и kalkulyator.js к ней привязаны, поэтому классы не переименованы — только покрашены.
   ═══════════════════════════════════════════════════════════════════ */

@font-face{font-family:'Unbounded';font-style:normal;font-weight:200 900;font-display:swap;
  src:url('/shrift/Unbounded-kirillica.woff2') format('woff2');
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Unbounded';font-style:normal;font-weight:200 900;font-display:swap;
  src:url('/shrift/Unbounded-latinica.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+20BD,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD,U+2190-21FF}
@font-face{font-family:'Golos';font-style:normal;font-weight:400 900;font-display:swap;
  src:url('/shrift/GolosText-kirillica.woff2') format('woff2');
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Golos';font-style:normal;font-weight:400 900;font-display:swap;
  src:url('/shrift/GolosText-latinica.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+20BD,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD,U+2190-21FF}

/* ── 1. Токены ──────────────────────────────────────────────────── */
:root{
  --bezdna:#03050a;           /* чёрный космос обложки */
  --fon:#03050a;
  --poverhnost:#0b1627;       /* цвет стекла — зазор между слоями графика (kalkulyator.js читает) */
  --sinka:#0a2452;            /* чертёжная бумага */
  --sinka-sv:#0d2f66;
  --sinka-tmn:#071a3a;
  --liniya:rgba(255,255,255,.12);
  --liniya-2:rgba(255,255,255,.22);
  --tekst:#f2f5fa;
  --tekst-2:#b9c4d6;
  --tekst-3:#8f9cb3;          /* подписи: на чёрном 7:1, на синьке 4,8:1 */
  --grafit:#9aa3ad;           /* карандаш */
  --golubo:#5aa9ff;           /* один акцент — голубой атмосферы */
  --golubo-sv:#9ccaff;
  --golubo-tush:rgba(90,169,255,.12);
  --golubo-dym:rgba(90,169,255,.38);
  --na-belom:#0a1324;
  --ok:#7fd49a;
  --trevoga:#ff8c7a;          /* пометка красным карандашом */
  --svoi:#9aa3ad;             /* графики: ваши взносы / как платите сейчас — графит */
  --procenty:#5aa9ff;         /* графики: проценты / по плану — голубая линия траектории */

  --shrift-zag:'Unbounded',-apple-system,BlinkMacSystemFont,sans-serif;
  --shrift:'Golos',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --polya:clamp(16px,3.9vw,56px);
  --plavno:300ms cubic-bezier(.22,.61,.36,1);
  --bystro:160ms cubic-bezier(.22,.61,.36,1);
  --r:14px;--r-mal:9px;--r-bol:16px;--r-kapsula:999px;
  --px:0px;--py:0px;         /* параллакс листа за мышью (kabinet.js) */
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;background:var(--bezdna);scroll-behavior:smooth}
body{margin:0;background:var(--bezdna);color:var(--tekst);font-family:var(--shrift);font-size:17px;line-height:1.58;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden;overflow-x:clip}
h1,h2,h3,h4,p,ol,ul,dl,dd,figure{margin:0;padding:0}
ol,ul{list-style:none}
h1,h2,h3,h4{font-family:var(--shrift-zag);font-weight:300;line-height:1.08;text-wrap:balance}
h1{font:300 clamp(34px,4.6vw,66px)/1.02 var(--shrift-zag);letter-spacing:-.02em}
h2{font:300 clamp(26px,3vw,42px)/1.08 var(--shrift-zag)}
h3{font:400 18px/1.25 var(--shrift-zag)}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
img{display:block;max-width:100%}
b,strong{font-weight:600;color:var(--tekst)}
em{font-style:normal;color:var(--golubo-sv)}
small{font-size:.75em}
.akc{font-weight:800;letter-spacing:-.032em}
.cifry{font-variant-numeric:tabular-nums lining-nums}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--golubo);outline-offset:3px}
[hidden]{display:none!important}
.chertezh-defs{position:absolute;width:0;height:0;overflow:hidden}

/* метка раздела — квадратная марка чертежа и разрядка */
.metka{display:flex;align-items:center;gap:12px;font:600 11.5px/1.35 var(--shrift-zag);letter-spacing:.2em;
  text-transform:uppercase;color:var(--golubo-sv)}
.metka::before{content:"";width:6px;height:6px;flex:none;background:var(--golubo);box-shadow:0 0 8px rgba(90,169,255,.55)}
.metka.tihaya{color:var(--tekst-3)}
.metka.tihaya::before{background:var(--tekst-3);box-shadow:none}

/* Кнопка — белая, как надпись «СТАТУС» на обложке. .obvod / .tihaya — обводка, .tekst — ссылка, .malaya — в шапку */
.knopka{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:52px;padding:0 24px;
  border:1px solid transparent;border-radius:12px;cursor:pointer;white-space:nowrap;text-align:center;
  font:700 12.5px/1.2 var(--shrift-zag);letter-spacing:.1em;text-transform:uppercase;
  background:#f2f5fa;color:var(--na-belom);
  box-shadow:0 1px 0 rgba(255,255,255,.6) inset,0 14px 36px -14px rgba(255,255,255,.35);
  transition:transform 260ms cubic-bezier(.2,.8,.2,1),box-shadow var(--plavno),background var(--bystro),opacity var(--bystro)}
.knopka:hover{transform:translateY(-2px);background:#fff;box-shadow:0 1px 0 rgba(255,255,255,.6) inset,0 16px 36px -12px rgba(90,169,255,.45)}
.knopka:disabled{opacity:.55;cursor:default;transform:none}
.knopka .strelka{display:inline-block;transition:transform var(--bystro)}
.knopka:hover .strelka{transform:translateX(4px)}
.knopka.obvod,.knopka.tihaya{background:rgba(3,5,10,.4);color:var(--tekst);border-color:rgba(255,255,255,.3);box-shadow:none}
.knopka.obvod:hover,.knopka.tihaya:hover{border-color:var(--golubo);background:var(--golubo-tush)}
.knopka.tekst{background:none;box-shadow:none;color:var(--tekst);padding:0;font-size:11.5px;min-height:0}
.knopka.tekst span{border-bottom:1px solid var(--liniya-2);padding-bottom:4px}
.knopka.malaya{min-height:40px;padding:0 16px;font-size:11px;border-radius:10px}

/* ── 2. Окно: чёрный космос с редкими звёздами; крючок под кадр художника (.s-kadrom) ─────── */
.okno{position:fixed;inset:-28px;z-index:0;pointer-events:none;overflow:hidden;background:var(--bezdna)}
.zvezdy{position:absolute;inset:0;display:block;opacity:.3;background-size:720px 720px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='720' height='720'%3E%3Cg fill='white'%3E%3Ccircle cx='233' cy='108' r='1.2' fill-opacity='.5'/%3E%3Ccircle cx='591' cy='67' r='1' fill-opacity='.45'/%3E%3Ccircle cx='365' cy='27' r='.9' fill-opacity='.7'/%3E%3Ccircle cx='173' cy='396' r='.6' fill-opacity='.85'/%3E%3Ccircle cx='89' cy='160' r='1.3' fill-opacity='.6'/%3E%3Ccircle cx='44' cy='421' r='.6' fill-opacity='.9'/%3E%3Ccircle cx='33' cy='618' r='.8' fill-opacity='.6'/%3E%3Ccircle cx='389' cy='411' r='1' fill-opacity='.8'/%3E%3Ccircle cx='130' cy='418' r='1.2' fill-opacity='.45'/%3E%3Ccircle cx='70' cy='512' r='1' fill-opacity='.4'/%3E%3Ccircle cx='335' cy='664' r='.8' fill-opacity='.5'/%3E%3Ccircle cx='572' cy='503' r='.7' fill-opacity='.4'/%3E%3Ccircle cx='216' cy='356' r='.8' fill-opacity='.8'/%3E%3Ccircle cx='692' cy='55' r='1' fill-opacity='.7'/%3E%3Ccircle cx='630' cy='225' r='1.3' fill-opacity='.55'/%3E%3Ccircle cx='357' cy='573' r='.6' fill-opacity='.85'/%3E%3Ccircle cx='680' cy='341' r='1.2' fill-opacity='.4'/%3E%3Ccircle cx='526' cy='222' r='1' fill-opacity='.9'/%3E%3Ccircle cx='249' cy='677' r='.8' fill-opacity='.45'/%3E%3Ccircle cx='84' cy='42' r='.8' fill-opacity='.45'/%3E%3Ccircle cx='323' cy='395' r='.7' fill-opacity='.8'/%3E%3Ccircle cx='491' cy='273' r='.7' fill-opacity='.45'/%3E%3Ccircle cx='598' cy='131' r='.8' fill-opacity='.35'/%3E%3Ccircle cx='301' cy='265' r='1' fill-opacity='.55'/%3E%3Ccircle cx='90' cy='618' r='1' fill-opacity='.7'/%3E%3Ccircle cx='532' cy='328' r='1.2' fill-opacity='.8'/%3E%3Ccircle cx='288' cy='137' r='.7' fill-opacity='.6'/%3E%3Ccircle cx='108' cy='73' r='.8' fill-opacity='.7'/%3E%3Ccircle cx='462' cy='65' r='.8' fill-opacity='.65'/%3E%3Ccircle cx='653' cy='256' r='.7' fill-opacity='.65'/%3E%3Ccircle cx='567' cy='546' r='.7' fill-opacity='.8'/%3E%3Ccircle cx='340' cy='139' r='1' fill-opacity='.9'/%3E%3Ccircle cx='475' cy='655' r='1.2' fill-opacity='.8'/%3E%3Ccircle cx='576' cy='699' r='1' fill-opacity='.6'/%3E%3Ccircle cx='91' cy='108' r='1' fill-opacity='.8'/%3E%3Ccircle cx='672' cy='312' r='.7' fill-opacity='.85'/%3E%3Ccircle cx='152' cy='181' r='.8' fill-opacity='.65'/%3E%3Ccircle cx='477' cy='586' r='1' fill-opacity='.6'/%3E%3Ccircle cx='441' cy='364' r='1' fill-opacity='.45'/%3E%3Ccircle cx='645' cy='111' r='1.3' fill-opacity='.7'/%3E%3Ccircle cx='158' cy='685' r='1' fill-opacity='.85'/%3E%3Ccircle cx='398' cy='317' r='.6' fill-opacity='.6'/%3E%3C/g%3E%3C/svg%3E");
  -webkit-mask-image:linear-gradient(180deg,#000 0,#000 45%,transparent 85%);mask-image:linear-gradient(180deg,#000 0,#000 45%,transparent 85%)}
/* Кадр художника: пока файла нет — слой выключен; kabinet.js ставит картинку и класс s-kadrom, когда файл есть
   (список готовых — kartinki/kadry.js). Кадр приглушён и под вуалью к чёрному, чтобы текст читался. */
.okno-kadr{position:absolute;inset:0;display:none;background:var(--bezdna) 50% 50%/cover no-repeat;transform-origin:50% 58%;opacity:.4}
.okno.s-kadrom{transform:translate3d(var(--px),var(--py),0);will-change:transform}
.okno.s-kadrom .okno-kadr{display:block;animation:dyhanie 38s ease-in-out infinite}
.okno.s-kadrom .zvezdy{display:none}
@keyframes dyhanie{0%,100%{transform:scale(1.025)}50%{transform:scale(1.055)}}
.okno-vual{position:absolute;inset:0;display:none}
.okno.s-kadrom .okno-vual{display:block;
  background:linear-gradient(180deg,rgba(3,5,10,.84) 0,rgba(3,5,10,.5) 24%,rgba(3,5,10,.46) 58%,rgba(3,5,10,.94) 100%),
    linear-gradient(90deg,rgba(3,5,10,.64) 0,rgba(3,5,10,.58) 38%,rgba(3,5,10,.3) 56%,rgba(3,5,10,.4) 100%)}
/* Зерно — еле заметное, неподвижное */
.zerno{position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.14;background-size:180px 180px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .6 0 0 0 0 .6 0 0 0 0 .6 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
/* Наплыв при переходе между комнатами (kabinet.js, html.uhodim) */
.naplyv{position:fixed;inset:0;z-index:60;pointer-events:none;background:var(--bezdna);opacity:0;transition:opacity .42s ease-in}
html.uhodim .naplyv{opacity:1;pointer-events:auto}

/* ── 3. Лист-синька: чертёжная бумага с миллиметровкой 8/40 px, зерном, рамкой и штампом ───────
   Лист дышит (масштаб 1→1,014 за 38 с) и чуть идёт за мышью (.list-polka, --px/--py). ── */
.list-polka{position:relative;transform:translate3d(var(--px),var(--py),0);will-change:transform}
.list{position:relative;color:#fff;border:1px solid rgba(255,255,255,.3);border-radius:2px;
  background:
    radial-gradient(110% 80% at 28% 18%,rgba(255,255,255,.06),rgba(255,255,255,0) 62%),
    repeating-linear-gradient(0deg,rgba(255,255,255,.085) 0 1px,transparent 1px 40px),
    repeating-linear-gradient(90deg,rgba(255,255,255,.085) 0 1px,transparent 1px 40px),
    repeating-linear-gradient(0deg,rgba(255,255,255,.038) 0 1px,transparent 1px 8px),
    repeating-linear-gradient(90deg,rgba(255,255,255,.038) 0 1px,transparent 1px 8px),
    linear-gradient(160deg,var(--sinka-sv) 0,var(--sinka) 45%,var(--sinka-tmn) 100%);
  box-shadow:0 50px 90px -40px rgba(0,0,0,.95),0 0 0 1px rgba(3,5,10,.5);
  animation:dyhanie-lista 38s ease-in-out infinite}
@keyframes dyhanie-lista{0%,100%{transform:scale(1)}50%{transform:scale(1.014)}}
.list::before{content:"";position:absolute;inset:10px;border:1px solid rgba(255,255,255,.4);pointer-events:none}
.list::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.06;mix-blend-mode:screen;background-size:200px 200px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.list>*{position:relative;z-index:1}
.chertezh{display:block;color:#fff}
/* штамп — угловая таблица чертежа */
.shtamp{display:grid;grid-template-columns:minmax(0,1fr) auto;border:1px solid rgba(255,255,255,.55);background:rgba(8,30,70,.94);
  font:600 9px/1.3 var(--shrift);letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.62);width:max-content;max-width:100%}
.shtamp>*{padding:6px 12px;border-bottom:1px solid rgba(255,255,255,.4);white-space:nowrap}
.shtamp>:nth-child(2n){border-left:1px solid rgba(255,255,255,.4)}
.shtamp>:nth-last-child(-n+2){border-bottom:0}
.shtamp b{font:500 11px/1.3 var(--shrift-zag);letter-spacing:.12em;color:#fff}
.shtamp .sh-imya{color:#fff}
/* лист 01 — сборка: слева ракета в рост, справа этапы, вид снизу А—А и штамп */
.list-01{display:grid;grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);gap:0 14px;padding:26px 24px 22px;min-height:640px}
.list-01 .chertezh-01{width:100%;height:100%;max-height:600px}
.list-01 .chertezh-01-gor{display:none;width:100%;height:auto}
.list-pravo{display:flex;flex-direction:column;gap:18px;min-width:0}
.niz-vid{display:flex;align-items:center;gap:14px;margin-top:auto}
.niz-vid .chertezh-niz{width:124px;height:92px;flex:none}
.niz-vid p{font:600 9px/1.5 var(--shrift);letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.62)}
.niz-vid p b{display:block;font:400 12px/1.4 var(--shrift-zag);letter-spacing:.14em;color:#fff}
.list-01 .shtamp{margin-top:18px;justify-self:end}
/* листы 02 и 03 — пейзажные, чертёж на весь лист, штамп в правом нижнем углу */
.list-02,.list-03{aspect-ratio:520/360;width:100%;max-width:560px;justify-self:end}
.list-02 .chertezh,.list-03 .chertezh{position:absolute;inset:0;width:100%;height:100%}
.list-02 .shtamp,.list-03 .shtamp{position:absolute;right:22px;bottom:20px}
/* маленькая ракета в подписи «борт» */
.bort-ikonka{display:block;width:132px;height:28px;color:rgba(255,255,255,.85);overflow:visible;margin-bottom:2px}

/* ── 4. Шапка (stanciya.css) + аватар кабинета ───────────────────── */
.shapka{position:fixed;top:0;left:0;right:0;z-index:30;height:72px;display:flex;align-items:center;gap:26px;padding:0 var(--polya)}
.shapka::before{content:"";position:absolute;left:0;right:0;top:0;height:150%;z-index:-1;pointer-events:none;
  background:linear-gradient(180deg,rgba(3,5,10,.99) 0,rgba(3,5,10,.975) 64%,rgba(3,5,10,0));opacity:0;transition:opacity .35s ease}
.shapka.temno::before{opacity:1}
/* подложка шапки темнеет и без скрипта — по прокрутке (Chrome, Safari 26+); kabinet.js остаётся запасом для старых браузеров */
@supports (animation-timeline:scroll()){
  .shapka::before{animation:shapka-temno linear both;animation-timeline:scroll(root);animation-range:0 110px}
  @keyframes shapka-temno{from{opacity:0}to{opacity:1}}
}
.logo{display:flex;align-items:center;gap:12px;font:700 15px/1 var(--shrift-zag);letter-spacing:.3em;text-transform:uppercase;white-space:nowrap}
.logo svg{width:24px;height:24px;flex:none;fill:none;stroke:#fff;stroke-width:1.4;filter:drop-shadow(0 0 5px rgba(90,169,255,.45))}
.logo svg circle{fill:#0b1627}
.logo svg .tochka{fill:var(--golubo);stroke:none}
.logo .rezhim{font:500 10px/1 var(--shrift-zag);letter-spacing:.2em;color:var(--tekst-3);padding-left:12px;border-left:1px solid var(--liniya-2);text-transform:uppercase}
.menyu{display:flex;align-items:center;gap:26px;margin-left:auto;font:500 11.5px/1 var(--shrift-zag);letter-spacing:.15em;text-transform:uppercase;color:var(--tekst-2)}
.menyu a{padding:8px 0;white-space:nowrap;transition:color var(--bystro)}
.menyu a:hover{color:var(--tekst)}
.menyu a.akt,.menyu a[aria-current="page"]{color:var(--golubo-sv)}
.menyu a.knopka{padding:0 16px}
.avatar{width:36px;height:36px;border-radius:50%;flex:none;display:grid;place-items:center;
  background:var(--golubo-tush);box-shadow:inset 0 0 0 1px var(--golubo-dym);color:var(--golubo-sv);
  font:700 12px/1 var(--shrift-zag);letter-spacing:.04em}
.burger{display:none;margin-left:auto;width:44px;height:44px;border-radius:50%;border:1px solid var(--liniya-2);background:rgba(3,5,10,.5);position:relative;cursor:pointer;padding:0}
.burger i{position:absolute;left:14px;right:14px;height:1.5px;background:var(--tekst);transition:top .2s,transform .2s}
.burger i:first-child{top:18px}.burger i:last-child{top:25px}

/* ── 5. Стекло — холодное: тонкая белая кромка, без тёплого свечения и заклёпок ───────────── */
.steklo,.sohranit{position:relative;border-radius:16px;padding:24px 26px 24px;color:var(--tekst);
  background:rgba(5,10,20,.55);
  -webkit-backdrop-filter:blur(18px) saturate(.8) brightness(.62);backdrop-filter:blur(18px) saturate(.8) brightness(.62);
  border:1px solid rgba(255,255,255,.14);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 30px 60px -24px rgba(0,0,0,.85)}
.steklo::before,.sohranit::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(115deg,rgba(255,255,255,.06) 0,rgba(255,255,255,0) 30%,rgba(255,255,255,0) 100%)}
.steklo>*,.sohranit>*{position:relative}
.steklo.glavnoe,.sohranit{border-color:rgba(255,255,255,.26);box-shadow:inset 0 1px 0 rgba(156,202,255,.35),0 30px 60px -24px rgba(0,0,0,.85)}
.steklo.tihoe{background:rgba(5,10,20,.42);border-color:var(--liniya)}
.steklo .metka{margin-bottom:10px}
.steklo h2{font-size:clamp(22px,2vw,30px);line-height:1.12}
/* заголовок стекла — строка штампа: разрядка и квадратная марка (.ya-lampa: горит = голубая) */
.ka-shapka{display:flex;justify-content:space-between;align-items:center;margin:-4px 0 14px;padding-bottom:9px;border-bottom:1px dashed rgba(255,255,255,.18);
  font:600 9.5px/1.3 var(--shrift);letter-spacing:.32em;text-transform:uppercase;color:var(--tekst-3)}
.ya-lampa{width:7px;height:7px;flex:none;background:none;box-shadow:inset 0 0 0 1px rgba(255,255,255,.45);transition:background .12s,box-shadow .12s}
.ya-lampa.gorit,.steklo.zaperta .ya-lampa{background:var(--golubo);box-shadow:0 0 8px rgba(90,169,255,.7)}
.ka-podpis{margin-top:14px;font-size:13px;line-height:1.45;color:var(--tekst-3)}
/* карман — тёмная ячейка в стекле */
.karman{border-radius:10px;padding:12px 14px;background:rgba(3,5,10,.5);box-shadow:inset 0 0 0 1px var(--liniya-2)}
/* показание — крупная тонкая белая цифра */
.pokazanie{font:300 clamp(26px,2.4vw,38px)/1 var(--shrift-zag);letter-spacing:-.02em;color:var(--tekst);font-variant-numeric:tabular-nums lining-nums}
.bort-podpis{position:absolute;right:var(--polya);bottom:26px;z-index:2;display:grid;gap:7px;justify-items:end;text-align:right;
  font:500 10.5px/1.3 var(--shrift-zag);letter-spacing:.2em;text-transform:uppercase;color:var(--tekst-3)}
.bort-podpis span:first-of-type{color:var(--golubo-sv)}
.bort-podpis.levo{right:auto;left:var(--polya);justify-items:start;text-align:left}

/* ── 6. Полотно, первый экран, стены, подвал ────────────────────── */
main{position:relative;z-index:4}
.polotno{max-width:1280px;margin:0 auto;padding:0 var(--polya)}
.geroy{position:relative;min-height:100vh;min-height:100svh;padding-top:112px;padding-bottom:124px;display:flex;flex-direction:column;justify-content:center}
.geroy-verh{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:28px 56px;align-items:center}
.geroy-tekst{max-width:640px}
.geroy-tekst .metka{margin-bottom:18px}
.geroy-tekst .lid{margin-top:18px;font-size:17px;line-height:1.6;color:var(--tekst-2);max-width:54ch}
.geroy-tekst .lid b{color:var(--tekst)}
.privet{display:flex;flex-wrap:wrap;gap:6px 18px;margin-bottom:14px;font-size:15px;color:var(--tekst-2)}
.privet b{color:var(--tekst);font-weight:600}
.yarlyk-primer{display:none;align-items:center;gap:8px;padding:5px 11px;border-radius:999px;font:600 10px/1.3 var(--shrift-zag);letter-spacing:.14em;
  text-transform:uppercase;color:var(--golubo-sv);background:var(--golubo-tush);box-shadow:inset 0 0 0 1px var(--golubo-dym);white-space:nowrap}
html.primer .yarlyk-primer{display:inline-flex}
.vnutri{position:relative;padding-bottom:40px;background:linear-gradient(180deg,rgba(3,5,10,0) 0,rgba(3,5,10,.9) 120px,var(--bezdna) 260px)}
.otsek{padding-top:64px;padding-bottom:24px}   /* только верх и низ: боковые поля — от .polotno */
.otsek+.otsek{padding-top:40px}
.razdel-shapka{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:20px 48px;align-items:end;margin-bottom:28px}
.razdel-shapka h2{margin-top:14px}
.razdel-shapka .poyasnenie{font-size:15px;line-height:1.55;color:var(--tekst-2);max-width:52ch}
.razdel-shapka .poyasnenie b{color:var(--tekst)}
.razdel-shapka .poyasnenie a{color:var(--golubo-sv);border-bottom:1px solid var(--golubo-dym)}
.podval{position:relative;z-index:4;background:var(--bezdna);border-top:1px solid var(--liniya);padding:30px var(--polya) 44px}
.podval p{max-width:1180px;margin:0 auto;color:var(--tekst-3);font-size:13.5px;line-height:1.6}
.podval p+p{margin-top:10px}
.podval .bort{display:flex;flex-wrap:wrap;gap:8px 26px;max-width:1180px;margin:0 auto 16px;
  font:500 10.5px/1.3 var(--shrift-zag);letter-spacing:.2em;text-transform:uppercase;color:var(--tekst-3)}
.podval .bort span:first-child{color:var(--golubo-sv)}
.ogovorka{margin:40px 0 8px;padding-top:18px;border-top:1px solid var(--liniya);color:var(--tekst-3);font-size:13.5px;line-height:1.65;max-width:80ch}
.ogovorka p+p{margin-top:10px}
.ogovorka b{color:var(--tekst-2)}
.plashka-pokaza{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:18px;font-size:13.5px;color:var(--tekst-2)}
.plashka-pokaza b{font:600 10px/1.3 var(--shrift-zag);letter-spacing:.14em;text-transform:uppercase;color:var(--golubo-sv);
  background:var(--golubo-tush);box-shadow:inset 0 0 0 1px var(--golubo-dym);padding:5px 12px;border-radius:999px}

/* ── 7. Формы — пульт на стекле ─────────────────────────────────── */
label{display:block;font:500 10px/1.3 var(--shrift-zag);letter-spacing:.16em;text-transform:uppercase;color:var(--tekst-3)}
input[type=text],input[type=number],input[type=search],select{width:100%;font:400 16px/1.3 var(--shrift);color:var(--tekst);padding:12px 14px;min-height:48px;
  border-radius:9px;border:1px solid var(--liniya-2);background:rgba(3,5,10,.55);box-shadow:inset 0 2px 6px rgba(0,0,0,.5);outline:none;
  transition:border-color var(--bystro),box-shadow var(--bystro)}
input[type=text]:focus,select:focus{border-color:var(--golubo);box-shadow:inset 0 2px 6px rgba(0,0,0,.5),0 0 0 3px rgba(90,169,255,.2)}
input::placeholder{color:var(--tekst-3);opacity:1}
select{appearance:none;-webkit-appearance:none;cursor:pointer;padding-right:38px;
  background-image:linear-gradient(45deg,transparent 50%,var(--tekst-3) 50%),linear-gradient(135deg,var(--tekst-3) 50%,transparent 50%);
  background-position:calc(100% - 20px) 54%,calc(100% - 15px) 54%;background-size:5px 5px;background-repeat:no-repeat}
select option{background:#0b1627;color:var(--tekst)}
.pult{position:relative}
.pult h3{font-size:19px;margin-bottom:16px}
.pult .pole{margin-bottom:14px;position:relative}
.pult label{margin-bottom:7px}
.pult .ryad{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:end}
.pult .podskazka-stavki{font-size:12.5px;color:var(--tekst-3);line-height:1.45;margin-top:7px}
.pult .knopki{display:flex;gap:10px;margin-top:18px;flex-wrap:wrap}
.pult .knopki .knopka{flex:1 1 auto}
.pult .soobshchenie{font-size:14px;color:var(--golubo-sv);margin-top:10px;min-height:1.4em;line-height:1.45}
.pult .soobshchenie.oshibka{color:var(--trevoga)}
/* выпадашка кредиторов (dolgi.html) — тёмная, удобна пальцем */
.podskazki{position:absolute;left:0;right:0;top:100%;margin-top:4px;z-index:20;list-style:none;padding:4px;
  background:rgba(8,13,24,.98);border:1px solid var(--liniya-2);border-radius:10px;box-shadow:0 24px 50px -16px rgba(0,0,0,.9);max-height:300px;overflow-y:auto}
.podskazki li{display:flex;justify-content:space-between;gap:10px;align-items:baseline;padding:11px 12px;border-radius:7px;cursor:pointer;font-size:15px;min-height:44px}
.podskazki li small{font-size:11.5px;color:var(--tekst-3);flex:none}
.podskazki li[aria-selected="true"],.podskazki li:hover{background:var(--golubo-tush)}
.podskazki li.svoe{color:var(--tekst-3);font-size:13.5px}
/* переключатели: сегмент (способ гашения, три вопроса) и чипы (частота, сценарии) — активное голубым */
.pereklyuchatel,.rezhimy{display:flex;gap:4px;padding:4px;border-radius:12px;background:rgba(3,5,10,.55);box-shadow:inset 0 0 0 1px var(--liniya-2)}
.pereklyuchatel button,.rezhimy button{background:none;border:0;color:var(--tekst-2);cursor:pointer;min-height:44px;padding:10px 18px;border-radius:9px;white-space:nowrap;
  font:600 13px/1.2 var(--shrift-zag);letter-spacing:.02em;transition:background var(--bystro),color var(--bystro),box-shadow var(--bystro)}
.pereklyuchatel button[aria-pressed="true"],.rezhimy button[aria-selected="true"]{color:#e4f0ff;background:var(--golubo-tush);box-shadow:inset 0 0 0 1px var(--golubo-dym)}
.pereklyuchatel button:hover:not([aria-pressed="true"]),.rezhimy button:hover:not([aria-selected="true"]){color:var(--tekst)}
.vybor{display:flex;flex-wrap:wrap;gap:6px}
.vybor button{flex:1 1 auto;background:rgba(3,5,10,.45);border:1px solid var(--liniya-2);color:var(--tekst-2);font:600 13px/1.3 var(--shrift);
  padding:9px 12px;min-height:40px;border-radius:9px;cursor:pointer;white-space:nowrap;transition:border-color var(--bystro),color var(--bystro),background var(--bystro)}
.vybor button[aria-pressed="true"]{background:var(--golubo-tush);border-color:var(--golubo-dym);color:#e4f0ff}
.vybor button:hover:not([aria-pressed="true"]){border-color:var(--golubo-dym);color:var(--tekst)}
.bystrye{display:flex;gap:6px;flex-wrap:wrap}
.bystrye button{background:rgba(3,5,10,.45);border:1px solid var(--liniya-2);color:var(--tekst-2);font:600 13px/1.2 var(--shrift);
  padding:9px 12px;min-height:40px;border-radius:9px;cursor:pointer;transition:border-color var(--bystro),color var(--bystro)}
.bystrye button:hover{border-color:var(--golubo-dym);color:var(--tekst)}
/* ползунки калькулятора */
input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:28px;margin:4px 0 0;border:0;padding:0;background:none;cursor:pointer;display:block;box-shadow:none;min-height:0}
input[type=range]::-webkit-slider-runnable-track{height:5px;border-radius:99px;background:linear-gradient(to right,var(--golubo) var(--zapolneno,0%),var(--liniya-2) var(--zapolneno,0%))}
input[type=range]::-moz-range-track{height:5px;border-radius:99px;background:linear-gradient(to right,var(--golubo) var(--zapolneno,0%),var(--liniya-2) var(--zapolneno,0%))}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:22px;height:22px;border-radius:50%;margin-top:-8.5px;
  background:#f2f5fa;border:2px solid #0b1627;box-shadow:0 2px 8px rgba(0,0,0,.5),0 0 10px rgba(90,169,255,.35);transition:transform var(--bystro)}
input[type=range]::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:#f2f5fa;border:2px solid #0b1627;box-shadow:0 2px 8px rgba(0,0,0,.5)}
input[type=range]:active::-webkit-slider-thumb{transform:scale(1.15)}
input[type=range]:focus-visible{outline:none}
input[type=range]:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 3px rgba(90,169,255,.55)}
details summary{cursor:pointer;list-style:none;user-select:none}
details summary::-webkit-details-marker{display:none}
.svernut{font-size:14px;color:var(--tekst-3);display:inline-flex;align-items:center;gap:8px;min-height:32px}
.svernut::after{content:'';width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);margin-top:-3px;transition:transform var(--bystro)}
details[open]>.svernut::after{transform:rotate(-135deg);margin-top:2px}
.svernut:hover{color:var(--tekst-2)}

/* ═══ 8. ЧЕРТЁЖ 01 — кабинет: сборка корабля ═══════════════════════ */
.mostik{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.98fr);gap:32px 56px;align-items:center}
.mostik-tekst .metka{margin-bottom:16px}
.mostik-tekst h1{font-size:clamp(34px,4vw,56px)}
.mostik-tekst .lid{margin-top:14px;font-size:16px;line-height:1.58;color:var(--tekst-2);max-width:50ch}
.dni-blok{margin-top:24px;display:grid;grid-template-columns:auto 1fr;gap:4px 22px;align-items:end}
.dni-metka{grid-column:1/-1;font:500 11px/1.3 var(--shrift-zag);letter-spacing:.2em;text-transform:uppercase;color:var(--tekst-3)}
.dni{font:300 clamp(60px,7.4vw,108px)/.92 var(--shrift-zag);letter-spacing:-.03em;color:var(--tekst);font-variant-numeric:tabular-nums}
.dni small{font:300 clamp(18px,1.6vw,24px)/1 var(--shrift-zag);letter-spacing:0;color:var(--tekst-2);margin-left:10px}
.dni-pod{font-size:14px;line-height:1.45;color:var(--tekst-2);max-width:30ch;padding-bottom:10px}
.dni-pod b{color:var(--tekst)}
.telemetriya{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 18px;margin-top:22px;border-top:1px solid var(--liniya-2)}
.telemetriya div{padding:12px 0 0;min-width:0}
.telemetriya dt{font:500 10px/1.3 var(--shrift-zag);letter-spacing:.16em;text-transform:uppercase;color:var(--tekst-3)}
.telemetriya dd{margin-top:6px;font:300 22px/1 var(--shrift-zag);color:var(--tekst);white-space:nowrap;font-variant-numeric:tabular-nums}
.telemetriya dd i{font:400 13px/1.3 var(--shrift);color:var(--tekst-3)}   /* «+6 в этом квартале» переносится через <br> из kabinet.js */
.telemetriya dd.malo{font-size:15px;line-height:1.3;white-space:normal}
/* следующий шаг — собирает сервер: <a class="shag"> или <div class="shag">, внутри .t .b .s и стрелка .str */
.shag{display:flex;align-items:center;gap:18px;margin-top:22px;padding:16px 20px;border-radius:14px;
  background:rgba(5,10,20,.55);border:1px solid rgba(255,255,255,.2);
  -webkit-backdrop-filter:blur(14px) brightness(.7);backdrop-filter:blur(14px) brightness(.7);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 24px 50px -24px rgba(0,0,0,.85);
  transition:border-color var(--plavno),transform var(--plavno)}
.shag>div{min-width:0;flex:1}
.shag .t{display:flex;align-items:center;gap:10px;font:600 10px/1.3 var(--shrift-zag);letter-spacing:.2em;text-transform:uppercase;color:var(--golubo-sv)}
.shag .t::before{content:"";width:7px;height:7px;background:var(--golubo);box-shadow:0 0 8px rgba(90,169,255,.7)}
.shag .b{font:500 17px/1.3 var(--shrift-zag);margin-top:8px;color:var(--tekst)}
.shag .s{font-size:14px;line-height:1.45;color:var(--tekst-2);margin-top:4px}
.shag .str{margin-left:auto;flex:none;font:300 28px/1 var(--shrift-zag);color:var(--golubo-sv);transition:transform var(--bystro)}
a.shag:hover{border-color:var(--golubo);transform:translateY(-2px)}
a.shag:hover .str{transform:translateX(4px)}
.put-knopki{display:flex;flex-wrap:wrap;gap:10px 14px;margin-top:20px;align-items:center}
/* этапы сборки — четыре станции прямо на листе: чертёж → сборка → испытания → старт */
.marshrut{min-width:0}
.marshrut .ka-shapka{margin-top:0;border-bottom-color:rgba(255,255,255,.3);color:rgba(255,255,255,.65)}
.marshrut .metka{margin-bottom:4px;color:#fff}
.marshrut .metka::before{background:#fff;box-shadow:none}
.stancii{display:grid;gap:0;margin-top:2px}
.stancii li{position:relative;display:grid;grid-template-columns:26px 1fr;grid-template-rows:auto auto auto;gap:0 12px;padding:11px 0 10px;align-items:start;border-top:1px dashed rgba(255,255,255,.26)}
.stancii li:first-child{border-top:0}
.stancii li i{grid-row:1/4;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;flex:none;position:relative;z-index:1;margin-top:1px;
  background:rgba(3,5,10,.3);box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.5);font:700 11px/1 var(--shrift-zag);color:rgba(255,255,255,.75)}
.stancii li.proydena i{background:#f2f5fa;box-shadow:none;color:var(--na-belom)}
.stancii li.proydena i::after{content:"✓"}
.stancii li.zdes i{box-shadow:inset 0 0 0 2px var(--golubo),0 0 0 5px rgba(90,169,255,.18);color:var(--golubo)}
.stancii li.zdes i::after{content:"";width:10px;height:10px;border-radius:50%;background:var(--golubo);box-shadow:0 0 10px rgba(90,169,255,.9)}
.stancii .etap{display:block;grid-column:2;font:600 9px/1.3 var(--shrift);letter-spacing:.22em;text-transform:uppercase;color:rgba(255,255,255,.6);padding-top:2px}
.stancii li.zdes .etap{color:var(--golubo-sv)}
.stancii b{display:block;grid-column:2;font:500 13px/1.3 var(--shrift-zag);letter-spacing:.04em;color:#fff;margin-top:3px}
.stancii li.vperedi b,.stancii li.vperedi .etap{color:rgba(255,255,255,.55)}
.stancii span{display:block;grid-column:2;margin-top:3px;font-size:13px;line-height:1.42;color:rgba(255,255,255,.72)}
.stancii li.vperedi span{color:rgba(255,255,255,.52)}
.marshrut .ka-podpis{color:rgba(255,255,255,.6);font-size:12.5px;margin-top:12px}

/* три таблицы: долги · цель · счётчик */
.tablicy{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.tablicy .shirokaya{grid-column:1/-1}
.tablicy h2{font-size:clamp(22px,2vw,28px)}
.tablicy .sub{margin:10px 0 18px;font-size:14.5px;line-height:1.5;color:var(--tekst-2)}
/* долги коротко — собирает сервер (blok_dolgov) */
.dolgi-kratko{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:4px 0 14px}
.dolgi-kratko div{min-width:0}
.dolgi-kratko span{display:block;font:500 10px/1.3 var(--shrift-zag);letter-spacing:.14em;text-transform:uppercase;color:var(--tekst-3);margin-bottom:8px}
.dolgi-kratko b{display:block;font:300 clamp(22px,2.1vw,30px)/1.05 var(--shrift-zag);letter-spacing:-.02em;color:var(--tekst);font-variant-numeric:tabular-nums}
.dolgi-ploho{color:var(--trevoga);font-size:.6em;line-height:1.3;display:block}
.dolgi-pod{font-size:13.5px;line-height:1.5;color:var(--tekst-3);max-width:60ch}
.k-kalkulyatoru{margin-top:14px;padding-top:12px;border-top:1px solid var(--liniya);font-size:14px}
.k-kalkulyatoru a{color:var(--golubo-sv);font-weight:600;border-bottom:1px solid var(--golubo-dym);padding-bottom:1px}
.k-kalkulyatoru a:hover{border-bottom-color:var(--golubo-sv)}
.cel-pusto p{font-size:15px;line-height:1.55;color:var(--tekst-2);max-width:56ch;margin-bottom:16px}
/* цели — собирает сервер (blok_celey) */
.cel{padding:14px 0 16px;border-bottom:1px solid var(--liniya)}
.cel:first-child{padding-top:0}
.cel:last-of-type,.cel:has(+ .k-kalkulyatoru){border-bottom:0;padding-bottom:6px}
.cel-verh{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:12px}
.cel-imya{font:500 16px/1.3 var(--shrift-zag);margin-bottom:6px}
.cel-summa{font:300 clamp(24px,2.1vw,30px)/1 var(--shrift-zag);letter-spacing:-.02em;color:var(--tekst);font-variant-numeric:tabular-nums}
.ubrat{background:none;border:0;color:var(--tekst-3);font-size:24px;line-height:1;cursor:pointer;padding:4px 8px;flex:none;border-radius:8px;transition:color var(--bystro)}
.ubrat:hover{color:var(--tekst)}
.cel-niz{display:flex;justify-content:space-between;gap:12px;margin-top:10px;font-size:13.5px;color:var(--tekst-3);flex-wrap:wrap}
.cel-niz b{color:var(--tekst-2)}
.cel-vyvod{margin-top:12px;font-size:14px;line-height:1.5;padding-left:12px;border-left:2px solid var(--liniya-2);color:var(--tekst-2)}
.cel-vyvod.horosho{border-left-color:var(--ok)}
.cel-vyvod.vnimanie{border-left-color:var(--trevoga)}
.cel-pravka{display:flex;align-items:center;gap:10px;margin-top:12px;font-size:13.5px;color:var(--tekst-3);flex-wrap:wrap}
.cel-pravka label{margin:0;flex:none}
.cel-pravka input{width:12ch;min-height:42px;padding:8px 12px;font:600 15px/1.2 var(--shrift-zag);text-align:right}
.cel-pravka .ed{color:var(--tekst-3)}
/* счётчик — собирает сервер (blok_schetchika): .period .bar .row .name .val .track .fill(.warn) .podskazka .alarm(.gotovo) */
.track{height:7px;background:rgba(3,5,10,.6);box-shadow:inset 0 0 0 1px var(--liniya);border-radius:999px;overflow:hidden}
.fill{height:100%;border-radius:inherit;transform-origin:left center;background:linear-gradient(90deg,#2b6fd6,var(--golubo));
  box-shadow:0 0 10px rgba(90,169,255,.35);animation:zapolnit 1.1s cubic-bezier(.16,.84,.28,1) both}
@keyframes zapolnit{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.fill.warn{background:linear-gradient(90deg,#b8655a,var(--trevoga));box-shadow:none}
.period{font-size:13px;color:var(--tekst-3);margin-bottom:14px;padding-bottom:10px;border-bottom:1px dashed rgba(255,255,255,.18)}
.schetchik-blok .bar{margin-bottom:16px}
.bar .row{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:8px}
.bar .name{font-size:14px;color:var(--tekst-2)}
.bar .val{font:300 18px/1 var(--shrift-zag);color:var(--tekst);white-space:nowrap;font-variant-numeric:tabular-nums}
.bar .val small{font:400 12.5px/1 var(--shrift);color:var(--tekst-3)}
.schetchik-blok .podskazka{margin-top:14px;font-size:13.5px;color:var(--tekst-3);line-height:1.5}
.alarm{margin-top:14px;padding:12px 14px;background:rgba(255,140,122,.09);border-left:2px solid var(--trevoga);border-radius:0 10px 10px 0;font-size:14px;line-height:1.5;color:var(--tekst-2)}
.alarm b{color:var(--trevoga)}
.alarm.gotovo{background:rgba(127,212,154,.1);border-left-color:var(--ok)}
.alarm.gotovo b{color:var(--ok)}
.zagruzka{margin-top:18px;padding-top:16px;border-top:1px solid var(--liniya);display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px;align-items:center}
.zagruzka p{font-size:13.5px;color:var(--tekst-3);line-height:1.55}
.zagruzka p b{color:var(--tekst-2)}
.ochistka{margin-top:10px;text-align:right}
.ochistka button{background:none;border:0;padding:6px 0;cursor:pointer;font:inherit;font-size:12.5px;color:var(--tekst-3);text-decoration:underline;text-underline-offset:3px}
.ochistka button:hover{color:var(--tekst-2)}
/* рынок сегодня — четыре прибора с искрой (kabinet.js) */
.pribory-ryad{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.pribor{display:grid;gap:6px;padding:16px 18px 14px;border-radius:14px;background:rgba(3,5,10,.5);box-shadow:inset 0 0 0 1px var(--liniya-2);min-width:0}
.pribor-imya{display:flex;justify-content:space-between;gap:8px;font:500 10px/1.3 var(--shrift-zag);letter-spacing:.14em;text-transform:uppercase;color:var(--tekst-3)}
.pribor-imya em{color:var(--golubo-sv);font-style:normal}
.pribor-chislo{font:300 clamp(24px,2.1vw,32px)/1 var(--shrift-zag);color:var(--tekst);font-variant-numeric:tabular-nums;white-space:nowrap}
.pribor-chislo small{font-size:.5em;color:var(--tekst-3);margin-left:4px}
.pribor-izm{font-size:13px;line-height:1.4;color:var(--tekst-2);min-height:2.8em}
.pribor-izm b{color:var(--tekst)}
.iskra{display:block;width:100%;height:52px;overflow:visible}
.pribor-ist{font-size:11.5px;color:var(--tekst-3);line-height:1.4}
.rynok-niz{display:flex;flex-wrap:wrap;gap:12px 28px;align-items:center;margin-top:16px;font-size:13.5px;color:var(--tekst-3)}
.rynok-niz a{color:var(--golubo-sv);font-weight:600;border-bottom:1px solid var(--golubo-dym)}
/* уроки — собирает сервер (spisok_urokov): .lesson(.done/.lock) .tick .n .ttl .len */
.uroki-setka{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:28px 48px;align-items:start}
.uroki-tekst h2{margin-top:14px}
.uroki-tekst p{margin-top:16px;font-size:15px;line-height:1.55;color:var(--tekst-2)}
.uroki-tekst .razbor-ssylka{display:grid;gap:6px;margin-top:22px;padding:16px 18px;border-radius:12px;background:rgba(3,5,10,.45);box-shadow:inset 0 0 0 1px var(--liniya-2);transition:box-shadow var(--bystro)}
.uroki-tekst .razbor-ssylka:hover{box-shadow:inset 0 0 0 1px var(--golubo-dym)}
.razbor-ssylka b{font:500 15px/1.3 var(--shrift-zag)}
.razbor-ssylka span{font-size:13.5px;color:var(--tekst-3);line-height:1.45}
.poryadok{font-size:13.5px;color:var(--tekst-3);margin:0 0 8px;line-height:1.5}
.lesson{display:flex;align-items:center;gap:14px;padding:12px 6px;border-top:1px solid var(--liniya);min-height:52px;transition:padding-left var(--bystro),background var(--bystro)}
.lesson:first-of-type{border-top:0}
a.lesson:hover{padding-left:12px;background:var(--golubo-tush)}
.tick{width:26px;height:26px;border-radius:50%;flex:none;display:grid;place-items:center;font-size:12px;color:transparent;background:rgba(3,5,10,.5);box-shadow:inset 0 0 0 1.5px var(--liniya-2)}
.lesson.done .tick{background:#f2f5fa;box-shadow:none;color:var(--na-belom)}
.lesson .n{font:700 12px/1 var(--shrift-zag);color:var(--tekst-3);width:22px;flex:none;text-align:right}
.lesson .ttl{flex:1;font-size:15px;line-height:1.35}
.lesson.done .ttl{color:var(--tekst-2)}
.lesson .len{font-size:12.5px;color:var(--tekst-3);flex:none}
.lesson.lock{opacity:.55;cursor:default}
.lesson.lock .ttl small{display:block;margin-top:4px;font-size:12.5px;color:var(--golubo-sv)}
/* служебное: карта, служба заботы, продление */
.sluzhba{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.perehod{display:flex;align-items:flex-start;gap:14px;justify-content:space-between;padding:16px 18px;border-radius:14px;
  background:rgba(3,5,10,.5);box-shadow:inset 0 0 0 1px var(--liniya-2);transition:box-shadow var(--plavno),transform var(--plavno)}
.perehod:hover{box-shadow:inset 0 0 0 1px var(--golubo-dym);transform:translateY(-2px)}
.perehod .zag{font:500 15px/1.3 var(--shrift-zag);margin-bottom:6px}
.perehod .txt{font-size:13.5px;line-height:1.5;color:var(--tekst-2)}
.perehod .strelka{font:300 24px/1 var(--shrift-zag);color:var(--golubo-sv);flex:none;transition:transform var(--bystro)}
.perehod:hover .strelka{transform:translateX(4px)}

/* ═══ 9. ЧЕРТЁЖ 02 — долги: лишний вес (разметка sayt/dolgi.html) ═══ */
.svodka{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.95fr) minmax(0,1.05fr) minmax(0,1fr);margin-top:28px;padding:18px 26px 20px}
.svodka .yach{padding:8px 18px 4px 0;min-width:0}
.svodka .yach+.yach{padding-left:20px;border-left:1px dashed rgba(255,255,255,.18)}
.svodka .nadpis{font:500 10px/1.3 var(--shrift-zag);letter-spacing:.16em;text-transform:uppercase;color:var(--tekst-3);margin-bottom:12px}
.svodka .chislo{font:300 clamp(24px,2.3vw,34px)/1 var(--shrift-zag);letter-spacing:-.02em;color:var(--tekst);white-space:nowrap;font-variant-numeric:tabular-nums}
.svodka .chislo small{font:400 .5em/1 var(--shrift);color:var(--tekst-3);letter-spacing:0}
.svodka .glavnoe .chislo{font-size:clamp(28px,3vw,44px)}
.svodka .pod{font-size:13px;color:var(--tekst-3);margin-top:10px;line-height:1.45}
.svodka .pod b{color:var(--tekst-2)}
.svodka .ploho,.ploho{color:var(--trevoga)}
.tablica-dolgov .ploho,.tablica-dolgov [style*="#f0a962"]{color:var(--trevoga)!important}
.svodka .chislo.data{white-space:normal;font-size:clamp(20px,1.9vw,27px);line-height:1.12}
.dohod{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:14px;padding:16px 26px}
.dohod label{margin:0;font:400 14px/1.3 var(--shrift);letter-spacing:0;text-transform:none;color:var(--tekst-2);flex:none}
.dohod .vvod{display:flex;align-items:center;gap:8px}
.dohod input{width:13ch;min-height:44px;padding:8px 12px;font:600 16px/1.2 var(--shrift-zag);text-align:right}
.dohod .ed{color:var(--tekst-3);font-size:14px}
.dohod .shkala{flex:1 1 220px;min-width:160px;height:8px;border-radius:99px;background:rgba(3,5,10,.6);box-shadow:inset 0 0 0 1px var(--liniya);overflow:hidden}
.dohod .shkala i{display:block;height:100%;width:0;background:linear-gradient(90deg,#2b6fd6,var(--golubo));border-radius:inherit;transition:width .45s cubic-bezier(.16,.84,.28,1)}
.dohod .shkala i.mnogo{background:linear-gradient(90deg,#b8655a,var(--trevoga))}
.dohod .vyvod{font-size:14.5px;line-height:1.5;color:var(--tekst-2);flex:1 1 100%}
.dohod .vyvod b{color:var(--tekst)}
.razdel>h2{margin-bottom:10px}
.razdel>.sub{color:var(--tekst-2);font-size:15.5px;line-height:1.55;max-width:66ch;margin-bottom:26px}
.stanok{display:grid;grid-template-columns:minmax(0,360px) minmax(0,1fr);gap:22px;align-items:start}
.stanok .pult{position:sticky;top:90px}
.spisok-steklo{min-height:200px}
.spisok-pusto{padding:26px 24px;border:1px dashed var(--liniya-2);border-radius:12px;color:var(--tekst-2);font-size:15px;line-height:1.55}
.spisok-pusto b{display:block;font:400 18px/1.3 var(--shrift-zag);color:var(--tekst);margin-bottom:8px}
.tablica-dolgov{width:100%;border-collapse:collapse;font-size:14.5px}
.tablica-dolgov th{font:600 9.5px/1.3 var(--shrift);letter-spacing:.2em;text-transform:uppercase;padding:0 7px 12px;color:var(--tekst-3);text-align:right;white-space:nowrap;border-bottom:1px dashed rgba(255,255,255,.22)}
.tablica-dolgov th:first-child{text-align:left;padding-left:0}
.tablica-dolgov td{padding:16px 7px 6px;text-align:right;white-space:nowrap;vertical-align:top;font-variant-numeric:tabular-nums}
.tablica-dolgov td:first-child{text-align:left;padding-left:0;white-space:normal}
.tablica-dolgov .imya{font:500 15.5px/1.3 var(--shrift-zag)}
.tablica-dolgov .vid{font-size:12.5px;color:var(--tekst-3);margin-top:3px}
.tablica-dolgov .tiho{color:var(--tekst-3);font-size:12.5px;display:block;margin-top:2px}
.tablica-dolgov .dorogo{color:var(--trevoga);font-weight:600}
.tablica-dolgov td.kogda-cell{white-space:normal}
.deystviya{white-space:nowrap;display:flex;gap:2px;margin:6px 0 0 -8px}
.deystviya button{background:none;border:1px solid transparent;color:var(--tekst-3);cursor:pointer;font:500 13px/1.2 var(--shrift);padding:7px 9px;min-height:34px;border-radius:8px;transition:color var(--bystro),border-color var(--bystro)}
.deystviya button:hover{color:var(--tekst);border-color:var(--liniya-2)}
.tablica-dolgov tr.niz td{padding:4px 0 16px;border-bottom:1px solid var(--liniya);text-align:left;white-space:normal}
.tablica-dolgov tbody tr:last-child td{border-bottom:0}
.tablica-dolgov tr.pravitsya td{background:var(--golubo-tush)}
.preduprezhdenie{font-size:13.5px;line-height:1.5;color:var(--tekst-2);border-left:2px solid var(--trevoga);padding:4px 0 4px 12px;margin:4px 0 10px;max-width:70ch}
.preduprezhdenie b{color:var(--trevoga)}
.nizhnyaya-stroka{display:flex;gap:18px;flex-wrap:wrap;align-items:center;font-size:13.5px}
.most{display:inline-flex;align-items:center;gap:8px;color:var(--golubo-sv);font-weight:600;border-bottom:1px solid var(--golubo-dym);padding-bottom:1px}
.most:hover{border-bottom-color:var(--golubo-sv)}
.grafik-dolga summary{color:var(--tekst-3);display:inline-flex;align-items:center;gap:6px;min-height:32px}
.grafik-dolga summary::after{content:'';width:5px;height:5px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);margin-top:-3px}
.grafik-dolga[open] summary::after{transform:rotate(-135deg);margin-top:2px}
.grafik-dolga summary:hover{color:var(--tekst-2)}
.grafik-dolga .korobka{margin-top:10px;max-height:300px;overflow:auto;border:1px solid var(--liniya);border-radius:10px;background:rgba(3,5,10,.55)}
.grafik-dolga table{font-size:13px;border-collapse:collapse;width:100%}
.grafik-dolga th,.grafik-dolga td{padding:7px 12px;text-align:right;white-space:nowrap}
.grafik-dolga th:first-child,.grafik-dolga td:first-child{text-align:left}
.grafik-dolga th{position:sticky;top:0;background:#0a1120;font:600 9.5px/1.3 var(--shrift);letter-spacing:.14em;text-transform:uppercase;color:var(--tekst-3)}
.grafik-dolga.otkryt-na-telefone{width:100%}
.perenos{margin-top:18px;display:flex;gap:14px;align-items:center;flex-wrap:wrap;background:var(--golubo-tush);border-left:2px solid var(--golubo);padding:14px 18px;border-radius:0 10px 10px 0;font-size:14.5px}
/* порядок гашения — что сбрасываем первым */
.poryadok-pult{display:flex;gap:28px;align-items:flex-end;flex-wrap:wrap;margin-bottom:22px}
.sverhu label{margin-bottom:8px}
.sverhu .vvod{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.sverhu input{width:12ch;min-height:44px;padding:8px 14px;font:600 16px/1.2 var(--shrift-zag);text-align:right}
.sverhu .ed{color:var(--tekst-3)}
.vyvod-poryadka{font:300 clamp(21px,2.2vw,30px)/1.22 var(--shrift-zag);letter-spacing:-.015em;max-width:36ch;margin-bottom:14px;text-wrap:balance}
.vyvod-poryadka em{font-weight:500;color:var(--golubo-sv)}
.vyvod-podrobno{font-size:15.5px;line-height:1.58;color:var(--tekst-2);max-width:66ch;margin-bottom:24px}
.vyvod-podrobno:empty{display:none}
.vyvod-podrobno em{font-weight:600;color:var(--tekst)}
.dva-sposoba{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-bottom:20px}
.sposob{padding:20px 22px 22px;transition:border-color var(--plavno),box-shadow var(--plavno)}
.sposob.vybran{border-color:var(--golubo-dym);box-shadow:inset 0 1px 0 rgba(156,202,255,.35),0 30px 60px -24px rgba(0,0,0,.85),0 0 40px -12px rgba(90,169,255,.35)}
.sposob .zag{display:flex;flex-direction:column-reverse;gap:6px;margin-bottom:12px}
.sposob h3{font-size:19px}
.sposob .yarlychok{display:flex;align-items:center;gap:8px;font:600 10px/1.3 var(--shrift-zag);letter-spacing:.14em;min-height:1.3em;text-transform:uppercase;color:var(--golubo-sv);white-space:nowrap}
.sposob .yarlychok:not(:empty)::before{content:"";width:6px;height:6px;background:var(--golubo);box-shadow:0 0 8px rgba(90,169,255,.6)}
.sposob .kak{font-size:13.5px;color:var(--tekst-3);margin-bottom:16px;line-height:1.5;min-height:6em}
.sposob .pometka{font-size:13px;line-height:1.45;color:var(--tekst-2);margin:-8px 0 16px;border-left:2px solid var(--golubo-dym);padding-left:10px}
.sposob .pometka em{font-weight:600;color:var(--tekst)}
.sposob .cifry{display:grid;grid-template-columns:auto minmax(0,1fr);gap:16px}
.sposob .cifry div span{display:block;font:500 10px/1.3 var(--shrift-zag);letter-spacing:.14em;text-transform:uppercase;color:var(--tekst-3);margin-bottom:6px}
.sposob .cifry b{display:block;font:300 clamp(17px,1.4vw,21px)/1.15 var(--shrift-zag);letter-spacing:-.02em;white-space:nowrap;color:var(--tekst);font-variant-numeric:tabular-nums}
.sposob .cifry b[id$="-srok"]{white-space:normal}
.sposob .ochered-zag{margin-top:16px;font:600 9.5px/1.3 var(--shrift);letter-spacing:.2em;text-transform:uppercase;color:var(--tekst-3)}
.sposob ol{margin-top:6px;counter-reset:n;font-size:14px}
.sposob ol li{counter-increment:n;display:flex;justify-content:space-between;gap:10px;padding:8px 0;border-top:1px solid var(--liniya)}
.sposob ol li::before{content:counter(n);font:700 12px/1.3 var(--shrift-zag);color:var(--tekst-3);width:18px;flex:none;padding-top:1px}
.sposob ol li .kto{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sposob ol li .kogda{color:var(--tekst-3);white-space:nowrap}
/* шкала свободы — на миллиметровке */
.shkala-shapka{display:flex;justify-content:space-between;align-items:baseline;gap:14px;flex-wrap:wrap;margin-bottom:14px}
.shkala-shapka h3{font-size:19px}
.legenda{display:flex;gap:18px;flex-wrap:wrap;font-size:13px;color:var(--tekst-2)}
.legenda span{display:flex;align-items:center;gap:7px}
.legenda i{width:14px;height:6px;border-radius:3px;flex:none}
.dorozhki{position:relative;padding-top:32px}
.dorozhka{display:grid;grid-template-columns:180px minmax(0,1fr);gap:14px;align-items:center;padding:9px 0}
.dorozhka .kto{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dorozhka .polosy{position:relative;height:22px}
.dorozhka .polosy i{position:absolute;left:0;height:7px;border-radius:4px}
.dorozhka .polosy .seychas{top:2px;background:var(--svoi)}
.dorozhka .polosy .plan{top:13px;background:var(--procenty)}
.dorozhka .polosy .beskonechno{background:repeating-linear-gradient(90deg,var(--svoi) 0 6px,transparent 6px 10px)}
.dorozhka .polosy em{position:absolute;top:-1px;font-size:11.5px;color:var(--tekst-3);white-space:nowrap;padding-left:8px}
.os{display:grid;grid-template-columns:180px minmax(0,1fr);gap:14px;margin-top:6px;border-top:1px solid var(--liniya);padding-top:8px}
.os .metki{position:relative;height:16px;font-size:11.5px;color:var(--tekst-3)}
.os .metki span{position:absolute;transform:translateX(-50%);white-space:nowrap}
.os .metki span:first-child{transform:none}
.os .metki span:last-child{transform:translateX(-100%)}
.liniya-svobody{position:absolute;top:0;bottom:0;width:0;border-left:1px dashed var(--golubo-sv);pointer-events:none}
.liniya-svobody span{position:absolute;top:3px;left:0;transform:translateX(-50%);font-size:12px;font-weight:600;color:var(--golubo-sv);white-space:nowrap;background:#0b1627;padding:0 6px;border-radius:4px}
/* мостик в цель */
.most-itog{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:center;padding:28px 30px}
.most-itog h2{font-size:clamp(22px,2.2vw,30px);margin-bottom:10px}
.most-itog p{color:var(--tekst-2);max-width:58ch;font-size:15.5px;line-height:1.55}
.most-itog p b{color:var(--tekst)}
.sohranenie{margin-top:18px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:22px;align-items:center;padding:22px 26px}
.sohranenie h3{font-size:18px;margin-bottom:8px}
.sohranenie p{color:var(--tekst-2);font-size:14.5px;line-height:1.5}

/* ═══ 10. ЧЕРТЁЖ 03 — цель: план полёта (разметка sayt/kalkulyator.html) ═══ */
.rezhimy{margin-top:26px;width:max-content;max-width:100%;flex-wrap:wrap}
.cel-stanok{grid-template-columns:minmax(0,380px) minmax(0,1fr);margin-top:24px}
.cel-stanok .pult{position:static}
.cel-stanok .pole{margin-bottom:22px}
.cel-stanok .pole:last-child{margin-bottom:0}
.cel-stanok .pole .shapka-polya{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:8px}
.cel-stanok .pult .pole label{font:400 14px/1.3 var(--shrift);letter-spacing:0;text-transform:none;color:var(--tekst-2);margin:0}
.cel-stanok .pole .znachenie{display:flex;align-items:baseline;gap:4px}
.cel-stanok .pole input[type=text]{background:none;border:0;border-radius:0;box-shadow:none;padding:0 0 2px;min-height:0;width:auto;min-width:2ch;max-width:10ch;
  font:600 19px/1.2 var(--shrift-zag);letter-spacing:-.02em;color:var(--tekst);text-align:right;border-bottom:1px dashed var(--liniya-2)}
.cel-stanok .pole input[type=text]:focus{border-bottom-color:var(--golubo);color:var(--golubo-sv);box-shadow:none}
.cel-stanok .pole .ed{font-size:13px;color:var(--tekst-3);flex:none}
.scenarii{display:grid;gap:6px}
.scenarii button{display:block;text-align:left;flex:none;white-space:normal;padding:11px 14px}
.scenarii button b{font:500 14px/1.3 var(--shrift-zag);display:block;margin-bottom:3px;color:inherit}
.scenarii .otkuda{font-size:11.5px;color:var(--tekst-3);font-weight:400;line-height:1.35;display:block}
.scenarii button[aria-pressed="true"] .otkuda{color:var(--golubo-sv);opacity:.85}
.tonko{margin-top:20px;border-top:1px solid var(--liniya);padding-top:12px}
.tonko .vnutri-tonko{padding-top:16px}
.otvet{padding:24px 28px 22px}
.otvet .nadpis{font:500 11px/1.3 var(--shrift-zag);letter-spacing:.2em;text-transform:uppercase;color:var(--tekst-3);margin-bottom:12px}
.otvet .summa{font:300 clamp(40px,5.4vw,78px)/.98 var(--shrift-zag);letter-spacing:-.035em;color:var(--tekst);word-break:break-word;font-variant-numeric:tabular-nums}
.otvet .summa .rub{color:var(--tekst-3);font-size:.42em;font-weight:300;letter-spacing:0}
.otvet .pripiska{color:var(--tekst-2);font-size:15.5px;line-height:1.55;margin-top:14px;max-width:56ch}
.otvet .pripiska b{color:var(--tekst)}
.raskladka{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px}
.dolya{padding:14px 16px}
.dolya .imya{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--tekst-2);margin-bottom:8px}
.dolya .imya i{width:10px;height:10px;border-radius:3px;flex:none}
.dolya .cifra{font:300 clamp(20px,2.1vw,28px)/1 var(--shrift-zag);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.dolya .chast{font-size:12.5px;color:var(--tekst-3);margin-top:6px;line-height:1.4}
.polosa{display:flex;height:9px;border-radius:99px;overflow:hidden;margin-top:12px;background:rgba(3,5,10,.6);gap:2px;box-shadow:inset 0 0 0 1px var(--liniya)}
.polosa span{display:block;transition:width .45s cubic-bezier(.16,.84,.28,1)}
.grafik-blok{margin-top:14px}
.grafik-shapka{display:flex;justify-content:space-between;align-items:baseline;gap:14px;flex-wrap:wrap;margin-bottom:12px}
.grafik-shapka h2{font-size:19px}
.legenda i{width:11px;height:11px;border-radius:3px}
/* график — карандашная траектория на миллиметровке: сетка 8/40 px под полотном,
   цвета линий скрипт kalkulyator.js пишет атрибутами (#b8823a / #5a8fd6) — перекрашиваем их здесь, расчёт не трогаем */
.holst{position:relative;border-radius:8px;
  background:
    repeating-linear-gradient(0deg,rgba(255,255,255,.06) 0 1px,transparent 1px 40px),
    repeating-linear-gradient(90deg,rgba(255,255,255,.06) 0 1px,transparent 1px 40px),
    repeating-linear-gradient(0deg,rgba(255,255,255,.025) 0 1px,transparent 1px 8px),
    repeating-linear-gradient(90deg,rgba(255,255,255,.025) 0 1px,transparent 1px 8px)}
.holst svg{display:block;overflow:visible}
.holst svg text{font-family:var(--shrift)}
.holst path[stroke="#b8823a"]{stroke:var(--procenty)}
.holst path[stroke="#5a8fd6"]{stroke:var(--svoi)}
.holst stop[stop-color="#b8823a"]{stop-color:var(--procenty)}
.holst stop[stop-color="#5a8fd6"]{stop-color:var(--svoi)}
.holst circle[fill="#b8823a"]{fill:var(--procenty)}
.holst circle[fill="#5a8fd6"]{fill:var(--svoi)}
.holst .podskazka i[style*="#b8823a"]{background:var(--procenty)!important}
.holst .podskazka i[style*="#5a8fd6"]{background:var(--svoi)!important}
@keyframes vyrasti{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
.holst .risunok.pervyy-raz{animation:vyrasti .85s cubic-bezier(.16,.84,.28,1) both}
.holst .lovushka{cursor:crosshair}
.holst .podskazka{position:absolute;top:8px;transform:translateX(-50%);background:rgba(8,13,24,.98);border:1px solid var(--liniya-2);border-radius:9px;padding:11px 14px;
  font-size:13px;pointer-events:none;box-shadow:0 18px 40px -12px rgba(0,0,0,.9);white-space:nowrap;z-index:3;display:grid;gap:3px}
.holst .podskazka b{font:500 13.5px/1.3 var(--shrift-zag);margin-bottom:2px;display:block}
.holst .podskazka span{display:flex;align-items:center;gap:7px;color:var(--tekst-2)}
.holst .podskazka i{width:9px;height:9px;border-radius:2px;flex:none}
.holst .podskazka .pribyl{color:var(--tekst-3);font-size:12.5px;padding-left:16px}
.os-podpis{text-align:center;font-size:11.5px;color:var(--tekst-3);margin-top:6px;line-height:1.4}
.po-godam{margin-top:16px}
.po-godam summary{font-size:14.5px;color:var(--tekst-2)}
.tablica-obertka{overflow-x:auto;margin-top:12px;border:1px solid var(--liniya);border-radius:12px;background:rgba(3,5,10,.5)}
.po-godam table{width:100%;border-collapse:collapse;font-size:14.5px}
.po-godam th{text-align:right;font:600 9.5px/1.3 var(--shrift);letter-spacing:.2em;text-transform:uppercase;color:var(--tekst-3);padding:12px 16px;border-bottom:1px solid var(--liniya);white-space:nowrap}
.po-godam th:first-child,.po-godam td:first-child{text-align:left}
.po-godam td{text-align:right;padding:11px 16px;border-bottom:1px solid var(--liniya);white-space:nowrap;font-variant-numeric:tabular-nums}
.po-godam tr:last-child td{border-bottom:0;color:var(--golubo-sv);font-weight:600}
.sohranit{margin-top:28px;display:grid;grid-template-columns:1fr auto;gap:22px;align-items:center;padding:28px 30px}
.sohranit h2{font-size:clamp(22px,2.2vw,30px);margin-bottom:10px}
.sohranit p{color:var(--tekst-2);max-width:56ch;font-size:15.5px;line-height:1.55}
.sohranit .knopka{flex:none}
.imya-celi{margin-top:16px;display:flex;gap:10px;flex-wrap:wrap}
.imya-celi input{flex:1 1 220px;font-size:15px}
.otvet-sohraneniya{margin-top:12px;font-size:14.5px;color:var(--golubo-sv);line-height:1.45}

/* ═══ 11. Средние экраны ════════════════════════════════════════ */
@media (max-width:1180px){
  .menyu{gap:16px}
  .pribory-ryad{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sluzhba{grid-template-columns:1fr}
  .perehod{align-items:center}
  .list-01{min-height:600px;padding:22px 20px 20px}
}
@media (max-width:1000px){
  .mostik,.geroy-verh{grid-template-columns:1fr}
  .list-polka{max-width:600px;width:100%}
  .list-02,.list-03{justify-self:start}
  .dva-sposoba{grid-template-columns:minmax(0,1fr)}
  .sposob .kak{min-height:0}
  .sposob .yarlychok:empty{display:none}
  .sposob .cifry b[id$="-srok"]{white-space:nowrap}
  .svodka{grid-template-columns:1fr 1fr;gap:0}
  .svodka .yach:nth-child(3){padding-left:0;border-left:0}
  .svodka .yach:nth-child(n+3){border-top:1px dashed rgba(255,255,255,.18);padding-top:16px}
  .stanok,.cel-stanok{grid-template-columns:minmax(0,1fr)}
  .stanok .pult{position:static}
  .tablicy{grid-template-columns:1fr}
  .uroki-setka{grid-template-columns:1fr}
  .razdel-shapka{grid-template-columns:1fr}
}
@media (max-width:640px){
  .pereklyuchatel{width:100%}
  .pereklyuchatel button{flex:1 1 0;padding:10px 6px;white-space:normal;line-height:1.2;font-size:12.5px}
}

/* ═══ 12. Телефон 390 ══════════════════════════════════════════ */
@media (max-width:760px){
  body{font-size:16px}
  .metka{font-size:13px;letter-spacing:.12em}
  .knopka,.knopka.malaya,.knopka.tekst{font-size:14px;letter-spacing:.06em}
  .knopka{min-height:54px}
  .shapka{height:64px;gap:12px}
  .shapka .logo .rezhim{display:none}
  .menyu{display:none}
  .burger{display:block}
  .avatar{margin-left:auto}
  .burger{margin-left:0}
  .shapka.menyu-otkryto .menyu{display:flex;flex-direction:column;align-items:stretch;gap:0;position:fixed;top:68px;left:12px;right:12px;margin:0;
    padding:6px 18px;background:rgba(3,5,10,.92);border:1px solid var(--liniya-2);border-radius:16px;
    -webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);font-size:14px}
  .shapka.menyu-otkryto .menyu a{display:block;padding:15px 0;border-bottom:1px solid var(--liniya-2)}
  .shapka.menyu-otkryto .menyu a:last-child{border-bottom:0}
  .shapka.menyu-otkryto .menyu a.knopka{display:flex;margin:10px 0;border-bottom:0}
  .shapka.menyu-otkryto .menyu .pryachem{display:block}
  .shapka.menyu-otkryto .burger i:first-child{top:21.5px;transform:rotate(45deg)}
  .shapka.menyu-otkryto .burger i:last-child{top:21.5px;transform:rotate(-45deg)}
  .logo{font-size:14px;letter-spacing:.24em}
  /* окно и лист: без дыхания и параллакса; лист — одной колонкой, ракета лёжа */
  .okno{inset:0;transform:none}
  .okno.s-kadrom{transform:none}
  .okno-kadr{animation:none!important;transform:none}
  .list-polka{transform:none;max-width:none}
  .list{animation:none}
  .list-01{grid-template-columns:1fr;min-height:0;padding:16px 14px 14px;gap:14px}
  .list-01 .chertezh-01{display:none}
  .list-01 .chertezh-01-gor{display:block}
  .niz-vid{display:none}
  .list-01 .shtamp{margin-top:12px}
  .list-02,.list-03{max-width:none;justify-self:stretch}
  .list-02 .shtamp,.list-03 .shtamp{right:12px;bottom:12px}
  .shtamp>*{padding:5px 9px}
  .bort-podpis{display:none}
  .geroy{min-height:0;padding-top:96px;padding-bottom:36px}
  .geroy-tekst h1{font-size:clamp(30px,8.6vw,38px)}
  .geroy-tekst .lid,.mostik-tekst .lid{font-size:16px}
  .privet{font-size:15px}
  .steklo{padding:18px 18px 18px;border-radius:14px}
  .steklo h2{font-size:21px}
  .ka-shapka{font-size:11px;letter-spacing:.2em}
  .ka-podpis,.sub,.razdel>.sub,.razdel-shapka .poyasnenie{font-size:15px}
  .otsek{padding-top:44px;padding-bottom:16px}
  .otsek+.otsek{padding-top:28px}
  .razdel-shapka{margin-bottom:20px}
  .podval p{font-size:14px}
  .ogovorka{font-size:14px}
  /* чертёж 01 */
  .dni-blok{grid-template-columns:1fr;gap:6px}
  .dni{font-size:clamp(56px,17vw,72px)}
  .dni small{font-size:18px}
  .dni-pod{max-width:none;padding-bottom:0}
  .telemetriya{grid-template-columns:1fr 1fr;gap:0 14px}
  .telemetriya dd{font-size:20px}
  .telemetriya dt,.telemetriya dd i{font-size:12px}
  .shag{padding:14px 16px;gap:12px}
  .shag .b{font-size:16px}
  .shag .s{font-size:14px}
  .put-knopki{flex-direction:column;align-items:stretch}
  .put-knopki .knopka{width:100%;white-space:normal;line-height:1.3;padding:12px 18px}
  .stancii span{font-size:14px}
  .stancii b{font-size:14px}
  .stancii .etap{font-size:11px}
  .marshrut .ka-podpis{font-size:14px}
  .dolgi-kratko{grid-template-columns:1fr;gap:12px}
  .dolgi-kratko span{margin-bottom:4px;font-size:12px}
  .zagruzka{grid-template-columns:1fr}
  .zagruzka .knopka{width:100%}
  .ochistka{text-align:left}
  .pribory-ryad{grid-template-columns:1fr 1fr;gap:10px}
  .pribor{padding:12px 12px 10px}
  .pribor-chislo{font-size:22px}
  .pribor-imya{font-size:10px}
  .pribor-izm{font-size:13px;min-height:0}
  .lesson .ttl{font-size:15px}
  .lesson .len{display:none}
  .uroki-tekst p{font-size:15px}
  /* чертёж 02 */
  .svodka{grid-template-columns:1fr;padding:14px 18px 6px;margin-top:22px}
  .svodka .yach,.svodka .yach+.yach{padding:12px 0;border-left:0}
  .svodka .yach+.yach{border-top:1px dashed rgba(255,255,255,.18)}
  .svodka .yach:nth-child(n+3){padding-top:12px}
  .svodka .chislo{font-size:26px}
  .svodka .glavnoe .chislo{font-size:34px}
  .svodka .chislo.data{font-size:22px}
  .svodka .pod{font-size:14px}
  .dohod{padding:14px 18px;gap:12px}
  .dohod label{flex:1 1 100%}
  .dohod .vyvod{font-size:14.5px}
  .pult .ryad{grid-template-columns:1fr 1fr}
  .pult .podskazka-stavki{font-size:13.5px}
  .spisok-pusto{font-size:15px}
  .poryadok-pult{gap:16px}
  .sverhu .vvod{gap:8px}
  .vyvod-poryadka{font-size:21px}
  .vyvod-podrobno{font-size:15.5px}
  .sposob{padding:16px 16px 18px}
  .sposob .kak,.sposob .pometka{font-size:14px}
  .sposob .cifry b{font-size:18px}
  .sposob ol{font-size:14.5px}
  .sposob .cifry b[id$="-srok"]{white-space:normal}
  .most-itog,.sohranenie{grid-template-columns:minmax(0,1fr);padding:20px 18px}
  .most-itog .knopka,.sohranenie .knopka{width:100%;white-space:normal;line-height:1.3;padding:12px 18px}
  .dorozhka,.os{grid-template-columns:minmax(0,1fr);gap:4px}
  .os>span{display:none}
  .dorozhka{padding:6px 0}
  .legenda{font-size:13.5px}
  /* таблица долгов на телефоне — карточки (sayt/dolgi.html, те же правила) */
  .tablica-dolgov thead{display:none}
  .tablica-dolgov,.tablica-dolgov tbody{display:block}
  .tablica-dolgov tr.verh{display:grid;grid-template-columns:1fr 1fr;gap:10px 16px;padding-top:16px}
  .tablica-dolgov tr.verh td{display:block;padding:0;text-align:left;white-space:normal}
  .tablica-dolgov tr.verh td:first-child{grid-column:1/-1;display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
  .tablica-dolgov tr.verh td:first-child .deystviya{margin:0 -8px 0 0}
  .tablica-dolgov tr.verh td[data-podpis]::before{content:attr(data-podpis);display:block;font:600 10.5px/1.3 var(--shrift);letter-spacing:.12em;text-transform:uppercase;color:var(--tekst-3);margin-bottom:3px}
  .tablica-dolgov tr.niz{display:block}
  .tablica-dolgov tr.niz td{display:block;padding:10px 0 16px}
  .tablica-dolgov{font-size:15px}
  .tablica-dolgov .vid,.tablica-dolgov .tiho{font-size:13px}
  /* чертёж 03 */
  .rezhimy{width:100%;display:grid;grid-template-columns:1fr}
  .rezhimy button{width:100%;white-space:normal;padding:11px 12px;font-size:13.5px}
  .raskladka{grid-template-columns:1fr}
  .otvet{padding:18px 18px 18px}
  .otvet .summa{font-size:clamp(34px,9.6vw,44px);overflow-wrap:anywhere}
  .otvet .pripiska{font-size:15px}
  .cel-stanok .pole input[type=text]{font-size:18px}
  .cel-stanok .pult .pole label{font-size:14.5px}
  .vybor button{font-size:13.5px}
  .scenarii .otkuda{font-size:12.5px}
  .grafik-blok{padding:16px 12px}
  .os-podpis{font-size:12.5px}
  .sohranit{grid-template-columns:minmax(0,1fr);padding:20px 18px;margin-top:22px}
  .sohranit .knopka{width:100%}
  .imya-celi input{min-height:48px}
  /* критик 29.10 (4.2): пояснительный текст не мельче 14 px, прописные метки — не мельче 11,5 px */
  .shtamp{font-size:11px;letter-spacing:.14em}
  .shtamp b{font-size:12px}
  .sposob .ochered-zag,.po-godam th,.grafik-dolga th,.tablica-dolgov th,label,.pult label,.svodka .nadpis,.sposob .yarlychok,.sposob .cifry div span,.pribor-imya,.plashka-pokaza b,.yarlyk-primer,.otvet .nadpis,.podval .bort{font-size:11.5px}
  .dni-metka,.telemetriya dt,.dolgi-kratko span,.stancii li i,.lesson .n,.sposob ol li::before,.holst svg text{font-size:12px}
  .pribor-ist,.telemetriya dd i,.podskazki li small,.liniya-svobody span,.os .metki,.dorozhka .polosy em{font-size:13px}
  .dolya .chast,.scenarii .otkuda,.os-podpis,.pribor-izm,.period,.tablica-dolgov .vid,.tablica-dolgov .tiho,.dolya .imya,.dolgi-pod,.schetchik-blok .podskazka,.poryadok,.most,.svernut,.grafik-dolga summary,.perehod .txt,.cel-niz,.cel-pravka,.zagruzka p,.ochistka button,.razbor-ssylka span,.lesson.lock .ttl small,.holst .podskazka,.holst .podskazka .pribyl,.cel-stanok .pole .ed,.legenda,.rynok-niz,.nizhnyaya-stroka,.preduprezhdenie,.plashka-pokaza,.grafik-dolga table,.svodka .pod,.sposob .kak,.sposob .pometka,.ka-podpis,.marshrut .ka-podpis,.deystviya button,.pult .podskazka-stavki,.stancii span{font-size:14px}
  .pereklyuchatel button{font-size:13.5px}
  /* критик 29.10 (4.3): под палец — поля-значения, ползунки, маленькие кнопки не ниже 40 px */
  .cel-stanok .pole input[type=text]{min-height:40px;padding:6px 0 4px}
  input[type=range]{height:40px;margin:0}
  .deystviya button{min-height:40px;padding:9px 11px}
  .ubrat{min-width:40px;min-height:40px;font-size:26px}
  .ochistka button{min-height:40px;padding:10px 0}
  .svernut,.grafik-dolga summary{min-height:40px}
  .cel-pravka input{min-height:44px}
  /* лист 02 на телефоне: размерная линия под штампом не нужна (2.5) */
  .list-02 .razmer{display:none}
  /* кадр художника на телефоне: вуаль плотнее */
  .okno.s-kadrom .okno-vual{background:linear-gradient(180deg,rgba(3,5,10,.86) 0,rgba(3,5,10,.64) 22%,rgba(3,5,10,.66) 60%,rgba(3,5,10,.96) 100%)}
}
@media (max-width:520px){
  .pult .ryad{grid-template-columns:1fr}
}

/* ═══ 13. «Меньше движения» и снимки ══════════════════════════ */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .okno-kadr,.list{animation:none!important;transform:none!important}
  .okno,.okno.s-kadrom,.list-polka{transform:none!important}
  .fill,.holst .risunok.pervyy-raz{animation:none}
  .polosa span,.dohod .shkala i,.knopka,.shag,.perehod{transition:none}
  .naplyv{transition:none}
}
/* !important — чтобы перебить .okno.s-kadrom .okno-kadr (кадр художника дышит только без ключей) */
html.snimok .okno-kadr,html.tiho .okno-kadr,html.snimok .list,html.tiho .list{animation:none!important;transform:none!important}
html.snimok .okno,html.tiho .okno,html.snimok .list-polka,html.tiho .list-polka{transform:none!important}
html.snimok .fill,html.snimok .holst .risunok.pervyy-raz,html.tiho .fill,html.tiho .holst .risunok.pervyy-raz{animation:none}
@media (hover:none){.okno,.list-polka{transform:none}}

/* сборка переезда: кнопка службы заботы в цвет бюро */
body .zabota-knopka{background:#f2f5fa;color:#0a1324}
body .zabota-knopka:hover{background:#ffffff;color:#0a1324}