/* BMB UI — единая дизайн-система. Подключается последней и задаёт шрифт, цвета, отступы и компоненты.
   Сетка 4/8 px · радиусы 8/12/16 · шрифт Inter с цифрами одинаковой ширины. */
:root{color-scheme:light;
 --bg:#f7f8fa;--card:#fff;--ink:#0f172a;--ink-2:#334155;--muted:#64748b;--faint:#94a3b8;
 --line:#e4e7ec;--line-2:#eef0f3;--hover:#f8fafc;--fill:#f1f3f6;
 --accent:#2563eb;--accent-ink:#1d4ed8;--accent-soft:#eff4ff;
 --gain:#047857;--gain-soft:#ecfdf5;--loss:#b42318;--loss-soft:#fef3f2;--warn:#b54708;--warn-soft:#fffaeb;
 /* данные: деньги (покупка · расходы · прибыль · убыток) и объём (внутр. · экспорт) */
 --c-buy:#2a78d6;--c-extra:#eb6834;--c-profit:#1baf7a;--c-loss:#e34948;--c-dom:#334155;--c-exp:#94a3b8;
 --a:#104281;--b:#3987e5;--c:#86b6ef;
 --r-sm:8px;--r:12px;--r-lg:16px;
 --shadow-xs:0 1px 2px rgba(16,24,40,.05);--shadow:0 1px 2px rgba(16,24,40,.04),0 1px 3px rgba(16,24,40,.06);--shadow-lg:0 12px 32px -4px rgba(16,24,40,.14),0 4px 8px -2px rgba(16,24,40,.06);
 --ease:cubic-bezier(.16,1,.3,1);
 font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;font-feature-settings:"cv11","ss01"}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font-size:14px;line-height:1.5;letter-spacing:-.006em;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
main{max-width:1200px;padding:0 32px 48px}
a{color:var(--accent);text-underline-offset:3px}
::selection{background:#dbe7ff}
:where(table,.metrics,.vz-tile strong,.vz-nums,.vz-money,.vz-hbars,.sales-metrics,td,dd){font-variant-numeric:tabular-nums}
.vz-ico{flex:0 0 auto;vertical-align:-2px}

/* ───── Шапка ───── */
.app-header{position:sticky;top:0;z-index:30;margin:0 -32px;padding:12px 32px;min-height:60px;background:rgba(247,248,250,.85);border:0;border-bottom:1px solid var(--line);border-radius:0;box-shadow:none;backdrop-filter:saturate(180%) blur(16px);-webkit-backdrop-filter:saturate(180%) blur(16px)}
.app-header .brand{gap:10px}
.app-header .brand b{font-size:20px;letter-spacing:-.04em;font-weight:700;color:var(--ink)}
.app-header .brand>span{font-size:7px;letter-spacing:.16em;color:var(--faint);line-height:1.25}
.app-header .app-tabs{background:transparent;padding:0;gap:4px}
.app-header .app-tabs a{min-height:34px;padding:6px 14px;font-size:14px;color:var(--muted);border-radius:var(--r-sm)}
.app-header .app-tabs a:hover{background:rgba(15,23,42,.04);color:var(--ink)}
.app-header .app-tabs a[aria-current=page]{background:var(--card);color:var(--ink);box-shadow:var(--shadow-xs),0 0 0 1px var(--line)}
.app-header .quiet{font-size:13px;color:var(--muted);text-decoration:none;padding:6px 8px;border-radius:var(--r-sm)}
.app-header .quiet:hover{color:var(--ink);background:rgba(15,23,42,.04)}

/* ───── Переключатели: по умолчанию — компактный сегмент ───── */
.app-tabs,.route,.switch{display:inline-flex;gap:2px;padding:3px;margin:0;background:var(--fill);border:0;border-radius:10px;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;width:max-content;max-width:100%;overflow-x:auto;scrollbar-width:none}
.route::-webkit-scrollbar{display:none}
.route{margin:0 0 20px}
.route a,.switch button{min-height:30px;padding:5px 12px;border:0;border-radius:7px;font-size:13px;font-weight:500;color:var(--muted);background:transparent;text-shadow:none;box-shadow:none;text-decoration:none;white-space:nowrap;transition:background .15s,color .15s}
.route a:hover,.switch button:not(:disabled):hover{color:var(--ink);background:rgba(255,255,255,.7)}
.route a[aria-current=page],.switch button[aria-pressed=true]{color:var(--ink);background:var(--card);box-shadow:0 1px 2px rgba(16,24,40,.08),0 0 0 1px rgba(16,24,40,.04)}
/* Разделы (Обзор · Внутренний рынок · Экспорт) — вкладки с подчёркиванием */
nav.route:is([aria-label="Цемент"],[aria-label="Управление цементом"],[aria-label="Вид транспорта"]){display:flex;width:100%;gap:24px;padding:0;margin:0 0 20px;background:transparent;border-radius:0;border-bottom:1px solid var(--line);overflow-x:auto}
nav.route:is([aria-label="Цемент"],[aria-label="Управление цементом"],[aria-label="Вид транспорта"]) a{position:relative;min-height:44px;padding:12px 0;border-radius:0;font-size:14px;color:var(--muted);background:transparent!important;box-shadow:none!important}
nav.route:is([aria-label="Цемент"],[aria-label="Управление цементом"],[aria-label="Вид транспорта"]) a:hover{color:var(--ink)}
nav.route:is([aria-label="Цемент"],[aria-label="Управление цементом"],[aria-label="Вид транспорта"]) a[aria-current=page]{color:var(--ink);font-weight:600}
nav.route:is([aria-label="Цемент"],[aria-label="Управление цементом"],[aria-label="Вид транспорта"]) a[aria-current=page]::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--ink);border-radius:2px}
nav.route:is([aria-label="Цемент"],[aria-label="Управление цементом"],[aria-label="Вид транспорта"])+nav.route{margin-top:-4px}

