/* Грузовая Сводка — мини-приложение. Стиль карточек — из render.py (страница выпуска),
   палитра — фирменная ВебВерфи из kartinka.py. Тема мессенджера НЕ используется (грабля §7:
   MAX отдаёт переменные темы неверно, получался чёрный на чёрном). */
:root{
  color-scheme:dark;
  --navy:#223240; --dark:#17212B; --orange:#D98A34; --orange-lt:#E8A04E; --light:#F2F4F6;
  --grey:#8FA0AE; --panel:#1E2A33; --line:#2C3A45;
  --bg:#131B23; --surface:var(--panel); --surface-2:var(--navy); --ink:var(--light); --muted:var(--grey);
  --signal:var(--orange-lt); --signal-soft:#36271A; --good:#63BE8C; --good-soft:#18302A;
  --bad:#E07A6B; --top:var(--dark); --tag-ink:#B9CAD8; --tag-bg:var(--navy); --chip-on-ink:var(--dark);
  --gut:clamp(14px,3.4vw,44px);
  --ico-duo:#E8A04E; --ico-duo-o:.38;   /* подложка иконок набора «Двухцветный» (icons.svg v2) */
  --f:"Manrope",-apple-system,"Segoe UI",system-ui,sans-serif;
}
/* Светлая тема — только выбором читателя (Настройки → Оформление), не от мессенджера (грабля §7) */
:root[data-theme="light"]{
  color-scheme:light;
  --bg:#E8ECEF; --surface:#FFFFFF; --surface-2:#F2F4F6; --ink:#17212B; --muted:#5B6B78; --line:#D3DAE0;
  --signal:#B8691B; --signal-soft:#FBEBD8; --good:#1F7A4D; --good-soft:#E3F3EA; --bad:#B8402F;
  --top:#F7F8FA; --ico-duo:#D98A34; --ico-duo-o:.32; --tag-ink:#3B4C5A; --tag-bg:#E4E9EE; --light:#17212B; --orange:#C9731F; --navy:#E4E9EE;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
h1,h2,h3{margin:0;text-wrap:balance}
a{color:inherit}
:focus-visible{outline:2px solid var(--signal);outline-offset:2px}
.hidden{display:none!important}

/* ── ЗАМОК ВЬЮПОРТА — перенесён из ВебПриёмки (webapp/style.css, 19.08.2026; чинили восемь раз).
   Документ не скроллится вовсе: body position:fixed, высота — --appvh из visualViewport (app.js:fitApp),
   не 100dvh (в webview MAX он больше видимого на величину панели хоста). Скроллится только main.
   Инвариант после любой правки высоты: scrollTop===0 && body.height===visualViewport.height. */
html,body{max-width:100%;overflow-x:hidden;overscroll-behavior-x:none}
html{height:100%;overflow:hidden;overscroll-behavior:none}
body{
  margin:0;width:100%;position:fixed;top:0;left:0;
  height:100vh;height:100dvh;height:var(--appvh,100dvh);
  display:flex;flex-direction:column;overflow:hidden;
  background:var(--bg);color:var(--ink);
  font:400 16px/1.55 var(--f);-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%;
}
#top{flex:0 0 auto;z-index:5;background:var(--top);border-bottom:1px solid var(--line)}
main{
  flex:1 1 auto;min-width:0;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;padding-bottom:calc(28px + env(safe-area-inset-bottom,0px));
}
.wrap{padding-inline:calc(var(--gut) + env(safe-area-inset-left,0px)) calc(var(--gut) + env(safe-area-inset-right,0px));width:100%}

/* ── шапка ── */
.mast{display:flex;align-items:center;gap:10px;padding:12px var(--gut) 11px}
.mast-t{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:2px 18px;flex:1;min-width:0}
.brand{font:800 clamp(19px,4.6vw,30px)/1.05 var(--f);text-transform:uppercase;letter-spacing:.01em}
.brand em{font-style:normal;color:var(--orange)}
.meta{font:600 12.5px/1.4 var(--f);color:var(--muted);letter-spacing:.04em;text-transform:uppercase;font-variant-numeric:tabular-nums}
.back{flex:none;background:var(--surface-2);color:var(--light);border:1px solid var(--line);border-radius:8px;
  font:700 15px/1 var(--f);padding:10px 12px;cursor:pointer;white-space:nowrap}
.back:active{background:var(--line)}
.tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;padding:0 var(--gut) 10px}
.tabs button{font:700 14px/1.1 var(--f);padding:8px 6px;border-radius:9px;border:1px solid var(--line);background:none;color:var(--muted);
  display:flex;align-items:center;justify-content:center;gap:7px;min-height:42px;cursor:pointer}
