/* ═══════════════════════════════════════════════════════════════════════════
   Doxx — единая система интерфейса. Один лист на весь сайт.
   Значения не выбраны на глаз, а сняты замерами с живых страниц отрасли:
     teardown/{apnewsroom,reuters,stripe,linear}/out/probe.json  (29.08.2026)

   AP Newsroom и Reuters Agency — прямые аналоги по продукту:
     белая основа · радиус 2–3px · заголовки веса 700 · корпус 14px ·
     ровно один насыщенный акцент · линейка 2px акцентом вместо плашки ·
     тёмный подвал колонками · ноль канвасов и шейдеров
   Stripe — механика органов управления:
     кнопка r4, высота 40 и 48, падинг 20 и 24; волосяная #E5EDF5;
     контейнер 1232 внутри 1440; трекинг −0.02em на крупном кегле
   Linear — плотность и границы:
     граница низкой альфы вместо тени; корпус 15/24; ls −0.022em у дисплея

   Классы сохранены прежние (mast, net, tier, field, st-*) — страницы
   переодеваются без правки разметки.
   ═══════════════════════════════════════════════════════════════════════════ */

:root{
  --bg:#FFFFFF; --soft:#F6F9FC; --sunken:#EEF2F6;
  --ink:#0A2540; --ink-2:#425466; --ink-3:#697386; --ink-4:#8792A2;
  --line:#E5EDF5; --line-2:#D6DEE8;
  --accent:#005EC7; --accent-ink:#004AA0; --accent-soft:#E4EEFA; --on-accent:#FFFFFF;
  --danger:#AB3300; --danger-soft:#FBEAE4;
  --ok:#0E6245; --ok-soft:#DCF3E9;
  --warn:#8A5A00; --warn-soft:#FBF0DC;
  --sky:#0A2540;

  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:20px; --s6:24px;
  --s8:32px; --s10:40px; --s12:48px; --s16:64px; --s20:80px; --s24:96px;
  --r:4px; --r-sm:2px; --r-lg:6px;
  --container:1232px; --reading:44em;

  --font:Archivo,"Söhne","Helvetica Neue",Helvetica,Arial,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,Consolas,monospace;
  --ease:cubic-bezier(.23,1,.32,1);
  --pop:0 16px 32px rgba(50,50,93,.12),0 4px 12px rgba(0,0,0,.08);

  /* Переключатель языков берёт свои цвета отсюда, если они есть. */
  --n18-bg:#fff; --n18-line:#D6DEE8; --n18-line-strong:#8792A2;
  --n18-ink:#425466; --n18-ink-strong:#0A2540; --n18-hover:#F6F9FC; --n18-accent:#005EC7;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#08090A; --soft:#0F1011; --sunken:#141517;
  --ink:#F7F8F8; --ink-2:#D0D6E0; --ink-3:#8A8F98; --ink-4:#62666D;
  --line:rgba(255,255,255,.08); --line-2:rgba(255,255,255,.14);
  --accent:#5CA4FF; --accent-ink:#8FC0FF; --accent-soft:#0E2036; --on-accent:#08090A;
  --danger:#E0785F; --danger-soft:#2A1712;
  --ok:#4FBF8F; --ok-soft:#0F2419;
  --warn:#D8A245; --warn-soft:#251C0B;
  --sky:#05070A;
  --pop:0 0 0 1px rgba(255,255,255,.10),0 16px 32px rgba(0,0,0,.55);
  --n18-bg:#0F1011; --n18-line:rgba(255,255,255,.16); --n18-line-strong:#62666D;
  --n18-ink:#D0D6E0; --n18-ink-strong:#F7F8F8; --n18-hover:rgba(255,255,255,.07); --n18-accent:#5CA4FF;
}}
:root[data-theme="dark"]{
  --bg:#08090A; --soft:#0F1011; --sunken:#141517;
  --ink:#F7F8F8; --ink-2:#D0D6E0; --ink-3:#8A8F98; --ink-4:#62666D;
  --line:rgba(255,255,255,.08); --line-2:rgba(255,255,255,.14);
  --accent:#5CA4FF; --accent-ink:#8FC0FF; --accent-soft:#0E2036; --on-accent:#08090A;
  --danger:#E0785F; --danger-soft:#2A1712;
  --ok:#4FBF8F; --ok-soft:#0F2419;
  --warn:#D8A245; --warn-soft:#251C0B;
  --sky:#05070A;
  --pop:0 0 0 1px rgba(255,255,255,.10),0 16px 32px rgba(0,0,0,.55);
  --n18-bg:#0F1011; --n18-line:rgba(255,255,255,.16); --n18-line-strong:#62666D;
  --n18-ink:#D0D6E0; --n18-ink-strong:#F7F8F8; --n18-hover:rgba(255,255,255,.07); --n18-accent:#5CA4FF;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);
     font-size:14px;line-height:1.6;
     -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
::selection{background:var(--accent-soft);color:var(--ink)}
img,svg{max-width:100%}
a{color:var(--accent);text-underline-offset:2px}
a:hover{color:var(--accent-ink)}
:where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{
  outline:none;box-shadow:0 0 0 2px var(--bg),0 0 0 4px var(--accent)}
hr{border:0;border-top:1px solid var(--line);margin:var(--s8) 0}

/* ── типографика: разрыв дисплея и корпуса как у AP (64 против 14) ── */
h1,h2,h3,h4,h5{margin:0;font-weight:700;letter-spacing:-.021em;line-height:1.12;text-wrap:balance}
h1{font-size:clamp(32px,4.6vw,52px);line-height:1.06;margin:0 0 var(--s5)}
h2{font-size:clamp(23px,2.7vw,30px);letter-spacing:-.02em;margin:var(--s16) 0 var(--s4)}
h3{font-size:19px;line-height:1.28;letter-spacing:-.014em;margin:var(--s8) 0 var(--s3)}
h4{font-size:16px;line-height:1.4;letter-spacing:-.008em;margin:var(--s6) 0 var(--s2)}
p{margin:0 0 var(--s3);max-width:var(--reading);text-wrap:pretty}
ul,ol{margin:0 0 var(--s4);padding-left:var(--s5);max-width:var(--reading)}
li{margin-bottom:var(--s2)}
li::marker{color:var(--accent)}
b,strong{font-weight:600}
small{font-size:13px}
.lede{font-size:18px;line-height:1.55;color:var(--ink-2);max-width:46em}
.fine{font-size:13px;color:var(--ink-3)}
.num{font-variant-numeric:tabular-nums}
.mono,code,kbd{font-family:var(--mono);font-size:.86em}
code{background:var(--sunken);padding:2px 5px;border-radius:var(--r-sm);color:var(--ink-2)}
.eyebrow{font-size:11px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;
         color:var(--accent);margin:0 0 var(--s2)}

/* ── шапка: у AP статичная, уезжает со страницей ── */
.mast{display:flex;align-items:center;gap:var(--s5);flex-wrap:wrap;
      max-width:var(--container);margin:0 auto;padding:var(--s4) var(--s6);
      border-bottom:1px solid var(--line)}
.mast .logo{display:inline-flex;align-items:center;line-height:0;text-decoration:none}
.mast .logo img{display:block;height:28px;width:auto}
/* Логотип у нас один — чернильный. На тёмном полотне он почти не виден, а
   держать вторую картинку и переключать её разметкой на пятнадцати страницах
   дороже, чем инвертировать монохромное начертание. */
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .mast .logo img{filter:invert(1)}}
:root[data-theme="dark"] .mast .logo img{filter:invert(1)}
.langs,.net-tabs{display:flex;align-items:center;gap:var(--s4);margin-left:auto;flex-wrap:wrap}
.net-tab{font-size:14px;font-weight:500;color:var(--ink-2);text-decoration:none;
         padding:6px 0;white-space:nowrap}
