/* Стили портала. Правки вносить здесь, а не в шаблонах.

   Волна 1 (26.07.2026): вся типографика сведена к шкале.
   Было 30 размеров шрифта, 10 начертаний и 11 радиусов — стало 7 / 3 / 3.
   Числа больше не пишутся руками: только токены --fs-*, --w-*, --r-*.
   Подробнее — docs/оформление.md. */

  /* ══════════ шрифт ══════════
     Golos Text, вариативный (400–700) в одном файле на набор символов.
     Лежит локально в public/fonts — на сторонние шрифтовые сервисы
     портал не ходит. Лицензия SIL OFL 1.1, см. public/fonts/LICENSE.txt. */
  @font-face{
    font-family:"Golos Text"; font-style:normal; font-weight:400 700; font-display:swap;
    src:url("/public/fonts/golos-cyrillic.woff2") format("woff2");
    unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
  }
  @font-face{
    font-family:"Golos Text"; font-style:normal; font-weight:400 700; font-display:swap;
    src:url("/public/fonts/golos-latin.woff2") format("woff2");
    unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
                  U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
                  U+2212, U+2215, U+FEFF, U+FFFD;
  }

  /* ══════════ токены ══════════ */
  :root{
    --bg:#080B11; --bg-2:#0C1119; --panel:#111823; --panel-2:#161E2B; --sunk:#0A0F16;
    --line:#1E2836; --line-soft:#18202C;
    --ink:#DFE6F0; --ink-2:#A9B5C6; --muted:#68768B;
    --accent:#7C86FF; --accent-2:#A8AFFF; --on-accent:#0A0D14;
    --accent-soft:rgba(124,134,255,.13); --accent-line:rgba(124,134,255,.42);
    --ok:#3ECF8E; --warn:#E8A33D; --crit:#FF5F5F; --idle:#4A5668;
    --dot:rgba(124,134,255,.07);
    --shadow:0 1px 2px rgba(0,0,0,.5), 0 10px 30px rgba(0,0,0,.4);
    --shadow-lift:0 2px 6px rgba(0,0,0,.55), 0 22px 50px rgba(0,0,0,.5);
    color-scheme:dark;
  }
  @media (prefers-color-scheme: light){
    :root{
      --bg:#EDF0F5; --bg-2:#E6EAF1; --panel:#FFFFFF; --panel-2:#F6F8FC; --sunk:#F1F3F8;
      --line:#D5DBE6; --line-soft:#E2E6EE;
      --ink:#0E121A; --ink-2:#394152; --muted:#5F6980;
      --accent:#3B4CCA; --accent-2:#2C3BAA; --on-accent:#FFFFFF;
      --accent-soft:rgba(59,76,202,.09); --accent-line:rgba(59,76,202,.34);
      --ok:#12784F; --warn:#8C5A0C; --crit:#C4302F; --idle:#98A1B3;
      --dot:rgba(59,76,202,.08);
      --shadow:0 1px 2px rgba(14,18,26,.05), 0 6px 18px rgba(14,18,26,.07);
      --shadow-lift:0 2px 4px rgba(14,18,26,.06), 0 16px 38px rgba(14,18,26,.12);
      color-scheme:light;
    }
  }
  :root[data-theme="light"]{
    --bg:#EDF0F5; --bg-2:#E6EAF1; --panel:#FFFFFF; --panel-2:#F6F8FC; --sunk:#F1F3F8;
    --line:#D5DBE6; --line-soft:#E2E6EE;
    --ink:#0E121A; --ink-2:#394152; --muted:#5F6980;
    --accent:#3B4CCA; --accent-2:#2C3BAA; --on-accent:#FFFFFF;
    --accent-soft:rgba(59,76,202,.09); --accent-line:rgba(59,76,202,.34);
    --ok:#12784F; --warn:#8C5A0C; --crit:#C4302F; --idle:#98A1B3;
    --dot:rgba(59,76,202,.08);
    --shadow:0 1px 2px rgba(14,18,26,.05), 0 6px 18px rgba(14,18,26,.07);
    --shadow-lift:0 2px 4px rgba(14,18,26,.06), 0 16px 38px rgba(14,18,26,.12);
    color-scheme:light;
  }
  :root[data-theme="dark"]{
    --bg:#080B11; --bg-2:#0C1119; --panel:#111823; --panel-2:#161E2B; --sunk:#0A0F16;
    --line:#1E2836; --line-soft:#18202C;
    --ink:#DFE6F0; --ink-2:#A9B5C6; --muted:#68768B;
    --accent:#7C86FF; --accent-2:#A8AFFF; --on-accent:#0A0D14;
    --accent-soft:rgba(124,134,255,.13); --accent-line:rgba(124,134,255,.42);
    --ok:#3ECF8E; --warn:#E8A33D; --crit:#FF5F5F; --idle:#4A5668;
    --dot:rgba(124,134,255,.07);
    --shadow:0 1px 2px rgba(0,0,0,.5), 0 10px 30px rgba(0,0,0,.4);
    --shadow-lift:0 2px 6px rgba(0,0,0,.55), 0 22px 50px rgba(0,0,0,.5);
    color-scheme:dark;
  }

  /* ── Шкала. Семь ступеней, три начертания, три радиуса.
        Новых значений не заводить: если ни одно не подходит, значит
        неверно выбран уровень, а не нужна ещё одна ступень. ── */
  :root{
    --fs-1:32px;   /* заголовок лендинга — только через clamp ниже */
    --fs-2:22px;   /* заголовок секции и экрана, название задачи */
    --fs-3:17px;   /* название карточки, подзаголовок внутри задачи */
    --fs-4:15px;   /* основной текст */
    --fs-5:13px;   /* вторичный текст, подписи, таблицы */
    --fs-6:11px;   /* моноширинные данные: ключи, даты, счётчики */
    --fs-7:10px;   /* моноширинные метки капителью */

    --w-rg:400; --w-md:600; --w-bd:700;

    --r-sm:4px;    /* метки, чипы, значки, поля ввода */
    --r-md:8px;    /* карточки, кнопки, панели */
    --r-lg:14px;   /* крупные поверхности: читалка, экран входа, фото */

    --ls-h:-.022em;   /* разрядка заголовков */
    --ls-cap:.12em;   /* разрядка капители */
    --lh-tight:1.3; --lh-base:1.6;

    --mono:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace;
    --sans:"Golos Text",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  }

  *{box-sizing:border-box;}
  body{
    margin:0; background:var(--bg); color:var(--ink);
    font-family:var(--sans); font-size:var(--fs-4); line-height:var(--lh-base);
    -webkit-font-smoothing:antialiased; font-variant-numeric:tabular-nums;
    font-synthesis-weight:none;
    background-image:radial-gradient(var(--dot) 1px, transparent 1px);
    background-size:24px 24px;
  }
  button{font:inherit; color:inherit; background:none; border:0; cursor:pointer;}
  a{color:var(--accent); text-decoration:none;}
  a:hover{text-decoration:underline;}
  :focus-visible{outline:2px solid var(--accent); outline-offset:2px; border-radius:var(--r-sm);}
  h1,h2,h3,h4{margin:0; text-wrap:balance; letter-spacing:var(--ls-h);}
  p{margin:0;}

  @media (prefers-reduced-motion: reduce){ *{transition:none !important; animation:none !important;} }

  /* ══════════ общие детали консоли ══════════ */
  .led{width:7px; height:7px; border-radius:50%; background:var(--idle); flex:none; display:inline-block;}
  .led.ok{background:var(--ok); box-shadow:0 0 0 3px color-mix(in srgb, var(--ok) 16%, transparent);}
  .led.warn{background:var(--warn); box-shadow:0 0 0 3px color-mix(in srgb, var(--warn) 16%, transparent);}
  .led.crit{background:var(--crit); box-shadow:0 0 0 3px color-mix(in srgb, var(--crit) 18%, transparent);}
  .led.acc{background:var(--accent); box-shadow:0 0 0 3px var(--accent-soft);}

  .lbl{font-family:var(--mono); font-size:var(--fs-7); letter-spacing:var(--ls-cap); text-transform:uppercase; color:var(--muted);}
  .m{font-family:var(--mono);}

  .panel{background:var(--panel); border:1px solid var(--line); border-radius:var(--r-md); box-shadow:var(--shadow);}

  .btn{
    display:inline-flex; align-items:center; justify-content:center; gap:8px;
    padding:11px 18px; border-radius:var(--r-md); font-size:var(--fs-4); font-weight:var(--w-md);
    background:var(--accent); color:var(--on-accent); border:1px solid var(--accent);
    transition:filter .14s ease;
  }
  .btn:hover{filter:brightness(1.1);}
  .btn.sm{padding:8px 13px; font-size:var(--fs-5);}
  .btn2{
    display:inline-flex; align-items:center; justify-content:center; gap:8px;
    padding:10px 16px; border-radius:var(--r-md); font-size:var(--fs-4); font-weight:var(--w-md);
    background:transparent; color:var(--ink-2); border:1px solid var(--line);
    transition:border-color .14s ease, color .14s ease;
  }
  .btn2:hover{border-color:var(--accent-line); color:var(--accent);}
  .btn2.sm{padding:7px 12px; font-size:var(--fs-5);}
  .btn.wide, .btn2.wide{width:100%;}

  .chip{
    display:inline-flex; align-items:center; gap:6px; white-space:nowrap;
    font-family:var(--mono); font-size:var(--fs-7); letter-spacing:.05em;
    padding:3px 8px; border-radius:var(--r-sm); border:1px solid var(--line); color:var(--muted);
  }
  .chip.ok{color:var(--ok); border-color:color-mix(in srgb, var(--ok) 45%, transparent);}
  .chip.wip{color:var(--accent); border-color:var(--accent-line); background:var(--accent-soft);}
  .chip.att{color:var(--warn); border-color:color-mix(in srgb, var(--warn) 45%, transparent);}
  .chip.crit{color:var(--crit); border-color:color-mix(in srgb, var(--crit) 45%, transparent);}

  .code-badge{
    font-family:var(--mono); font-size:var(--fs-7); letter-spacing:.08em; flex:none;
    min-width:28px; height:20px; padding:0 5px; display:inline-grid; place-items:center;
    border:1px solid var(--line); border-radius:var(--r-sm); color:var(--muted); background:var(--sunk);
  }

  /* ══════════ ЛЕНДИНГ ══════════ */
  .land{max-width:1120px; margin:0 auto; padding:0 22px 90px;}
  .land-nav{
    display:flex; align-items:center; gap:16px; padding:18px 0;
    border-bottom:1px solid var(--line-soft); flex-wrap:wrap;
  }
  .brand{display:flex; align-items:center; gap:9px; font-family:var(--mono); font-size:var(--fs-5); letter-spacing:.02em;}
  .brand b{font-weight:var(--w-md); color:var(--ink);}
  .brand .sq{width:9px; height:9px; border-radius:2px; background:var(--accent);}
  .brand .lbl{letter-spacing:.04em;}
  .land-nav .sp{flex:1;}
  .land-nav a{font-size:var(--fs-5); color:var(--ink-2);}
  .land-nav a:hover{color:var(--accent); text-decoration:none;}

  .hero{display:grid; grid-template-columns:1fr; gap:44px; padding:64px 0 56px; align-items:center;}
  @media (max-width:940px){ .hero{gap:34px; padding:40px 0;} }
  .hero-l{display:flex; flex-direction:column; gap:22px;}
  .hero h1{font-size:clamp(24px,3.4vw,var(--fs-1)); line-height:1.1; letter-spacing:-.03em; font-weight:var(--w-bd);}
  .hero .lede{font-size:var(--fs-4); color:var(--ink-2); max-width:52ch;}
  .hero-cta{display:flex; gap:11px; flex-wrap:wrap; padding-top:2px;}
  .eyebrow{display:flex; align-items:center; gap:9px;}
  .eyebrow::after{content:""; height:1px; flex:1; max-width:70px; background:var(--line);}

  /* ── Панель-врезка: список разделов кабинета рядом с призывом войти.
        Строк с показаниями серверов тут больше нет — они рисовались
        выдуманными числами из скрипта и убраны вместе с ним. ── */
  .board{background:var(--panel); border:1px solid var(--line); border-radius:var(--r-md); box-shadow:var(--shadow-lift); overflow:hidden;}
  .board.side{min-width:270px; box-shadow:var(--shadow);}
  .board-top{display:flex; align-items:center; gap:9px; padding:9px 13px; background:var(--panel-2); border-bottom:1px solid var(--line); font-family:var(--mono); font-size:var(--fs-7); letter-spacing:var(--ls-cap); text-transform:uppercase; color:var(--muted);}
  .board-top .sp{flex:1;}
  .board-feed{padding:11px 13px; display:flex; flex-direction:column; gap:9px; background:var(--sunk);}
  .fline{display:flex; gap:9px; align-items:baseline; font-family:var(--mono); font-size:var(--fs-6); color:var(--ink-2);}
  .fline .t{color:var(--muted); flex:none;}

  .metrics{
    display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
    border:1px solid var(--line); border-radius:var(--r-md); overflow:hidden; background:var(--panel);
  }
  .metric{padding:16px 18px; border-right:1px solid var(--line-soft); display:flex; flex-direction:column; gap:3px;}
  .metric:last-child{border-right:0;}
  .metric .n{font-family:var(--mono); font-size:var(--fs-2); font-weight:var(--w-md); letter-spacing:-.02em; color:var(--ink);}
  .metric .c{font-size:var(--fs-5); color:var(--muted); line-height:1.45;}

  .sect{padding:62px 0 0; display:flex; flex-direction:column; gap:24px;}
  .sect-h{display:flex; flex-direction:column; gap:7px;}
  .sect-h h2{font-size:var(--fs-2); font-weight:var(--w-bd);}
  .sect-h p{color:var(--muted); font-size:var(--fs-4); max-width:66ch;}

  .svc{display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:14px;}
  .svc-i{background:var(--panel); border:1px solid var(--line); border-radius:var(--r-md); padding:17px 18px; display:flex; flex-direction:column; gap:9px;}
  .svc-i .h{display:flex; align-items:center; gap:9px;}
  .svc-i .t{font-size:var(--fs-3); font-weight:var(--w-md);}
  .svc-i p{font-size:var(--fs-5); color:var(--muted); line-height:1.55;}

  .cases{display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:14px;}
  .case{background:var(--panel); border:1px solid var(--line); border-radius:var(--r-md); padding:19px 20px; display:flex; flex-direction:column; gap:12px; box-shadow:var(--shadow);}
  .case .t{font-size:var(--fs-3); font-weight:var(--w-md);}
  .case p{font-size:var(--fs-4); color:var(--ink-2);}
  .tags{display:flex; flex-wrap:wrap; gap:5px;}

  .flow{display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:14px;}
  .fstep{background:var(--panel); border:1px solid var(--line); border-top:2px solid var(--accent); border-radius:0 0 var(--r-md) var(--r-md); padding:16px 17px; display:flex; flex-direction:column; gap:7px;}
  .fstep .n{font-family:var(--mono); font-size:var(--fs-7); letter-spacing:var(--ls-cap); color:var(--accent);}
  .fstep .t{font-size:var(--fs-4); font-weight:var(--w-md);}
  .fstep p{font-size:var(--fs-5); color:var(--muted); line-height:1.55;}

  .cta-band{
    display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap;
    background:var(--panel); border:1px solid var(--accent-line); border-radius:var(--r-lg); padding:26px 28px;
    box-shadow:var(--shadow);
  }
  .cta-band h3{font-size:var(--fs-2); font-weight:var(--w-bd);}
  .cta-band p{font-size:var(--fs-4); color:var(--muted); max-width:56ch; margin-top:5px;}
  .cta-band .col{display:flex; flex-direction:column; gap:9px; min-width:260px;}

  .land-foot{margin-top:64px; padding-top:22px; border-top:1px solid var(--line-soft); display:flex; justify-content:space-between; gap:18px; flex-wrap:wrap; font-size:var(--fs-5); color:var(--muted);}

  /* ══════════ ВХОД ══════════ */
  .gate{min-height:100vh; display:grid; place-items:center; padding:34px 20px;}
  .gate-in{width:100%; max-width:780px; display:flex; flex-direction:column; gap:22px; align-items:stretch;}
  .gate-in > .brand, .gate-in > .term, .gate-in > .gate-foot{width:100%; max-width:452px; align-self:center;}
  .gate-foot{display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap; align-items:center;}
  .gate-foot .lost{font-size:var(--fs-5); color:var(--muted);}
  .term{background:var(--panel); border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:var(--shadow-lift); overflow:hidden;}
  .term-bar{display:flex; align-items:center; gap:8px; padding:9px 13px; background:var(--panel-2); border-bottom:1px solid var(--line); font-family:var(--mono); font-size:var(--fs-7); letter-spacing:var(--ls-cap); text-transform:uppercase; color:var(--muted);}
  .term-body{padding:26px 24px 22px; display:flex; flex-direction:column; gap:18px;}
  .term-body h1{font-size:var(--fs-2); font-weight:var(--w-bd);}
  .term-body .sub{font-size:var(--fs-4); color:var(--muted);}
  .term-head{display:flex; flex-direction:column; gap:6px;}
  .term-form{display:flex; flex-direction:column; gap:18px;}
  .term-field{display:flex; flex-direction:column; gap:9px;}
  .prompt{display:flex; align-items:center; gap:0; border:1px solid var(--line); border-radius:var(--r-sm); background:var(--sunk); padding:0 12px; transition:border-color .14s ease;}
  .prompt:focus-within{border-color:var(--accent);}
  .prompt.bad{border-color:var(--crit);}
  .prompt .ps{font-family:var(--mono); font-size:var(--fs-4); color:var(--accent); padding-right:9px; flex:none;}
  .prompt input{
    flex:1; min-width:0; background:none; border:0; outline:none; color:var(--ink);
    font-family:var(--mono); font-size:var(--fs-3); letter-spacing:.15em; padding:13px 0; text-transform:uppercase;
  }
  .prompt input::placeholder{color:var(--muted); opacity:.5;}
  .gate-err{color:var(--crit); font-size:var(--fs-5); min-height:19px; font-family:var(--mono);}
  .hint{font-size:var(--fs-5); color:var(--muted); line-height:1.45;}

  .nokey{
    display:flex; flex-direction:column; gap:10px; align-items:flex-start;
    padding:24px 26px; border-radius:var(--r-lg);
    background:var(--panel); border:1px solid var(--accent-line);
    box-shadow:var(--shadow);
  }
  .nokey h2{font-size:var(--fs-2); font-weight:var(--w-bd); color:var(--ink); display:flex; align-items:center; gap:10px;}
  .nokey p{font-size:var(--fs-4); color:var(--ink-2); max-width:62ch;}
  .nokey-cta{display:flex; gap:10px; flex-wrap:wrap; padding-top:6px;}

  /* ── Демонстрационные кабинеты на экране входа ── */
  .demo-list{display:grid; grid-template-columns:1fr 1fr; gap:10px; width:100%; margin-top:4px;}
  @media (max-width:640px){ .demo-list{grid-template-columns:1fr;} }

  .demo-card{
    display:flex; flex-direction:column; gap:7px; text-align:left; width:100%;
    padding:13px 15px; border-radius:var(--r-md); cursor:pointer; min-height:112px;
    background:var(--sunk); border:1px solid var(--line);
    transition:border-color .14s ease, transform .14s ease, box-shadow .14s ease;
  }
  .demo-card:hover{border-color:var(--accent-line); transform:translateY(-1px); box-shadow:var(--shadow);}
  .demo-card .top{display:flex; align-items:baseline; gap:10px;}
  .demo-card .co{font-size:var(--fs-4); font-weight:var(--w-md); color:var(--ink); white-space:nowrap;}
  .demo-card .what{font-size:var(--fs-6); color:var(--muted); margin-left:auto; white-space:nowrap;}
  .demo-card .desc{font-size:var(--fs-5); color:var(--ink-2); line-height:1.45; flex:1;}
  .demo-card .bottom{
    display:flex; align-items:center; justify-content:space-between; gap:10px;
    padding-top:8px; border-top:1px solid var(--line-soft);
  }
  .demo-card .k{font-family:var(--mono); font-size:var(--fs-6); color:var(--muted); letter-spacing:.03em;}
  .demo-card .go{font-size:var(--fs-5); font-weight:var(--w-md); color:var(--accent); white-space:nowrap;}

  /* ══════════ КОНСОЛЬ ══════════ */
  .shell{display:grid; grid-template-columns:246px 1fr; min-height:100vh;}
  @media (max-width:900px){ .shell{grid-template-columns:1fr;} }

  .rail{background:var(--panel); border-right:1px solid var(--line); padding:18px 14px; display:flex; flex-direction:column; gap:18px; position:sticky; top:0; height:100vh; overflow-y:auto;}
  @media (max-width:900px){ .rail{position:static; height:auto; border-right:0; border-bottom:1px solid var(--line);} }
  .who{display:flex; flex-direction:column; gap:3px; padding:13px 11px; background:var(--sunk); border:1px solid var(--line-soft); border-radius:var(--r-md);}
  .who .org{font-size:var(--fs-4); font-weight:var(--w-md);}
  .who .sub{font-size:var(--fs-5); color:var(--muted);}
  .who .fp{font-family:var(--mono); font-size:var(--fs-7); color:var(--muted); letter-spacing:.05em; margin-top:3px;}

  .nav{display:flex; flex-direction:column; gap:1px;}
  .nav .cap{margin:0 0 7px 3px;}
  .nav .cap + .cap{margin-top:15px;}
  .ni{display:flex; align-items:center; gap:9px; width:100%; text-align:left; padding:6px 8px; border-radius:var(--r-sm); font-size:var(--fs-4); color:var(--ink-2); transition:background .12s ease;}
  .ni:hover{background:var(--panel-2);}
  .ni.sel{background:var(--accent-soft); color:var(--accent); font-weight:var(--w-md);}
  .ni.sel .code-badge{border-color:var(--accent-line); color:var(--accent);}
  .ni .n{margin-left:auto; font-family:var(--mono); font-size:var(--fs-6); color:var(--muted);}
  .ni .warn-dot{margin-left:auto;}
  .rail-foot{margin-top:auto; display:flex; flex-direction:column; gap:7px; border-top:1px solid var(--line-soft); padding-top:14px;}

  .main{min-width:0; display:flex; flex-direction:column;}
  .bar{
    display:flex; align-items:center; gap:10px; padding:11px 22px; flex-wrap:wrap;
    border-bottom:1px solid var(--line); background:var(--panel); position:sticky; top:0; z-index:20;
  }
  @media (max-width:900px){ .bar{position:static;} }
  .stat{display:flex; align-items:center; gap:7px; font-family:var(--mono); font-size:var(--fs-6); color:var(--ink-2); white-space:nowrap;}
  .stat i{font-style:normal; color:var(--muted);}
  .bar .div{width:1px; height:16px; background:var(--line); flex:none;}
  .bar .sp{flex:1;}
  .search{width:min(320px,42vw); padding:7px 11px; border-radius:var(--r-sm); border:1px solid var(--line); background:var(--sunk); color:var(--ink); font-size:var(--fs-5); font-family:var(--sans);}
  .search:focus{outline:none; border-color:var(--accent);}

  .body{padding:24px 22px 70px; display:flex; flex-direction:column; gap:20px;}
  @media (max-width:640px){ .body{padding:18px 14px 50px;} }

  .crumbs{display:flex; align-items:center; gap:7px; font-family:var(--mono); font-size:var(--fs-6); color:var(--muted); flex-wrap:wrap;}
  .crumbs button{color:var(--muted);}
  .crumbs button:hover{color:var(--accent);}
  .head{display:flex; flex-direction:column; gap:5px;}
  .head h2{font-size:var(--fs-2); font-weight:var(--w-bd);}
  .head p{color:var(--muted); font-size:var(--fs-4); max-width:74ch;}

  /* сводка */
  .digest{display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:12px;}
  .dg{background:var(--panel); border:1px solid var(--line); border-radius:var(--r-md); padding:14px 16px; display:flex; flex-direction:column; gap:5px; border-left:2px solid var(--line);}
  .dg.att{border-left-color:var(--warn);}
  .dg.new{border-left-color:var(--accent);}
  .dg.ok{border-left-color:var(--ok);}
  .dg .n{font-family:var(--mono); font-size:var(--fs-2); font-weight:var(--w-md); letter-spacing:-.02em;}
  .dg .c{font-size:var(--fs-5); color:var(--muted); line-height:1.45;}

  /* разделы */
  .folders{display:grid; grid-template-columns:repeat(auto-fill,minmax(232px,1fr)); gap:12px;}
  .fcard{
    position:relative; text-align:left; background:var(--panel); border:1px solid var(--line);
    border-left:2px solid var(--line); border-radius:var(--r-md); padding:14px 15px;
    display:flex; flex-direction:column; gap:8px;
    transition:border-color .14s ease, background .14s ease, transform .14s ease;
  }
  .fcard:hover{border-color:var(--accent-line); border-left-color:var(--accent); background:var(--panel-2); transform:translateY(-2px);}
  .fcard.att{border-left-color:var(--warn);}
  .fcard .top{display:flex; align-items:center; gap:9px;}
  .fcard .nm{font-size:var(--fs-4); font-weight:var(--w-md);}
  .fcard .ds{font-size:var(--fs-5); color:var(--muted); line-height:1.5;}
  .fcard .ft{display:flex; align-items:center; gap:8px; padding-top:9px; margin-top:auto; border-top:1px solid var(--line-soft); font-family:var(--mono); font-size:var(--fs-7); color:var(--muted);}

  /* строки задач */
  .rows{border:1px solid var(--line); border-radius:var(--r-md); background:var(--panel); overflow:hidden;}
  .rows .hd{display:grid; grid-template-columns:26px 1fr 92px 82px 104px; gap:12px; padding:8px 14px; background:var(--panel-2); border-bottom:1px solid var(--line);}
  .rows .hd span{font-family:var(--mono); font-size:var(--fs-7); letter-spacing:var(--ls-cap); text-transform:uppercase; color:var(--muted);}
  .wrow{display:grid; grid-template-columns:26px 1fr 92px 82px 104px; gap:12px; align-items:center; width:100%; text-align:left; padding:11px 14px; border-bottom:1px solid var(--line-soft); border-left:2px solid transparent; transition:background .12s ease, border-color .12s ease;}
  .wrow:last-child{border-bottom:0;}
  .wrow:hover{background:var(--panel-2); border-left-color:var(--accent);}
  .wrow.att{border-left-color:var(--warn);}
  .wrow .ix{font-family:var(--mono); font-size:var(--fs-6); color:var(--muted);}
  .wrow .t{font-size:var(--fs-4); font-weight:var(--w-md);}
  .wrow .s{font-size:var(--fs-5); color:var(--muted); margin-top:1px;}
  .wrow .k, .wrow .d{font-family:var(--mono); font-size:var(--fs-6); color:var(--muted);}
  @media (max-width:780px){
    .rows .hd{display:none;}
    .wrow{grid-template-columns:1fr auto; row-gap:6px; padding:12px 13px;}
    .wrow .ix{display:none;}
    .wrow .k{grid-column:1;}
    .wrow .d{grid-column:2; text-align:right;}
    .wrow .st{grid-column:2; grid-row:1; justify-self:end;}
  }
  .empty{padding:44px 20px; text-align:center; display:flex; flex-direction:column; gap:9px; align-items:center;}
  .empty .t{font-size:var(--fs-4); font-weight:var(--w-md);}
  .empty p{font-size:var(--fs-5); color:var(--muted); max-width:46ch;}

  /* читалка */
  .doc{display:grid; grid-template-columns:minmax(0,1fr) 254px; gap:18px; align-items:start;}
  @media (max-width:1000px){ .doc{grid-template-columns:1fr;} }
  .reader{background:var(--panel); border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; box-shadow:var(--shadow);}
  .reader-bar{display:flex; align-items:center; gap:8px; padding:8px 13px; background:var(--panel-2); border-bottom:1px solid var(--line); font-family:var(--mono); font-size:var(--fs-7); color:var(--muted);}
  .reader-bar .url{overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
  .reader-in{padding:28px 30px 34px; display:flex; flex-direction:column; gap:26px;}
  @media (max-width:640px){ .reader-in{padding:20px 16px 26px;} }
  .dhead{display:flex; flex-direction:column; gap:10px;}
  /* Название задачи — текст для человека, поэтому основным шрифтом,
     а не моноширинным: моноширинный русский на крупном кегле читается тяжело. */
  .dhead h3{font-size:clamp(20px,3vw,var(--fs-2)); font-weight:var(--w-bd); line-height:1.18;}
  .dhead .lede{font-size:var(--fs-4); color:var(--ink-2); max-width:64ch;}
  .dsec{display:flex; flex-direction:column; gap:12px;}
  .dsec h4{font-family:var(--mono); font-size:var(--fs-7); letter-spacing:var(--ls-cap); text-transform:uppercase; color:var(--muted); font-weight:var(--w-md);}
  .dsec .st{font-size:var(--fs-3); font-weight:var(--w-md); margin-top:-6px;}
  .dsec p{font-size:var(--fs-4); color:var(--ink-2); max-width:72ch;}
  .dsec code{font-family:var(--mono); font-size:.87em; background:var(--sunk); border:1px solid var(--line-soft); border-radius:var(--r-sm); padding:1px 5px;}
  /* приглушённый абзац: подпись под таблицей и примечания в блоках задачи */
  .dsec p.dim{font-size:var(--fs-5); color:var(--muted);}
  /* блоки задачи: список, пункты в колонках, команды */
  .dlist{margin:0; padding-left:19px; display:flex; flex-direction:column; gap:6px; font-size:var(--fs-4); color:var(--ink-2);}
  .node .pts{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:5px; font-size:var(--fs-5); color:var(--ink-2); line-height:1.5;}
  .node .pts li{display:flex; gap:7px; align-items:baseline;}
  .node .pts li::before{content:"▪"; color:var(--accent); font-size:var(--fs-7); flex:none;}
  .dcmd{margin:0; padding:13px 15px; background:var(--sunk); border:1px solid var(--line-soft); border-radius:var(--r-md); overflow-x:auto; font-family:var(--mono); font-size:var(--fs-5); line-height:1.7; color:var(--ink-2); white-space:pre;}
  .dcmd .c{color:var(--muted);}
  .dfig{margin:0; display:flex; flex-direction:column; gap:8px;}
  .dfig img{display:block; width:100%; height:auto; border:1px solid var(--line); border-radius:var(--r-md); background:var(--sunk);}
  .dfig figcaption{font-size:var(--fs-5); color:var(--muted);}
  /* Колонка читалки уже страницы, поэтому плитки и шаги там плотнее:
     иначе четыре плитки ломаются на 3 + 1 и выглядят как ошибка вёрстки. */
  .reader-in .digest{grid-template-columns:repeat(auto-fit,minmax(146px,1fr));}
  .reader-in .flow{grid-template-columns:repeat(auto-fit,minmax(166px,1fr));}
  .dtable{overflow-x:auto; border:1px solid var(--line); border-radius:var(--r-md);}
  .dtable table{border-collapse:collapse; width:100%; min-width:520px; font-size:var(--fs-5);}
  .dtable th, .dtable td{text-align:left; padding:9px 13px; border-bottom:1px solid var(--line-soft); vertical-align:top;}
  .dtable tr:last-child td{border-bottom:0;}
  .dtable th{font-family:var(--mono); font-size:var(--fs-7); letter-spacing:var(--ls-cap); text-transform:uppercase; color:var(--muted); background:var(--panel-2); font-weight:var(--w-md);}
  .dtable td.m{font-family:var(--mono); font-size:var(--fs-5); white-space:nowrap;}
  .note{border-left:2px solid var(--accent); background:var(--sunk); border-radius:0 var(--r-md) var(--r-md) 0; padding:13px 16px; display:flex; flex-direction:column; gap:5px;}
  .note.warn{border-left-color:var(--warn);}
  .note.crit{border-left-color:var(--crit);}
  .note .t{font-size:var(--fs-4); font-weight:var(--w-md);}
  .note p{font-size:var(--fs-4); color:var(--ink-2);}
  pre.sh{margin:0; background:var(--sunk); border:1px solid var(--line-soft); border-radius:var(--r-md); padding:13px 15px; overflow-x:auto; font-family:var(--mono); font-size:var(--fs-5); line-height:1.7; color:var(--ink-2);}
  pre.sh .c{color:var(--muted);}
  .nodes{display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:11px;}
  .node{background:var(--sunk); border:1px solid var(--line-soft); border-radius:var(--r-md); padding:13px 14px; display:flex; flex-direction:column; gap:7px;}
  .node .h{display:flex; align-items:baseline; justify-content:space-between; gap:8px;}
  .node .nm{font-family:var(--mono); font-size:var(--fs-5); font-weight:var(--w-md);}
  .node .rl{font-size:var(--fs-6); color:var(--muted);}
  .node .dm{font-family:var(--mono); font-size:var(--fs-6); color:var(--accent); word-break:break-all;}
  .node .ps{display:flex; flex-wrap:wrap; gap:4px;}
  .tag{font-family:var(--mono); font-size:var(--fs-7); padding:2px 6px; border-radius:var(--r-sm); background:var(--panel); border:1px solid var(--line); color:var(--ink-2);}

  .inspector{display:flex; flex-direction:column; gap:11px; position:sticky; top:70px;}
  @media (max-width:1000px){ .inspector{position:static;} }
  .ins{background:var(--panel); border:1px solid var(--line); border-radius:var(--r-md); padding:14px 15px; display:flex; flex-direction:column; gap:11px;}
  .ins h4{font-family:var(--mono); font-size:var(--fs-7); letter-spacing:var(--ls-cap); text-transform:uppercase; color:var(--muted); font-weight:var(--w-md);}
  .kv{display:flex; flex-direction:column; gap:7px;}
  .kv > div{display:flex; justify-content:space-between; gap:10px; font-size:var(--fs-5);}
  .kv .k{color:var(--muted); flex:none;}
  .kv .v{text-align:right; font-weight:var(--w-md);}
  .toc{display:flex; flex-direction:column; gap:4px;}
  .toc a, .toc button{text-align:left; font-size:var(--fs-5); color:var(--ink-2); padding:3px 0; line-height:1.4;}
  .toc a:hover, .toc button:hover{color:var(--accent);}
  .toc .none{font-size:var(--fs-5); color:var(--muted);}
  .acts{display:flex; flex-direction:column; gap:7px;}
  .acts .btn, .acts .btn2{width:100%;}

  /* админка */
  .tw{overflow-x:auto; border:1px solid var(--line); border-radius:var(--r-md); background:var(--panel);}
  .tw table{border-collapse:collapse; width:100%; min-width:700px; font-size:var(--fs-5);}
  .tw th, .tw td{text-align:left; padding:10px 14px; border-bottom:1px solid var(--line-soft); vertical-align:middle;}
  .tw tr:last-child td{border-bottom:0;}
  .tw th{font-family:var(--mono); font-size:var(--fs-7); letter-spacing:var(--ls-cap); text-transform:uppercase; color:var(--muted); background:var(--panel-2); font-weight:var(--w-md);}
  .tw td.m{font-family:var(--mono); font-size:var(--fs-5); white-space:nowrap;}
  .tw tbody tr:hover{background:var(--panel-2);}
  .log{display:flex; flex-direction:column;}
  .lrow{display:grid; grid-template-columns:118px 1fr; gap:12px; padding:8px 14px; border-bottom:1px solid var(--line-soft); font-size:var(--fs-5);}
  .lrow:last-child{border-bottom:0;}
  .lrow .tm{font-family:var(--mono); font-size:var(--fs-6); color:var(--muted);}

  /* Формальные таблицы на лендинге — уже, чем в админке */
  .tw.slim table{min-width:420px;}
  .tw.slim th{white-space:nowrap;}

  .letter{background:var(--sunk); border:1px solid var(--line-soft); border-radius:var(--r-md); padding:16px 17px; display:flex; flex-direction:column; gap:11px; font-size:var(--fs-4); color:var(--ink-2);}
  .letter.gap{margin-top:10px;}
  .letter .subj{font-family:var(--mono); font-size:var(--fs-6); color:var(--muted); padding-bottom:9px; border-bottom:1px solid var(--line-soft);}
  .letter .keybox{font-family:var(--mono); font-size:var(--fs-3); letter-spacing:.16em; color:var(--accent); text-align:center; padding:13px; background:var(--panel); border:1px dashed var(--accent-line); border-radius:var(--r-md);}

  /* отказ по ключу */
  .denied{max-width:470px; margin:0 auto; padding:90px 22px; display:flex; flex-direction:column; gap:16px; align-items:flex-start;}

  /* ── Карточки и строки — это ссылки, но выглядеть должны как карточки.
        Без этого они наследуют цвет и подчёркивание от a{}. ── */
  a.fcard, a.wrow, a.ni, a.brand, a.svc-i, a.case{color:inherit;}
  a.fcard:hover, a.wrow:hover, a.ni:hover, a.brand:hover{text-decoration:none;}
  a.fcard .nm, a.wrow .t{color:var(--ink);}
  a.ni.sel{color:var(--accent);}

  /* ── Возврат назад: явная ссылка рядом с хлебными крошками ── */
  .back{display:inline-flex; align-items:center; gap:7px; font-size:var(--fs-5); color:var(--ink-2);}
  .back:hover{color:var(--accent); text-decoration:none;}
  .crumbs a{color:var(--muted);}
  .crumbs a:hover{color:var(--accent);}

  /* ── Кнопка «наверх» на длинных страницах ── */
  .up-btn{
    position:fixed; right:18px; bottom:18px; z-index:50;
    width:40px; height:40px; border-radius:var(--r-md); display:grid; place-items:center;
    background:var(--panel); border:1px solid var(--line); color:var(--ink-2);
    box-shadow:var(--shadow); opacity:0; pointer-events:none; transition:opacity .2s ease;
    text-decoration:none;
  }
  .up-btn.on{opacity:1; pointer-events:auto;}
  .up-btn:hover{border-color:var(--accent-line); color:var(--accent); text-decoration:none;}

  /* ── Вопросы-ответы ── */
  .rows details summary{list-style:none; display:flex; align-items:center; gap:10px;}
  .rows details summary::-webkit-details-marker{display:none;}
  .rows details summary::after{content:"+"; margin-left:auto; color:var(--muted); font-family:var(--mono); font-size:var(--fs-3);}
  .rows details[open] summary::after{content:"–";}
  .rows details[open] summary{color:var(--accent);}
  .rows details:last-child{border-bottom:0 !important;}

  /* ── Лендинг-портфолио: карточка исполнителя и проекты ── */
  .who-card{display:grid; grid-template-columns:auto 1fr; gap:26px; align-items:center;}
  @media (max-width:760px){ .who-card{grid-template-columns:1fr;} }
  .photo{width:190px; height:190px; border-radius:var(--r-lg); object-fit:cover; border:1px solid var(--line); display:block;}
  .photo.sm{width:120px; height:120px;}

  .proj{background:var(--panel); border:1px solid var(--line); border-radius:var(--r-md); padding:19px 20px; display:flex; flex-direction:column; gap:11px; box-shadow:var(--shadow);}
  .proj .head-row{display:flex; align-items:baseline; justify-content:space-between; gap:12px; flex-wrap:wrap;}
  .proj .t{font-size:var(--fs-3); font-weight:var(--w-md); color:var(--ink);}
  .proj dl{margin:0; display:grid; grid-template-columns:auto 1fr; gap:6px 14px; font-size:var(--fs-4);}
  .proj dt{font-family:var(--mono); font-size:var(--fs-7); letter-spacing:var(--ls-cap); text-transform:uppercase; color:var(--muted); padding-top:4px;}
  .proj dd{margin:0; color:var(--ink-2); line-height:1.55;}
  .proj .res{color:var(--ok); font-weight:var(--w-md);}

  .reqs{display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:0; border:1px solid var(--line); border-radius:var(--r-md); background:var(--panel); overflow:hidden;}
  .req{padding:14px 17px; border-right:1px solid var(--line-soft); border-bottom:1px solid var(--line-soft); display:flex; flex-direction:column; gap:3px;}
  .req .k{font-family:var(--mono); font-size:var(--fs-7); letter-spacing:var(--ls-cap); text-transform:uppercase; color:var(--muted);}
  .req .v{font-size:var(--fs-4); color:var(--ink);}
  .req .v.m{font-family:var(--mono); font-size:var(--fs-5);}

  /* ── Полоса входа для заказчиков.
        Стоит выше всего остального и намеренно не синяя: на странице синий —
        цвет обычных действий, а вход в кабинет должен читаться отдельно. ── */
  .gate-strip{
    display:flex; align-items:center; gap:14px; flex-wrap:wrap;
    margin:14px 0 0; padding:13px 18px;
    background:var(--panel); border:1px solid var(--line);
    border-left:3px solid var(--ok); border-radius:var(--r-md); box-shadow:var(--shadow);
  }
  .gate-strip .txt{display:flex; flex-direction:column; gap:2px; flex:1; min-width:230px;}
  .gate-strip .t{font-size:var(--fs-4); font-weight:var(--w-md); color:var(--ink);}
  .gate-strip .s{font-size:var(--fs-5); color:var(--muted);}
  .btn-key{
    display:inline-flex; align-items:center; justify-content:center; gap:9px;
    padding:12px 20px; border-radius:var(--r-md); font-size:var(--fs-4); font-weight:var(--w-md);
    background:var(--ok); color:var(--bg); border:1px solid var(--ok);
    transition:filter .14s ease; white-space:nowrap;
  }
  .btn-key:hover{filter:brightness(1.08); text-decoration:none; color:var(--bg);}
  .btn-key.sm{padding:8px 14px; font-size:var(--fs-5);}

  /* ── Список разборов ── */
  .linklist{display:flex; flex-direction:column; gap:1px;}
  .linklist a{
    display:grid; grid-template-columns:1fr auto; gap:12px; align-items:baseline;
    padding:8px 10px; border-radius:var(--r-sm); color:var(--ink-2); font-size:var(--fs-4); line-height:1.45;
  }
  .linklist a:hover{background:var(--panel-2); color:var(--accent); text-decoration:none;}
  .linklist a .d{font-family:var(--mono); font-size:var(--fs-6); color:var(--muted); white-space:nowrap;}

  /* ══════════ доработки визуала (24.07.2026) ══════════
     Аддитивно, на существующих токенах. См. plans/2026-07-24-визуал.md. */

  /* таблицы задачи: зебра и подсветка строки под курсором */
  .dtable tbody tr{transition:background .12s ease;}
  .dtable tbody tr:nth-child(even){background:color-mix(in srgb, var(--panel-2) 55%, transparent);}
  .dtable tbody tr:hover{background:var(--accent-soft);}

  /* врезки: значок тона — важность считывается мгновенно и переживает ч/б-печать */
  .note .t{display:flex; align-items:center; gap:9px;}
  .note .t::before{
    content:"i"; flex:none; width:18px; height:18px; border-radius:50%;
    display:grid; place-items:center; font-family:var(--mono); font-size:var(--fs-6); font-weight:var(--w-bd); line-height:1;
    color:var(--accent); background:var(--accent-soft); border:1px solid var(--accent-line);
  }
  .note.warn .t::before{content:"!"; color:var(--warn); background:color-mix(in srgb,var(--warn) 14%,transparent); border-color:color-mix(in srgb,var(--warn) 45%,transparent);}
  .note.crit .t::before{content:"\00D7"; color:var(--crit); background:color-mix(in srgb,var(--crit) 14%,transparent); border-color:color-mix(in srgb,var(--crit) 45%,transparent);}

  /* разделы внутри задачи: волосяная линия отбивает раздел от предыдущего */
  .reader-in .dsec-h{padding-top:15px; border-top:1px solid var(--line-soft); scroll-margin-top:74px;}
  .reader-in .dhead + .dsec-h{border-top:0; padding-top:0;}

  /* полоса прогресса чтения */
  .reader-prog{height:3px; background:var(--line-soft);}
  .reader-prog i{display:block; height:100%; width:0; background:linear-gradient(90deg, var(--accent), var(--accent-2)); transition:width .1s linear;}

  /* оглавление задачи: номер и подсветка текущего раздела */
  .toc a .ix{font-family:var(--mono); font-size:var(--fs-7); color:var(--muted); margin-right:8px;}
  .toc a.on{color:var(--accent);}
  .toc a.on .ix{color:var(--accent);}

  /* сводка: список задач, которым нужно ваше внимание */
  .attention{display:flex; flex-direction:column; gap:1px; background:var(--panel); border:1px solid var(--line); border-left:2px solid var(--warn); border-radius:var(--r-md); overflow:hidden;}
  .attention .cap{display:flex; align-items:center; gap:9px; padding:10px 15px; border-bottom:1px solid var(--line-soft); font-family:var(--mono); font-size:var(--fs-7); letter-spacing:var(--ls-cap); text-transform:uppercase; color:var(--muted);}
  a.arow{display:grid; grid-template-columns:auto 1fr auto; gap:12px; align-items:center; padding:11px 15px; border-bottom:1px solid var(--line-soft); color:inherit;}
  a.arow:last-child{border-bottom:0;}
  a.arow:hover{background:var(--panel-2); text-decoration:none;}
  .arow .t{font-size:var(--fs-4); font-weight:var(--w-md); color:var(--ink);}
  .arow .s{display:block; font-size:var(--fs-5); color:var(--muted); margin-top:1px;}

  /* карточки разделов: точки-статусы задач */
  .statedots{display:inline-flex; gap:4px; margin-left:auto;}
  .statedots i{width:7px; height:7px; border-radius:50%; display:inline-block;}
  .sd-ok{background:var(--ok);} .sd-att{background:var(--warn);} .sd-wip{background:var(--accent);}

  /* ══════════ график: сравнение полосами ══════════
     Полосы считает сервер, здесь только рисование. Ни скриптов, ни картинок —
     значит работает и на печати, и в выгруженном файле задачи. */
  .dchart{margin:0; display:flex; flex-direction:column; gap:11px;}
  .dchart-t{font-size:var(--fs-4); font-weight:var(--w-md); color:var(--ink);}
  .dchart-rows{display:flex; flex-direction:column; gap:7px;}
  .dbar{display:grid; grid-template-columns:minmax(96px,26%) 1fr auto; gap:12px; align-items:center;}
  .dbar .lb{font-size:var(--fs-5); color:var(--ink-2); line-height:1.35;}
  .dbar .tr{background:var(--sunk); border:1px solid var(--line-soft); border-radius:var(--r-sm); height:20px; overflow:hidden;}
  .dbar .fl{
    display:block; height:100%; background:var(--accent); border-radius:3px 0 0 3px;
    print-color-adjust:exact; -webkit-print-color-adjust:exact;
  }
  .dbar .fl.ok{background:var(--ok);}
  .dbar .fl.att{background:var(--warn);}
  .dbar .fl.crit{background:var(--crit);}
  .dbar .vl{font-family:var(--mono); font-size:var(--fs-6); color:var(--ink); white-space:nowrap; text-align:right; min-width:64px;}
  @media (max-width:560px){
    .dbar{grid-template-columns:1fr auto; row-gap:4px;}
    .dbar .tr{grid-column:1 / -1; grid-row:2;}
  }

  /* ══════════ схема: узлы со стрелками ══════════ */
  .dflow{display:flex; flex-direction:column; gap:11px;}
  .dflow-line{display:flex; align-items:stretch; gap:10px; flex-wrap:wrap;}
  .fnode{
    flex:1 1 150px; min-width:0; display:flex; flex-direction:column; gap:3px;
    background:var(--sunk); border:1px solid var(--line-soft); border-radius:var(--r-md);
    padding:12px 13px;
  }
  .fnode .t{font-size:var(--fs-5); font-weight:var(--w-md); color:var(--ink);}
  .fnode .s{font-family:var(--mono); font-size:var(--fs-6); color:var(--accent); word-break:break-word;}
  .fnode .x{font-size:var(--fs-5); color:var(--muted); line-height:1.4;}
  .farr{
    align-self:center; flex:none; font-size:var(--fs-3); color:var(--accent);
    line-height:1; user-select:none;
  }
  @media (max-width:560px){
    .dflow-line{flex-direction:column;}
    .farr{align-self:flex-start; margin-left:16px; transform:rotate(90deg);}
  }

  /* ══════════ раскладки вместо инлайновых стилей ══════════
     Раньше эти правила были расписаны прямо в шаблонах атрибутом style=
     (70 штук). Теперь живут здесь — по правилу «правки в стилях, не в разметке». */

  .mt6{margin-top:6px;}
  .mt16{margin-top:16px;}
  .mb6{margin-bottom:6px;}
  .cards-wide{grid-template-columns:repeat(auto-fit,minmax(320px,1fr));}

  /* полоса призыва: текст слева, кнопки или врезка справа */
  .cta-band.top{align-items:flex-start;}
  .cta-band .col-text{max-width:56ch;}
  .cta-band .col-text.narrow{max-width:52ch;}
  .cta-band h3{margin-top:8px;}

  /* вопросы-ответы на лендинге */
  .rows details{border-bottom:1px solid var(--line-soft);}
  .rows details summary{padding:15px 18px; cursor:pointer; font-size:var(--fs-4); font-weight:var(--w-md);}
  .rows details p{padding:0 18px 16px; font-size:var(--fs-4); color:var(--ink-2); max-width:74ch;}

  /* экран отказа и ошибки */
  .denied h2{font-size:var(--fs-2); font-weight:var(--w-bd);}
  .denied p{color:var(--ink-2); font-size:var(--fs-4);}
  .denied .acts-row{display:flex; gap:10px; flex-wrap:wrap;}

  /* админка: форма выдачи ключа и мелочи */
  .keyform{padding:16px; display:flex; flex-direction:column; gap:12px;}
  .keyform .fields{display:flex; gap:12px; flex-wrap:wrap; align-items:flex-end;}
  .keyform label{display:flex; flex-direction:column; gap:6px;}
  .search.w240{width:240px;} .search.w220{width:220px;} .search.w160{width:160px;}
  .letter .sign{color:var(--muted); font-size:var(--fs-5);}
  .mini{font-size:var(--fs-6); color:var(--muted);}
  .chip.ml{margin-left:6px;}

  /* ══════════ печать задачи ══════════
     Задача из блоков рисуется порталом, поэтому печать заменяет прежнее
     «переслать файл письмом»: на бумагу уходит только сам документ. */
  @media print{
    :root{
      --bg:#FFFFFF; --bg-2:#FFFFFF; --panel:#FFFFFF; --panel-2:#F6F8FC; --sunk:#F4F6FA;
      --line:#C9D0DC; --line-soft:#DDE2EA;
      --ink:#0E121A; --ink-2:#2B3242; --muted:#5A6478;
      --accent:#2C3BAA; --accent-soft:rgba(44,59,170,.08); --accent-line:rgba(44,59,170,.3);
      --ok:#12784F; --warn:#8C5A0C; --crit:#C4302F;
      --shadow:none; --shadow-lift:none;
      color-scheme:light;
    }
    .rail, .bar, .inspector, .crumbs, .up-btn, .reader-bar, .reader-prog{display:none !important;}
    .shell{display:block;}
    .doc{display:block;}
    .body{padding:0;}
    .main{display:block;}
    .reader{border:0;}
    .reader-in{padding:0;}
    .dsec, .dtable, .note, .fstep, .node, .dg, .dchart, .dflow{break-inside:avoid;}
    a{color:inherit; text-decoration:none;}
  }