.tabs button .ico{width:20px;height:20px;flex:none}
.tabs button.on{background:var(--orange);border-color:var(--orange);color:var(--chip-on-ink)}
@media (max-width:420px){.tabs button{flex-direction:column;gap:3px;font-size:12px;padding:7px 2px}}

/* ── hero ── */
.hero{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:12px;margin-top:16px}
.box{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:16px 18px}
.hero .v{font:800 clamp(36px,8vw,62px)/1 var(--f);font-variant-numeric:tabular-nums;color:var(--orange);letter-spacing:-.01em}
.hero .c{font-size:17px;margin-top:8px}
.hero .s,.src{font:500 13px/1.4 var(--f);color:var(--muted)}
.hero .s{margin-top:8px}
.hero .side{display:flex;flex-direction:column;justify-content:center;gap:8px}
.lbl{font:700 11.5px/1.2 var(--f);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}

/* ── фильтры ── */
.filters{margin-top:16px;display:flex;flex-direction:column;gap:8px}
.frow{display:flex;flex-wrap:wrap;gap:7px;align-items:center}
.chip{display:inline-flex;align-items:center;gap:6px;text-decoration:none;font:700 14px/1 var(--f);padding:10px 13px;border-radius:999px;border:1px solid var(--line);
  background:var(--surface);color:var(--light);cursor:pointer;min-height:38px}
.chip .k{color:var(--muted);font-weight:600;margin-left:5px;font-variant-numeric:tabular-nums}
.chip.on{background:var(--orange);border-color:var(--orange);color:var(--chip-on-ink)}
.chip.on .k{color:var(--navy)}
.chip.all{background:none}
.chip.all.on{background:var(--ink);border-color:var(--ink);color:var(--bg)}
.fcount{font:600 13px/1.3 var(--f);color:var(--muted);margin-left:2px}

/* ── карточки (render.py: .card) ── */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,350px),1fr));gap:12px;align-items:start;margin-top:14px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:16px 18px 15px;
  display:flex;flex-direction:column;gap:9px;scroll-margin-top:12px;transition:border-color .3s,box-shadow .3s}
.card.hl{border-color:var(--orange);box-shadow:0 0 0 2px var(--orange)}
.card .hd{display:flex;gap:12px;align-items:flex-start}
.card .n{flex:none;display:inline-flex;align-items:center;gap:5px;font:700 14px/1 var(--f);color:var(--signal);background:var(--signal-soft);border-radius:5px;padding:7px 9px;font-variant-numeric:tabular-nums}
.card h3{font:700 18px/1.3 var(--f)}
.card p{margin:0}
.take{border-left:3px solid var(--good);padding:2px 0 2px 12px}
.take .lbl{display:block;color:var(--good);margin-bottom:3px}
.note{font-size:14px;color:var(--muted)}
.tags{display:flex;flex-wrap:wrap;gap:6px}
.tags span{font:700 11.5px/1 var(--f);padding:6px 8px;border-radius:4px;background:var(--tag-bg);color:var(--tag-ink);text-transform:uppercase;letter-spacing:.04em}
.links{display:flex;flex-wrap:wrap;gap:7px;margin-top:2px}
.links a{font:600 14px/1 var(--f);text-decoration:none;padding:11px 13px;border-radius:6px;background:var(--surface-2);border:1px solid var(--line);min-height:40px;display:inline-flex;align-items:center}
.links a::after{content:"\00a0↗";color:var(--muted)}
.empty{margin-top:14px;color:var(--muted)}

/* ── воскресный выпуск: экран с числами (render.py: .week) ── */
.week{margin-top:16px;background:var(--surface);border:1px solid var(--line);border-radius:10px;overflow:hidden}
/* flex с переносом, не grid: широкое число («12,3 тыс. шт.») или пояснение сжимали подпись в столбик по слову
   в строке (04.10.2026). Подписи не меньше 11em — иначе число уходит строкой ниже */