.net-tab:hover{color:var(--ink)}
/* Активный подчёркнут линейкой 2px акцентом — приём Reuters (26 применений). */
.net-tab.is-active,.net-tab[aria-current]{color:var(--ink);box-shadow:inset 0 -2px 0 var(--accent)}
.net-tab-lang{display:inline-flex;align-items:center}
/* .acct — ссылка «Войти» в шапке провода и служебные ссылки в аккаунте.
   Раньше это имя стояло ещё и среди контейнеров полосы, и ссылка получала
   падинги страницы. Имя одно, смысл один: ссылка. */
.acct{font-size:13.5px;font-weight:500;color:var(--ink-2);text-decoration:none;
      font-family:var(--font);white-space:nowrap}
.acct:hover{color:var(--ink)}

/* ── полосы страницы ── */
.net,.desk,.wire,.sheet{max-width:var(--container);margin:0 auto;padding:var(--s12) var(--s6) var(--s24)}
.net-wide{max-width:var(--container);margin:0 auto;padding:0 var(--s6)}
.net > h1:first-child,.sheet > h1:first-child{margin-top:0}

/* ── кнопки: Stripe r4, высоты 40 и 48, падинги 20 и 24 ── */
.btn,.btn-quiet{display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);
  min-height:40px;padding:9px var(--s5);text-align:center;border-radius:var(--r);font-family:var(--font);
  font-size:14px;font-weight:600;line-height:1;text-decoration:none;cursor:pointer;
  border:1px solid transparent;transition:background .12s var(--ease),transform .12s var(--ease)}
