/* Сегодня · дашборд выборов. Всё внутри .sgd, сайт не задевается.
   Шрифты Inter и Roboto берутся с сайта.
   Тёмная тема: класс sgd--dark на контейнере или родителе, либо data-theme="dark" на <html>.
   Отступ липкой полосы под шапкой сайта: --sgd-top (по умолчанию 0). */
.sgd{
  --sgd-bg:#ffffff; --sgd-fg:#0b0d10; --sgd-ink:#333a42; --sgd-meta:#5b6672; --sgd-line:#dde1e6; --sgd-soft:#f5f7f9; --sgd-tint:#eff8fa;
  --sgd-red:#c8102e; --sgd-gold:#9c7a1f;
  --sgd-right:#2456c9; --sgd-change:#0e9a8a; --sgd-arab:#6b7280; --sgd-off:#c9ced4;
  --sgd-head:"Roboto",Arial,sans-serif; --sgd-body:"Inter",-apple-system,"Segoe UI",Helvetica,Arial,sans-serif;
  --sgd-top:0px;
  background:var(--sgd-bg);color:var(--sgd-fg);font-family:var(--sgd-body);font-size:15px;line-height:1.45;
  max-width:1180px;margin:0 auto;display:grid;gap:28px;padding-block:0 40px;
}
.sgd.sgd--dark,.sgd--dark .sgd,html[data-theme="dark"] .sgd{
  --sgd-bg:#111417; --sgd-fg:#f1f3f5; --sgd-ink:#d3d8de; --sgd-meta:#98a3ae; --sgd-line:#2a3037; --sgd-soft:#181c20; --sgd-tint:#16252a;
  --sgd-red:#ff4d63; --sgd-gold:#d6b25a; --sgd-right:#5b8cff; --sgd-change:#2fc2ad; --sgd-arab:#9aa3af; --sgd-off:#3a4048; color-scheme:dark;
}
.sgd *,.sgd *::before,.sgd *::after{box-sizing:border-box}
.sgd{max-width:1180px;margin:0 auto;padding-block:20px 56px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));display:grid;gap:28px}
.sgd h1,.sgd h2,.sgd h3{font-family:var(--sgd-head);margin:0;text-wrap:balance}
.sgd .sec-h h3{font-size:22px;font-weight:700}
.sgd .eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--sgd-meta);display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.sgd .live{color:var(--sgd-red);font-weight:600;display:inline-flex;align-items:center;gap:6px}
.sgd .live::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--sgd-red);animation:sgd-p 1.6s infinite}
@keyframes sgd-p{50%{opacity:.25}}
@media (prefers-reduced-motion:reduce){.sgd .live::before{animation:none}}
.sgd .top .title{font-size:clamp(26px,4vw,38px);font-weight:900;margin:8px 0 6px;line-height:1.1}
.sgd .top p{margin:0;margin:0;color:var(--sgd-ink);max-width:720px}
.sgd .sec-h{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap;border-top:2px solid var(--sgd-fg);padding-top:10px;margin-bottom:14px}
.sgd .sec-h .note{font-size:12px;color:var(--sgd-meta)}
.sgd .num{font-variant-numeric:tabular-nums}
/* live bar */
.sgd .livebar{position:sticky;top:var(--sgd-top);z-index:5;background:var(--sgd-fg);color:var(--sgd-bg);padding:10px 16px;display:flex;align-items:center;gap:10px 18px;flex-wrap:wrap;font-size:13px;overflow:hidden}
.sgd .lb-state{display:inline-flex;align-items:center;gap:8px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;font-size:12px}
.sgd .lb-dot{width:10px;height:10px;border-radius:50%;background:var(--sgd-off);position:relative}
.sgd .is-live .lb-dot{background:#2fd16b}
.sgd .is-live .lb-dot::after{content:"";position:absolute;inset:-5px;border-radius:50%;border:2px solid #2fd16b;animation:sgd-ring 1.8s ease-out infinite}
.sgd .is-busy .lb-dot{background:#f5b301}
.sgd .is-err .lb-dot{background:var(--sgd-red)}
@keyframes sgd-ring{from{transform:scale(.5);opacity:1}to{transform:scale(1.4);opacity:0}}
.sgd .lb-txt{opacity:.85;font-variant-numeric:tabular-nums}
.sgd .lb-chg{font-weight:600;color:#2fd16b;font-variant-numeric:tabular-nums}
.sgd .lb-chg:empty{display:none}
.sgd .lb-btn{margin-inline-start:auto;font:inherit;font-size:12px;text-transform:uppercase;letter-spacing:.05em;font-weight:600;border:1px solid var(--sgd-bg);background:transparent;color:var(--sgd-bg);padding:6px 12px;cursor:pointer}
.sgd .lb-btn:hover{background:var(--sgd-bg);color:var(--sgd-fg)}
.sgd .lb-btn:focus-visible{outline:2px solid #2fd16b;outline-offset:2px}
.sgd .lb-btn:disabled{opacity:.5;cursor:default}
.sgd .lb-prog{position:absolute;left:0;bottom:0;height:2px;background:#2fd16b;width:0}
.sgd .flash{animation:sgd-flash 1.6s ease-out}
@keyframes sgd-flash{0%{background:rgba(47,209,107,.35)}100%{background:transparent}}
.sgd .kpi small{display:block;font-size:11px;font-weight:600;color:var(--sgd-gold);min-height:14px}
@media (prefers-reduced-motion:reduce){.sgd .is-live .lb-dot::after,.sgd .flash{animation:none}}
/* KPI */
.sgd .kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-top:2px solid var(--sgd-fg);border-bottom:1px solid var(--sgd-line)}
.sgd .kpi{padding:12px 10px;border-inline-start:1px solid var(--sgd-line)}
.sgd .kpi:first-child{border-inline-start:0}
.sgd .kpi b{display:block;font-family:var(--sgd-head);font-size:26px;font-weight:700;line-height:1.1}
.sgd .kpi span{font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--sgd-meta)}
@media (max-width:760px){.sgd .kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.sgd .kpi:nth-child(odd){border-inline-start:0}.sgd .kpi:nth-child(n+3){border-top:1px solid var(--sgd-line)}.sgd .kpi:last-child{grid-column:1/-1}}
/* seat bars */
.sgd .bars{overflow-x:auto;padding-bottom:4px}
.sgd .bars-in{display:grid;grid-template-columns:repeat(13,minmax(56px,1fr));gap:6px;align-items:end;min-width:740px;height:260px}
.sgd .bar{display:grid;grid-template-rows:auto 1fr auto;height:100%;cursor:pointer;border:0;background:none;padding:0;font:inherit;color:inherit;text-align:center}
.sgd .bar:focus-visible{outline:2px solid var(--sgd-red);outline-offset:3px}
.sgd .bar .n{font-family:var(--sgd-head);font-weight:700;font-size:20px}
.sgd .bar .col{display:flex;align-items:end;justify-content:center}
.sgd .bar .fill{width:70%;max-width:46px;border-radius:4px 4px 0 0;transition:opacity .2s,height .3s}
.sgd .bar .lbl{font-size:12px;line-height:1.2;padding-top:6px;min-height:42px;color:var(--sgd-ink)}
.sgd .bar.out .n{color:var(--sgd-meta)} .sgd .bar.out .fill{background:var(--sgd-off)!important;height:3px!important}
.sgd .bar.dim .fill{opacity:.25}
.sgd .bar.in .lbl{font-weight:700;color:var(--sgd-fg)}
.sgd .bar.in .fill{box-shadow:0 0 0 2px var(--sgd-bg),0 0 0 4px var(--sgd-fg)}
.sgd .delta{font-size:11px;font-weight:600;display:block;min-height:14px}
.sgd .delta.up{color:var(--sgd-gold)} .sgd .delta.dn{color:var(--sgd-red)}
.sgd .legend{display:flex;gap:16px;flex-wrap:wrap;font-size:12px;color:var(--sgd-meta);margin-top:10px}
.sgd .legend i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-inline-end:6px;vertical-align:-1px}
/* two cols */
.sgd .two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px}
@media (max-width:860px){.sgd .two{grid-template-columns:1fr}}
/* coalition */
.sgd .coal{background:var(--sgd-tint);padding:16px;display:grid;gap:10px}
.sgd .coal .big{font-family:var(--sgd-head);font-size:48px;font-weight:900;line-height:1}
.sgd .coal .big small{font-family:var(--sgd-body);font-size:14px;color:var(--sgd-meta);font-weight:400}
.sgd .meter{height:10px;background:var(--sgd-bg);position:relative;border:1px solid var(--sgd-line)}
.sgd .meter i{position:absolute;inset:0 auto 0 0;background:var(--sgd-fg);transition:width .25s}
.sgd .meter::after{content:"61";position:absolute;left:50.83%;top:-18px;font-size:10px;color:var(--sgd-meta);transform:translateX(-50%)}
.sgd .meter b{position:absolute;left:50.83%;top:-3px;bottom:-3px;width:2px;background:var(--sgd-red)}
.sgd .tag{display:inline-block;font-size:11px;text-transform:uppercase;letter-spacing:.05em;font-weight:600}
.sgd .tag.yes{color:var(--sgd-gold)} .sgd .tag.no{color:var(--sgd-red)}
.sgd .hint{font-size:13px;color:var(--sgd-meta);margin:0}
.sgd .btns{display:flex;flex-wrap:wrap;gap:8px}
.sgd .btn{font:inherit;font-size:12px;text-transform:uppercase;letter-spacing:.04em;font-weight:600;border:1px solid var(--sgd-fg);background:transparent;color:var(--sgd-fg);padding:6px 12px;cursor:pointer}
.sgd .btn:hover{background:var(--sgd-fg);color:var(--sgd-bg)}
.sgd .btn:focus-visible,.sgd input:focus-visible,.sgd th button:focus-visible{outline:2px solid var(--sgd-red);outline-offset:2px}
/* bloc split */
.sgd .split{display:grid;gap:14px}
.sgd .split-row{display:grid;gap:6px}
.sgd .split-row .lab{display:flex;justify-content:space-between;font-size:12px;color:var(--sgd-meta);text-transform:uppercase;letter-spacing:.05em}
.sgd .stack{display:flex;height:34px;border-radius:2px;overflow:hidden}
.sgd .stack div{display:flex;align-items:center;justify-content:center;color:#fff;font-weight:600;font-size:13px;white-space:nowrap;overflow:hidden;min-width:0}
.sgd .blocs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.sgd .bloc b{font-family:var(--sgd-head);font-size:30px;font-weight:900;display:block;line-height:1}
.sgd .bloc span{font-size:12px;color:var(--sgd-ink);font-weight:600}
.sgd .bloc small{display:block;font-size:12px;color:var(--sgd-meta)}
.sgd .bloc:nth-child(2){text-align:center} .sgd .bloc:nth-child(3){text-align:right}
/* barrier watch */
.sgd .watch{display:grid;gap:12px}
.sgd .w-row{display:grid;grid-template-columns:minmax(0,150px) minmax(0,1fr) 92px;gap:10px;align-items:center;font-size:14px}
.sgd .w-track{position:relative;height:14px;background:var(--sgd-soft);border:1px solid var(--sgd-line)}
.sgd .w-track i{position:absolute;inset:0 auto 0 0}
.sgd .w-track b{position:absolute;top:-4px;bottom:-4px;width:2px;background:var(--sgd-red)}
.sgd .w-row .r{text-align:right;font-size:12px;font-weight:600}
.sgd .w-scale{display:grid;grid-template-columns:minmax(0,150px) minmax(0,1fr) 92px;gap:10px;font-size:11px;color:var(--sgd-meta)}
.sgd .w-scale div{position:relative;height:14px}
.sgd .w-scale span{position:absolute;transform:translateX(-50%)}
/* scenarios */
.sgd .scen{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px}
.sgd .sw{display:flex;gap:10px;align-items:flex-start;padding:12px;border:1px solid var(--sgd-line);background:var(--sgd-bg);cursor:pointer}
.sgd .sw input{width:18px;height:18px;accent-color:var(--sgd-red);margin-top:2px;flex-shrink:0}
.sgd .sw b{display:block;font-size:14px}
.sgd .sw small{display:block;color:var(--sgd-meta);font-size:12px}
.sgd .sw.on{border-color:var(--sgd-fg);background:var(--sgd-tint)}
.sgd .scen-out{margin-top:12px;font-size:14px;padding:12px;background:var(--sgd-soft);border-left:3px solid var(--sgd-red)}
.sgd .scen-out:empty{display:none}
/* cities */
.sgd .tbl{overflow-x:auto}
.sgd table{width:100%;border-collapse:collapse;font-size:14px;min-width:1040px}
.sgd tr.grp th{border-bottom:0;padding-bottom:2px;font-weight:700}
.sgd tr.grp th.g-c{color:var(--sgd-change);border-bottom:3px solid var(--sgd-change);text-align:center}
.sgd tr.grp th.g-r{color:var(--sgd-right);border-bottom:3px solid var(--sgd-right);text-align:center}
.sgd td.tot,.sgd th.tot{font-weight:700;background:var(--sgd-soft)}
.sgd th.grp-c+th.grp-r,.sgd td.c-last{border-inline-end:1px solid var(--sgd-line)}
.sgd th{font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--sgd-meta);font-weight:500;text-align:left;padding:8px;border-bottom:2px solid var(--sgd-fg);white-space:nowrap}
.sgd th button{all:unset;cursor:pointer}
.sgd th button::after{content:" ↕";opacity:.4}
.sgd th button.on::after{content:" ↓";opacity:1;color:inherit}
.sgd th.n,.sgd td.n{text-align:right}
.sgd td{padding:8px;border-bottom:1px solid var(--sgd-line);vertical-align:middle}
.sgd td.n{font-variant-numeric:tabular-nums;white-space:nowrap}
.sgd tr.low td{color:var(--sgd-meta)}
.sgd tr.low td:first-child::after{content:" · мало урн";font-size:11px;color:var(--sgd-red)}
.sgd .city{font-weight:600}
.sgd .lead{display:inline-flex;align-items:center;gap:6px}
.sgd .lead i{width:8px;height:8px;border-radius:50%;display:inline-block}
.sgd .yb{display:flex;align-items:center;gap:8px;justify-content:flex-end}
.sgd .yb-bar{width:90px;height:8px;background:var(--sgd-soft);position:relative}
.sgd .yb-bar i{position:absolute;inset:0 auto 0 0;background:#6e3fa8}
.sgd .yb-bar b{position:absolute;top:-3px;bottom:-3px;width:2px;background:var(--sgd-fg)}
.sgd .foot{font-size:12px;color:var(--sgd-meta);border-top:1px solid var(--sgd-line);padding-top:14px;display:grid;gap:4px}
.sgd .foot a{color:var(--sgd-meta)}

.sgd .final{color:var(--sgd-gold);font-weight:600}
.sgd h2,.sgd h3{color:var(--sgd-fg)}

/* Главная цифра: подсчитано голосов */
.sgd .hero-wrap{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:24px;align-items:end}
@media (max-width:760px){.sgd .hero-wrap{grid-template-columns:1fr}}
.sgd .hero{border-top:4px solid var(--sgd-red);padding-top:12px;display:grid;gap:8px}
.sgd .hero-l{font-size:12px;text-transform:uppercase;letter-spacing:.08em;font-weight:600;color:var(--sgd-meta)}
.sgd .hero-n{font-family:var(--sgd-head);font-weight:900;font-size:clamp(44px,7vw,68px);line-height:.95;font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.sgd .hero-s{font-size:14px;color:var(--sgd-ink)}
.sgd .hero-s b{font-family:var(--sgd-head);font-size:18px;color:var(--sgd-fg)}
.sgd .hero-bar{height:10px;background:var(--sgd-soft);border:1px solid var(--sgd-line);position:relative;overflow:hidden}
.sgd .hero-bar i{position:absolute;inset:0 auto 0 0;background:var(--sgd-red);transition:width .4s}
.sgd .hero-chg{font-size:12px;font-weight:600;color:var(--sgd-gold);min-height:16px}