.week .r{display:flex;flex-wrap:wrap;column-gap:18px;row-gap:4px;padding:15px 18px;border-bottom:1px solid var(--line);align-items:baseline}
.week .l{font-size:16.5px;flex:1 1 11em;min-width:0}
.week .v{font:800 clamp(21px,3.6vw,29px)/1 var(--f);font-variant-numeric:tabular-nums;text-align:right;flex:none;margin-left:auto}
.week .d{font:600 13px/1.3 var(--f);color:var(--signal);flex:1 0 100%}   /* на всю ширину: во 2-й колонке длинное пояснение сжимало подпись в столбик (04.10.2026) */
.week .s{font:500 13px/1.3 var(--f);color:var(--muted);flex:1 0 100%;margin-top:2px}
.week .sum{background:var(--good-soft);padding:15px 18px;font-size:16.5px}
.week .sum .lbl{display:block;color:var(--good);margin-bottom:4px}

/* ── архив ── */
.arch{margin-top:26px;display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.arch label{font:700 14px/1.2 var(--f);color:var(--muted)}
/* Селект ≥16px: мельче — iOS зумит страницу при фокусе (грабля §6) */
.arch select{font:600 16px/1.2 var(--f);color:var(--light);background:var(--surface);border:1px solid var(--line);
  border-radius:8px;padding:10px 12px;min-height:44px;max-width:100%}

.foot{margin-top:26px;padding-top:14px;border-top:1px solid var(--line);color:var(--muted);font-size:14px}
/* Подвал — активная ссылка на вебверфь.рф (п. 2) */
.foot-brand{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;text-decoration:none;color:var(--ink);
  background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:12px 14px;min-height:48px}
.foot-brand .ico{width:28px;height:28px;color:var(--orange);flex:none}
.foot-brand span:nth-of-type(1){flex:1 1 220px}
.foot-brand b{color:var(--orange)}
.foot-brand .go{font-weight:700;color:var(--signal);white-space:nowrap}
.foot-brand:active{background:var(--surface-2)}
.foot-note{margin-top:10px}
.loading,.fail{margin-top:22px;color:var(--muted)}
.fail{background:var(--surface);border:1px solid var(--line);border-left:4px solid var(--orange);border-radius:0 10px 10px 0;padding:16px 18px;color:var(--light)}
.fail .src{margin-top:6px}
.fail button{margin-top:12px;font:700 16px/1 var(--f);padding:11px 14px;border-radius:8px;border:none;background:var(--orange);color:var(--dark)}

/* ── иконки ── */
.ico{width:18px;height:18px;flex:none;vertical-align:-3px;fill:none;stroke:currentColor}
.ico.big{width:48px;height:48px;color:var(--orange)}

/* ── серия дней ── */
.streak{flex:none;display:flex;align-items:center;gap:5px;font:600 12.5px/1.1 var(--f);color:var(--muted);
  background:var(--signal-soft);border-radius:999px;padding:7px 11px}
.streak .ico{color:var(--orange)}
.streak b{color:var(--signal);font-size:15px}
@media (max-width:560px){.streak span{display:none}}

/* ── появление карточек и тост (п. 19); без движения — если человек его отключил ── */
.card{opacity:0;transform:translateY(8px);transition:opacity .35s ease,transform .35s ease,border-color .3s,box-shadow .3s}
.card.shown{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.card{opacity:1;transform:none;transition:none}}
.toast{position:fixed;left:50%;bottom:calc(18px + env(safe-area-inset-bottom,0px));transform:translate(-50%,20px);opacity:0;
  background:var(--ink);color:var(--bg);font:600 15px/1.35 var(--f);padding:11px 16px;border-radius:10px;max-width:calc(100% - 32px);
  pointer-events:none;transition:opacity .25s,transform .25s;z-index:20;word-break:break-word}
.toast.on{opacity:1;transform:translate(-50%,0)}

/* ── карточка: закладка, «Для вас», бейджи, фото ── */
.card .hd h3{flex:1;min-width:0}
/* телефон: заголовок под строкой «номер · закладка» на всю ширину — между ними на 320–375px
   он сжимался до 140–200px, по слову в строке (04.10.2026, tools/svodka_layout_check.py) */
@media (max-width:480px){html:not(.web) .card .hd{flex-wrap:wrap;row-gap:10px}
  html:not(.web) .card .hd h3{order:3;flex-basis:100%}html:not(.web) .card .hd .save{margin-left:auto}}
.card .save{flex:none;background:none;border:1px solid var(--line);border-radius:8px;color:var(--muted);width:40px;height:40px;
  display:grid;place-items:center;cursor:pointer;margin:-4px -6px 0 0}
.card .save.on{color:var(--orange);border-color:var(--orange);background:var(--signal-soft)}
.card .save .ico{width:20px;height:20px}
.card.mine{border-color:color-mix(in srgb,var(--orange) 55%,var(--line))}
.mine-l{align-self:flex-start;font:700 11.5px/1 var(--f);letter-spacing:.06em;text-transform:uppercase;color:var(--signal);
  background:var(--signal-soft);border-radius:4px;padding:5px 7px}
.badges{display:flex;flex-wrap:wrap;gap:6px}
.badge{font:800 12.5px/1 var(--f);padding:6px 8px;border-radius:5px;background:var(--signal-soft);color:var(--signal);font-variant-numeric:tabular-nums}
.badge.up{background:var(--good-soft);color:var(--good)}
.badge.down{background:color-mix(in srgb,var(--bad) 16%,transparent);color:var(--bad)}
.img{margin:0;border-radius:8px;overflow:hidden;background:var(--surface-2)}
.img img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover}
.img figcaption{font:500 12px/1.3 var(--f);color:var(--muted);padding:6px 9px}