.btn{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.btn:hover{background:var(--accent-ink);border-color:var(--accent-ink);color:var(--on-accent)}
.btn:active,.btn-quiet:active{transform:scale(.98)}
.btn-quiet{background:transparent;color:var(--ink);border-color:var(--line-2)}
.btn-quiet:hover{background:var(--soft);border-color:var(--ink-4);color:var(--ink)}
.btn-lg{min-height:48px;padding:13px var(--s6);font-size:15px}
.btn[disabled],.btn-quiet[disabled],button[disabled]{opacity:.45;cursor:default;transform:none}
button.btn,button.btn-quiet{font:inherit;font-size:14px;font-weight:600}

/* ── формы: подпись обязательна, поле не ниже 40, кегль 16 против зума iOS ── */
.field{margin:0 0 var(--s4);max-width:var(--reading)}
.field label,.field > .t{display:block;font-size:13px;font-weight:600;color:var(--ink);
                         margin-bottom:var(--s1)}
.field input,.field select,.field textarea{
  width:100%;min-height:40px;font-family:var(--font);font-size:16px;padding:9px var(--s3);
  color:var(--ink);background:var(--bg);border:1px solid var(--line-2);border-radius:var(--r)}
.field textarea{min-height:96px;line-height:1.5}
.field input:hover,.field select:hover,.field textarea:hover{border-color:var(--ink-4)}
.field .hint,.field .m{display:block;font-size:13px;color:var(--ink-3);margin-top:var(--s1)}
.field .err{display:block;font-size:13px;color:var(--danger);font-weight:600;margin-bottom:var(--s1)}
.field.is-invalid input,.field.is-invalid textarea{border-color:var(--danger)}
.check{display:flex;align-items:flex-start;gap:var(--s2);margin:0 0 var(--s3);
       font-size:14px;max-width:var(--reading)}
.check input{width:16px;height:16px;min-height:0;margin:3px 0 0;flex:0 0 auto}
fieldset{border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--s5);margin:0 0 var(--s5)}
legend{font-size:13px;font-weight:600;padding:0 var(--s2);color:var(--ink-2)}

/* ── таблицы: мелкий служебный регистр и волосяные линейки ── */
.tabwrap{overflow-x:auto;margin:var(--s4) 0 var(--s6);
         border:1px solid var(--line);border-radius:var(--r-lg)}
table{border-collapse:collapse;width:100%;font-size:14px;background:var(--bg)}
.tabwrap table{border:0}
th{font-size:11px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;text-align:left;
   color:var(--ink-3);padding:var(--s3);border-bottom:1px solid var(--line-2);white-space:nowrap}
td{padding:var(--s3);border-bottom:1px solid var(--line);vertical-align:top}
tr:last-child td{border-bottom:none}
td.num,th.num{font-variant-numeric:tabular-nums;white-space:nowrap}

/* ── состояния: цвет + слово, никогда только цвет ── */
.st{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:600;
    letter-spacing:.05em;text-transform:uppercase;padding:3px 7px;border-radius:var(--r-sm);
    background:var(--sunken);color:var(--ink-3);white-space:nowrap}
.st-ok{background:var(--ok-soft);color:var(--ok)}
.st-warn{background:var(--warn-soft);color:var(--warn)}
.st-bad{background:var(--danger-soft);color:var(--danger)}
.st-mut{background:var(--sunken);color:var(--ink-3)}

/* ── блоки ── */
.card,.row-card,.tier,.paybox,.img-cand{border:1px solid var(--line);border-radius:var(--r-lg);
  background:var(--bg);padding:var(--s5)}
.row-card{margin:0 0 var(--s3)}
.row-card .t{font-size:16px;font-weight:600;letter-spacing:-.01em;margin:0 0 var(--s1)}
.row-card .m{font-size:13px;color:var(--ink-3)}
.tiers{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:var(--s4);
       margin:var(--s6) 0;max-width:none}
