/* Aveasy Zoom — all selectors are scoped to .zd*; no page-wide overrides.
   Палитра (23.09.2026): язык сайта hz.css — бумага/белый, тёмная панель, чернила, сигнальный оранжевый,
   радиусы 6–10 px, заголовки Sofia Sans Condensed, цифры JetBrains Mono. Токены --hz-* берутся со страницы,
   в скобках — фолбэки на случай встраивания без hz.css (harness). Смысловая пара «хорошо / плохо» —
   приглушённые тёмно-зелёный (--zd-good) и розово-красный (--zd-bad); всё остальное — оранжевый акцент. */
.zd, .zd-tabs, .zd-overlay {
  --zd-paper:var(--hz-paper, #F1F1EE); --zd-white:var(--hz-white, #fff);
  --zd-ink:var(--hz-ink, #121416); --zd-ink-2:var(--hz-ink-2, #45494D); --zd-ink-3:var(--hz-ink-3, #6B7075);
  --zd-line:var(--hz-line, #D4D5D0);
  --zd-panel:var(--hz-panel, #17191C); --zd-panel-2:var(--hz-panel-2, #232629);
  --zd-on-panel:var(--hz-on-panel, #F4F4F1); --zd-on-panel-2:var(--hz-on-panel-2, #B7BBBF); --zd-line-panel:var(--hz-line-panel, rgba(255,255,255,.14));
  --zd-signal:var(--hz-signal, #FF6A2A); --zd-signal-deep:var(--hz-signal-deep, #B33A0A);
  --zd-good:#2F6B47; --zd-good-bg:#DEE9E0; --zd-bad:#9A3434; --zd-bad-bg:#F3DCDA;
  --zd-display:var(--hz-display, 'Sofia Sans Condensed', 'Arial Narrow', Arial, sans-serif);
  --zd-text:var(--hz-text, 'Golos Text', Arial, sans-serif);
  --zd-mono:var(--hz-mono, 'JetBrains Mono', Consolas, monospace);
  --zd-ease:var(--hz-ease, cubic-bezier(.2,.7,.2,1));
  box-sizing:border-box; font-family:var(--zd-text); color:var(--zd-ink);
}
.zd *, .zd-tabs *, .zd-overlay * { box-sizing:border-box; }
.zd { position:relative; width:100%; min-width:0; min-height:360px; padding:28px; border:0; border-radius:10px; background:var(--zd-paper); box-shadow:0 40px 80px -40px rgba(0,0,0,.55); overflow:clip; }
.zd[data-zoom-ready] { animation:zd-enter .5s var(--zd-ease) both; }
.zd [hidden], .zd-tabs [hidden], .zd-overlay [hidden] { display:none !important; }
.zd button, .zd-tabs button, .zd-overlay button { font:inherit; cursor:pointer; }
.zd button:focus-visible, .zd a:focus-visible, .zd summary:focus-visible, .zd-tabs button:focus-visible, .zd-overlay button:focus-visible, .zd-point:focus-visible { outline:3px solid var(--zd-signal); outline-offset:3px; }
.zd h3, .zd h4, .zd p { margin:0; }
.zd h3, .zd h4 { font-family:var(--zd-display); color:inherit; }
.zd h3 { font-size:clamp(32px, 3.6vw, 48px); font-weight:800; line-height:.96; letter-spacing:-.01em; }
.zd h4 { font-size:23px; font-weight:700; line-height:1.05; letter-spacing:-.005em; }
.zd-top, .zd-heading, .zd-panel-head { display:flex; justify-content:space-between; align-items:center; gap:16px; }
.zd-top { margin-bottom:27px; }
.zd-brand { display:flex; align-items:center; gap:9px; font-size:12px; font-weight:600; }
.zd-mark { display:flex; align-items:center; justify-content:center; width:35px; height:35px; background:var(--zd-ink); color:var(--zd-on-panel); border-radius:6px; font:800 24px var(--zd-display); }
.zd-mark span { font-size:16px; color:var(--zd-signal); }
.zd-disclaimer { padding:6px 10px; border:1px solid var(--zd-line); border-radius:4px; font:500 12px var(--zd-mono); color:var(--zd-ink-2); white-space:nowrap; }
.zd-heading { margin-bottom:12px; }
.zd-heading .zd-button { flex-shrink:0; font-size:12px; }
.zd-full-icon { display:inline-block; width:16px; height:16px; vertical-align:middle; margin-right:5px; fill:none; stroke:currentColor; stroke-width:1.6; }
.zd-shop { font-size:12px; line-height:1.5; color:var(--zd-ink-3); max-width:650px; }
.zd-controls { margin:24px 0 19px; }
.zd-button { min-height:42px; padding:10px 15px; border:1px solid var(--zd-line); border-radius:6px; background:var(--zd-white); color:var(--zd-ink-2); transition:background .2s, box-shadow .2s, color .2s, border-color .2s; line-height:1.25; }
.zd-button:hover { border-color:var(--zd-ink); color:var(--zd-ink); }
/* Переключатели = язык hz-seg (hz-ui.css): серая группа, выбранный сегмент тёмный, hover — оранжевая рамка.
   Правила продублированы здесь, чтобы движок выглядел так же и без hz-ui.css (harness). */
.zd-controls { display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px; }
.zd-switch-label { font:500 12px/1.2 var(--zd-mono); letter-spacing:.04em; color:var(--zd-ink-3); }
.zd-switch { display:inline-flex; flex-wrap:wrap; gap:4px; padding:4px; background:#E6E6E1; border:0; border-radius:8px; max-width:100%; }
.zd-switch .zd-button { min-height:40px; background:transparent; border:1px solid transparent; border-radius:6px; color:var(--zd-ink); font-size:13px; font-weight:600; }
.zd-switch .zd-button:hover { border-color:var(--zd-signal); background:transparent; }
.zd-switch .zd-button[aria-pressed="true"] { background:var(--zd-panel); border-color:var(--zd-panel); color:var(--zd-on-panel); box-shadow:none; }
.zd-content { min-width:0; }
.zd-panel { padding:22px; border:1px solid var(--zd-line); border-radius:8px; background:var(--zd-white); min-width:0; }
.zd-panel--dark { background:radial-gradient(ellipse at 100% 0%, rgba(255,106,42,.16) 0%, transparent 58%), var(--zd-panel); color:var(--zd-on-panel); border-color:transparent; box-shadow:0 24px 40px -28px rgba(0,0,0,.6); }
.zd-panel-head { margin-bottom:21px; }
.zd-eyebrow { display:block; font:600 12px/1.5 var(--zd-mono); letter-spacing:.08em; color:var(--zd-ink-3); }
.zd-panel--dark .zd-eyebrow, .zd-panel--dark .zd-micro { color:var(--zd-on-panel-2); }
.zd-panel-head h4 { margin-top:6px; }
.zd-pill { display:inline-flex; align-items:center; padding:6px 10px; border-radius:4px; font:500 12px var(--zd-mono); white-space:nowrap; color:var(--zd-ink-2); background:var(--zd-paper); }
.zd-panel--dark .zd-pill { background:rgba(255,255,255,.08); color:var(--zd-on-panel); }
.zd-pill--pink { background:var(--zd-bad-bg); color:var(--zd-bad); }
.zd-num, .zd-kpi strong, .zd-rank-value, .zd-place, .zd-equation, .zd-index-key > span, .zd-mini-funnel strong, .zd-funnel-step strong, .zd-manager strong, .zd-money-equation, .zd-concentration > strong, .zd-payback > strong { font-family:var(--zd-mono); font-variant-numeric:tabular-nums; }
.zd-kpis { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.zd-kpi { padding:17px 18px 4px; background:var(--zd-white); border:1px solid var(--zd-line); border-radius:6px; min-width:0; overflow:hidden; }
.zd-label { display:block; font-size:12px; color:var(--zd-ink-2); margin-bottom:7px; }
.zd-kpi strong { display:block; font-size:clamp(18px,2.2vw,28px); font-weight:700; white-space:nowrap; letter-spacing:-.04em; }
.zd-chart { position:relative; width:100%; min-width:0; color:var(--zd-signal); }
.zd-chart svg { display:block; width:100%; height:auto; overflow:visible; }
.zd-chart--small { height:42px; margin-top:8px; overflow:hidden; }
.zd-chart--small svg { width:100%; height:52px; }
.zd-line { fill:none; stroke:currentColor; stroke-width:3; stroke-linecap:round; stroke-linejoin:round; vector-effect:non-scaling-stroke; stroke-dasharray:1500; animation:zd-draw .6s ease both; }
.zd-area { fill:currentColor; opacity:.12; }
.zd-panel--dark .zd-chart { color:var(--zd-signal); }
.zd-panel--dark .zd-area { opacity:.16; }
.zd-gridline { stroke:rgba(255,255,255,.12); stroke-dasharray:3 6; }
.zd-axis { fill:var(--zd-on-panel-2); font:12px var(--zd-mono); }
.zd-chart-zone { fill:#E0605A; opacity:.16; }
/* Непрерывный тултип (DECISIONS §1): вся область графика ловит указатель; перекрестие + точка + тултип
   со всеми сериями даты. Вид — как .hz-chart/.hz-tip в hz-ui.css (дублируем для harness). */
.zd-chart[data-zd-tips] { touch-action:pan-y; cursor:crosshair; -webkit-user-select:none; user-select:none; -webkit-tap-highlight-color:transparent; }
.zd-chart[data-zd-tips]:focus-visible { outline:3px solid var(--zd-signal); outline-offset:4px; border-radius:4px; }
.zd-cross { pointer-events:none; stroke:var(--zd-signal); stroke-width:1; stroke-dasharray:3 3; opacity:0; vector-effect:non-scaling-stroke; }
.zd-cross-dot { pointer-events:none; fill:var(--zd-signal); stroke:var(--zd-white); stroke-width:2; opacity:0; }
.zd-chart[data-hover] .zd-cross, .zd-chart[data-hover] .zd-cross-dot { opacity:1; }
.zd-tooltip { position:absolute; z-index:5; left:0; top:4px; padding:8px 11px; background:#121416; color:#fff; border-radius:6px; box-shadow:0 6px 24px rgba(0,0,0,.25);
  font:500 12px/1.55 var(--zd-mono); white-space:nowrap; pointer-events:none; opacity:0; transition:opacity .12s; }
.zd-tooltip[data-show] { opacity:1; }
.zd-tooltip b { color:var(--zd-signal); font-weight:600; }
.zd-panel-head .zd-hint { flex-shrink:0; }
.zd-compare-layout { display:grid; grid-template-columns:minmax(0,1.7fr) minmax(220px,1fr); gap:16px; }
.zd-ranking { display:flex; flex-direction:column; gap:10px; }
.zd-rank-row { display:grid; grid-template-columns:26px minmax(0,1fr) auto; align-items:center; gap:12px; padding:17px 14px; border-radius:6px; background:rgba(255,255,255,.03); border:1px solid var(--zd-line-panel); min-height:91px; transition:background .3s, border-color .3s; }
.zd-rank-row--leader { background:rgba(255,106,42,.09); border-color:rgba(255,106,42,.6); }
.zd-place { color:#8A8E94; font-size:12px; }
.zd-rank-row--leader .zd-place { color:var(--zd-signal); }
.zd-rank-name { font-size:14px; font-weight:600; line-height:1.4; }
.zd-rank-meta { font-size:12px; color:var(--zd-on-panel-2); margin-top:5px; }
.zd-leader { display:inline-block; color:var(--zd-signal); font:600 12px var(--zd-mono); letter-spacing:.08em; text-transform:uppercase; margin-left:5px; }
.zd-rank-value { text-align:right; min-width:85px; }
.zd-rank-value strong { display:block; font-size:25px; font-weight:600; letter-spacing:-.04em; }
.zd-rank-row--leader .zd-rank-value strong { color:var(--zd-signal); }
.zd-rank-value small { display:block; font:12px var(--zd-text); color:var(--zd-on-panel-2); }
.zd-index { display:inline-block; font-size:12px; padding:3px 6px; color:var(--zd-on-panel); background:rgba(255,255,255,.08); border-radius:3px; margin-top:5px; }
.zd-rank-row--leader .zd-index { color:var(--zd-ink); background:var(--zd-signal); }
.zd-track { height:4px; background:rgba(255,255,255,.09); margin-top:12px; border-radius:2px; overflow:hidden; }
.zd-track > span { display:block; height:100%; border-radius:2px; background:rgba(244,244,241,.42); transition:width .55s cubic-bezier(.2,.8,.2,1); }
.zd-rank-row--leader .zd-track > span { background:var(--zd-signal); }
.zd-insight { align-self:start; padding:25px; border:1px solid var(--zd-line); border-radius:8px; background:var(--zd-white); display:flex; flex-direction:column; justify-content:flex-start; }
.zd-duo-bars { display:flex; flex-direction:column; gap:10px; margin-top:18px; }
.zd-duo-bar { display:grid; grid-template-columns:84px minmax(0,1fr) auto; align-items:center; gap:10px; font-size:12px; color:var(--zd-ink-2); }
.zd-duo-bar i { display:block; height:8px; border-radius:2px; background:var(--zd-paper); overflow:hidden; }
.zd-duo-bar b { display:block; height:100%; border-radius:2px; background:#B7BBBF; }
.zd-duo-bar strong { font:600 12px var(--zd-mono); color:var(--zd-ink-2); white-space:nowrap; }
.zd-duo-bar--lead { color:var(--zd-ink); font-weight:600; }
.zd-duo-bar--lead b { background:var(--zd-signal); }
.zd-duo-bar--lead strong { color:var(--zd-signal-deep); }
.zd-equation { display:flex; align-items:center; gap:9px; margin:27px 0 20px; font-size:27px; letter-spacing:-.04em; }
.zd-equation strong { color:var(--zd-signal-deep); font-size:39px; }
.zd-equation-sign { font-size:18px; color:var(--zd-ink-3); }
.zd-insight > p { font-size:19px; line-height:1.45; }
.zd-insight .zd-muted { font-size:13px; margin-top:16px; }
.zd-muted { color:var(--zd-ink-2); font-size:13px; line-height:1.5; }
.zd-index-key { display:flex; align-items:center; gap:13px; border-top:1px solid var(--zd-line); padding-top:20px; margin-top:22px; color:var(--zd-ink-2); font-size:12px; }
.zd-index-key > span { background:var(--zd-paper); color:var(--zd-signal-deep); padding:8px; border-radius:4px; font-size:19px; }
.zd .zd-micro { font-size:12px; line-height:1.55; color:var(--zd-ink-3); margin-top:12px; }
.zd .zd-panel--dark .zd-micro { color:var(--zd-on-panel-2); }
/* Формула индекса рядом с ключом «100 — медиана»: читаемо, а не мелким серым (приёмка 24.09) */
.zd .zd-micro.zd-formula { font-size:13px; line-height:1.5; color:var(--zd-ink-2); }
.zd-takeaway { display:flex; align-items:center; gap:10px; padding:17px 0 0; font-size:14px; font-weight:500; line-height:1.55; }
.zd-takeaway::before { content:'↗'; flex-shrink:0; display:grid; place-items:center; width:29px; height:29px; background:var(--zd-signal); color:var(--zd-ink); border-radius:6px; font-size:18px; font-weight:700; }
.zd .zd-footnote { font-size:12px; color:var(--zd-ink-3); line-height:1.6; margin-top:14px; }
.zd-fix-layout { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); gap:16px; }
.zd-legend { display:flex; gap:10px; flex-wrap:wrap; margin-bottom:14px; }
.zd-legend > span { display:flex; gap:6px; align-items:center; font-size:12px; color:var(--zd-ink-2); }
.zd-legend b { font:600 12px var(--zd-mono); color:var(--zd-ink); }
.zd-legend i { display:inline-block; width:12px; height:12px; border-radius:2px; }
/* Парк: 200 плотных клеток (20×10, на мобильном 10×20), видны все сразу; номер и оценка — у выбранной и в подсказке */
.zd-card-grid { display:grid; grid-template-columns:repeat(20,minmax(0,1fr)); gap:3px; }
.zd-card-dot { position:relative; min-width:0; aspect-ratio:1; padding:0; display:flex; align-items:center; justify-content:center; border:0; border-radius:3px; font-family:var(--zd-mono) !important; font-size:12px !important; font-weight:700; transition:transform .15s, opacity .25s, box-shadow .15s; }
.zd-card-dot small { display:none; font-size:inherit; line-height:1; }
.zd-card-dot:hover { transform:scale(1.18); z-index:1; box-shadow:0 4px 10px -4px rgba(0,0,0,.5); }
.zd-card-dot[aria-pressed="true"] { z-index:2; transform:scale(1.25); box-shadow:0 0 0 2px var(--zd-white), 0 0 0 4px var(--zd-ink); }
.zd-card-dot[aria-pressed="true"] small { display:block; }
.zd-card-grid--sleeping .zd-card-dot:not(.zd-grade--D) { opacity:.14; }
.zd-card-dot.zd-grade--A, .zd-legend i.zd-grade--A { background:#4F8A63; color:#fff; }
.zd-card-dot.zd-grade--B, .zd-legend i.zd-grade--B { background:#C9CAC4; color:var(--zd-ink); }
.zd-card-dot.zd-grade--C, .zd-legend i.zd-grade--C { background:#F2A67C; color:var(--zd-ink); }
.zd-card-dot.zd-grade--D, .zd-legend i.zd-grade--D { background:#B84A45; color:#fff; }
.zd-grade { display:inline-grid; place-items:center; width:36px; height:36px; border-radius:6px; font-weight:700; font-family:var(--zd-mono); }
.zd-grade--A { background:var(--zd-good-bg); color:var(--zd-good); }
.zd-grade--B { background:#E6E6E1; color:var(--zd-ink-2); }
.zd-grade--C { background:#FBE4D6; color:var(--zd-signal-deep); }
.zd-grade--D { background:var(--zd-bad-bg); color:var(--zd-bad); }
.zd-detail { align-self:start; display:flex; flex-direction:column; justify-content:flex-start; background:var(--zd-paper); }
.zd-mini-funnel { display:flex; align-items:center; justify-content:space-between; gap:7px; margin:25px 0 18px; }
.zd-mini-funnel > div { text-align:center; }
.zd-mini-funnel strong { display:block; font-size:21px; font-weight:700; white-space:nowrap; }
.zd-mini-funnel span { display:block; font-size:12px; color:var(--zd-ink-3); margin-top:6px; }
.zd-diagnosis { padding:14px; font-size:14px; line-height:1.5; background:var(--zd-white); border-left:3px solid var(--zd-bad); border-radius:0 6px 6px 0; }
.zd-burn-layout { display:grid; grid-template-columns:minmax(0,2fr) minmax(190px,1fr); gap:16px; margin-top:16px; }
.zd-concentration { border-radius:8px; background:var(--zd-panel); color:var(--zd-on-panel); padding:24px; display:flex; flex-direction:column; justify-content:center; box-shadow:0 24px 40px -28px rgba(0,0,0,.6); }
.zd-concentration > strong { display:block; color:var(--zd-signal); font-size:46px; font-weight:700; letter-spacing:-.05em; margin:10px 0 6px; }
.zd-concentration > p { font-size:17px; line-height:1.45; }
.zd .zd-concentration .zd-eyebrow, .zd .zd-concentration .zd-micro { color:var(--zd-on-panel-2); }
.zd-concentration-bar { height:9px; border-radius:2px; background:rgba(255,255,255,.12); margin-top:15px; overflow:hidden; }
.zd-concentration-bar > span { display:block; height:100%; background:var(--zd-signal); border-radius:2px; }
.zd-method { margin-top:16px; font-size:12px; color:var(--zd-ink-2); }
.zd-method summary { cursor:pointer; min-height:40px; padding:10px 0; }
.zd-method p { padding:10px 12px; background:var(--zd-white); border:1px solid var(--zd-line); border-radius:6px; line-height:1.6; }
.zd-cross-layout { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); gap:16px; }
.zd-cross-layout .zd-rank-value strong { font-size:20px; }
.zd-money-funnel { display:flex; flex-direction:column; gap:10px; margin:16px 0; }
.zd-funnel-step { position:relative; display:grid; grid-template-columns:22px minmax(0,1fr) auto; align-items:center; gap:8px; padding:13px; border-radius:6px; overflow:hidden; background:var(--zd-paper); }
.zd-funnel-step::before { content:''; position:absolute; inset:0; width:var(--zd-step); background:linear-gradient(90deg, rgba(255,106,42,.2), rgba(255,106,42,.05)); border-left:3px solid var(--zd-signal); }
.zd-funnel-step > * { position:relative; }
.zd-funnel-step strong { font-size:22px; font-weight:600; letter-spacing:-.04em; }
.zd-funnel-step > span { font-size:12px; color:var(--zd-ink-2); }
.zd-funnel-step:last-child { background:var(--zd-panel); color:var(--zd-on-panel); }
.zd-funnel-step:last-child::before { background:linear-gradient(90deg, rgba(255,106,42,.34), rgba(255,106,42,.08)); }
.zd-funnel-step:last-child strong { color:var(--zd-signal); }
.zd-funnel-step:last-child > span { color:var(--zd-on-panel-2); }
.zd-money-equation { font-size:12px; line-height:1.8; color:var(--zd-ink-2); margin-top:12px !important; }
.zd-cross-bottom { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); gap:16px; margin-top:16px; }
.zd-managers { display:flex; flex-direction:column; gap:17px; }
.zd-manager { display:grid; grid-template-columns:100px 1fr auto; gap:8px 12px; align-items:center; font-size:12px; }
.zd-manager strong { font-size:12px; font-weight:500; }
.zd-manager small { grid-column:2 / -1; text-align:right; color:var(--zd-bad); font-size:12px; }
.zd-manager-bar { height:8px; background:var(--zd-bad-bg); border-radius:2px; overflow:hidden; }
.zd-manager-bar span { display:block; height:100%; background:var(--zd-good); border-radius:2px; }
.zd-payback { padding:24px; background:var(--zd-good-bg); border-radius:8px; }
.zd-payback .zd-eyebrow { color:var(--zd-good); }
.zd-payback > strong { display:block; color:var(--zd-good); font-size:46px; font-weight:700; letter-spacing:-.05em; margin:17px 0 7px; }
.zd-payback > strong small { font-size:18px; letter-spacing:0; }
.zd-payback > p { font-size:14px; }
.zd-payback-total { display:inline-block; font:500 12px var(--zd-mono); color:var(--zd-good); border-top:1px solid rgba(47,107,71,.25); padding-top:12px; margin-top:15px; }
.zd[data-zoom-demo="teaser"] .zd-insight { display:none; }
.zd[data-zoom-demo="teaser"] .zd-compare-layout { grid-template-columns:minmax(0,1fr); }
.zd[data-zoom-demo="teaser"] .zd-heading h3 { font-size:36px; }
/* Вход в полный дашборд у тизера — вторичная контурная кнопка, не баннер (DECISIONS §0: один основной CTA на блок) */
.zd-cta { display:inline-flex; align-items:center; gap:10px; min-height:48px; padding:12px 18px; margin-top:18px; background:transparent; color:var(--zd-ink) !important; border:1.5px solid var(--zd-ink); border-radius:6px; text-decoration:none; font-weight:600; font-size:15px; transition:border-color .18s var(--zd-ease), color .18s var(--zd-ease); }
.zd-cta:hover { border-color:var(--zd-signal); color:var(--zd-signal-deep) !important; }
.zd-cta span { font-size:18px; transition:transform .18s var(--zd-ease); }
.zd-cta:hover span { transform:translateX(3px); }
.zd-sr { position:absolute !important; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
/* Одна рамка демо: вопросы-вкладки → уровень → демо → сноска */
.zd-tabs { min-width:0; }
.zd-tabs--frame { position:relative; padding:24px 28px 22px; border-radius:10px; background:var(--zd-paper); color:var(--zd-ink); box-shadow:0 40px 80px -40px rgba(0,0,0,.55); }
.zd-frame-top { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:8px 16px; }
.zd-frame-top .zd-shop { margin:0; }
.zd-tabbar { display:flex; flex-wrap:wrap; align-items:center; gap:10px 14px; margin:16px 0 0; }
.zd-tab-level { color:var(--zd-signal-deep); font:600 12px/1.3 var(--zd-mono); letter-spacing:.04em; margin:16px 0 0; }
.zd-tablist { display:flex; flex-wrap:wrap; gap:4px; padding:4px; background:#E6E6E1; border-radius:8px; max-width:100%; }
.zd-tab { min-height:44px; padding:10px 16px; border:1px solid transparent; border-radius:6px; background:transparent; color:var(--zd-ink); font-size:14px !important; font-weight:600; transition:background .15s, color .15s, border-color .15s; }
.zd-tab:hover { border-color:var(--zd-signal); }
.zd-tab[aria-selected="true"] { background:var(--zd-panel); color:var(--zd-on-panel); border-color:var(--zd-panel); }
.zd.zd--embedded { min-height:0; padding:0; border-radius:0; background:transparent; box-shadow:none; overflow:visible; }
.zd.zd--embedded .zd-controls { margin:14px 0 16px; }
.zd-tabs--frame > .zd-footnote { font-size:12px; color:var(--zd-ink-3); line-height:1.6; margin:16px 0 0; }
.zd-overlay { position:fixed; inset:0; width:min(1280px, calc(100vw - 48px)); max-width:none; height:auto; max-height:calc(100dvh - 48px); margin:auto; padding:55px 14px 14px; border:0; border-radius:10px; background:var(--zd-panel); overflow:auto; overscroll-behavior:contain; box-shadow:0 40px 100px rgba(0,0,0,.55); }
.zd-overlay::backdrop { background:rgba(10,11,12,.74); backdrop-filter:blur(6px); }
.zd-overlay .zd { box-shadow:none; }
.zd-close { position:absolute; right:18px; top:9px; min-height:40px; padding:8px 14px; border:1px solid var(--zd-line-panel); border-radius:6px; background:transparent; color:var(--zd-on-panel); }
.zd-close:hover { border-color:var(--zd-on-panel); }
.zd-harness { max-width:1200px; margin:0 auto; padding:48px 24px 100px; }
.zd-harness > h1 { font:800 44px/1 var(--hz-display, 'Sofia Sans Condensed', sans-serif); color:var(--hz-ink, #121416); margin:0 0 12px; }
.zd-harness > p { color:var(--hz-ink-2, #45494D); font:14px var(--hz-text, sans-serif); margin-bottom:40px; }
.zd-harness > section { margin:0 0 55px; min-width:0; }
.zd-harness > section > h2 { margin:0 0 17px; color:var(--hz-ink-3, #6B7075); font:13px var(--hz-mono, monospace); }
@keyframes zd-enter { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:translateY(0); } }
@keyframes zd-draw { from { stroke-dashoffset:1500; } to { stroke-dashoffset:0; } }
@media (max-width:1000px) {
  .zd-compare-layout { grid-template-columns:minmax(0,1.6fr) minmax(190px,1fr); }
  .zd-insight { padding:20px; }
  .zd-equation { font-size:23px; gap:6px; }
  .zd-equation strong { font-size:30px; }
  .zd-cross-layout, .zd-cross-bottom { grid-template-columns:minmax(0,1fr); }
  /* планшет: сетка парка на всю ширину (в две колонки клетки были ~13 px), диагноз — под ней */
  .zd-fix-layout { grid-template-columns:minmax(0,1fr); }
  .zd-money-funnel { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:759px) {
  .zd { padding:17px; border-radius:8px; }
  .zd-top { align-items:flex-start; gap:10px; flex-direction:column; margin-bottom:22px; }
  .zd-disclaimer { font-size:12px; }
  .zd-heading { align-items:flex-start; gap:9px; }
  .zd h3 { font-size:32px; letter-spacing:-.005em; }
  /* «На весь экран» на телефоне — только иконка 42×42, подпись остаётся для скринридера */
  .zd-heading .zd-button { position:relative; display:grid; place-items:center; width:42px; min-height:42px; height:42px; padding:0; }
  .zd-heading .zd-button span { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
  .zd-heading .zd-full-icon { width:18px; height:18px; margin:0; }
  .zd-shop { font-size:12px; }
  .zd-controls { margin:19px 0 15px; }
  .zd .zd-switch { display:flex; width:100%; }
  .zd .zd-switch .zd-button { flex:1; padding:10px 7px; font-size:12px; min-height:44px; white-space:normal; }
  .zd-panel { padding:16px; }
  /* Плашка в шапке панели («4 из 53 карточек группы») на узком экране переносится под заголовок
     и сама переносит строки — раньше на 320–375 px она вылезала за панель (до 352 px на 320). */
  .zd-panel-head { gap:8px; margin-bottom:17px; flex-wrap:wrap; }
  .zd-panel-head .zd-pill { white-space:normal; max-width:100%; line-height:1.35; }
  .zd-panel-head h4 { font-size:21px; }
  .zd-eyebrow { font-size:12px; letter-spacing:.06em; }
  .zd-kpis { grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
  .zd-kpi { padding:13px 12px 2px; }
  .zd-kpi strong { font-size:21px; }
  .zd-label { font-size:12px; }
  .zd-compare-layout, .zd-fix-layout, .zd-burn-layout { grid-template-columns:minmax(0,1fr); }
  /* Читаемость на телефоне (приёмка 24.09): смысловой текст ≥ 12 px, служебные метки и оси ≥ 11 px */
  .zd-rank-row { grid-template-columns:20px minmax(0,1fr) auto; gap:8px; padding:13px 10px; min-height:97px; }
  .zd-rank-name { font-size:13px; }
  .zd-rank-meta { font-size:12px; line-height:1.4; }
  .zd-rank-value { min-width:70px; max-width:96px; }
  .zd-rank-value strong { font-size:23px; }
  .zd-rank-value small { font-size:12px; line-height:1.25; }
  .zd-index { font-size:12px; }
  .zd-place { font-size:12px; }
  .zd-leader { display:block; margin-left:0; margin-top:3px; font-size:12px; }
  .zd-disclaimer, .zd-pill { font-size:12px; }
  .zd-disclaimer { white-space:normal; }
  .zd .zd-micro { font-size:12px; }
  .zd-legend > span, .zd-legend b { font-size:12px; }
  .zd-mini-funnel span, .zd-funnel-step > span { font-size:12px; }
  .zd-money-equation, .zd-payback-total { font-size:12px; }
  .zd-tooltip { font-size:12px; }
  .zd-insight { padding:20px; }
  .zd-equation { margin:13px 0; font-size:29px; }
  .zd-equation strong { font-size:39px; }
  .zd-insight > p { font-size:17px; }
  .zd-index-key { margin-top:15px; padding-top:15px; }
  .zd .zd-takeaway { font-size:12px; align-items:flex-start; }
  .zd .zd-footnote, .zd-tabs--frame > .zd-footnote { font-size:12px; line-height:1.5; }
  .zd-chart svg { min-height:150px; }
  .zd-chart--small svg { min-height:0; }
  .zd-chart .zd-axis { font-size:12px; }
  .zd-mini-funnel strong { font-size:20px; }
  .zd-legend { gap:7px; }
  .zd-concentration { padding:20px; }
  .zd-concentration > strong { font-size:42px; }
  .zd-card-grid { grid-template-columns:repeat(10,minmax(0,1fr)); gap:2px; }
  .zd-card-dot { font-size:12px !important; }
  .zd-fix-layout > .zd-panel:first-child { padding:14px 10px; }
  .zd-money-funnel { display:flex; }
  .zd-funnel-step strong { font-size:23px; }
  .zd-cross-layout .zd-rank-value strong { font-size:17px; letter-spacing:-.03em; }
  .zd-manager { grid-template-columns:auto 1fr auto; gap:6px 8px; font-size:12px; }
  .zd-manager strong, .zd-manager small { font-size:12px; }
  .zd-payback > strong { font-size:42px; }
  .zd-tabs--frame { padding:16px 14px 16px; border-radius:8px; }
  .zd-tabbar { display:block; }
  .zd-tabbar .zd-hint { margin-top:8px; }
  .zd-tabs .zd-tablist { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px; }
  .zd-tabs .zd-tab { padding:10px 6px; font-size:12.5px !important; white-space:normal; }
  .zd-overlay { inset:0; width:100%; height:100dvh; max-height:100dvh; margin:0; border-radius:0; padding:57px 8px 20px; }
  .zd-overlay .zd { padding:15px; }
  .zd-harness { padding:28px 12px 60px; }
  .zd-harness > h1 { font-size:34px; }
  .zd[data-zoom-demo="teaser"] .zd-heading h3 { font-size:32px; }
}
/* «Что исправлять» на телефоне (DECISIONS §4): вместо стены из 200 клеток — сводка статусов
   (легенда становится плитками с числами) и список «Посмотреть объявления» по 10 с «ещё».
   Пункт списка — тот же data-zd-action="card", что клетка: открывает ту же диагностику. */
.zd-plist { display:none; }
@media (max-width:599px) {
  .zd-card-grid, .zd-grid-note { display:none; }
  .zd-legend { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin-bottom:0; }
  .zd-legend > span { flex-wrap:wrap; gap:4px 6px; padding:10px 12px; border-radius:6px; background:var(--zd-paper); font-size:13px; line-height:1.3; }
  .zd-legend b { order:-1; flex-basis:100%; font:700 24px/1.1 var(--zd-mono); letter-spacing:-.03em; }
  .zd-plist { display:block; margin-top:18px; }
  .zd-plist__head { display:flex; justify-content:space-between; align-items:baseline; gap:8px; }
  .zd-plist h5 { margin:0; font:700 20px/1.1 var(--zd-display); }
  .zd-plist__count { font:500 12px var(--zd-mono); color:var(--zd-ink-3); white-space:nowrap; }
  .zd-plist .zd-micro { margin-top:6px; }
  .zd-plist__items { list-style:none; display:grid; gap:6px; margin:12px 0 0; padding:0; }
  .zd-plist__it { display:grid; grid-template-columns:32px minmax(0,1fr) auto; align-items:center; gap:10px; width:100%; min-height:54px; padding:8px 12px 8px 10px;
    text-align:left; background:var(--zd-white); border:1px solid var(--zd-line); border-radius:6px; color:var(--zd-ink); transition:border-color .15s, box-shadow .15s; }
  .zd-plist__it:hover { border-color:var(--zd-signal); }
  .zd-plist__it[aria-pressed="true"] { border-color:var(--zd-ink); box-shadow:inset 0 0 0 1px var(--zd-ink); background:var(--zd-paper); }
  .zd-plist__it .zd-grade { width:32px; height:32px; font-size:14px; }
  .zd-plist__txt { min-width:0; }
  .zd-plist__txt b { display:block; font-size:14px; font-weight:600; line-height:1.3; }
  .zd-plist__txt span { display:block; margin-top:2px; font-size:12px; line-height:1.35; color:var(--zd-ink-2); }
  .zd-plist__go { font-size:18px; font-weight:700; color:var(--zd-signal-deep); }
  .zd .zd-plist__more { width:100%; min-height:44px; margin-top:10px; padding:10px 14px; border:1.5px solid var(--zd-ink); border-radius:6px; background:transparent;
    color:var(--zd-ink); font-size:14px; font-weight:600; }
  .zd-plist__more:hover { border-color:var(--zd-signal); color:var(--zd-signal-deep); }
}
@media (max-width:359px) {
  .zd { padding:13px; }
  .zd-panel { padding:12px; }
  .zd-kpi strong { font-size:18px; }
  .zd-mini-funnel strong { font-size:17px; }
  .zd h3, .zd[data-zoom-demo="teaser"] .zd-heading h3 { font-size:29px; }
}
@media (prefers-reduced-motion:reduce) {
  .zd, .zd *, .zd-tabs *, .zd-overlay * { animation:none !important; transition:none !important; scroll-behavior:auto !important; }
}