/* ── реакции под «Что это значит» (п. 1, 16): два вопроса, у каждого пара кнопок-половинок ── */
/* Плашка на всю ширину карточки, два вопроса колонками, подписи по центру над своей парой (Денис, 25.09.2026) */
.rxs{display:grid;grid-template-columns:1fr 1fr;gap:10px;background:var(--surface-2);border-radius:12px;padding:10px 10px 11px;margin-top:2px}
.rxg{display:flex;flex-direction:column;align-items:stretch;gap:7px;min-width:0}
.rxl{font:700 11px/1.2 var(--f);letter-spacing:.07em;text-transform:uppercase;color:var(--muted);text-align:center}
.rxp{display:grid;grid-template-columns:1fr 1fr;background:var(--surface);border:1px solid var(--line);border-radius:9px;overflow:hidden}
.rx{display:inline-flex;align-items:center;justify-content:center;gap:6px;font:600 14.5px/1.2 var(--f);color:var(--ink);
  background:none;border:0;border-radius:0;padding:0 8px;min-height:40px;cursor:pointer;min-width:0;white-space:nowrap}
.rx+.rx{border-left:1px solid var(--line)}
.rx .ico{width:16px;height:16px;vertical-align:0}
.rx .k{font-variant-numeric:tabular-nums;color:var(--muted);font-weight:700;font-size:13px}
.rx.on{color:var(--good);background:var(--good-soft);font-weight:700}
.rx.on .k{color:var(--good)}
.rx:active{background:var(--surface-2)}
@media (max-width:350px){.rxs{grid-template-columns:1fr}}

/* ── опрос дня (п. 8) ── */
.poll{border:1px solid var(--line);border-radius:10px;padding:12px 13px;display:flex;flex-direction:column;gap:9px}
.poll-q{display:flex;gap:8px;align-items:flex-start;font-weight:700}
.poll-q .ico{color:var(--orange);margin-top:2px}
.poll-o{display:flex;flex-direction:column;gap:6px}
.opt{position:relative;overflow:hidden;display:flex;justify-content:space-between;gap:10px;text-align:left;
  font:600 15.5px/1.3 var(--f);color:var(--ink);background:var(--surface-2);border:1px solid var(--line);border-radius:8px;
  padding:11px 12px;min-height:44px;cursor:pointer}
.opt .bar{position:absolute;inset:0 auto 0 0;background:var(--signal-soft);transition:width .5s ease}
.opt .t,.opt .p{position:relative}
.opt .p{font-variant-numeric:tabular-nums;color:var(--muted)}
.opt.on{border-color:var(--orange)}
.opt.on .p{color:var(--signal)}