/* ───── Текст ───── */
h1{font-size:28px;font-weight:650;letter-spacing:-.028em;line-height:1.2;margin:0 0 4px;color:var(--ink)}
h1 i{display:none}
h2{font-size:15px;font-weight:600;letter-spacing:-.01em;line-height:1.4;margin:0 0 12px;color:var(--ink)}
h3{font-size:14px;font-weight:600}
.eyebrow{font-size:11px;letter-spacing:.06em;font-weight:600;color:var(--muted);text-transform:uppercase}
.muted,small{color:var(--muted)}
footer{display:flex;justify-content:space-between;border-top:1px solid var(--line);margin-top:48px;padding:20px 0 0;font-size:11px;letter-spacing:.08em;color:var(--faint)}
footer a{color:var(--muted);text-decoration:none}

/* ───── Поверхности ───── */
.chart-panel,.daily-table,.calculation,.sales-editor,.sales-report,.sales-audit,.sales-select,.vz-card,.vz-tile,.admin-page section,.sales-metrics article{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow-xs);backdrop-filter:none;-webkit-backdrop-filter:none}
.chart-panel{padding:24px}.daily-table,.calculation{padding:4px 20px}
.sales-editor,.sales-report,.sales-audit{padding:20px 24px;margin:16px 0}
.sales-select{padding:16px 20px}