.tier{display:flex;flex-direction:column}
.tier .nm{font-size:16px;font-weight:600;letter-spacing:-.01em;margin:0 0 var(--s1)}
.tier .pr{font-size:30px;font-weight:700;letter-spacing:-.024em;line-height:1;
          font-variant-numeric:tabular-nums;margin:0 0 var(--s3)}
.tier ul{margin:0;padding-left:var(--s5);font-size:13.5px;color:var(--ink-2)}
.tier li{margin-bottom:5px}

.notice,.foot-note{border-left:2px solid var(--accent);background:var(--soft);
  padding:var(--s4) var(--s5);border-radius:0 var(--r) var(--r) 0;margin:var(--s5) 0;
  font-size:14px;max-width:48em}
.notice-warn{border-left-color:var(--warn);background:var(--warn-soft)}
.notice-err{border-left-color:var(--danger);background:var(--danger-soft)}
.notice-ok{border-left-color:var(--ok);background:var(--ok-soft)}

.pkg-html{max-width:var(--reading);font-size:15px;line-height:1.65}
.pkg-html h2,.pkg-html h3{margin-top:var(--s6)}
.img-cands{display:grid;grid-template-columns:repeat(auto-fill,minmax(268px,1fr));gap:var(--s3)}
.img-cand{padding:var(--s3)}
.img-cand .lic{display:block;font-size:12px;color:var(--ink-3);margin-top:var(--s2)}
.packrow{display:flex;flex-wrap:wrap;gap:var(--s2)}
.ph{color:var(--ink-4)}
.trm{font-size:13px;color:var(--ink-3)}

/* ── подвал: тёмный, колонками — приём AP ── */
/* Фон подвала — всегда тёмно-синий, а не var(--ink): в тёмной теме «чернила»
   становятся почти белыми, и подвал превращался в белую полосу с белыми
   ссылками (найдено 04.09.2026 на /auth/ и /legal/). */
.foot{background:#0A2540;color:#fff;margin-top:var(--s24)}
.foot a{color:rgba(255,255,255,.85)}
.foot a:hover{color:#fff}
.foot .foot-note{border-left-color:rgba(255,255,255,.35);background:rgba(255,255,255,.06);color:rgba(255,255,255,.85)}
.foot-in{max-width:var(--container);margin:0 auto;padding:var(--s12) var(--s6);
         display:grid;grid-template-columns:repeat(auto-fit,minmax(165px,1fr));gap:var(--s8)}
.foot-in h4{font-size:11px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;
            color:rgba(255,255,255,.55);margin:0 0 var(--s3)}
.foot-in a{display:block;text-decoration:none;font-size:14px;margin-bottom:var(--s2)}
.foot-in a:hover{text-decoration:underline}
.foot-legal{max-width:var(--container);margin:0 auto;padding:var(--s5) var(--s6);
            border-top:1px solid rgba(255,255,255,.12);font-size:12.5px;color:rgba(255,255,255,.55);
            display:flex;flex-wrap:wrap;gap:var(--s2) var(--s6)}

/* Подвал вне тёмной полосы (страницы, где .foot стоит просто внизу текста). */
.net > .foot,.sheet > .foot,.desk > .foot{background:none;color:var(--ink-3);
  margin-top:var(--s16);padding-top:var(--s5);border-top:1px solid var(--line);
  display:flex;flex-wrap:wrap;gap:var(--s2) var(--s6);font-size:13px}
.net > .foot a,.sheet > .foot a,.desk > .foot a{color:var(--ink-3)}

/* ── провод-агрегатор ── */
.topics{border-bottom:1px solid var(--line)}
.topics-track{display:flex;gap:var(--s4);overflow-x:auto;max-width:var(--container);
              margin:0 auto;padding:var(--s3) var(--s6)}
.fresh{position:fixed;left:50%;transform:translateX(-50%);bottom:var(--s6);z-index:50}

.sky-panel{background:var(--sky);border-radius:var(--r-lg);padding:var(--s3);overflow:hidden}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
         clip:rect(0,0,0,0);white-space:nowrap;border:0}
.noscript{padding:var(--s4) var(--s6);background:var(--warn-soft);color:var(--warn);font-size:14px}

@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
@media (max-width:640px){
  .mast,.net,.desk,.wire,.sheet,.net-wide,.foot-in,.foot-legal,.topics-track{
    padding-left:var(--s4);padding-right:var(--s4)}
  .net,.desk,.wire,.sheet{padding-top:var(--s8)}
  .langs,.net-tabs{gap:var(--s3);width:100%;margin-left:0}
}