/* ── калькулятор (п. 13) ── */
.calc{border:1px dashed var(--line);border-radius:10px}
.calc summary{display:flex;align-items:center;gap:8px;cursor:pointer;padding:11px 13px;font-weight:700;color:var(--signal);list-style:none;min-height:44px}
.calc summary::-webkit-details-marker{display:none}
.calc[open] summary{border-bottom:1px dashed var(--line)}
.calc-b{padding:12px 13px;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr));gap:10px}
.calc-b label{display:flex;flex-direction:column;gap:5px;font:600 13px/1.3 var(--f);color:var(--muted)}
/* Поля ≥16px: мельче — iOS зумит страницу при фокусе (грабля §6) */
.calc-b input{font:700 16px/1.2 var(--f);color:var(--ink);background:var(--surface-2);border:1px solid var(--line);border-radius:8px;
  padding:10px 11px;min-height:44px;width:100%;font-variant-numeric:tabular-nums}
.calc-out{grid-column:1/-1;display:flex;flex-direction:column;gap:6px;background:var(--good-soft);border-radius:8px;padding:11px 12px}
.calc-out div{display:flex;justify-content:space-between;gap:10px;align-items:baseline}
.calc-out b{font:800 20px/1 var(--f);color:var(--good);font-variant-numeric:tabular-nums}
.calc-b .src{grid-column:1/-1}

/* ── низ карточки: метки, источник, переслать ── */
.ft{display:flex;flex-direction:column;gap:10px;border-top:1px solid var(--line);padding-top:12px}
.ft-top{display:flex;align-items:center;gap:10px;min-height:16px}
.tagl{font:700 11px/1.3 var(--f);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);min-width:0}
.card .links{display:flex;flex-wrap:nowrap;gap:8px;margin:0;align-items:stretch}
.card .links a{flex:1;min-width:0;gap:8px;border-radius:10px;padding:0 14px;min-height:44px;color:var(--ink)}
.card .links a span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;line-height:1.35;padding-block:2px}
.card .links a .ico{width:16px;height:16px;color:var(--muted);vertical-align:0}
.card .links a::after{content:"↗";margin-left:-2px;flex:none}
.share{flex:none;display:inline-flex;align-items:center;justify-content:center;width:44px;min-height:44px;padding:0;
  color:var(--ink);background:var(--surface-2);border:1px solid var(--line);border-radius:10px;cursor:pointer}
.share .ico{width:19px;height:19px;vertical-align:0}
.views{margin-left:auto;display:inline-flex;align-items:center;gap:5px;font:600 13px/1 var(--f);color:var(--muted);font-variant-numeric:tabular-nums}

/* ── цифра дня: график (п. 9) ── */
.hero .big{position:relative}
.chart-btn{margin-top:12px;display:inline-flex;align-items:center;gap:7px;font:700 14px/1 var(--f);color:var(--signal);
  background:var(--signal-soft);border:none;border-radius:8px;padding:10px 12px;min-height:40px;cursor:pointer}
.chart{margin-top:12px}
.spark{width:100%;height:auto;max-height:160px;display:block}
.spark .line{fill:none;stroke:var(--orange);stroke-width:2.5;stroke-linejoin:round;stroke-linecap:round}
.spark .area{fill:var(--signal-soft);stroke:none}
.spark .dot{fill:var(--orange)}
.spark .lastv{fill:var(--ink);font:700 13px var(--f)}
.weekread{margin-top:6px;display:flex;flex-direction:column;gap:5px}
.meter{height:6px;border-radius:3px;background:var(--surface-2);overflow:hidden}
.meter span{display:block;height:100%;background:var(--good);border-radius:3px}

/* ── тест недели (п. 15) ── */
.quiz{margin-top:18px;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:16px 18px;display:flex;flex-direction:column;gap:14px}
.quiz h2{display:flex;align-items:center;gap:9px;font:800 19px/1.2 var(--f)}
.quiz h2 .ico{color:var(--orange);width:22px;height:22px}
.qq{display:flex;flex-direction:column;gap:8px}
.qt{font-weight:700}
.qo{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:6px}
.opt.right{border-color:var(--good);background:var(--good-soft);color:var(--good)}
.opt.wrong{border-color:var(--bad);color:var(--bad)}
.opt.dim{opacity:.55}
.opt:disabled{cursor:default}
.qres{font-weight:800;color:var(--signal)}

