/* Кабинет Boost: компоненты поверх cab.css — логотип по теме, кнопки как акцент сайта, редактор, предпросмотр, всплывашки */

/* логотип: белый на тёмной теме, цветной на светлой */
.lg-light{display:none}
:root[data-theme="light"] .lg-dark{display:none}
:root[data-theme="light"] .lg-light{display:block}
.sidebar .brand{padding:4px 8px 0}
.sidebar .lg-logo{width:132px;height:auto}
.login-brand .lg-logo{width:186px;height:auto;margin:0 auto 14px}

/* главная кнопка — градиент сайта (#1D6DB6 → #2C3594), белый текст */
.btn-green,.btn-orange{background:var(--acc-grad);color:#fff;box-shadow:0 12px 28px -14px rgba(29,109,182,.9)}
:root[data-theme="light"] .btn-green{color:#fff}
.btn[disabled]{opacity:.55;pointer-events:none}
.btn.is-busy{position:relative;color:transparent!important}
.btn.is-busy::after{content:"";position:absolute;inset:0;margin:auto;width:16px;height:16px;border-radius:50%;border:2px solid #fff;border-right-color:transparent;animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.btn-ghost.danger:hover{color:var(--red);border-color:color-mix(in srgb,var(--red) 45%,transparent)}
:focus-visible{outline:2px solid var(--mint);outline-offset:2px}
.btn:focus-visible,.nav-item:focus-visible,.icon-btn:focus-visible{outline:2px solid var(--mint);outline-offset:2px}

/* вход */
.login-hint{margin:-4px 0 4px;color:var(--text-2);font-size:13.5px;line-height:1.5}
.login-ok{padding:12px 14px;border-radius:12px;background:color-mix(in srgb,var(--mint) 12%,transparent);color:var(--text);font-size:13.5px;line-height:1.5}
.login-error{padding:10px 14px;border-radius:12px;background:color-mix(in srgb,var(--red) 13%,transparent);color:var(--text);font-size:13.5px}
.link-btn{background:none;border:0;color:var(--muted);font-size:13px;cursor:pointer;padding:6px;margin:0 auto;display:block;text-align:center;text-decoration:none}
.link-btn:hover{color:var(--text)}
.login-card h1.login-title{margin:0}

/* каркас */
.side-site{display:block;padding:8px 12px;color:var(--muted);font-size:12.5px;text-decoration:none;border-radius:10px}
.side-site:hover{color:var(--text);background:var(--panel-hi)}
.logout{background:none;border:0;width:100%;cursor:pointer;font:inherit}
.user-chip{text-decoration:none;color:inherit}
#view:focus,#view:focus-visible{outline:none}   /* фокус переводится на контент при смене раздела — для экранных дикторов, рамка не нужна */
.loading{padding:60px 0;text-align:center;color:var(--muted)}
.grow{flex:1 1 auto}
.card-meta{color:var(--muted);font-size:12.5px}
.card-head{gap:10px;flex-wrap:wrap}
.card-title{margin:0}
.sub-title{font-size:13px;font-weight:600;color:var(--text-2);margin:20px 0 8px}
.empty-state{padding:34px 16px;text-align:center;color:var(--muted)}
.empty-state b{display:block;color:var(--text);font-weight:600;margin-bottom:6px}
.empty-state p{margin:0 auto;max-width:42ch;line-height:1.5}
.stack{display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.stack .field{width:100%}
.field-wide{grid-column:1/-1}
.row-acts{display:inline-flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.table td a{color:inherit;text-decoration:none}
.table td.td-name a:hover{color:var(--mint)}
.table tr[hidden]{display:none}
.donut-sm .donut-chart{width:120px;height:120px;flex:0 0 120px}

/* лента последних открытий */
.feed{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.feed li{display:flex;align-items:center;gap:10px;font-size:13px}
.feed-t{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.feed-dot{width:8px;height:8px;border-radius:50%;flex:0 0 8px;background:var(--mint)}
.feed-dot.m{background:var(--violet)}

/* сегментный переключатель (вместо выпадающих списков) */
.seg{display:inline-flex;padding:3px;border-radius:12px;background:var(--panel-hi);border:1px solid var(--line);gap:2px;flex-wrap:wrap}
.seg button{border:0;background:none;color:var(--text-2);font:inherit;font-size:13px;padding:7px 12px;border-radius:9px;cursor:pointer;white-space:nowrap;transition:background .15s,color .15s}
.seg button:hover{color:var(--text)}
.seg button.on{background:var(--acc-grad);color:#fff}
.seg-sm button{padding:5px 10px;font-size:12px}

/* всплывашка и модальное окно */
.toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%,12px);opacity:0;z-index:100;padding:12px 18px;border-radius:14px;
  background:var(--panel-flat);border:1px solid var(--line);box-shadow:var(--shadow);font-size:14px;transition:opacity .2s,transform .2s;max-width:calc(100vw - 32px)}
.toast.on{opacity:1;transform:translate(-50%,0)}
.toast.bad{border-color:color-mix(in srgb,var(--red) 50%,transparent)}
.modal{border:0;padding:0;background:none;color:var(--text);max-width:min(520px,calc(100vw - 32px));width:100%}
.modal::backdrop{background:rgba(5,6,9,.6);backdrop-filter:blur(4px)}
.modal-box{background:var(--panel-flat);border:1px solid var(--line);border-radius:var(--r-lg);padding:26px;box-shadow:var(--shadow)}
.modal-title{margin:0 0 8px;font-size:20px;font-weight:600}
.modal-text{margin:0 0 18px;color:var(--text-2);line-height:1.55}
.modal-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:22px;flex-wrap:wrap}
.copy-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.copy-in{flex:1 1 220px;min-width:0;padding:10px 12px;border-radius:12px;border:1px solid var(--line);background:var(--panel-hi);color:var(--text);font:inherit;font-size:13px}

/* приглашение */
.inv{display:grid;grid-template-columns:1.3fr 1fr auto auto;gap:14px;align-items:end}
.inv .field .seg{margin-top:2px}
.roles-note{margin:14px 0 0;line-height:1.55}
@media (max-width:900px){.inv{grid-template-columns:1fr}}

/* ===== редактор ===== */
.ed{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:20px;align-items:start}
.ed-form{display:flex;flex-direction:column;gap:20px;min-width:0}
.ed-side{position:sticky;top:18px;display:flex;flex-direction:column;gap:14px;min-width:0}
.ed-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:16px}
.ed-row.off{opacity:.45;pointer-events:none}
.ed-lbl{font-size:13px;color:var(--text-2);min-width:150px}
.ed-bar{display:flex;flex-direction:column;gap:12px}
.ed-link{display:flex;flex-direction:column;gap:8px}
.ed-acts .btn{width:100%}
.blk{display:grid;grid-template-columns:1fr 1fr;gap:6px 18px}
@media (max-width:640px){.blk{grid-template-columns:1fr}}
.input-num{width:96px;padding:9px 11px;border-radius:11px;border:1px solid var(--line);background:var(--panel-hi);color:var(--text);font:inherit;font-size:13.5px}
.input-num:focus{border-color:var(--mint);outline:none}

/* список продуктов */
.pl{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.pi{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:start;padding:12px 12px 12px 10px;border-radius:14px;border:1px solid var(--line);background:var(--panel-hi);transition:border-color .15s,opacity .15s}
.pi:not(.on){opacity:.62}
.pi.on{border-color:color-mix(in srgb,var(--mint) 40%,var(--line))}
.pi-chk{display:flex;align-items:center;gap:8px;cursor:pointer;padding-top:2px}
.pi-num{font-weight:700;font-size:13px;color:var(--mint);font-variant-numeric:tabular-nums}
.pi-t{font-weight:600;line-height:1.35}
.pi-p{margin-top:3px}
.pi-ctl{display:flex;flex-wrap:wrap;gap:10px 14px;align-items:center;margin-top:10px}
.pi-own{display:flex;align-items:center;gap:8px}
.pi-hide{display:flex;align-items:center;gap:6px;cursor:pointer}
.pi-mv{display:flex;flex-direction:column;gap:4px}
.pi-mv button,.stp button{width:28px;height:28px;border-radius:9px;border:1px solid var(--line);background:var(--panel-flat);color:var(--text-2);cursor:pointer;font:inherit;line-height:1}
.pi-mv button:hover:not([disabled]),.stp button:hover{color:var(--text);border-color:var(--mint)}
.pi-mv button[disabled]{opacity:.3;cursor:default}
.stp{display:inline-flex;align-items:center;gap:6px}
.stp output{min-width:22px;text-align:center;font-weight:700;font-variant-numeric:tabular-nums}

/* итог */
.tot{margin-top:18px;display:flex;flex-direction:column;gap:6px;padding:14px 16px;border-radius:14px;background:var(--panel-hi);border:1px solid var(--line)}
.tot>div{display:flex;justify-content:space-between;gap:12px;font-size:14px}
.tot>div span{color:var(--text-2)}
.tot b{font-variant-numeric:tabular-nums}
.tot-f{border-top:1px solid var(--line);padding-top:8px;margin-top:2px}
.tot-f b{font-size:17px}
.tot .tot-n{display:block}

/* предпросмотр: страница клиента в окне 1280 px, уменьшенная под колонку */
.pv{padding:14px}
.pv-head{display:flex;align-items:center;gap:10px;margin-bottom:10px;font-size:13px;font-weight:600;flex-wrap:wrap}
.pv-frame{position:relative;height:calc(100vh - 290px);min-height:420px;border-radius:14px;overflow:hidden;border:1px solid var(--line);background:#08090D}
.pv-frame iframe{position:absolute;top:0;left:0;border:0;transform-origin:0 0;background:#08090D}
.pv-frame.phone{width:100%}
.pv-frame.phone iframe{left:50%;transform-origin:50% 0;margin-left:-195px}

@media (max-width:1180px){
  .ed{grid-template-columns:1fr}
  .ed-side{position:static;order:-1}
  .pv-frame{height:62vh}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* заявки (05.11) */
.nav-badge{margin-left:auto;min-width:20px;height:20px;padding:0 6px;border-radius:10px;background:var(--acc-grad);color:#fff;font-size:11.5px;font-weight:700;display:grid;place-items:center}
.lead-row{cursor:pointer}
.lead-task{max-width:420px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.lst{display:inline-block;padding:4px 10px;border-radius:999px;font-size:12px;font-weight:600;white-space:nowrap}
.lst-new{background:var(--acc-grad);color:#fff}
.lst-work{background:color-mix(in srgb,var(--amber) 18%,transparent);color:var(--amber)}
.lst-done{background:color-mix(in srgb,var(--mint) 16%,transparent);color:var(--mint)}
.lst-spam{background:var(--panel-hi);color:var(--muted)}
.leads-last{margin-bottom:20px}
.lead-form{grid-template-columns:1fr 1fr}
.modal{max-width:min(720px,calc(100vw - 32px))}
.modal-actions .grow{flex:1}
.nav-badge[hidden]{display:none}

/* вход (вариант 1 мокапа _mock-login, выбор автора 05.11): синие пятна сайта на фоне, стеклянная карточка, ошибки полей */
.login-body{background:radial-gradient(900px 560px at 12% -10%,rgba(29,109,182,.30),transparent 60%),radial-gradient(800px 520px at 100% 110%,rgba(44,53,148,.30),transparent 60%),var(--bg)}
:root[data-theme="light"] .login-body{background:radial-gradient(900px 560px at 12% -10%,rgba(29,109,182,.14),transparent 60%),radial-gradient(800px 520px at 100% 110%,rgba(44,53,148,.12),transparent 60%),var(--bg)}
.login-card{backdrop-filter:blur(16px) saturate(1.3);-webkit-backdrop-filter:blur(16px) saturate(1.3)}
.field.er input{border-color:var(--red)!important;box-shadow:0 0 0 1px var(--red)}
.field input:disabled{opacity:.45}
.login-card .btn[disabled]{opacity:.45}

/* таблицы и панель над ними (правка автора 05.11: «лейаут поехавший»): заголовки колонок выровнены как значения, панель отделена от таблицы */
.table th.ta-r{text-align:right}
.card>.table-tools{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 14px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.table-tools .input-search{width:320px;max-width:100%}
.table-tools .muted.small{white-space:nowrap}
.table td,.table th{vertical-align:middle}

/* синий светлее и мягче (автор 05.11): градиент кнопок и акценты светлой темы */
:root{--acc-grad:linear-gradient(135deg,#3E8EE0 0%,#5965DD 100%)}
:root[data-theme="light"]{--mint:#2F80D0;--mint-2:#2673C4;--violet:#5965DD;--blue:#3E8EE0;--it-grad:linear-gradient(95deg,#3E8EE0 0%,#5965DD 100%)}
.btn-green,.btn-orange{box-shadow:0 12px 26px -14px rgba(62,142,224,.75)}

.pw-hint{display:block;margin-top:7px;font-size:12px;line-height:1.45;color:var(--muted)}

/* «Пригласить»: поля, роль и кнопка одной высоты и по одной линии (правка автора 05.11: «лейаут поехавший») */
.inv{align-items:end}
.inv .field input{height:44px;box-sizing:border-box}
.inv .seg{height:44px;box-sizing:border-box;align-items:center}
.inv .seg button{height:36px}
.inv>.btn{height:44px;align-self:end}
.inv>.field{margin-bottom:0}   /* у полей был нижний отступ 14px, кнопка «Пригласить» стояла ниже (автор 09.11) */
.inv .field>span{min-height:16px}

/* ===== меню тем (05.11): кнопка с образцом цвета и двойным шевроном, меню-стекло в стиле Apple ===== */
.thm{position:relative}
.thm-b{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 10px 0 8px;border-radius:12px;border:1px solid var(--line);background:var(--panel);color:var(--text);cursor:pointer;font:inherit;font-size:13px}
.thm-b:hover{border-color:var(--mint)}
.thm-sw{width:20px;height:20px;border-radius:50%;flex:0 0 20px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
.thm-ch{width:15px;height:15px;opacity:.6}
.thm-m{position:absolute;right:0;top:calc(100% + 8px);z-index:80;min-width:200px;margin:0;padding:6px;list-style:none;border-radius:14px;
  background:color-mix(in srgb,var(--panel-flat) 78%,transparent);backdrop-filter:blur(22px) saturate(1.6);-webkit-backdrop-filter:blur(22px) saturate(1.6);
  border:1px solid var(--line);box-shadow:0 24px 60px -18px rgba(0,0,0,.45);transform-origin:top right;animation:thmIn .17s ease-out}
.thm-m[hidden]{display:none}
@keyframes thmIn{from{opacity:0;transform:scale(.96)}}
.thm-m li{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:9px;cursor:pointer;font-size:14px;outline:none}
.thm-m li:hover,.thm-m li:focus{background:color-mix(in srgb,var(--mint) 14%,transparent)}
.thm-m li span{flex:1}
.thm-beta{flex:none;padding:2px 6px;border-radius:5px;font:600 10px/1.2 var(--f-ui,inherit);font-style:normal;letter-spacing:.04em;color:var(--muted);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--muted) 45%,transparent)}   /* пометка тем в испытании (автор 10.11) */
.thm-b .thm-beta{margin-left:-2px}
.thm-ck{width:16px;height:16px;color:var(--mint);opacity:0}
.thm-m li[aria-selected="true"] .thm-ck{opacity:1}
.login-body>.ui-switchers .thm-m{right:0}
@media (prefers-reduced-motion:reduce){.thm-m{animation:none}}
/* светлые оттенки тем (близко к стайлгайду: синий сайта, голубой, индиго, графит) */
:root[data-tint="sky"]{--bg:#EAF3FC;--mint:#2E86DE;--mint-2:#2272C4;--violet:#4FA3F0;--blue:#46A0EE;--acc-grad:linear-gradient(135deg,#46A0EE 0%,#2E7FD8 100%);--line:rgba(30,90,160,.12)}
:root[data-tint="sky"] body{background-image:radial-gradient(1100px 620px at 12% -10%,rgba(70,160,238,.20),transparent 60%),radial-gradient(900px 560px at 96% 4%,rgba(127,192,245,.22),transparent 62%)}
:root[data-tint="indigo"]{--bg:#ECEDF8;--mint:#4652C9;--mint-2:#3A45B0;--violet:#6C78E6;--blue:#5A66DE;--acc-grad:linear-gradient(135deg,#5A66DE 0%,#3B47B8 100%);--line:rgba(60,70,170,.12)}
:root[data-tint="indigo"] body{background-image:radial-gradient(1100px 620px at 12% -10%,rgba(90,102,222,.18),transparent 60%),radial-gradient(900px 560px at 96% 4%,rgba(129,137,218,.18),transparent 62%)}
:root[data-tint="graphite"]{--bg:#ECEEF1;--mint:#2F80D0;--mint-2:#2673C4;--violet:#3E4656;--blue:#2F80D0;--acc-grad:linear-gradient(135deg,#2B313C 0%,#3E4656 100%);--line:rgba(23,24,28,.11)}
:root[data-tint="graphite"] body{background-image:radial-gradient(1100px 620px at 12% -10%,rgba(47,128,208,.10),transparent 60%),radial-gradient(900px 560px at 96% 4%,rgba(43,49,60,.08),transparent 62%)}
:root[data-tint="graphite"] .nav-item.active{background:rgba(43,49,60,.08)}

/* ===== карта стран и аналитика (05.11) ===== */
.geo{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(240px,1fr);gap:24px;align-items:center}
.geo-map{height:340px;position:relative}
.geo-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;max-height:340px;overflow:auto}
.geo-list li{position:relative;display:grid;grid-template-columns:30px 1fr auto;gap:10px;align-items:center;padding:7px 10px;border-radius:9px;font-size:13.5px;overflow:hidden}
.geo-list li i{position:absolute;left:0;top:0;bottom:0;background:color-mix(in srgb,var(--mint) 12%,transparent);z-index:0;border-radius:9px}
.geo-list li>*:not(i){position:relative;z-index:1}
.geo-f{font-size:11.5px;font-weight:700;color:var(--muted)}
.jvm-tooltip{font-family:var(--f-ui);font-size:12.5px;padding:6px 10px;border-radius:8px;background:var(--panel-flat);color:var(--text);border:1px solid var(--line);box-shadow:var(--shadow)}
.an-top{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:16px}
.an-top p{margin:0;max-width:70ch}
.kpi-6{grid-template-columns:repeat(4,1fr)}
.an-t td:first-child{width:62%}
.an-bar{position:relative;padding:4px 8px;border-radius:8px;overflow:hidden}
.an-bar i{position:absolute;left:0;top:0;bottom:0;background:color-mix(in srgb,var(--mint) 13%,transparent);border-radius:8px}
.an-bar span{position:relative}
.cards-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:20px}
.chart-sm{height:200px}
.legend .dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin:0 4px 0 12px;vertical-align:middle}
.card+.card,.cards-2+.card,.card+.cards-2,.cards-2+.cards-2,.kpi-grid+.card{margin-top:20px}
@media (max-width:1100px){.geo,.cards-3{grid-template-columns:1fr}.kpi-6{grid-template-columns:repeat(2,1fr)}}
/* карта: размер задаёт контейнер, а не svg библиотеки (иначе колонка сетки раздувается) */
.geo{grid-template-columns:minmax(0,1.7fr) minmax(0,1fr)}
.geo-map,.geo-map.jvm-container{height:340px;min-width:0;overflow:hidden;position:relative}
.geo-map svg{position:absolute;inset:0;width:100%!important;height:100%!important}

/* активные ссылки на презентации (05.11) */
.kpi-3{grid-template-columns:repeat(3,1fr);margin-bottom:20px}
.p-sw{gap:10px;margin:0}
.p-sw .switch-label{font-size:13px}
.p-slug{margin-top:3px}
.table tr.p-off td{opacity:.6}
.table tr.p-off td:nth-child(5){opacity:1}

/* «Сохранить» и «Предпросмотр в новой вкладке» — по половине ширины (05.11) */
.ed-acts{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ed-acts .btn{width:100%;justify-content:center}

/* ночная тема светлее и с матовым стеклом (автор 05.11): фон графитовый, а не чёрный, карточки — полупрозрачные с размытием */
:root[data-theme="dark"]{--bg:#12151C;--bg-2:#171B24;--panel:rgba(38,44,58,.52);--panel-flat:#1C212C;--panel-hi:rgba(255,255,255,.05);--line:rgba(255,255,255,.10);--line-soft:rgba(255,255,255,.06);--muted:rgba(242,244,247,.58)}
:root[data-theme="dark"] body{background-color:#12151C;background-image:radial-gradient(1100px 640px at 10% -10%,rgba(62,142,224,.30),transparent 60%),radial-gradient(900px 560px at 96% 6%,rgba(89,101,221,.26),transparent 62%),radial-gradient(800px 560px at 50% 115%,rgba(114,176,233,.14),transparent 60%)}
:root[data-theme="dark"] .card,:root[data-theme="dark"] .kpi,:root[data-theme="dark"] .login-card{background:rgba(38,44,58,.52);backdrop-filter:blur(22px) saturate(1.4);-webkit-backdrop-filter:blur(22px) saturate(1.4);border-color:rgba(255,255,255,.10);box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 20px 50px -30px rgba(0,0,0,.7)}
:root[data-theme="dark"] .sidebar{background:rgba(22,26,34,.72);backdrop-filter:blur(22px) saturate(1.3);-webkit-backdrop-filter:blur(22px) saturate(1.3)}

/* обзор: «Открытия по странам», «Чаще всего открывают», «Устройства» — в один ряд (автор 05.11); карта над списком стран */
.dash-row{grid-template-columns:1.25fr 1fr 1fr;align-items:stretch}
.dash-row .geo{grid-template-columns:1fr;gap:12px}
.dash-row .geo-map,.dash-row .geo-map.jvm-container{height:230px}
.dash-row .geo-list{max-height:170px}
@media (max-width:1300px){.dash-row{grid-template-columns:1fr 1fr}.dash-row>.card:first-child{grid-column:1/-1}}
@media (max-width:800px){.dash-row{grid-template-columns:1fr}}

/* ===================================================================================================
   Стили мокапов _mock-dash2 (выбор автора 05.11): вариант 1 «Графит» — светлый и тёмный режимы.
   Только оформление: разделы, данные и разметка кабинета прежние. Оттенки светлой (Синяя/Небо/Индиго/Графит) остаются
   и работают через --mint/--bg из data-tint.
   =================================================================================================== */
/* общее: шрифтовые подписи без капса, как в мокапе */
.eyebrow,.kpi-label,.table th,.side-label,.card-meta{text-transform:none;letter-spacing:0;font-weight:500}
.eyebrow{font-size:13px}.kpi-label{font-size:14px}.table th{font-size:13px}.side-label{font-size:12px;letter-spacing:.06em}
.page-title{font-size:26px;font-weight:600;letter-spacing:-.02em}
.card,.kpi{border-radius:18px}
.kpi-value{font-size:32px;font-weight:600;letter-spacing:-.02em}
.kpi-delta.up{color:#22B07D}.kpi-delta.down{color:#E5484D}
.table th{background:var(--panel-hi);padding:12px}
.table th:first-child{border-radius:10px 0 0 10px}.table th:last-child{border-radius:0 10px 10px 0}
.table tbody tr{transition:background .2s}.table tbody tr:hover td{background:var(--panel-hi)}
.topbar{position:sticky;top:0;z-index:15;border-bottom:0;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);background:color-mix(in srgb,var(--bg) 78%,transparent)}
.nav-item{border-radius:11px}.nav-item.active{font-weight:600}
.nav-item.active::before{display:none}

/* ---------- светлые темы: вариант 1 «Графит», светлый режим (автор 05.11: «v=1 применяй, в светлой оставь оттенки») ----------
   Сплошные белые карточки на светло-сером фоне, тонкие рамки, тёмная главная кнопка. Без стекла и пятен.
   Цветные оттенки из меню тем (Небо/Индиго/Графит) красят фон, активный пункт меню и акценты своим цветом. */
:root[data-theme="light"]{--bg:#F4F5F7;--panel:#FFFFFF;--panel-flat:#FFFFFF;--panel-hi:#F6F7F9;--line:rgba(23,24,28,.09);--line-soft:rgba(23,24,28,.05);--text:#17181C;--text-2:#3F434C;--muted:#6B7280}
:root[data-theme="light"][data-tint="sky"]{--bg:#EDF4FC;--panel-hi:#F3F8FD;--line:rgba(30,90,160,.11)}
:root[data-theme="light"][data-tint="indigo"]{--bg:#EFF0FA;--panel-hi:#F5F5FC;--line:rgba(60,70,170,.11)}
:root[data-theme="light"][data-tint="graphite"]{--bg:#EEEFF2;--panel-hi:#F5F6F8}
:root[data-theme="light"] body{background:var(--bg);background-image:none}
:root[data-theme="light"] .card,:root[data-theme="light"] .kpi,:root[data-theme="light"] .login-card,:root[data-theme="light"] .modal-box{background:#fff;backdrop-filter:none;-webkit-backdrop-filter:none;border:1px solid var(--line);box-shadow:none}
:root[data-theme="light"] .sidebar{background:var(--bg);backdrop-filter:none;-webkit-backdrop-filter:none;border-right:1px solid var(--line)}
:root[data-theme="light"] .nav-item.active{background:#fff;color:var(--text);box-shadow:0 0 0 1px var(--line)}
:root[data-theme="light"][data-tint] .nav-item.active{background:color-mix(in srgb,var(--mint) 11%,#fff);color:var(--mint-2);box-shadow:none}
:root[data-theme="light"] .table th{background:var(--panel-hi)}
:root[data-theme="light"] .table td{border-color:var(--line-soft)}
:root[data-theme="light"] .field input,:root[data-theme="light"] .field select,:root[data-theme="light"] .field textarea,:root[data-theme="light"] .input-search,:root[data-theme="light"] .input-num,:root[data-theme="light"] .copy-in{background:#fff;border-color:var(--line)}
/* главная кнопка — тёмная заливка, как «Новая презентация» в мокапе; в цветных оттенках — цвет оттенка */
:root[data-theme="light"] .btn-green,:root[data-theme="light"] .btn-orange{background:#17181C;color:#fff;box-shadow:none}
:root[data-theme="light"] .btn-green:hover{background:#2B2D33}
:root[data-theme="light"] .seg button.on{background:#17181C;color:#fff}
:root[data-theme="light"][data-tint="sky"] .btn-green,:root[data-theme="light"][data-tint="indigo"] .btn-green,:root[data-theme="light"][data-tint="sky"] .seg button.on,:root[data-theme="light"][data-tint="indigo"] .seg button.on{background:var(--mint);color:#fff}
:root[data-theme="light"][data-tint="sky"] .btn-green:hover,:root[data-theme="light"][data-tint="indigo"] .btn-green:hover{background:var(--mint-2)}
:root[data-theme="light"] .btn-ghost{background:#fff;border-color:var(--line)}
:root[data-theme="light"] .thm-b{background:#fff;border-color:var(--line)}

/* ---------- сайдбар сворачивается влево (автор 05.11) ---------- */
.sidebar{transition:width .28s cubic-bezier(.2,.7,.2,1),flex-basis .28s cubic-bezier(.2,.7,.2,1),padding .28s}
.side-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.side-top .brand{min-width:0}
/* кнопка заметная: стеклянный квадрат с рамкой (автор 05.11: «не вижу кнопки свернуть») */
.sb-tog{flex:none;width:38px;height:38px;border-radius:12px;display:grid;place-items:center;color:var(--text);cursor:pointer;
  background:linear-gradient(160deg,rgba(255,255,255,.85),rgba(255,255,255,.45));border:0;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 0 0 1px rgba(23,24,28,.10),0 6px 14px -8px rgba(20,30,60,.35);transition:transform .2s,background .2s}
.sb-tog:hover{transform:translateY(-1px);background:#fff}
:root[data-theme="dark"] .sb-tog{background:linear-gradient(160deg,rgba(255,255,255,.14),rgba(255,255,255,.04));box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 0 0 1px rgba(255,255,255,.10)}
:root[data-theme="dark"] .sb-tog:hover{background:rgba(255,255,255,.18)}
.sb-tog:focus-visible{outline:2px solid var(--mint);outline-offset:2px}
.sb-tog svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;transition:transform .28s}
:root.sb-min,:root.sb-min[data-theme]{--sidebar-w:76px}
.sb-min .sidebar{padding-left:12px;padding-right:12px}
.sb-min .side-top{flex-direction:column;gap:14px}
.sb-min .side-top .brand{display:none}
.sb-min .sb-tog svg{transform:scaleX(-1)}
.sb-min .side-label,.sb-min .nav-item span,.sb-min .logout span,.sb-min .side-site{display:none}
.sb-min .nav{gap:10px;align-items:center}
/* свёрнутый сайдбар: крупные иконки на стеклянных кнопках (liquid glass, автор 05.11) */
.sb-min .nav-item{justify-content:center;padding:0;width:48px;height:48px;border-radius:16px;
  background:linear-gradient(160deg,rgba(255,255,255,.78),rgba(255,255,255,.38));backdrop-filter:blur(14px) saturate(1.8);-webkit-backdrop-filter:blur(14px) saturate(1.8);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95),inset 0 -1px 0 rgba(23,24,28,.06),0 0 0 1px rgba(23,24,28,.07),0 8px 18px -10px rgba(20,30,60,.35);
  transition:transform .2s cubic-bezier(.2,.7,.2,1),box-shadow .2s,background .2s}
.sb-min .nav-item svg{width:22px;height:22px;flex-basis:22px;opacity:.8}
.sb-min .nav-item:hover{transform:translateY(-1px);background:linear-gradient(160deg,rgba(255,255,255,.95),rgba(255,255,255,.5))}
.sb-min .nav-item.active,:root[data-theme="light"].sb-min .nav-item.active,:root[data-theme="light"][data-tint].sb-min .nav-item.active{color:#fff;
  background:linear-gradient(160deg,color-mix(in srgb,var(--mint) 78%,#fff),var(--mint-2));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55),inset 0 -2px 6px rgba(0,0,0,.12),0 10px 22px -10px color-mix(in srgb,var(--mint) 70%,transparent)}
.sb-min .nav-item.active svg{fill:#fff;opacity:1}
:root[data-theme="dark"].sb-min .nav-item{background:linear-gradient(160deg,rgba(255,255,255,.12),rgba(255,255,255,.03));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 0 0 1px rgba(255,255,255,.08),0 10px 22px -12px rgba(0,0,0,.8)}
:root[data-theme="dark"].sb-min .nav-item:hover{background:linear-gradient(160deg,rgba(255,255,255,.18),rgba(255,255,255,.06))}
:root[data-theme="dark"].sb-min .nav-item.active{background:linear-gradient(160deg,#5AA2EC,#2F80D0)}
@media (prefers-reduced-motion:reduce){.sb-min .nav-item{transition:none}.sb-min .nav-item:hover{transform:none}}
.sb-min .nav-badge{position:absolute;top:2px;right:2px;min-width:16px;height:16px;padding:0 4px;font-size:10px}
.sb-min .logout{justify-content:center;width:100%}
@media (max-width:900px){.sb-tog{display:none}}
@media (prefers-reduced-motion:reduce){.sidebar,.sb-tog svg{transition:none}}

/* ---------- крупнее шрифт и единая сетка (автор 05.11: «шрифт крупнее и выровняй по сетке, чтоб не плясал») ----------
   Один шаг 20px между всеми блоками страницы и внутри рядов; одинаковые поля у карточек и KPI; добавочные margin-top убраны,
   отступы задаёт только gap контейнера. */
.content{gap:20px;padding:8px 32px 44px}
.content>*{margin-top:0!important;margin-bottom:0!important}
.kpi-grid,.cards-2,.cards-3,.kpi-3,.kpi-6{gap:20px;align-items:stretch}
/* карточки в одном ряду начинаются на одной линии и одинаковой высоты (автор 05.11) */
.kpi-grid>*,.cards-2>*,.cards-3>*,.kpi-3>*,.kpi-6>*{margin:0!important;height:auto;align-self:stretch}
.card{padding:24px}
.kpi{padding:22px 24px}
.card-head{margin-bottom:18px;min-height:32px}
.card-title{font-size:18px}
.nav-item{font-size:14.5px}
.eyebrow{font-size:13.5px}
.page-title{font-size:28px}
.kpi-label{font-size:15px}
.kpi-value{font-size:34px;margin-top:10px}
.kpi-sub,.kpi-delta{font-size:13px}
.legend{font-size:13px}
.table{font-size:14.5px}
.table th{font-size:13.5px}
.table td{padding:14px 12px}
.small{font-size:13px}
.card-meta{font-size:13px}
.geo-list li{font-size:14.5px}

/* ---------- тёмная тема: «Графит» ---------- */
:root[data-theme="dark"]{--bg:#0E0F12;--bg-2:#141519;--panel:#141519;--panel-flat:#141519;--panel-hi:#1B1D22;--line:rgba(255,255,255,.08);--line-soft:rgba(255,255,255,.05);--text:#F2F4F7;--text-2:rgba(242,244,247,.75);--muted:rgba(242,244,247,.55);--mint:#3E8EE0;--violet:#8189DA}
:root[data-theme="dark"] body{background:#0E0F12;background-image:none}
:root[data-theme="dark"] .card,:root[data-theme="dark"] .kpi,:root[data-theme="dark"] .login-card,:root[data-theme="dark"] .modal-box{background:#141519;backdrop-filter:none;-webkit-backdrop-filter:none;border:1px solid rgba(255,255,255,.08);box-shadow:none}
:root[data-theme="dark"] .sidebar{background:#0E0F12;backdrop-filter:none;-webkit-backdrop-filter:none;border-right:1px solid rgba(255,255,255,.08)}
:root[data-theme="dark"] .nav-item.active{background:#1B1D22;color:var(--text)}
:root[data-theme="dark"] .btn-green,:root[data-theme="dark"] .btn-orange{background:#fff;color:#0E0F12;box-shadow:none}
:root[data-theme="dark"] .btn-green:hover{background:#E6ECF5}
:root[data-theme="dark"] .seg button.on{background:#fff;color:#0E0F12}
:root[data-theme="dark"] .login-body{background:#0E0F12}

/* ---------- заявки: колонки под все поля форм сайта (05.11) ---------- */
.lead-tbl td{vertical-align:top}
.lead-tbl .lead-task{min-width:220px;max-width:340px}
.lead-tbl .lead-sv{min-width:160px;max-width:260px;font-size:13px;color:var(--text-2)}

/* ---------- меню тем — матовое стекло во всех темах (автор 05.11) ---------- */
.thm-b{background:linear-gradient(160deg,rgba(255,255,255,.72),rgba(255,255,255,.38));backdrop-filter:blur(18px) saturate(1.6);-webkit-backdrop-filter:blur(18px) saturate(1.6);
  border:0;box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 0 0 1px rgba(23,24,28,.08),0 6px 16px -10px rgba(20,30,60,.3)}
.thm-m{background:rgba(246,247,249,.55);backdrop-filter:blur(28px) saturate(1.7);-webkit-backdrop-filter:blur(28px) saturate(1.7);
  border:0;box-shadow:inset 0 1px 0 rgba(255,255,255,.85),0 0 0 1px rgba(23,24,28,.08),0 28px 60px -20px rgba(20,30,60,.35)}
.thm-m li:hover,.thm-m li:focus{background:rgba(255,255,255,.55)}
.thm-m li[aria-selected="true"]{background:rgba(255,255,255,.7)}
:root[data-theme="dark"] .thm-b{background:linear-gradient(160deg,rgba(255,255,255,.12),rgba(255,255,255,.04));box-shadow:inset 0 1px 0 rgba(255,255,255,.15),0 0 0 1px rgba(255,255,255,.08)}
:root[data-theme="dark"] .thm-m{background:rgba(28,30,36,.55);box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 0 0 1px rgba(255,255,255,.08),0 28px 60px -20px rgba(0,0,0,.8)}
:root[data-theme="dark"] .thm-m li:hover,:root[data-theme="dark"] .thm-m li:focus,:root[data-theme="dark"] .thm-m li[aria-selected="true"]{background:rgba(255,255,255,.08)}

/* ---------- тема «Серая» — по умолчанию (автор 05.11): тона сайта, всё матовое стекло ----------
   Фон — мягкие серые пятна с лёгким синим сайта, чтобы стекло было видно; сайдбар — серое стекло;
   карточки дашборда — стекло разных оттенков серого (KPI светлее, ряды графиков — средний, нижний ряд — темнее). */
:root[data-tint="grey"]{--bg:#E3E6EB;--panel:rgba(246,247,249,.55);--panel-flat:#F3F4F6;--panel-hi:rgba(255,255,255,.45);--line:rgba(23,24,28,.08);--line-soft:rgba(23,24,28,.05);
  --text:#17181C;--text-2:#3F434C;--muted:#6B7280;--mint:#2F80D0;--mint-2:#1D6DB6;--violet:#8A93A3;--blue:#2F80D0;--acc-grad:linear-gradient(135deg,#3E4656 0%,#17181C 100%)}
:root[data-tint="grey"] body{background:
  radial-gradient(900px 620px at 8% -6%,rgba(255,255,255,.9),transparent 60%),
  radial-gradient(800px 600px at 92% 8%,rgba(47,128,208,.12),transparent 62%),
  radial-gradient(900px 700px at 70% 105%,rgba(150,158,172,.45),transparent 60%),
  radial-gradient(700px 520px at 20% 85%,rgba(196,202,212,.7),transparent 62%),#E3E6EB;background-attachment:fixed}
:root[data-tint="grey"] .sidebar{background:rgba(214,218,225,.42);backdrop-filter:blur(30px) saturate(1.5);-webkit-backdrop-filter:blur(30px) saturate(1.5);
  border-right:0;box-shadow:inset -1px 0 0 rgba(255,255,255,.6),1px 0 0 rgba(23,24,28,.06)}
:root[data-tint="grey"] .topbar{background:rgba(227,230,235,.55)}
:root[data-tint="grey"] .card,:root[data-tint="grey"] .kpi,:root[data-tint="grey"] .login-card,:root[data-tint="grey"] .modal-box{
  background:rgba(246,247,249,.52);backdrop-filter:blur(24px) saturate(1.5);-webkit-backdrop-filter:blur(24px) saturate(1.5);border:0;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85),0 0 0 1px rgba(23,24,28,.06),0 18px 40px -28px rgba(20,30,60,.4)}
:root[data-tint="grey"] .kpi{background:rgba(255,255,255,.58)}
:root[data-tint="grey"] .cards-2>.card:nth-child(2),:root[data-tint="grey"] .cards-3>.card:nth-child(2){background:rgba(236,238,242,.55)}
:root[data-tint="grey"] .cards-3>.card:nth-child(3){background:rgba(226,229,234,.58)}
:root[data-tint="grey"] .content>.card{background:rgba(240,242,245,.55)}
:root[data-tint="grey"] .modal-box{background:rgba(244,245,247,.82)}
:root[data-tint="grey"] .nav-item.active{background:rgba(255,255,255,.62);color:var(--text);box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 0 0 1px rgba(23,24,28,.06)}
:root[data-tint="grey"] .nav-item.active svg{fill:var(--mint)}
:root[data-tint="grey"] .table th{background:rgba(255,255,255,.45)}
:root[data-tint="grey"] .field input,:root[data-tint="grey"] .field select,:root[data-tint="grey"] .field textarea,:root[data-tint="grey"] .input-search,:root[data-tint="grey"] .input-num,:root[data-tint="grey"] .copy-in{background:rgba(255,255,255,.55);border-color:rgba(23,24,28,.09)}
:root[data-tint="grey"] .btn-ghost{background:rgba(255,255,255,.5);border-color:rgba(23,24,28,.09)}
:root[data-tint="grey"] .btn-green,:root[data-tint="grey"] .btn-orange,:root[data-tint="grey"] .seg button.on{background:#17181C;color:#fff}
:root[data-tint="grey"] .btn-green:hover{background:#2B2D33}
:root[data-tint="grey"] .user-chip{background:rgba(255,255,255,.5);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}

/* ---------- шапка: язык, тема и пользователь — одной панелью из матового стекла (автор 05.11) ---------- */
.top-panel{display:inline-flex;align-items:center;gap:4px;padding:5px;border-radius:999px;
  background:linear-gradient(160deg,rgba(255,255,255,.66),rgba(255,255,255,.34));backdrop-filter:blur(22px) saturate(1.6);-webkit-backdrop-filter:blur(22px) saturate(1.6);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 0 0 1px rgba(23,24,28,.07),0 10px 26px -16px rgba(20,30,60,.35)}
.top-panel>*+*{position:relative;margin-left:6px}
.top-panel>*+*::before{content:"";position:absolute;left:-6px;top:8px;bottom:8px;width:1px;background:rgba(23,24,28,.10)}
.top-panel .thm-b,.top-panel .user-chip,:root[data-tint="grey"] .top-panel .user-chip{background:none;border:0;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;height:40px;border-radius:999px}
.top-panel .thm-b:hover,.top-panel .user-chip:hover{background:rgba(255,255,255,.6)}
.top-panel .user-chip{padding:3px 14px 3px 3px}
.lng{display:inline-flex;gap:2px}
.lng button{font:inherit;font-size:12.5px;font-weight:600;letter-spacing:.02em;height:34px;padding:0 11px;border-radius:999px;border:0;background:none;color:var(--muted);cursor:pointer;transition:background .2s,color .2s}
.lng button:hover{color:var(--text)}
.lng button.on{background:#17181C;color:#fff}
.lng button:focus-visible{outline:2px solid var(--mint);outline-offset:2px}
:root[data-theme="dark"] .top-panel{background:linear-gradient(160deg,rgba(255,255,255,.10),rgba(255,255,255,.03));box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 0 0 1px rgba(255,255,255,.08)}
:root[data-theme="dark"] .top-panel>*+*::before{background:rgba(255,255,255,.12)}
:root[data-theme="dark"] .top-panel .thm-b:hover,:root[data-theme="dark"] .top-panel .user-chip:hover{background:rgba(255,255,255,.08)}
:root[data-theme="dark"] .lng button.on{background:#fff;color:#0E0F12}
.login-body>.ui-switchers.top-panel{gap:4px}

/* ---------- виджеты дашборда как в мокапе _mock-dash2 (автор 05.11) ---------- */
.card.w{display:flex;flex-direction:column}
.w-head{gap:12px;align-items:center;flex-wrap:nowrap}
.w-head .card-title{font-size:18px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.w-ic{flex:none;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;color:var(--text);
  background:linear-gradient(160deg,rgba(255,255,255,.8),rgba(255,255,255,.4));box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 0 0 1px rgba(23,24,28,.08)}
.w-ic svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.w-more{flex:none;width:32px;height:32px;border-radius:10px;display:grid;place-items:center;color:var(--muted);transition:background .2s,color .2s}
.w-more:hover{background:var(--panel-hi);color:var(--text)}
.w-more svg{width:18px;height:18px;fill:currentColor}
.w-foot{margin-top:auto;padding-top:18px;display:flex;align-items:center;gap:8px;font-size:13.5px;color:var(--muted)}
.w-foot svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linejoin:round}
.w-head .card-meta{white-space:nowrap}
:root[data-theme="dark"] .w-ic{background:linear-gradient(160deg,rgba(255,255,255,.12),rgba(255,255,255,.04));box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 0 0 1px rgba(255,255,255,.08)}
/* донат и легенда: число в центре крупно, подпись без капса; легенда — цветные чёрточки, число справа */
.card.w .donut-row{gap:40px;flex:1}
.card.w .donut-num{font-size:40px;font-weight:600;letter-spacing:-.02em;color:var(--text)}
.card.w .donut-cap{font-size:14px;letter-spacing:0;text-transform:none;margin-top:6px}
.w-legend{gap:12px}
.card.w .w-legend li{font-size:15px;color:var(--text);gap:14px}
.w-legend .bar{flex:0 0 4px;width:4px;height:20px;border-radius:2px}
.card.w .w-legend b{color:var(--text);font-weight:600;font-size:15px}

/* ---------- уведомления о действиях (автор 05.11): тёмное серое матовое стекло, синяя галочка с ореолом, стопка справа сверху ---------- */
.toasts{position:fixed;top:18px;right:18px;z-index:200;display:flex;flex-direction:column;gap:12px;width:min(420px,calc(100vw - 36px));pointer-events:none}
.tst{pointer-events:auto;display:flex;align-items:center;gap:16px;padding:16px 16px 16px 18px;border-radius:16px;color:#F2F4F7;font-size:15.5px;line-height:1.35;font-weight:500;
  background:linear-gradient(160deg,rgba(52,56,64,.78),rgba(28,30,35,.82));backdrop-filter:blur(26px) saturate(1.5);-webkit-backdrop-filter:blur(26px) saturate(1.5);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 0 0 1px rgba(255,255,255,.06),0 18px 40px -18px rgba(0,0,0,.55);
  opacity:0;transform:translateY(-10px) scale(.98);transition:opacity .22s ease-out,transform .26s cubic-bezier(.2,.8,.2,1)}
.tst.on{opacity:1;transform:none}
.tst.off{opacity:0;transform:translateX(16px)}
.tst-ic{flex:none;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle,rgba(62,142,224,.28),rgba(62,142,224,.10) 70%)}
.tst-ic svg{width:28px;height:28px;padding:5px;border-radius:50%;background:linear-gradient(160deg,#5AA8F0,#2F80D0);box-shadow:0 0 14px rgba(62,142,224,.6);
  fill:none;stroke:#0E1B3D;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;box-sizing:border-box}
.tst.bad .tst-ic{background:radial-gradient(circle,rgba(240,106,122,.26),rgba(240,106,122,.08) 70%)}
.tst.bad .tst-ic svg{background:linear-gradient(160deg,#F58A97,#E5484D);box-shadow:0 0 14px rgba(229,72,77,.55);stroke:#3A0D12}
.tst-t{flex:1;min-width:0}
.tst-x{flex:none;width:34px;height:34px;border-radius:10px;border:0;background:none;color:rgba(242,244,247,.75);cursor:pointer;display:grid;place-items:center;transition:background .2s,color .2s}
.tst-x:hover{background:rgba(255,255,255,.08);color:#fff}
.tst-x:focus-visible{outline:2px solid #72B0E9;outline-offset:2px}
.tst-x svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
@media (prefers-reduced-motion:reduce){.tst{transition:opacity .15s}.tst,.tst.off{transform:none}}

/* ---------- Motion Design System, вариант 3 «Стекло и свет» в замедлении ×2 (выбор автора 06.11: сначала ×4, потом «сделай x2»; мокап _mock-motion?v=3) ----------
   Все длительности — базовое значение × --k. Ускорить или замедлить всё разом — поменять одно число --k (1 — темп мокапа, 2 — выбор автора).
   Кривые: вход — экспо-выход, уход — быстрее входа. Размытие — только на появлении (меню, окно, уведомление, раздел). */
:root{--k:2;
  --t-hover:calc(180ms*var(--k));--t-press:calc(120ms*var(--k));--t-dd:calc(220ms*var(--k));--t-modal:calc(280ms*var(--k));
  --t-card:calc(280ms*var(--k));--t-page:calc(280ms*var(--k));--t-toast:calc(300ms*var(--k));
  --e-out:cubic-bezier(.16,1,.3,1);--e-in:cubic-bezier(.7,0,.84,0);--e-io:cubic-bezier(.83,0,.17,1);--e-emph:cubic-bezier(.16,1,.3,1);
  --lift:2px;--press:.98;--blur:8px}
/* кнопки: подъём на наведении, сжатие на нажатии, блик по стеклу, светящийся фокус */
.btn{position:relative;overflow:hidden;transition:transform var(--t-hover) var(--e-out),box-shadow var(--t-hover) var(--e-out),background var(--t-hover) var(--e-out),color var(--t-hover) var(--e-out),border-color var(--t-hover) var(--e-out),opacity var(--t-hover) var(--e-out)}
.btn:hover{transform:translateY(calc(var(--lift)*-1))}
.btn:active{transform:scale(var(--press));transition-duration:var(--t-press)}
.btn::before{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.45) 50%,transparent 70%);transform:translateX(-120%);pointer-events:none}
.btn:hover::before{transform:translateX(120%);transition:transform calc(700ms*var(--k)) var(--e-out)}
.btn[disabled]::before,.btn.is-busy::before{display:none}
.btn:focus-visible{box-shadow:0 0 0 4px color-mix(in srgb,var(--mint) 22%,transparent),0 0 22px 4px color-mix(in srgb,var(--mint) 40%,transparent)}
/* меню, вкладки, ссылки виджетов, строки таблиц — плавная смена фона и цвета */
.nav-item,.seg button,.lng button,.w-more,.tst-x,.icon-btn,.sb-tog,.thm-m li{transition:background var(--t-hover) var(--e-out),color var(--t-hover) var(--e-out),transform var(--t-hover) var(--e-out),box-shadow var(--t-hover) var(--e-out)}
.table tbody tr,.table tbody td{transition:background var(--t-hover) var(--e-out)}
.sidebar{transition:width var(--t-card) var(--e-io),flex-basis var(--t-card) var(--e-io),padding var(--t-card) var(--e-io)}
.sb-tog svg{transition:transform var(--t-card) var(--e-io)}
/* карточки с цифрами чуть поднимаются под курсором */
.kpi{transition:transform var(--t-card) var(--e-out),box-shadow var(--t-card) var(--e-out)}
.kpi:hover{transform:translateY(calc(var(--lift)*-1));box-shadow:0 18px 34px -20px rgba(20,30,60,.35)}
/* выпадающее меню темы — проявляется из размытия */
.thm-m{animation:mxDd var(--t-dd) var(--e-emph) both}
@keyframes mxDd{from{opacity:0;transform:scale(.96) translateY(-4px);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
/* модальное окно: фон темнеет, окно проявляется из размытия */
.modal[open] .modal-box{animation:mxMd var(--t-modal) var(--e-emph) both}
.modal[open]::backdrop{animation:mxFade var(--t-modal) var(--e-out) both}
@keyframes mxMd{from{opacity:0;transform:scale(.94) translateY(10px);filter:blur(10px)}to{opacity:1;transform:none;filter:none}}
@keyframes mxFade{from{opacity:0}}
/* уведомления: приходят из размытия, уходят вправо быстрее, чем пришли */
.tst{filter:blur(var(--blur));transition:opacity var(--t-toast) var(--e-out),transform var(--t-toast) var(--e-emph),filter var(--t-toast) var(--e-out)}
.tst.on{filter:none}
.tst.off{filter:none;transition-duration:calc(var(--t-toast)*.7);transition-timing-function:var(--e-in)}
/* смена раздела: содержимое проявляется снизу из размытия, блоки — лёгкой волной */
.content>*:not(.loading){animation:mxPg var(--t-page) var(--e-out) both}
.content>*:nth-child(2){animation-delay:calc(40ms*var(--k))}
.content>*:nth-child(3){animation-delay:calc(80ms*var(--k))}
.content>*:nth-child(n+4){animation-delay:calc(120ms*var(--k))}
@keyframes mxPg{from{opacity:0;transform:translateY(8px);filter:blur(var(--blur))}to{opacity:1;transform:none;filter:none}}
/* загрузка в кнопке */
.btn.is-busy::after{animation-duration:calc(700ms*var(--k))}
@media (prefers-reduced-motion:reduce){.thm-m,.modal[open] .modal-box,.modal[open]::backdrop,.content>*:not(.loading){animation:none}.tst{filter:none}.btn:hover,.kpi:hover{transform:none}.btn::before{display:none}}
/* ошибка входа читается в любой теме (замечание автора 06.11: розовое на розовом): в cab.css цвет из тёмной темы с !important */
.login-error{color:var(--text)!important;background:color-mix(in srgb,var(--red) 10%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--red) 32%,transparent)}
:root[data-theme="light"] .login-error{color:#8E1F2C!important}
/* плашки ошибки и «готово» в формах входа не прилипают к кнопке (замечание автора 06.11: «налазит») */
.login-card .login-error,.login-card .login-ok{margin:2px 0 14px}
/* ---------- вход и сброс пароля: тёмный стиль сайта, как в мокапе _mock-login v1 (автор 06.11: «изначально был красивый экран входа») ----------
   Фон с синими пятнами, белый логотип без плашки (старое правило .login-brand>img было для квадратной иконки), стеклянная карточка, кнопка-градиент сайта. */
:root[data-theme] .login-body{background:radial-gradient(900px 560px at 12% -10%,rgba(29,109,182,.32),transparent 60%),radial-gradient(800px 520px at 100% 110%,rgba(44,53,148,.32),transparent 60%),#08090D}
.login-body .login-brand>img.lg-logo{width:186px;height:auto;padding:0;border-radius:0;background:none;box-shadow:none;margin:0 auto 14px}
.login-body .login-tag{color:rgba(242,244,247,.65)}
:root[data-theme] .login-body .login-card{background:rgba(16,18,24,.82);backdrop-filter:blur(16px) saturate(1.3);-webkit-backdrop-filter:blur(16px) saturate(1.3);
  border:0;border-radius:24px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08),0 30px 80px -30px rgba(0,0,0,.65)}
.login-body .login-card .btn-green{background:var(--acc-grad);color:#fff}
.login-body .login-footer{color:rgba(242,244,247,.45)}

/* ========== Обзор и каркас по мокапу _mock-dashfinal (утверждён автором 06.11): тема — токены кабинета, движение — Motion выше ========== */
/* сайдбар: рабочее пространство, недавние клиенты, сайт и пользователь внизу */
.ws{display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:14px;margin:14px 0 12px;background:var(--panel-hi);box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 0 0 1px var(--line)}
.ws-i{width:36px;height:36px;flex:0 0 36px;border-radius:11px;display:grid;place-items:center;color:#fff;font-weight:700;background:var(--acc-grad)}
.ws-t{min-width:0}.ws-t b{display:block;font-size:14px;color:var(--text)}.ws-t small{display:block;color:var(--muted);font-size:12.5px}
.nav-item.active::after{content:"";margin-left:auto;width:7px;height:7px;border-right:1.6px solid var(--muted);border-top:1.6px solid var(--muted);transform:rotate(45deg)}
.nav-item.active .nav-badge+*{display:none}
.side-cl{margin-top:16px}
.side-cl-h{display:flex;justify-content:space-between;align-items:baseline;padding:0 12px 6px;font-size:13px;font-weight:600;color:var(--text-2)}.side-cl-h small{font-weight:400;font-size:12px;color:var(--muted)}
.side-client svg{fill:none!important;stroke:currentColor;stroke-width:1.7;stroke-linejoin:round}
.side-client span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.side-dot{margin-left:auto;width:7px;height:7px;border-radius:50%;background:var(--mint);flex:none}
.side-bottom{display:flex;flex-direction:column;gap:10px}
.side-bottom .side-site{display:flex;align-items:center;justify-content:center;gap:8px;padding:9px;border-radius:11px;box-shadow:0 0 0 1px var(--line);font-size:13.5px;color:var(--text-2)}
.side-site svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7}
.me{display:flex;align-items:center;gap:6px}
.me-a{display:flex;align-items:center;gap:11px;min-width:0;flex:1;padding:6px;border-radius:12px;text-decoration:none;color:inherit;transition:background var(--t-hover) var(--e-out)}
.me-a:hover{background:var(--panel-hi)}
.me .avatar{width:36px;height:36px;flex:0 0 36px;color:#fff}
.me .user-name{color:var(--text);font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.me .user-role{font-size:12px;letter-spacing:0}
.me .logout{width:36px;height:36px;flex:none;padding:0;display:grid;place-items:center;border-radius:10px;color:var(--muted)}
.sb-min .ws-t,.sb-min .side-cl,.sb-min .side-site span,.sb-min .me .user-meta,.sb-min .nav-item.active::after{display:none}
.sb-min .ws{justify-content:center;padding:8px;background:none;box-shadow:none}.sb-min .me{flex-direction:column}.sb-min .me-a{justify-content:center;flex:none}
/* шапка: значок раздела, заголовок, поиск на полширины (автор 06.11: «поиск на 50 процентов шире»), язык и тема */
.topbar{padding:14px 32px;border-bottom:1px solid var(--line)}
.tb-l{display:flex;align-items:center;gap:12px;min-width:0}
.tb-ic{width:22px;height:22px;flex:none;fill:none;stroke:var(--muted);stroke-width:1.7;stroke-linejoin:round}
.topbar .page-title{font-size:21px;color:var(--text)}
.tb-r{display:flex;align-items:center;gap:14px;min-width:0}
.gsearch{display:flex;align-items:center;gap:10px;height:42px;padding:0 12px;border-radius:12px;width:480px;max-width:40vw;color:var(--muted);
  background:rgba(255,255,255,.5);box-shadow:inset 0 1px 0 rgba(255,255,255,.8),0 0 0 1px var(--line);transition:box-shadow var(--t-hover) var(--e-out)}
:root[data-theme="dark"] .gsearch{background:rgba(255,255,255,.05);box-shadow:0 0 0 1px var(--line)}
.gsearch:focus-within{box-shadow:0 0 0 1px var(--mint),0 0 0 4px color-mix(in srgb,var(--mint) 18%,transparent)}
.gsearch svg{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.gsearch input{flex:1;min-width:0;border:0;background:none;outline:0;font:inherit;font-size:14px;color:var(--text)}.gsearch input::placeholder{color:var(--muted)}
.gsearch input::-webkit-search-cancel-button{display:none}
.gsearch kbd{font:inherit;font-size:11.5px;padding:2px 6px;border-radius:6px;box-shadow:0 0 0 1px var(--line);color:var(--muted);white-space:nowrap}
/* приветствие и действия */
.content{padding:26px 32px 48px}
.dz-hi{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap}
.dz-hi-t{margin:0;font-size:30px;font-weight:600;letter-spacing:-.02em;color:var(--text)}.dz-hi p{margin:6px 0 0;color:var(--text-2);font-size:15px}.dz-hi p b{color:var(--text);font-weight:600}
.dz-ha{display:flex;gap:10px;flex-wrap:wrap}.dz-ha .btn,.dz-edit-bar .btn,.dz-h .btn{display:inline-flex;align-items:center;gap:8px}
.di{flex:none}
/* сетка плиток: 12 колонок, ряды одной высоты (автор 06.11: «без перепадов по высоте») */
.dz-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:20px;align-items:stretch}
.dz-cell{grid-column:span var(--s);position:relative;display:flex;min-width:0}
.dz-cell>.card{flex:1;min-width:0;margin:0!important}
.content .dz-grid>.dz-cell{animation:mxPg var(--t-page) var(--e-out) both}
.dz-cell:nth-child(2){animation-delay:calc(40ms*var(--k))}.dz-cell:nth-child(3){animation-delay:calc(80ms*var(--k))}.dz-cell:nth-child(n+4){animation-delay:calc(120ms*var(--k))}
/* показатели — одна стеклянная полоса */
.dz-kpis{display:grid;grid-template-columns:repeat(4,1fr);padding:0!important}
.dz-kp{padding:22px 24px;position:relative;min-width:0}
.dz-kp+.dz-kp::before{content:"";position:absolute;left:0;top:22px;bottom:22px;width:1px;background:var(--line)}
.dz-kh{display:flex;align-items:center;gap:8px;color:var(--text-2);font-size:13.5px}.dz-kh .di{color:var(--muted)}
.dz-kp>b{display:block;margin:12px 0 10px;font-size:32px;font-weight:600;letter-spacing:-.02em;color:var(--text);font-variant-numeric:tabular-nums;white-space:nowrap}
.dz-kf{font-size:12.5px;color:var(--muted)}.dz-kf em{font-style:normal;font-weight:600}
.dz-kf .up,.dz-tip .up{color:#1E9E6A}.dz-kf .down,.dz-tip .down{color:#D9424B}
:root[data-theme="dark"] .dz-kf .up,:root[data-theme="dark"] .dz-tip .up{color:#4FD1A0}:root[data-theme="dark"] .dz-kf .down,:root[data-theme="dark"] .dz-tip .down{color:#FF7A85}
/* виджет */
.dz-w{display:flex;flex-direction:column;padding:20px 22px!important}
.dz-h{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px}
.dz-t{display:flex;align-items:center;gap:12px;min-width:0}.dz-t .card-title{margin:0;font-size:17px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dz-hr{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.dz-cnt{font-style:normal;font-size:12px;font-weight:600;padding:2px 8px;border-radius:999px;margin-left:6px;background:var(--panel-hi);box-shadow:0 0 0 1px var(--line);color:var(--text-2)}
.dz-w .w-foot{margin-top:auto}
.dz-w .empty-state{margin:auto 0;padding:24px 8px}
/* кольцо */
.dz-srcb{display:flex;align-items:center;gap:30px;flex:1}
.dz-donut{position:relative;width:170px;flex:none}.dz-donut svg{display:block;transform:rotate(-90deg)}
.arc{fill:none;stroke:var(--c);stroke-width:20;animation:dzArc calc(900ms*var(--k)) var(--e-out) both}.arc-empty{stroke:var(--line);animation:none}
@keyframes dzArc{from{opacity:0;stroke-width:6}}
.dz-dc{position:absolute;inset:0;display:grid;place-content:center;text-align:center}.dz-dc b{font-size:36px;font-weight:600;letter-spacing:-.02em;color:var(--text)}.dz-dc span{color:var(--muted);font-size:13px}
.dz-lg{list-style:none;margin:0;padding:0;flex:1;min-width:0;display:flex;flex-direction:column;gap:12px}
.dz-lg li{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--text)}.dz-lg i{width:4px;height:18px;border-radius:2px;flex:none}.dz-lg b{margin-left:auto;font-variant-numeric:tabular-nums}
/* просмотры: главный виджет */
.c1{background:var(--mint)}.c2{background:var(--violet)}
.dz-leg{display:flex;gap:16px;font-size:13px;color:var(--text-2)}.dz-leg span{display:flex;align-items:center;gap:6px;white-space:nowrap}.dz-leg i{width:8px;height:8px;border-radius:50%}
.dz-revb{display:grid;grid-template-columns:220px minmax(0,1fr);gap:24px;flex:1;align-items:stretch}
.dz-revl{display:flex;flex-direction:column;min-width:0}
.dz-big{font-size:46px;font-weight:600;letter-spacing:-.03em;line-height:1.05;color:var(--text)}
.dz-best{margin-top:auto;position:relative;padding:14px;border-radius:14px;background:var(--panel-hi);box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 0 0 1px var(--line);min-height:150px}
.dz-best-s{position:absolute;inset:14px 14px 40px;opacity:0;transform:translateY(6px);filter:blur(4px);pointer-events:none;transition:opacity var(--t-card) var(--e-out),transform var(--t-card) var(--e-out),filter var(--t-card) var(--e-out)}
.dz-best-s.on{opacity:1;transform:none;filter:none;pointer-events:auto}
.dz-best-s b{display:flex;align-items:center;gap:7px;font-size:14px;color:var(--text)}.dz-best-s b .di{color:var(--mint)}
.dz-best-s p{margin:8px 0 0;font-size:13px;line-height:1.5;color:var(--text-2)}
.dz-dots{position:absolute;left:10px;right:10px;bottom:8px;display:flex;align-items:center;justify-content:space-between}
.dz-dots button{width:28px;height:28px;border:0;border-radius:8px;background:none;color:var(--muted);cursor:pointer;font:inherit;font-size:17px;line-height:1}.dz-dots button:hover{background:var(--panel-hi);color:var(--text)}
.dz-dd{display:flex;gap:5px}.dz-dd i{width:6px;height:6px;border-radius:3px;background:var(--line);transition:width var(--t-card) var(--e-out),background var(--t-card) var(--e-out)}.dz-dd i.on{width:18px;background:var(--text)}
.dz-flow{position:relative;min-height:240px;display:flex;flex-direction:column;cursor:crosshair;min-width:0}
.dz-flow svg{width:100%;height:230px;flex:none;display:block;overflow:visible}
.dz-flow .dz-xl{margin-top:auto;padding-top:8px}
.dz-flow .g{stroke:var(--line);stroke-dasharray:3 5;vector-effect:non-scaling-stroke}
.dz-flow .l1,.dz-flow .l2{fill:none;vector-effect:non-scaling-stroke;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1}
.dz-flow .l1{stroke:var(--mint);stroke-width:2.6;animation:dzDraw calc(1200ms*var(--k)) var(--e-out) calc(120ms*var(--k)) forwards}
.dz-flow .l2{stroke:var(--violet);stroke-width:2;opacity:.75;animation:dzDraw calc(1200ms*var(--k)) var(--e-out) calc(220ms*var(--k)) forwards}
.dz-flow .ar{opacity:0;animation:dzFade calc(900ms*var(--k)) var(--e-out) calc(500ms*var(--k)) forwards}
@keyframes dzDraw{to{stroke-dashoffset:0}}@keyframes dzFade{to{opacity:1}}
.dz-flow .vl{stroke:var(--text);stroke-opacity:.18;vector-effect:non-scaling-stroke;stroke-dasharray:3 4}
.dz-flow .pt{position:absolute;width:11px;height:11px;margin:-5.5px 0 0 -5.5px;border-radius:50%;border:2.5px solid #fff;box-shadow:0 2px 6px rgba(20,30,60,.3);pointer-events:none;transition:left var(--t-hover) var(--e-out),top var(--t-hover) var(--e-out)}
.dz-flow .p1{background:var(--mint)}.dz-flow .p2{background:var(--violet)}
.dz-tip{position:absolute;top:6px;width:220px;padding:12px 14px;border-radius:14px;font-size:13px;display:flex;flex-direction:column;gap:6px;pointer-events:none;color:var(--text);
  background:rgba(250,251,252,.8);backdrop-filter:blur(16px) saturate(1.5);-webkit-backdrop-filter:blur(16px) saturate(1.5);box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 0 0 1px var(--line),0 18px 34px -18px rgba(20,30,60,.4);transition:left var(--t-hover) var(--e-out)}
:root[data-theme="dark"] .dz-tip{background:rgba(28,30,36,.85);box-shadow:0 0 0 1px var(--line),0 18px 34px -18px rgba(0,0,0,.6)}
.dz-tip>span{display:flex;align-items:center;gap:7px;color:var(--text-2)}.dz-tip>span>i{width:8px;height:8px;border-radius:50%;flex:none}.dz-tip em{font-style:normal;font-weight:600;color:var(--text);margin-left:auto}
.dz-tip small{font-size:12px;font-weight:600}
.dz-xl{display:flex;justify-content:space-between;margin-top:8px;font-size:12px;color:var(--muted)}
/* таблицы */
.dz-tbl td{vertical-align:middle}
.dz-tbl .td-name a{color:var(--text);font-weight:600;text-decoration:none}.dz-tbl .td-name a:hover{color:var(--mint)}
.ini{width:30px;height:30px;border-radius:9px;display:inline-grid;place-items:center;margin-right:10px;vertical-align:middle;font-size:11.5px;font-weight:700;color:var(--text);background:var(--panel-hi);box-shadow:0 0 0 1px var(--line)}
.av-s{width:24px;height:24px;border-radius:50%;display:inline-grid;place-items:center;color:#fff;font-size:11.5px;font-weight:700;background:var(--acc-grad);margin-right:8px;vertical-align:middle}
.muted2{color:var(--text-2)}
.dz-pill{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;font-size:12.5px;font-weight:600;white-space:nowrap}
.dz-pill::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.s-on{color:#1E7F58;background:rgba(34,176,125,.12)}.s-sent{color:#1D6DB6;background:rgba(47,128,208,.12)}.s-off{color:var(--muted);background:var(--panel-hi);box-shadow:0 0 0 1px var(--line)}
:root[data-theme="dark"] .s-on{color:#4FD1A0}:root[data-theme="dark"] .s-sent{color:#72B0E9}
.dz-srch{display:flex;align-items:center;gap:8px;height:36px;padding:0 10px;border-radius:10px;width:200px;color:var(--muted);background:rgba(255,255,255,.45);box-shadow:0 0 0 1px var(--line)}
:root[data-theme="dark"] .dz-srch{background:rgba(255,255,255,.05)}
.dz-srch:focus-within{box-shadow:0 0 0 1px var(--mint)}
.dz-srch input{flex:1;min-width:0;border:0;background:none;outline:0;font:inherit;font-size:13.5px;color:var(--text)}
/* где открывают */
.dz-geo{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.dz-geo li{display:grid;grid-template-columns:28px minmax(0,110px) 1fr 44px;align-items:center;gap:10px;font-size:14px;color:var(--text)}
.dz-geo .cc{font-size:11.5px;font-weight:700;color:var(--muted)}.dz-geo .gn{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dz-geo b{text-align:right;font-variant-numeric:tabular-nums}
.gb{height:8px;border-radius:4px;background:var(--line);overflow:hidden}
.gb i{display:block;height:100%;width:var(--w);border-radius:4px;background:linear-gradient(90deg,var(--violet),var(--mint));transform-origin:left;animation:dzBar calc(900ms*var(--k)) var(--e-out) calc(200ms*var(--k)) both}
@keyframes dzBar{from{transform:scaleX(0)}}
.dz-dev{display:flex;gap:22px;flex-wrap:wrap;margin-top:18px;padding-top:14px;border-top:1px solid var(--line);font-size:13.5px;color:var(--text-2)}.dz-dev span{display:flex;align-items:center;gap:7px}.dz-dev b{color:var(--text)}
/* режим «Изменить раскладку» (автор 06.11): плитки перетаскиваются, ширина − / +, скрыть, вернуть из списка */
.dz-edit-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:12px 14px;border-radius:14px;font-size:13.5px;color:var(--text-2);
  background:color-mix(in srgb,var(--mint) 9%,var(--panel-hi));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--mint) 35%,transparent);animation:mxPg var(--t-page) var(--e-out) both}
.dz-edit-bar[hidden]{display:none}
.dz-add{display:flex;gap:8px;flex-wrap:wrap}
.dz-tools{display:none}
.editing .dz-cell{outline:1.5px dashed color-mix(in srgb,var(--mint) 55%,transparent);outline-offset:4px;border-radius:var(--r-lg);cursor:grab}
.editing .dz-cell>.card{pointer-events:none;user-select:none;filter:saturate(.85)}
.editing .dz-tools{display:flex;align-items:center;gap:4px;position:absolute;left:12px;right:12px;top:12px;z-index:3;padding:6px 6px 6px 10px;border-radius:12px;font-size:13px;color:var(--text);
  background:rgba(250,251,252,.88);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 0 0 1px var(--line),0 12px 28px -16px rgba(20,30,60,.45)}
:root[data-theme="dark"] .editing .dz-tools{background:rgba(28,30,36,.9)}
.dz-tools b{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dz-grip{display:flex;color:var(--muted);cursor:grab}
.dz-tools button{width:30px;height:30px;flex:none;display:grid;place-items:center;border:0;border-radius:8px;background:none;color:var(--text-2);cursor:pointer}
.dz-tools button:hover{background:var(--panel-hi);color:var(--text)}.dz-tools button[data-t="hide"]:hover{color:var(--red)}
.dz-cell.drag{opacity:.45}
.dz-cell[data-s="4"] .dz-tools b{display:none}
/* адаптив: до 1200 — узкие плитки по половине, широкие на всю; до 760 — всё в колонку */
@media (max-width:1400px){.dz-revb{grid-template-columns:1fr}.dz-best{min-height:120px}.dz-flow{min-height:220px}}
@media (max-width:1200px){
  .dz-cell{grid-column:span 6}.dz-cell[data-s="7"],.dz-cell[data-s="8"],.dz-cell[data-s="12"]{grid-column:span 12}
  .dz-kpis{grid-template-columns:repeat(2,1fr)}.dz-kp:nth-child(3)::before{display:none}.dz-kp:nth-child(n+3){border-top:1px solid var(--line)}
  .gsearch{width:320px}
}
@media (max-width:900px){
  .topbar{padding:12px 16px;flex-wrap:wrap}.tb-r{flex:1;justify-content:flex-end}.gsearch{width:auto;flex:1;max-width:none}.gsearch kbd{display:none}
  .content{padding:18px 16px 32px}
  .ws-t,.side-cl,.side-site span,.me .user-meta,.nav-item.active::after{display:none}.ws{justify-content:center;padding:8px;background:none;box-shadow:none}.me{flex-direction:column}.me-a{justify-content:center;flex:none}
}
@media (max-width:760px){
  .dz-cell,.dz-cell[data-s]{grid-column:1/-1}
  .dz-grid{gap:14px}
  .dz-hi-t{font-size:24px}
  .dz-srcb{flex-direction:column;align-items:stretch}.dz-donut{margin:0 auto}
  .dz-h{flex-wrap:wrap}.dz-hr{justify-content:flex-start}.dz-srch{width:100%}
  .dz-leg{display:none}
  .tb-l .tb-ic{display:none}
}
@media (max-width:520px){
  .dz-kpis{grid-template-columns:1fr}.dz-kp::before{display:none}.dz-kp+.dz-kp{border-top:1px solid var(--line)}
  .dz-kp>b{font-size:28px}.dz-big{font-size:38px}
  .top-panel{order:-1}.tb-r{flex-wrap:wrap}.gsearch{flex:1 1 100%}
  .dz-ha{width:100%;flex-direction:column}.dz-ha .btn{justify-content:center}
  .editing .dz-tools b{display:none}
}
@media (prefers-reduced-motion:reduce){.arc,.dz-flow .l1,.dz-flow .l2,.dz-flow .ar,.gb i,.content .dz-grid>.dz-cell,.dz-edit-bar{animation:none;stroke-dashoffset:0;opacity:1}.dz-best-s{transition:none}}

/* ---------- тема «Графит» (автор 06.11): премиальное матовое стекло в серых тонах, контраст — синий сайта; слева тёмная серая панель-стекло ---------- */
:root[data-tint="graphite"]{--bg:#DADDE2;--panel:rgba(244,245,247,.5);--panel-hi:rgba(255,255,255,.42);--line:rgba(23,24,28,.09);--text:#15171B;--text-2:#3A3F48;--muted:#666C77;
  --mint:#2F80D0;--mint-2:#1D6DB6;--violet:#7A8291;--acc-grad:linear-gradient(135deg,#2F80D0 0%,#1D5FA8 100%)}
:root[data-tint="graphite"] body{background:
  radial-gradient(900px 640px at 6% -8%,rgba(255,255,255,.75),transparent 60%),
  radial-gradient(760px 560px at 96% 6%,rgba(47,128,208,.16),transparent 62%),
  radial-gradient(900px 700px at 72% 106%,rgba(120,128,142,.5),transparent 60%),
  radial-gradient(700px 520px at 24% 88%,rgba(170,176,188,.6),transparent 62%),#DADDE2;background-attachment:fixed}
:root[data-tint="graphite"] .sidebar{background:linear-gradient(180deg,rgba(40,44,52,.78),rgba(28,31,37,.82));backdrop-filter:blur(30px) saturate(1.4);-webkit-backdrop-filter:blur(30px) saturate(1.4);
  border-right:0;box-shadow:inset -1px 0 0 rgba(255,255,255,.08),1px 0 0 rgba(0,0,0,.2);color:#E9ECF1;
  --text:#F2F4F7;--text-2:rgba(242,244,247,.74);--muted:rgba(242,244,247,.5);--line:rgba(255,255,255,.1);--panel-hi:rgba(255,255,255,.07)}
:root[data-tint="graphite"] .sidebar .lg-dark{display:block}:root[data-tint="graphite"] .sidebar .lg-light{display:none}
:root[data-tint="graphite"] .sidebar .nav-item{color:rgba(242,244,247,.74)}
:root[data-tint="graphite"] .sidebar .nav-item:hover{background:rgba(255,255,255,.07);color:#fff}
:root[data-tint="graphite"] .sidebar .nav-item.active{background:linear-gradient(160deg,rgba(255,255,255,.14),rgba(255,255,255,.05));color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 0 0 1px rgba(255,255,255,.08)}
:root[data-tint="graphite"] .sidebar .nav-item.active svg{fill:#72B0E9}
:root[data-tint="graphite"] .sidebar .ws{box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 0 0 1px rgba(255,255,255,.08)}
:root[data-tint="graphite"] .sidebar .sb-tog{color:rgba(242,244,247,.74)}
:root[data-tint="graphite"] .card,:root[data-tint="graphite"] .kpi,:root[data-tint="graphite"] .modal-box{background:rgba(242,243,246,.5);backdrop-filter:blur(26px) saturate(1.4);-webkit-backdrop-filter:blur(26px) saturate(1.4);border:0;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8),0 0 0 1px rgba(23,24,28,.07),0 22px 44px -30px rgba(15,20,35,.5)}
:root[data-tint="graphite"] .topbar{background:rgba(218,221,226,.55)}
:root[data-tint="graphite"] .btn-green{background:#2F80D0;color:#fff}:root[data-tint="graphite"] .btn-green:hover{background:#2673C4}
:root[data-tint="graphite"] .btn-ghost{background:rgba(255,255,255,.45);border-color:rgba(23,24,28,.09)}
:root[data-tint="graphite"] .table th{background:rgba(255,255,255,.38)}
:root[data-tint="graphite"].sb-min .sidebar .nav-item{background:rgba(255,255,255,.06);box-shadow:inset 0 1px 0 rgba(255,255,255,.1)}

/* меню тем плотнее: сквозь полупрозрачное стекло просвечивали кнопки периода «7 / 30 / 90 дней» (замечание автора 06.11: «оверлап») */
:root .thm-m{background:rgba(248,249,251,.95)}
:root[data-theme="dark"] .thm-m{background:rgba(30,32,38,.95)}
/* «Графит»: кнопка сворачивания меню — тёмное стекло, как панель (замечание автора 06.11: «ужасно выглядит») */
:root[data-tint="graphite"] .sidebar .sb-tog{background:linear-gradient(160deg,rgba(255,255,255,.12),rgba(255,255,255,.03));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 0 0 1px rgba(255,255,255,.08);color:rgba(242,244,247,.8)}
:root[data-tint="graphite"] .sidebar .sb-tog:hover{background:rgba(255,255,255,.16);color:#fff}
/* аналитика: показатели 2×2 и страны в одной первой строке (замечание автора 06.11) */
.an-r1{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:20px;align-items:stretch}
.an-r1>.kpi-6{grid-template-columns:repeat(2,1fr)}
.an-r1>.card{margin:0!important}
.an-r1 .geo{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);align-items:center}
.an-r1+.card{margin-top:20px}
@media (max-width:1100px){.an-r1{grid-template-columns:1fr}}

/* магнитная кнопка «Копировать ссылку» (автор 06.11): стекло → синяя заливка на наведении, тянется к курсору, после копирования — галочка */
.mag-z{width:56px}
.mag{position:relative;width:36px;height:36px;border:0;border-radius:999px;padding:0;cursor:pointer;display:inline-grid;place-items:center;color:var(--mint);
  background:linear-gradient(160deg,rgba(255,255,255,.85),rgba(255,255,255,.4));box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 0 0 1px var(--line),0 6px 14px -10px rgba(20,40,90,.45);
  transition:background var(--t-hover) var(--e-out),color var(--t-hover) var(--e-out),box-shadow var(--t-hover) var(--e-out),width .38s cubic-bezier(.22,1,.36,1)}
:root[data-theme="dark"] .mag{background:linear-gradient(160deg,rgba(255,255,255,.12),rgba(255,255,255,.04));box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 0 0 1px var(--line)}
.mag::after{content:"";position:absolute;inset:-5px;border-radius:999px;border:1.5px solid var(--mint);opacity:0;transform:scale(.8);transition:opacity var(--t-hover) var(--e-out),transform var(--t-hover) var(--e-out)}
.mag.near,.mag:hover,.mag:focus-visible{color:#fff;background:linear-gradient(135deg,#3B8FE0,#2C3594);box-shadow:0 10px 22px -10px rgba(47,128,208,.75),0 0 0 1px rgba(47,128,208,.4)}
.mag.near::after,.mag:hover::after{opacity:.35;transform:none}
/* рядом с курсором кнопка плавно вытягивается влево на 20 px (правый край на месте), иконка магнитится внутри (автор 06.11) */
.mag.near,.mag:hover{width:56px}
.mag-z .mag{margin-left:auto}
.mag:active{transition-duration:var(--t-press)}.mag:active .mag-i{scale:.86}
.mag-i{position:relative;width:18px;height:18px;display:block;transition:scale var(--t-press) var(--e-out)}
.mag-i svg{position:absolute;inset:0;width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;transition:opacity var(--t-card) var(--e-out),transform var(--t-card) var(--e-out)}
.mag.near .mag-a,.mag:hover .mag-a{transform:rotate(-12deg)}
.mag-b{opacity:0;transform:scale(.4) rotate(-30deg)}
.mag.done{color:#fff;background:linear-gradient(135deg,#22B07D,#1E7F58)}
.mag.done .mag-a{opacity:0;transform:scale(.4) rotate(30deg)}.mag.done .mag-b{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.mag,.mag-i,.mag-i svg,.mag::after{transition:none}}
/* магнитная кнопка в строке действий списка презентаций: поле притяжения — запас вокруг кнопки */
.mag-in{display:inline-grid;place-items:center;padding:6px;margin:-6px 0;vertical-align:middle}
.row-acts{align-items:center}
/* кнопка «Копировать ссылку» — мокап _mock-copy v4 (выбор автора 09.11): круг с иконкой «два листа»;
   на наведении раскрывается влево подписью и переливается фиолетовым градиентом, листы разъезжаются;
   после копирования — галочка и подсказка над кнопкой. Раскрытая кнопка ложится поверх соседей, строка не прыгает */
.mag-z{width:56px;position:relative}
.mag-z .mag,.mag-in .mag{position:absolute;left:auto;right:6px;top:50%;margin-top:-19px}
.mag-z .mag{right:0}
.mag-in{position:relative;width:38px;height:38px}
.mag{width:auto;min-width:38px;height:38px;padding:0 10px;gap:0;display:inline-flex;align-items:center;justify-content:center;font:600 13px/1 inherit;font-family:inherit;white-space:nowrap;color:#5B4BF0;z-index:1;
  transition:gap .3s cubic-bezier(.2,.8,.2,1),padding .3s cubic-bezier(.2,.8,.2,1),color .25s,box-shadow .25s}
.mag::after{content:none}
.mag.near,.mag:hover,.mag:focus-visible,.mag.done{width:auto;gap:8px;padding:0 16px 0 12px;color:#fff;z-index:3;
  background:linear-gradient(110deg,#5B4BF0,#8B5CF6,#B06CF8,#6D5BFF,#5B4BF0);background-size:300% 100%;animation:mag-shim 2.6s linear infinite;
  box-shadow:0 10px 24px -12px rgba(109,91,255,.75),0 0 0 1px rgba(109,91,255,.35)}
@keyframes mag-shim{to{background-position:-300% 0}}
.mag.near .mag-a,.mag:hover .mag-a{transform:none}
.mag .s1,.mag .s2{transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.mag:hover .s1,.mag:focus-visible .s1{transform:translate(-2px,-2px)}.mag:hover .s2,.mag:focus-visible .s2{transform:translate(2px,2px)}
.mag-t{display:block;max-width:0;opacity:0;overflow:hidden;transition:max-width .4s cubic-bezier(.2,.8,.2,1),opacity .25s}
.mag:hover .mag-t,.mag:focus-visible .mag-t,.mag.done .mag-t{max-width:110px;opacity:1}
.mag-toast{position:absolute;bottom:calc(100% + 10px);right:0;padding:8px 12px;border-radius:10px;background:#15171C;color:#fff;font-size:12.5px;font-weight:500;white-space:nowrap;
  opacity:0;transform:translateY(6px) scale(.96);pointer-events:none;transition:opacity .25s,transform .3s cubic-bezier(.2,.8,.2,1)}
.mag-toast::after{content:"";position:absolute;top:100%;right:16px;border:6px solid transparent;border-top-color:#15171C}
.mag.done .mag-toast{opacity:1;transform:none}
:root[data-theme="dark"] .mag{color:#B7A3F9}
@media (prefers-reduced-motion:reduce){.mag,.mag-t,.mag-toast,.mag .s1,.mag .s2{transition:none}.mag.near,.mag:hover,.mag:focus-visible,.mag.done{animation:none}}

/* окно подтверждения в светлых темах — белое, а не серое: полупрозрачное стекло брало цвет затемнения (замечание автора 06.11: «попап тёмный») */
:root[data-theme="light"] .modal-box,:root[data-theme="light"][data-tint] .modal-box{background:rgba(251,252,253,.97)!important;color:var(--text)}
:root[data-theme="light"] .modal::backdrop{background:rgba(30,36,48,.28);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}

/* виджет «Источники заявок» — «Живое кольцо · синий» (мокап _mock-src v1, выбор автора 09.11); цвета — переменные, темы могут переопределить */
:root{--src-1:#2F6BD8;--src-2:#6E8FE8;--src-3:#A9BDF0;--src-4:#D4DDF3;--src-track:rgba(21,23,28,.05)}
:root[data-theme="dark"]{--src-3:#5C76C4;--src-4:#3A4A78;--src-track:rgba(255,255,255,.06)}
.dz-rg{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:28px;container-type:inline-size}
.dz-w:has(.dz-rg){container-type:inline-size}
.dz-rg-ls{display:grid;gap:16px;min-width:0}
.dz-rg-ls>div{display:grid;grid-template-columns:10px minmax(0,1fr) auto;gap:4px 12px;align-items:center}
.dz-rg-ls i{width:10px;height:10px;border-radius:3px}
.dz-rg-ls span{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dz-rg-ls small{font-size:12px;color:var(--muted)}
.dz-rg-ls b{font-size:20px;font-weight:700;letter-spacing:-.02em}
.dz-rg-ls em{grid-column:2/4;height:4px;border-radius:4px;background:var(--src-track);overflow:hidden}
.dz-rg-ls em u{display:block;height:100%;border-radius:4px;animation:dzRgGrow 1.2s cubic-bezier(.2,.8,.2,1) both}
@keyframes dzRgGrow{from{width:0!important}}
.dz-rg-dn{position:relative;width:240px;height:240px;flex:none}
.dz-rg-dn svg{width:100%;height:100%;overflow:visible}
.dz-rg-rot{transform-origin:120px 120px;animation:dzRgRot 40s linear infinite}
.dz-rg-sh{transform-origin:120px 120px;animation:dzRgRot 4.5s linear infinite;mix-blend-mode:soft-light}
@keyframes dzRgRot{to{transform:rotate(360deg)}}
.dz-rg-c{position:absolute;inset:0;text-align:center;pointer-events:none}
/* число — точно по центру круга (цифры обрезаны по высоте прописных), подпись отдельно ниже (автор 09.11) */
.dz-rg-c b{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);font-size:40px;font-weight:700;letter-spacing:-.03em;line-height:1;text-box:trim-both cap alphabetic;color:var(--text)}
.dz-rg-c small{position:absolute;left:0;right:0;top:calc(50% + 22px);font-size:13.5px;line-height:1.2;color:var(--muted)}
@container (max-width:470px){.dz-rg{grid-template-columns:1fr;justify-items:center}.dz-rg-ls{width:100%}}
@media (max-width:600px){.dz-rg-dn{width:200px;height:200px}}
@media (prefers-reduced-motion:reduce){.dz-rg-rot,.dz-rg-sh,.dz-rg-ls em u{animation:none}}

/* ---------- демо-превью и 3D-графики обзора (автор 10.11, мокап _mock-dash3d v1) ---------- */
.dz-cell{position:relative}
.dz-demo{position:absolute;top:-9px;right:22px;z-index:3;padding:3px 10px;border-radius:999px;background:var(--text);color:var(--bg,#fff);box-shadow:0 4px 10px -4px rgba(0,0,0,.3);font-size:11.5px;font-weight:600;letter-spacing:.02em;pointer-events:none}
.dz-k3{position:absolute;right:20px;bottom:18px;width:112px;height:58px;pointer-events:none}
.dz-k3 canvas,.dz-3c canvas{display:block;width:100%!important;height:100%!important}
.dz-3c{position:absolute;inset:0}
.dz-rg-dn.d3 svg,.dz-donut.d3 svg,.dz-donut.d3 .dz-dc{visibility:hidden}
.dz-donut.d3{position:relative}
.dz-flow.d3 svg{opacity:0}.dz-flow.d3 .pt{display:none}
.dz-flow.d3 .dz-3c{bottom:auto;height:230px}
.dz-geo3{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,260px);gap:18px;align-items:center}
.dz-g3{position:relative;height:220px}
@container (max-width:560px){.dz-geo3{grid-template-columns:1fr}.dz-g3{display:none}}
.dz-w:has(.dz-geo3){container-type:inline-size}
.dz-rg-ls>div,.dz-lg li,.dz-geo li{transition:background .25s,transform .25s;border-radius:10px}
.dz-rg-ls>div.on,.dz-lg li.on,.dz-geo li.on{background:color-mix(in srgb,var(--text) 6%,transparent);transform:translateX(4px)}
@media (max-width:600px){.dz-k3{display:none}}