/* ───── Поля и кнопки ───── */
:is(.admin-page,.sales-module) :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]):not([type=file]),select){height:38px;min-height:38px;padding:0 12px;margin:6px 0 0;border:1px solid #d0d5dd;border-radius:var(--r-sm);background:#fff;color:var(--ink);font:inherit;font-size:14px;box-shadow:var(--shadow-xs);transition:border-color .15s,box-shadow .15s}
:is(.admin-page,.sales-module) :is(input,select)::placeholder{color:var(--faint)}
:is(.admin-page,.sales-module) :is(input,select):hover{border-color:#b9c0cb}
:is(.admin-page,.sales-module) :is(input,select):focus{outline:0;border-color:var(--accent);box-shadow:0 0 0 4px rgba(37,99,235,.14)}
:is(.admin-page,.sales-module) input[type=file]{font:inherit;font-size:14px;margin:8px 0;padding:10px;border:1px dashed #d0d5dd;border-radius:var(--r);width:100%;background:var(--hover)}
:is(.admin-page,.sales-module) label{display:block;font-size:13px;font-weight:500;color:var(--ink-2);margin-top:12px}
:is(.admin-page,.sales-module) button{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:38px;min-height:38px;padding:0 16px;margin:6px 6px 0 0;border:1px solid var(--ink);border-radius:var(--r-sm);background:var(--ink);color:#fff;font:inherit;font-size:14px;font-weight:600;cursor:pointer;box-shadow:var(--shadow-xs);transition:background .15s,border-color .15s,transform .1s}
:is(.admin-page,.sales-module) button:hover{background:#1e293b;border-color:#1e293b;filter:none}
:is(.admin-page,.sales-module) button:active{transform:translateY(1px)}
:is(.admin-page,.sales-module) button:focus-visible{outline:0;box-shadow:0 0 0 4px rgba(15,23,42,.18)}
:is(.admin-page,.sales-module) button.secondary{background:#fff;color:var(--ink-2);border-color:#d0d5dd}
:is(.admin-page,.sales-module) button.secondary:hover{background:var(--hover);color:var(--ink)}
input[type=checkbox]{accent-color:var(--ink)}
:is(a,button,summary,[tabindex]):focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* ───── Таблицы ───── */
table{border-collapse:collapse;width:100%}
th{font-size:12px;font-weight:500;letter-spacing:0;text-transform:none;color:var(--muted);padding:10px 12px;border-bottom:1px solid var(--line);background:transparent;white-space:nowrap}
td{font-size:14px;padding:12px;border-bottom:1px solid var(--line-2);color:var(--ink)}
tbody tr{transition:background .12s}tbody tr:hover{background:var(--hover)}
tbody tr:last-child td{border-bottom:0}
tfoot th,tfoot td{color:var(--ink);font-weight:600;border-top:1px solid var(--line);border-bottom:0;background:var(--hover)}
.sales-table-wrap{overflow-x:auto}

/* ───── Сообщения ───── */
.admin-page .ok,.sales-feedback{padding:10px 14px;border-radius:var(--r);background:var(--gain-soft);color:var(--gain);border:1px solid #a6f4c5;font-size:14px}
.admin-page .error{padding:10px 14px;border-radius:var(--r);background:var(--loss-soft);color:var(--loss);border:1px solid #fecdca;font-size:14px}
.sales-warning{padding:10px 14px;border:1px solid #fedf89;background:var(--warn-soft);color:var(--warn);border-radius:var(--r);font-size:14px}
.vz-note{display:flex;align-items:flex-start;gap:6px;margin:10px 0 0;font-size:12.5px;color:var(--warn);line-height:1.4}
.vz-note .vz-ico{margin-top:1px}
a.vz-note.is-link{display:inline-flex;margin:0 0 16px;padding:8px 12px;border:1px solid #fedf89;background:var(--warn-soft);border-radius:var(--r);text-decoration:none;font-size:13px}
a.vz-note.is-link:hover{border-color:#fdb022}
.vz-chip{display:inline-flex;align-items:center;gap:6px;margin:0 6px 8px 0;padding:4px 10px;border-radius:999px;background:var(--warn-soft);color:var(--warn);border:1px solid #fedf89;font-size:12px}
.vz-chip.is-info{background:var(--accent-soft);color:var(--accent-ink);border-color:#d1e0ff}
.vz-empty{color:var(--faint);margin:8px 0}

/* ───── Админка ───── */
.admin-page .admin-heading{padding:24px 0 8px}
.admin-page .admin-heading .eyebrow{display:none}
.admin-page .admin-heading h1{font-size:24px;margin:0}
.admin-page .admin-heading .muted{margin:2px 0 16px;font-size:13px}
.admin-page section{padding:20px 24px;margin:16px 0}
.admin-page .logout-form{border-top:1px solid var(--line);margin-top:40px;padding-top:16px}
.admin-page .logout-form button{background:#fff;color:var(--muted);border-color:var(--line)}

/* ───── Страница покупки (график по дням с марками) ───── */
.hero{padding:8px 0 20px}.hero h1{font-size:28px;margin:0 0 16px}
.metrics{gap:12px;border:0;margin-top:0;grid-template-columns:repeat(3,minmax(0,1fr))}
.metrics>div{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);padding:16px 20px;box-shadow:var(--shadow-xs)}
.metrics strong{font-size:24px;font-weight:650;letter-spacing:-.02em}
.metrics>div>span{font-size:13px;color:var(--muted)}

/* ───── Страницы цен (Покупка / Продажа) ───── */
.sales-module h1{font-size:24px;letter-spacing:-.02em;margin:0 0 16px}
.sales-heading{align-items:flex-start}.sales-heading .eyebrow{display:none}
.sales-metrics{gap:12px;margin:16px 0}
.sales-metrics article{padding:16px 18px}
.sales-metrics span{font-size:13px;font-weight:500;color:var(--muted);margin-bottom:6px}
.sales-metrics strong{font-size:22px;font-weight:650;letter-spacing:-.02em}
.sales-bar{background:var(--c-buy);border-radius:4px 4px 0 0;width:28px}
.sales-module .sales-bar-button{color:var(--muted)}
.sales-bar-button[aria-pressed=true]{outline:0;background:var(--accent-soft);border-radius:var(--r-sm)}
.vz-seg{margin:0 0 12px}

/* ═════ Цемент: обзор ═════ */
.vz-top{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:8px 0 20px}
.vz-sub{margin:0;font-size:13px;color:var(--muted)}
.vz-month{display:inline-flex;align-items:center;gap:2px;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:3px;box-shadow:var(--shadow-xs)}
.vz-month a{display:grid;place-items:center;width:30px;height:30px;border-radius:7px;color:var(--muted);text-decoration:none}
.vz-month a:hover{background:var(--fill);color:var(--ink)}
.vz-month b{font-size:13.5px;font-weight:600;min-width:118px;text-align:center}

/* Показатели */
.vz-kpi{display:grid;grid-template-columns:1.25fr repeat(4,minmax(0,1fr));gap:12px;margin:0 0 12px}
.vz-kpi.is-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.vz-tile{display:flex;flex-direction:column;min-width:0;padding:16px 18px 0;overflow:hidden;color:var(--faint)}
.vz-tile-h{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:22px}
.vz-tile-h>span{font-size:13px;font-weight:500;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vz-tile strong{display:block;margin:6px 0 2px;font-size:22px;font-weight:650;letter-spacing:-.025em;line-height:1.2;color:var(--ink);white-space:nowrap}
.vz-tile strong small{font-size:13px;font-weight:500;color:var(--faint);letter-spacing:0}
.vz-tile:first-child strong{font-size:28px}
.vz-tile em{display:block;font-style:normal;font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vz-tile.is-gain{color:var(--gain)}.vz-tile.is-gain strong{color:var(--gain)}
.vz-tile.is-loss{color:var(--loss)}.vz-tile.is-loss strong{color:var(--loss)}
.vz-tile.is-ink{color:var(--ink)}.vz-tile.is-buy{color:var(--c-buy)}.vz-tile.is-warm{color:var(--c-extra)}.vz-tile.is-vol{color:var(--c-dom)}.vz-tile.is-muted{color:var(--faint)}
.vz-spark{display:block;width:calc(100% + 36px);height:40px;margin:10px -18px 0;flex:0 0 auto}
.vz-tile:not(:has(.vz-spark)){padding-bottom:16px}
.vz-delta{display:inline-flex;align-items:center;gap:1px;padding:1px 7px 1px 4px;border-radius:999px;font-size:12px;font-weight:600;background:var(--fill);color:var(--muted);white-space:nowrap}
.vz-delta.is-good{background:var(--gain-soft);color:var(--gain)}
.vz-delta.is-bad{background:var(--loss-soft);color:var(--loss)}

/* Сетка карточек */
.vz-split2{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:12px;margin-bottom:12px}
.vz-split2.is-even{grid-template-columns:repeat(2,minmax(0,1fr))}
.vz-card{padding:20px;min-width:0}
.vz-flat{margin-bottom:12px}
.vz-card-h{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:0 0 16px}
.vz-card-h h2{margin:0}
.vz-card-h a{display:inline-flex;align-items:center;gap:2px;font-size:13px;font-weight:500;text-decoration:none}
.vz-card-h a:hover{text-decoration:underline}

/* Легенда */
.vz-legend{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:12px;color:var(--muted)}
.vz-legend span{display:inline-flex;align-items:center;gap:6px}
:is(.vz-legend,.vz-money-l,.vz-nums,.ui-tt) i{display:inline-block;width:8px;height:8px;border-radius:2px;flex:0 0 8px}
i.vz-buy{background:var(--c-buy)}i.vz-extra{background:var(--c-extra)}i.vz-profit{background:var(--c-profit)}i.vz-loss{background:var(--c-loss)}i.vz-dom{background:var(--c-dom)}i.vz-exp{background:var(--c-exp)}

/* График по дням */
.vz-chart{position:relative;display:grid;grid-template-columns:36px minmax(0,1fr);height:220px;margin:4px 0 24px}
.vz-y{position:relative}
.vz-y span{position:absolute;right:10px;transform:translateY(50%);font-size:11px;color:var(--faint);font-variant-numeric:tabular-nums}
.vz-cols{position:relative;display:flex;align-items:flex-end;gap:4px;height:100%;border-bottom:1px solid var(--line);background:linear-gradient(to top,transparent calc(50% - 1px),var(--line-2) calc(50% - 1px),var(--line-2) 50%,transparent 50%),linear-gradient(to bottom,var(--line-2) 1px,transparent 1px)}
.vz-col{position:relative;flex:1;height:100%;display:flex;flex-direction:column;justify-content:flex-end;border-radius:5px 5px 0 0;cursor:default;outline:0}
.vz-col i{display:block;width:100%;min-height:0;transition:filter .15s,opacity .15s}
.vz-col i.vz-exp{background:var(--c-exp);border-radius:3px 3px 0 0}
.vz-col i.vz-dom{background:var(--c-dom)}
.vz-col i.vz-exp[style^="height:0"]+i.vz-dom{border-radius:3px 3px 0 0}
.vz-col i.vz-exp:not([style^="height:0"])+i.vz-dom{border-top:2px solid var(--card)}
.vz-cols:hover .vz-col:not(:hover) i{opacity:.45}
.vz-col:focus-visible{box-shadow:0 0 0 2px var(--accent)}
.vz-col span{position:absolute;bottom:-22px;left:50%;transform:translateX(-50%);font-size:11px;color:var(--faint)}
.vz-avg{position:absolute;left:0;right:0;height:0;border-top:1px dashed #98a2b3;z-index:2;pointer-events:none}
.vz-avg span{position:absolute;right:0;bottom:3px;padding:1px 6px;border-radius:5px;background:rgba(255,255,255,.92);font-size:11px;font-weight:500;color:var(--muted)}
@media(prefers-reduced-motion:no-preference){
 .vz-col i{transform-origin:bottom;animation:vz-up .7s var(--ease) both;animation-delay:calc(var(--i,0)*18ms)}
 .vz-bar,.vz-hbars b{animation:vz-grow .8s var(--ease) both}
 .vz-spark path:last-child{stroke-dasharray:400;stroke-dashoffset:400;animation:vz-draw 1.1s var(--ease) .15s forwards}
 .vz-tile,.vz-card,.sales-report,.sales-editor{animation:ui-in .5s var(--ease) both}
 .vz-kpi>:nth-child(2){animation-delay:.04s}.vz-kpi>:nth-child(3){animation-delay:.08s}.vz-kpi>:nth-child(4){animation-delay:.12s}.vz-kpi>:nth-child(5){animation-delay:.16s}
}
/* «Уменьшение движения»: те же появления, но только прозрачностью — без сдвигов и роста. */
@media(prefers-reduced-motion:reduce){
 .vz-col i{animation:bmb-soft-in .7s var(--ease) both;animation-delay:calc(var(--i,0)*18ms)}
 .vz-bar,.vz-hbars b,.vz-spark path:last-child{animation:bmb-soft-in .8s var(--ease) both}
 .vz-tile,.vz-card,.sales-report,.sales-editor{animation:bmb-soft-in .5s var(--ease) both}
 .vz-kpi>:nth-child(2){animation-delay:.04s}.vz-kpi>:nth-child(3){animation-delay:.08s}.vz-kpi>:nth-child(4){animation-delay:.12s}.vz-kpi>:nth-child(5){animation-delay:.16s}
}
@keyframes vz-up{from{transform:scaleY(0)}to{transform:none}}
@keyframes vz-grow{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}
@keyframes vz-draw{to{stroke-dashoffset:0}}
@keyframes ui-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* Полоса «продажа = покупка + расходы + прибыль» */
.vz-bar{position:relative;display:flex;gap:2px;height:10px;margin:0;border-radius:5px}
.vz-bar i{display:block;height:100%;min-width:3px;outline:0}
.vz-bar i:first-child{border-radius:5px 0 0 5px}.vz-bar i:last-of-type{border-radius:0 5px 5px 0}.vz-bar i:only-of-type{border-radius:5px}
.vz-bar i.vz-buy{background:var(--c-buy)}.vz-bar i.vz-extra{background:var(--c-extra)}.vz-bar i.vz-profit{background:var(--c-profit)}
.vz-bar i:hover,.vz-bar i:focus-visible{filter:brightness(1.08) saturate(1.1)}
.vz-bar.is-empty{background:var(--fill)}
.vz-bar .vz-sale-mark{position:absolute;top:-4px;bottom:-4px;width:2px;margin-left:-1px;background:var(--ink);border-radius:1px;z-index:2}
.vz-bar .vz-sale-mark::after{content:"";position:absolute;inset:0 -6px}

/* «Куда уходят деньги» */
.vz-money{display:block;padding:14px 16px;margin:0 -16px;border-radius:var(--r);color:inherit;text-decoration:none;transition:background .15s}
a.vz-money:hover{background:var(--hover)}
.vz-money+.vz-money{border-top:1px solid var(--line-2);border-radius:0 0 var(--r) var(--r)}
.vz-money-h{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:10px}
.vz-money-h b{font-size:14px;font-weight:600}
.vz-money-r{font-size:15px;font-weight:650;letter-spacing:-.01em}
.vz-money-l{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:12px 0 0}
.vz-money-l dt{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--muted)}
.vz-money-l dd{margin:2px 0 0 14px;font-size:14px;font-weight:600;white-space:nowrap}
.vz-money-l dd small{font-weight:500;color:var(--faint);margin-left:2px}
.is-gain{color:var(--gain)}.is-loss{color:var(--loss)}

/* Таблица контрагентов */
.vz-tbl th,.vz-tbl td{text-align:right;white-space:nowrap}
.vz-tbl :is(th,td):first-child{text-align:left;padding-left:0}
.vz-tbl :is(th,td):last-child{padding-right:0}
.vz-tbl td:first-child{font-weight:500}
.vz-tbl tfoot :is(th,td){background:transparent}
.vz-tbl .vz-tbl-bar{width:22%;min-width:150px}
.vz-tbl .vz-bar{height:8px}
.vz-flag{display:inline-block;margin-right:8px;padding:1px 5px;border-radius:5px;background:var(--fill);border:1px solid var(--line);color:var(--ink-2);font-size:10.5px;font-weight:700;letter-spacing:.04em;vertical-align:1px}
.vz-docs td{vertical-align:top}
.vz-docs-items{white-space:normal!important}
.vz-docs-items span{display:inline-block;margin:0 6px 4px 0;padding:2px 8px;border-radius:6px;background:var(--fill);font-size:12.5px;color:var(--ink-2)}
.vz-docs-items b{font-weight:600;color:var(--ink)}

/* Горизонтальные полосы (статьи расходов) */
.vz-hbars{display:grid;gap:4px}
.vz-hbars>div{display:grid;grid-template-columns:minmax(96px,32%) minmax(0,1fr) 96px;align-items:center;gap:12px;padding:6px 8px;margin:0 -8px;border-radius:var(--r-sm);font-size:13.5px;outline:0}
.vz-hbars>div:hover,.vz-hbars>div:focus-visible{background:var(--hover)}
.vz-hbars span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ink-2)}
.vz-hbars i{display:block;height:8px;background:var(--fill);border-radius:4px;overflow:hidden}
.vz-hbars b{display:block;height:100%;background:var(--c-extra);border-radius:4px}
.vz-hbars em{font-style:normal;font-weight:600;text-align:right;white-space:nowrap}
.vz-hbars em small{font-weight:500;color:var(--faint);margin-left:2px}

/* Карточки контрагентов (админка) */
.vz-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:16px}
.vz-grid.is-small{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.vz-party{position:relative;padding:18px 20px}
.vz-cover{position:absolute;inset:0;border-radius:var(--r-lg);z-index:0}
.vz-head{display:flex;justify-content:space-between;align-items:center;gap:10px}
.vz-head h3{display:flex;align-items:center;margin:0;font-size:14px;min-width:0;overflow-wrap:anywhere}
.vz-tons{color:var(--muted);font-size:13px;white-space:nowrap}
.vz-result{margin:8px 0 12px;font-size:22px;font-weight:650;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.vz-result small{font-size:13px;font-weight:500;color:var(--faint)}
.vz-nums{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:12px 0 0}
.vz-nums dt{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--muted)}
.vz-nums dd{margin:2px 0 0;font-weight:600;font-size:14px;white-space:nowrap}
.vz-rate{margin:0;font-size:13px;color:var(--muted)}
.eb>.vz{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;margin:8px 0 16px}
.eb>.vz>:is(.vz-grid,.vz-legend){flex-basis:100%}

/* Всплывающая подсказка (ui.js) */
.ui-tt{position:fixed;z-index:100;min-width:150px;max-width:280px;padding:10px 12px;border-radius:10px;background:#101828;color:#fff;box-shadow:var(--shadow-lg);font-size:12.5px;line-height:1.4;pointer-events:none;opacity:0;transform:translateY(4px);transition:opacity .12s,transform .12s}
.ui-tt.is-on{opacity:1;transform:none}
.ui-tt>b{display:block;font-weight:600;margin-bottom:2px}
.ui-tt>div{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;margin-top:4px;color:#d0d5dd}
.ui-tt>div em{font-style:normal;color:#fff;font-weight:600;font-variant-numeric:tabular-nums}
html:not(.js) [data-tip]{position:relative}
html:not(.js) [data-tip]:hover::after{content:attr(data-tip);position:absolute;left:50%;bottom:calc(100% + 8px);transform:translateX(-50%);background:#101828;color:#fff;font-size:12px;padding:6px 9px;border-radius:8px;white-space:nowrap;z-index:5}

/* ───── Адаптив ───── */
@media(max-width:1100px){.vz-kpi{grid-template-columns:repeat(3,minmax(0,1fr))}.vz-kpi .vz-tile:first-child{grid-column:span 3}.vz-kpi.is-4{grid-template-columns:repeat(2,minmax(0,1fr))}.vz-kpi.is-4 .vz-tile:first-child{grid-column:auto}.vz-split2,.vz-split2.is-even{grid-template-columns:minmax(0,1fr)}}
@media(max-width:700px){
 main{padding:0 16px 32px}
 .app-header{margin:0 -16px;padding:10px 16px}
 .app-header .app-tabs{width:100%;display:grid;grid-template-columns:repeat(3,1fr);background:var(--fill);padding:3px}
 .app-header .app-tabs a{justify-content:center}
 nav.route:is([aria-label="Цемент"],[aria-label="Управление цементом"],[aria-label="Вид транспорта"]){gap:18px}
 h1{font-size:24px}
 .vz-top{align-items:flex-start}
 .vz-kpi,.vz-kpi.is-4{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
 .vz-kpi .vz-tile:first-child{grid-column:1/-1}
 .vz-tile{padding:14px 14px 0}.vz-spark{width:calc(100% + 28px);margin:8px -14px 0;height:34px}
 .vz-tile strong{font-size:18px}.vz-tile:first-child strong{font-size:26px}
 .vz-card{padding:16px}.vz-money{padding:12px;margin:0 -12px}
 .vz-chart{height:170px;grid-template-columns:30px minmax(0,1fr)}.vz-cols{gap:2px}
 .vz-tbl .vz-tbl-bar{display:none}
 .vz-hbars>div{grid-template-columns:minmax(80px,38%) minmax(0,1fr) auto}
 .chart-panel{padding:16px 10px}
 .metrics{grid-template-columns:minmax(0,1fr)}
}
@media print{.app-header{position:static;backdrop-filter:none}.ui-tt{display:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.sales-module :is(.vz-card,.sales-report,.sales-editor) h2,.vz-card h2{font-size:15px;letter-spacing:-.01em;margin:0 0 12px}
.vz-card .vz-card-h h2{margin:0}
.sales-actions button{width:auto;flex:0 0 auto}
.sales-bar-value{font-size:11px;color:var(--muted);font-weight:500}
.sales-module .sales-bar-button{height:210px}
.sales-days a{border-radius:var(--r-sm)}

/* Документ расходов — строки ведомости */
.eb-lines{margin-top:4px}
.eb-lines th{padding:8px 6px}
.eb-lines td{padding:3px 4px;border-bottom:1px solid var(--line-2)}
.eb-lines tbody tr:hover{background:transparent}
.sales-module .eb-lines :is(input,select){margin:0!important;border-color:transparent!important;box-shadow:none!important;background:transparent!important}
.sales-module .eb-lines tr:hover :is(input,select){background:var(--hover)!important;border-color:var(--line)!important}
.sales-module .eb-lines :is(input,select):focus{background:#fff!important;border-color:var(--accent)!important;box-shadow:0 0 0 4px rgba(37,99,235,.14)!important}
.sales-module .eb-lines input[name="amount[]"]{text-align:right;font-weight:600;font-variant-numeric:tabular-nums}
.sales-module .eb-lines .eb-del{min-width:32px;width:32px;height:32px;min-height:32px;padding:0;margin:0;font-size:18px;background:transparent;border-color:transparent;color:var(--faint);box-shadow:none}
.sales-module .eb-lines .eb-del:hover{background:var(--loss-soft);color:var(--loss)}
.eb-lines tfoot th,.eb-lines tfoot td{background:transparent;padding:12px 8px;font-size:15px}
.eb-lines tfoot td{text-align:right}
.eb-pick{align-items:end}
.vz-docs :is(th,td){text-align:left}
.vz-docs :is(th,td).num{text-align:right}
.vz-docs td:first-child{white-space:nowrap;color:var(--muted)}
@media(max-width:700px){
 .app-header{position:relative;background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;border-bottom:0}
 .vz-money-l{gap:6px}
 .vz-money-l dd{margin-left:0;font-size:13px}
 .vz-money-l dd small{display:block;margin:0}
 .vz-sub{font-size:12.5px}
}
@media(max-width:700px){
 .hero .metrics{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
 .hero .metrics>div{padding:14px!important}
 .hero .metrics strong{font-size:20px!important;white-space:nowrap}.hero .metrics strong .num{overflow-wrap:normal}
 .hero .metrics .m-days{grid-column:1/-1}
}

/* ═════ Клинкер ═════ */
.vz-kpi.is-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.vz-progress{height:6px;border-radius:3px;background:var(--fill);overflow:hidden}
.vz-progress i{display:block;height:100%;border-radius:3px;background:var(--c-profit)}
.vz-progress.is-tile{margin:12px 0 16px}
.is-due{color:var(--warn)}
.ck-settle-h{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:0 0 14px}
.ck-settle-h span{display:block;font-size:12px;color:var(--muted)}
.ck-settle-h b{display:block;margin-top:2px;font-size:20px;font-weight:650;letter-spacing:-.02em;white-space:nowrap;font-variant-numeric:tabular-nums}
.ck-settle-h b small{font-size:12px;font-weight:500;color:var(--faint)}
.ck-settle-h .is-gain b{color:var(--gain)}.ck-settle-h .is-due b{color:var(--warn)}
.vz-bar.ck-pay{height:12px;margin:0 0 18px;background:var(--fill)}
.vz-bar.ck-pay i.vz-profit{background:var(--c-profit)}.vz-bar.ck-pay i.vz-extra{background:var(--c-extra)}
.ck-periods td{vertical-align:middle}
.ck-periods .vz-tbl-bar{width:28%}
.ck-periods .vz-tbl-bar .vz-progress{display:inline-block;width:calc(100% - 44px);vertical-align:middle;margin-right:8px}
.ck-periods .vz-tbl-bar small{display:inline-block;width:36px;text-align:right;color:var(--muted)}
.ck-route{list-style:none;margin:0;padding:0 0 0 4px;position:relative}
.ck-route li{position:relative;display:flex;gap:14px;padding:0 0 18px 0;min-height:28px}
.ck-route li:last-child{padding-bottom:0}
.ck-route li::before{content:"";position:absolute;left:5px;top:14px;bottom:-2px;width:2px;background:var(--line)}
.ck-route li:last-child::before{display:none}
.ck-route li>i{position:relative;z-index:1;flex:0 0 12px;width:12px;height:12px;margin-top:4px;border-radius:50%;background:var(--card);border:2px solid var(--faint)}
.ck-route li.is-end>i{border-color:var(--c-dom);background:var(--c-dom);box-shadow:0 0 0 4px rgba(51,65,85,.1)}
.ck-route li>div{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px;min-width:0}
.ck-route b{font-size:14px;font-weight:600;color:var(--ink-2)}
.ck-route li:not(.is-end) b{font-weight:500;color:var(--muted)}
.ck-route span{font-size:12px;color:var(--muted)}
.ck-route strong{font-size:16px;font-weight:650;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.ck-route small{flex-basis:100%;font-size:12px;color:var(--faint)}
.ck-route-note{margin:14px 0 0;padding-top:12px;border-top:1px solid var(--line-2);font-size:12.5px;color:var(--muted)}
.ck-route-note b{color:var(--ink)}
.ck .vz-sub a{display:inline-flex;align-items:center;gap:2px;text-decoration:none;font-weight:500}
/* старые элементы клинкера в новом стиле */
.ck~.route{margin-top:4px}
.month-tabs{max-width:100%}
.month-note{color:var(--muted)}
.chart-panel .section-head h2{font-size:17px;font-weight:600;margin:4px 0 0}
.chart-panel .eyebrow{font-size:11px}
.warning{color:var(--warn)}
@media(max-width:1100px){.vz-kpi.is-3{grid-template-columns:repeat(3,minmax(0,1fr))}.vz-kpi.is-3 .vz-tile:first-child{grid-column:auto}}
@media(max-width:700px){.vz-kpi.is-3{grid-template-columns:repeat(2,minmax(0,1fr))}.vz-kpi.is-3 .vz-tile:first-child{grid-column:1/-1}.ck-settle-h b{font-size:16px}.ck-periods .vz-tbl-bar{display:none}}

/* Панель фильтров графика (report-controls.js) */
.chart-panel .report-controls{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin:12px 0 8px}
.chart-panel .report-presets{display:inline-flex;gap:2px;padding:3px;background:var(--fill);border-radius:10px}
.chart-panel .report-controls button{min-height:30px;height:30px;padding:0 12px;border:0;border-radius:7px;background:transparent;color:var(--muted);font-size:13px;font-weight:500;box-shadow:none;cursor:pointer}
.chart-panel .report-controls button:hover:not(:disabled){color:var(--ink);background:rgba(255,255,255,.7)}
.chart-panel .report-controls button[aria-pressed=true]{background:var(--card);color:var(--ink);box-shadow:0 1px 2px rgba(16,24,40,.08),0 0 0 1px rgba(16,24,40,.04)}
.chart-panel .report-custom{position:relative}
.chart-panel .report-custom summary{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0 12px;border:1px solid var(--line);border-radius:var(--r-sm);font-size:13px;color:var(--ink-2);background:var(--card);cursor:pointer;list-style:none}
.chart-panel .report-custom summary::-webkit-details-marker{display:none}
.chart-panel .report-custom summary span{color:var(--faint)}
.chart-panel .report-custom[open]{flex-basis:100%}
.chart-panel .report-range{display:flex;flex-wrap:wrap;align-items:end;gap:8px;margin-top:8px}
.chart-panel .report-range button{background:var(--ink);color:#fff;height:36px}
.chart-panel .report-controls label{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted);margin:0}
.chart-panel .report-controls input{height:36px;min-height:36px;padding:0 10px;border:1px solid var(--line);border-radius:var(--r-sm);font-size:13px;background:var(--card);width:auto;min-width:150px}
.chart-panel .report-controls input:focus{outline:0;border-color:var(--accent);box-shadow:0 0 0 4px rgba(37,99,235,.14)}
.chart-panel .report-status{font-size:12px;color:var(--faint);margin:0}
.chart-panel .report-pager{display:inline-flex;gap:2px;margin-left:auto;padding:3px;background:var(--fill);border-radius:10px}
.chart-panel .report-scope{display:none}
.chart-panel .chart-foot{margin:4px 0 8px}
.chart-panel .chart-foot .muted{font-size:12px;color:var(--faint)}
.chart-panel .section-head{align-items:flex-start}
@media(max-width:700px){.chart-panel .report-pager{margin-left:0}.chart-panel .report-controls label{flex:1 1 100%}.chart-panel .report-controls input{flex:1}}
.vz-top .route{margin:0}
.vz-hbars.is-vol b{background:var(--c-buy)}
.vz-card-h .vz-sub{font-size:12.5px}
.vz-docs details summary{cursor:pointer;color:var(--accent);font-size:13px}

/* Админка: компактные формы клинкера */
.admin-page h2{font-size:17px;letter-spacing:-.01em;margin:0 0 6px}
.admin-page h3{font-size:15px;font-weight:600;margin:24px 0 4px}
.admin-page h4{font-size:14px;margin:16px 0 4px}
.admin-page .vz-card-h{margin-bottom:8px}
.admin-page .vz-card-h a{font-size:13px}
.admin-page .vz-sub{margin:0 0 12px}
.ck-admin-settle{margin:12px 0 16px;padding:16px;border:1px solid var(--line-2);border-radius:var(--r);background:var(--hover)}
.admin-page .ck-rate,.admin-page .ck-inv{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px 12px;align-items:end;margin:12px 0;padding:12px 16px 16px;border:1px solid var(--line);border-radius:var(--r);background:var(--card)}
.admin-page .ck-rate legend,.admin-page .ck-inv legend{padding:0 6px;font-size:12px;font-weight:600;color:var(--muted)}
.admin-page .ck-rate label,.admin-page .ck-inv label{margin-top:4px}
.admin-page .ck-rate label:has(input[type=checkbox]),.admin-page .ck-inv label:has(input[type=checkbox]){grid-column:1/-1;display:flex;align-items:center;gap:6px;font-weight:400;color:var(--muted)}
.admin-page .ck-inv label:nth-of-type(7){grid-column:span 2}
.admin-page .ck-sync{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) auto;gap:4px 12px;align-items:end}
.admin-page .ck-sync button{margin:0}
.admin-page .sync-preview,.admin-page .batch-editor{margin-top:16px;padding:16px;border:1px solid var(--line-2);border-radius:var(--r);background:var(--hover)}
@media(max-width:700px){.admin-page .ck-rate,.admin-page .ck-inv,.admin-page .ck-sync{grid-template-columns:minmax(0,1fr)}.admin-page .ck-inv label:nth-of-type(4),.admin-page .ck-inv label:nth-of-type(7){grid-column:auto}}
@media(max-width:700px){.ck-settle-h{gap:8px}.ck-settle-h b{font-size:15px;white-space:normal}.ck-settle-h b small{display:block;margin-top:1px}}

/* ═════ Цемент: Покупка / Продажа ═════ */
.vz-top-r{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.vz-top-r .route{margin:0}
.sales-module.vz .sales-select.vz-filter{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:0;margin:0 0 16px;background:transparent;border:0;box-shadow:none}
.sales-module .vz-filter label{margin:0}
.sales-module .vz-filter :is(input,select){margin:0;min-width:200px}
.sales-module .vz-filter button{margin:0}
.vz-search input{padding-left:34px!important;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E") no-repeat 11px 50%!important}
html.js .vz-filter button{display:none}
/* столбцы по дням — кнопки */
.sales-module .vz-cols .vz-col{height:100%;min-height:0;padding:0;margin:0;border:0;border-radius:5px 5px 0 0;background:transparent;color:inherit;box-shadow:none;font:inherit;cursor:pointer;display:flex;flex-direction:column;justify-content:flex-end;gap:0;transform:none}
.sales-module .vz-cols .vz-col:hover{background:rgba(15,23,42,.04)}
.sales-module .vz-cols .vz-col[aria-pressed=true]{background:var(--accent-soft);box-shadow:inset 0 -2px 0 var(--accent)}
.sales-module .vz-cols .vz-col.is-zero{cursor:default}
.vz-col i.vz-ga{background:var(--a)}.vz-col i.vz-gb{background:var(--b)}.vz-col i.vz-gc{background:var(--c)}
.vz-col i:first-of-type{border-radius:3px 3px 0 0}
.vz-col i+i{border-top:2px solid var(--card)}
.vz-col.is-partial::before{content:"";position:absolute;top:-6px;left:50%;width:5px;height:5px;margin-left:-2.5px;border-radius:50%;background:var(--c-extra)}
i.vz-ga{background:var(--a)}i.vz-gb{background:var(--b)}i.vz-gc{background:var(--c)}
:is(.vz-day-list) i{display:inline-block;width:8px;height:8px;border-radius:2px;margin-right:6px}
/* рейтинг дилеров — ссылки */
.vz-hbars>a{display:grid;grid-template-columns:minmax(96px,32%) minmax(0,1fr) 110px;align-items:center;gap:12px;padding:6px 8px;margin:0 -8px;border-radius:var(--r-sm);font-size:13.5px;color:inherit;text-decoration:none}
.vz-hbars>a:hover,.vz-hbars>a:focus-visible{background:var(--hover)}
.vz-hbars.is-ink b{background:var(--ink-2)}
/* детали дня */
.sales-day-detail:not([hidden]){margin:16px 0 0;padding:16px;border:1px solid var(--line);border-radius:var(--r);background:var(--hover)}
.sales-day-detail h3{margin:0;font-size:15px}
.sales-composition{display:flex;align-items:center;gap:24px;margin:8px 0 12px}
.sales-pie{width:120px;height:120px;flex:0 0 120px;border-radius:50%;-webkit-mask:radial-gradient(circle,transparent 38%,#000 39%);mask:radial-gradient(circle,transparent 38%,#000 39%)}
.vz-day-list{list-style:none;margin:0;padding:0;display:grid;gap:6px;font-size:13.5px;color:var(--ink-2)}
.vz-day-list b{margin-left:6px;color:var(--ink);font-variant-numeric:tabular-nums}
.vz-day-sum{margin-top:4px;padding-top:6px;border-top:1px solid var(--line)}
.sales-report.vz-card{padding:20px}
.sales-report .vz-more{margin:4px 0 0}
.sales-module.vz .sales-editor{margin:0 0 12px}
@media(max-width:700px){.vz-top-r{width:100%;justify-content:space-between}.sales-module .vz-filter :is(input,select){min-width:0;width:100%}.sales-module .vz-filter label{flex:1 1 100%}.vz-hbars>a{grid-template-columns:minmax(80px,38%) minmax(0,1fr) auto}.sales-composition{gap:14px}.sales-pie{width:96px;height:96px;flex-basis:96px}}
.vz-tile.is-due{color:var(--c-extra)}.vz-tile.is-due strong{color:var(--warn)}
.vz-more summary{display:inline-flex;align-items:center;gap:6px;cursor:pointer;color:var(--accent);font-size:13px;font-weight:500;padding:8px 0;list-style:none}
.vz-more summary::-webkit-details-marker{display:none}
.vz-more summary::after{content:"";width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .15s}
.vz-more[open] summary::after{transform:rotate(-135deg) translateY(-1px)}
.sales-day-detail:focus,.sales-day-detail:focus-visible{outline:0}
@media(max-width:700px){
 .vz-kpi.is-4 .vz-tile:first-child{grid-column:auto}
 .vz-kpi.is-4 .vz-tile strong,.vz-kpi.is-4 .vz-tile:first-child strong{font-size:17px}
 .vz-top-r .route{width:auto}
 .vz-top-r{justify-content:space-between}
}

/* ═════ Баланс ═════ */
.bl-refresh{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 14px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--card);color:var(--ink-2);font:inherit;font-size:13.5px;font-weight:500;cursor:pointer;box-shadow:var(--shadow-xs)}
.bl-refresh:hover{background:var(--hover);color:var(--ink)}
.bl-refresh:disabled{cursor:wait;opacity:.7}
.bl-refresh.is-spinning svg{animation:bl-spin .9s linear infinite}
@keyframes bl-spin{to{transform:rotate(360deg)}}
.bl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:12px}
.bl-card{display:flex;flex-direction:column;padding:20px}
.bl-card .vz-card-h{margin-bottom:12px}
.bl-card h2{font-size:15px}
.bl-card .ajy-values{display:grid;gap:12px;flex:1}
.bl-card .ajy-row{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px}
.bl-card .ajy-amount{flex-basis:100%;font-size:24px;font-weight:650;letter-spacing:-.025em;font-variant-numeric:tabular-nums;color:var(--ink);white-space:nowrap}
.bl-card .ajy-amount small{font-size:13px;font-weight:500;color:var(--faint)}
.bl-card .ajy-material{padding:1px 8px;border-radius:999px;background:var(--accent-soft);color:var(--accent-ink);font-size:12px;font-weight:600}
.bl-card .bl-code{font-size:12px;color:var(--faint)}
.bl-card .account-placeholder{font-size:24px;color:var(--line)}
.bl-card .ajy-status{display:flex;align-items:center;gap:6px;margin:16px 0 0;padding-top:12px;border-top:1px solid var(--line-2);font-size:12px;color:var(--muted)}
.bl-card .ajy-status::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--faint);flex:0 0 6px}
.bl-card .ajy-status.ajy-success::before{background:#12b76a}
.bl-card .ajy-status.ajy-error{color:var(--loss)}.bl-card .ajy-status.ajy-error::before{background:var(--loss)}
.bl-card .ajy-status.is-loading::before{background:var(--accent);animation:bl-pulse 1s ease-in-out infinite}
.bl-card .ajy-status:empty{display:none}
@keyframes bl-pulse{50%{opacity:.3}}
@media(max-width:700px){.bl-card .ajy-amount{font-size:21px}.bl-grid{grid-template-columns:minmax(0,1fr)}}
@media(prefers-reduced-motion:reduce){.bl-refresh.is-spinning svg,.bl-card .ajy-status.is-loading::before{animation:none}}
.bl .vz-top{margin-top:24px}
.bl-card .ajy-values{align-content:start}