/* ── экраны «В работе», «Архив», «Настройки» ── */
.scr-h{font:800 clamp(20px,4vw,26px)/1.2 var(--f);margin-top:18px}
.blank{margin:34px auto 0;text-align:center;display:flex;flex-direction:column;align-items:center;gap:10px;max-width:520px}
.blank h2{font:800 20px/1.3 var(--f)}
.blank p{margin:0;color:var(--muted)}
.from{align-self:flex-start;font:700 13px/1 var(--f);color:var(--signal);background:none;border:none;padding:4px 0;cursor:pointer}
.alist{margin-top:14px;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr));gap:8px}
.arow{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;text-align:left;font:600 15.5px/1.3 var(--f);
  color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:13px 15px;min-height:52px;cursor:pointer}
.arow .no{font-weight:800;color:var(--signal);font-variant-numeric:tabular-nums}
.arow .k{color:var(--muted);font-size:13.5px}
.arow.on{border-color:var(--orange)}
.set{margin-top:16px;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:14px 16px;display:flex;flex-direction:column;gap:10px}
.set h3{font:800 17px/1.2 var(--f)}
.set p{margin:0}
.chip.mine{border-color:var(--orange);color:var(--signal)}
.chip.mine.on{color:var(--chip-on-ink)}

@media (max-width:560px){
  .mast-t{flex-direction:column;align-items:flex-start}
  .card{padding:14px 15px 13px}
  .card h3{font-size:17px}
}
.rxs + .ft{border-top:0;padding-top:4px}   /* под плашкой реакций линия лишняя */

/* ── пояснение раздела «В работе» ── */
.hint{margin-top:12px;display:flex;gap:12px;align-items:flex-start;background:var(--signal-soft);border-radius:12px;padding:13px 15px}
.hint>.ico{width:24px;height:24px;color:var(--orange);margin-top:1px}
.hint b{display:block;font:800 15.5px/1.3 var(--f);margin-bottom:4px}
.hint p{margin:0;font-size:14.5px;line-height:1.5}
.hint p .ico{width:15px;height:15px;vertical-align:-2px;color:var(--orange)}
.hint .hint-s{margin-top:6px;color:var(--muted);font-size:13.5px}
.hint + .blank{margin-top:22px}
.card.leaving{opacity:0!important;transform:scale(.97)!important;transition:opacity .2s,transform .2s}

/* ── «Админ»: статистика канала (26.09.2026) ── */
.aper{margin-top:10px}
.akpi{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;margin-top:12px}
.akpi div{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:11px 13px}
.akpi b{display:block;font:800 21px/1.15 var(--f);font-variant-numeric:tabular-nums}
.akpi span{color:var(--muted);font-size:12.5px;line-height:1.3}
.abox{margin-top:12px;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:13px 15px;display:flex;flex-direction:column;gap:8px}
.abox h3{font:800 16px/1.3 var(--f)}
.arow2{display:grid;grid-template-columns:1fr auto;gap:2px 10px;align-items:baseline;padding:7px 0;border-bottom:1px solid var(--line);font-size:14.5px}
.arow2:last-child{border-bottom:0}
.arow2 b{font-variant-numeric:tabular-nums;text-align:right}
.arow2 small{grid-column:1/-1;color:var(--muted);font-size:12.5px}
.atr{display:grid;grid-template-columns:minmax(74px,110px) 1fr 1fr 44px;align-items:center;gap:0 6px;font-size:13.5px}
.atr .tn{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.atr .tl,.atr .tp{height:18px;display:flex;align-items:center}
.atr .tl{justify-content:flex-end;border-right:1px solid var(--line)}
.atr i{display:block;height:13px;border-radius:3px}
.atr .tl i{background:var(--bad)}.atr .tp i{background:var(--good)}
.atr em{font:600 11.5px/1 var(--f);color:var(--muted);font-style:normal;padding:0 4px;font-variant-numeric:tabular-nums}
.atr b{text-align:right;font-variant-numeric:tabular-nums}
.atr b.lo{color:var(--bad)}
.ali{display:flex;gap:10px;padding:7px 0;border-bottom:1px solid var(--line);font-size:14.5px;line-height:1.35}
.ali:last-child{border-bottom:0}
.ali>b{flex:none;min-width:52px;font-variant-numeric:tabular-nums}
.ali>b.g{color:var(--good)}.ali>b.r{color:var(--bad)}.ali>b.o{color:var(--signal)}
.ali small{display:block;color:var(--muted);font-size:12.5px}

/* ── знак ВебВерфи в шапке (26.09.2026) ── */
.cmain,.cside{display:contents}
.logo{flex:none;display:block;color:var(--ink);line-height:0}
.logo .mark{width:34px;height:auto;display:block}
.back:not(.hidden) + .logo{display:none}

/* ════════════════ ДЕСКТОП-ВЕРСИЯ: браузер, широкий экран (Денис, 26.09.2026) ════════════════
   Не растянутое мини-приложение, а первая полоса отраслевой газеты: шапка-масthead со знаком и разделами
   строкой, цифра дня на всю ширину, слева закреплённые рубрики, главная новость крупно, остальные — сеткой.
   Только html.web (без мессенджера) и ширина ≥ 1100 px; телефон и мини-приложение не затронуты. */
@media (min-width:1100px){
  html.web{--gut:clamp(28px,4vw,72px)}
  html.web #top{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:0 36px;
    padding:0 var(--gut);background:var(--top);border-bottom:0;position:relative}
  html.web #top::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;
    background:linear-gradient(90deg,var(--orange) 0 38%,var(--line) 38% 100%)}
  html.web .mast{padding:18px 0 17px;gap:16px}
  html.web .logo .mark{width:52px}
  html.web .mast-t{flex-direction:column;align-items:flex-start;gap:4px}
  html.web .brand{font:800 30px/1 var(--f);letter-spacing:.02em}
  html.web .meta{font-size:12px;letter-spacing:.12em}
  html.web .streak{display:none}
  html.web .tabs{grid-column:2;justify-self:end;display:flex !important;gap:4px;padding:0}
  html.web .tabs button{flex-direction:row;background:none;border:0;border-radius:0;min-height:0;padding:28px 14px 26px;
    font:700 13px/1 var(--f);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);
    box-shadow:inset 0 -3px 0 transparent;transition:color .15s,box-shadow .15s}
  html.web .tabs button .ico{width:17px;height:17px}
  html.web .tabs button:hover{color:var(--ink)}
  html.web .tabs button.on{background:none;color:var(--ink);box-shadow:inset 0 -3px 0 var(--orange)}

  html.web main{padding-bottom:40px}
  html.web .wrap{max-width:1560px;margin:0 auto}

  /* экран выпуска: рубрики слева, лента справа */
  html.web #screen.scr-issue{display:grid;grid-template-columns:250px minmax(0,1fr);column-gap:44px;
    grid-template-areas:"hero hero" "side main" "side quiz" "side arch";align-items:start}
  html.web .scr-issue > .hero{grid-area:hero}
  html.web .scr-issue > .filters{grid-area:side;position:sticky;top:24px;margin-top:34px}
  html.web .scr-issue > .grid,html.web .scr-issue > .week{grid-area:main}
  html.web .scr-issue > .quiz{grid-area:quiz}
  html.web .scr-issue > .arch{grid-area:arch}
  html.web .scr-issue > .loading,html.web .scr-issue > .fail{grid-column:1/-1}

  /* цифра дня — баннер на всю ширину */
  html.web .hero{grid-template-columns:minmax(0,1fr) 340px;gap:0;margin-top:32px;border:1px solid var(--line);
    border-radius:18px;overflow:hidden;background:var(--surface)}
  html.web .hero .box{border:0;border-radius:0;background:none;padding:34px 40px}
  html.web .hero .big{position:relative;padding:40px 44px 38px;
    background:
      radial-gradient(120% 140% at 0% 0%,color-mix(in srgb,var(--orange) 16%,transparent),transparent 55%),
      var(--surface)}
  html.web .hero .v{font-size:clamp(84px,8.4vw,150px);letter-spacing:-.035em;line-height:.9}
  html.web .hero .c{font-size:22px;line-height:1.35;max-width:30ch;margin-top:16px;font-weight:600}
  html.web .hero .s{font-size:13.5px;margin-top:14px}
  html.web .hero .side{border-left:1px solid var(--line);justify-content:center;gap:12px}
  html.web .hero .side > div:nth-child(2){font:700 19px/1.35 var(--f)}

  /* рубрики — колонкой */
  html.web .filters::before{content:"Рубрики";font:700 11.5px/1 var(--f);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
  html.web .filters .frow{flex-direction:column;align-items:stretch;gap:2px}
  html.web .filters .frow + .frow{margin-top:14px;padding-top:14px;border-top:1px solid var(--line);flex-direction:row;flex-wrap:wrap;gap:6px}
  html.web .filters .frow:first-child .chip{justify-content:flex-start;border:0;border-radius:10px;background:none;
    padding:11px 12px;font-size:15px;min-height:0;color:var(--ink)}
  html.web .filters .frow:first-child .chip .k{margin-left:auto}
  html.web .filters .frow:first-child .chip:hover{background:var(--surface)}
  html.web .filters .frow:first-child .chip.on{background:var(--signal-soft);color:var(--signal)}
  html.web .filters .frow:first-child .chip.all.on{background:var(--surface-2);color:var(--ink)}

  /* лента: главная новость на всю ширину, дальше — сетка */
  html.web .scr-issue .grid{grid-template-columns:repeat(auto-fill,minmax(360px,1fr));gap:18px;margin-top:34px}
  html.web .card{padding:22px 24px 20px;border-radius:16px;gap:12px}
  html.web .card:hover{border-color:color-mix(in srgb,var(--orange) 40%,var(--line))}
  html.web .card h3{font-size:20px;line-height:1.28}
  html.web .card p{font-size:16px;line-height:1.6}
  html.web .scr-issue .grid .card:first-child{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);
    column-gap:48px;padding:34px 38px 30px;align-items:start;
    background:linear-gradient(180deg,color-mix(in srgb,var(--orange) 7%,var(--surface)),var(--surface) 60%)}
  html.web .scr-issue .grid .card:first-child > .cmain,
  html.web .scr-issue .grid .card:first-child > .cside{display:flex;flex-direction:column;gap:14px;min-width:0}
  html.web .scr-issue .grid .card:first-child > .cside{padding-top:4px}
  html.web .scr-issue .grid .card:first-child .take{font-size:17px;padding:6px 0 6px 20px}
  html.web .scr-issue .grid .card:first-child h3{font-size:clamp(28px,2.3vw,36px);line-height:1.15;letter-spacing:-.01em}
  html.web .scr-issue .grid .card:first-child p{font-size:17.5px}
  html.web .scr-issue .grid .card:first-child .n{font-size:15px;padding:8px 11px}

  html.web .arch{margin-top:30px}
  html.web .foot{max-width:1560px;margin:40px auto 0}
  html.web .foot-brand{padding:18px 22px;border-radius:14px}
  html.web .scr-h{font-size:30px;margin-top:30px}
}

/* ── согласие, «Мои данные», «Выбрать все» (26.09.2026) ── */
.consent{position:fixed;inset:0;z-index:30;background:color-mix(in srgb,var(--bg) 78%,transparent);backdrop-filter:blur(3px);
  display:flex;align-items:flex-end;justify-content:center;padding:16px 16px calc(16px + env(safe-area-inset-bottom,0px))}
.consent-c{width:100%;max-width:520px;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:20px 20px 18px;
  display:flex;flex-direction:column;gap:10px;box-shadow:0 20px 60px rgba(0,0,0,.35)}
.consent-c h2{font:800 20px/1.25 var(--f)}
.consent-c p{margin:0;font-size:15px;line-height:1.5}
.consent-c a{color:var(--signal);font-weight:700;text-decoration:none;font-size:14.5px}
.consent-ok{margin-top:6px;font:800 16px/1 var(--f);padding:15px;border-radius:12px;border:0;background:var(--orange);color:var(--chip-on-ink);cursor:pointer;min-height:48px}
@media (min-width:700px){.consent{align-items:center}}
.allrow{gap:14px}
.lnk{background:none;border:0;padding:4px 0;font:700 14px/1.2 var(--f);color:var(--signal);cursor:pointer}
.chip.danger{color:var(--bad);border-color:color-mix(in srgb,var(--bad) 45%,var(--line));background:none;align-self:flex-start}

/* ── «Практик считает» (26.09.2026) ── */
.card.praktik{border-color:color-mix(in srgb,var(--orange) 55%,var(--line));background:linear-gradient(180deg,var(--signal-soft),var(--surface) 70%)}
.pr-l{display:flex;align-items:center;gap:6px;font:800 11.5px/1.3 var(--f);letter-spacing:.08em;text-transform:uppercase;color:var(--signal)}
.pr-l .ico{width:16px;height:16px;color:var(--orange)}
.pr-l span{font-weight:700;letter-spacing:.02em;text-transform:none;color:var(--muted)}