/* ══════════════════════════════════════════════════════════════
   Numerra Design System — Aurora Glass
   Extracted from base.html inline styles + typographic scale + spacing
   ══════════════════════════════════════════════════════════════ */

:root {
  /* ── Colors ── */
  --bg:#111827; --bg-2:#151C2C; --bg-card:#1C2537; --bg-card-solid:#1C2537; --bg-hover:rgba(148,163,184,0.06); --surface-2:#1A2235;
  --border:#253040; --border-hard:#253040; --text:#E2E8F0; --text-muted:#94A3B8;
  --primary:#6366F1; --primary-h:#4F46E5; --primary-glow:rgba(99,102,241,0.18);
  --success:#10B981; --danger:#EF4444; --warning:#F59E0B;
  --wb-color:#CB11AB; --oz-color:#005BFF; --ym-color:#FF6600;
  --aurora-cyan:#22d3ee; --aurora-purple:#a78bfa; --aurora-pink:#ec4899;
  --radius:10px; --radius-lg:14px;
  --font:'Onest',system-ui,sans-serif; --mono:'JetBrains Mono',ui-monospace,monospace;
  --glass-bg:rgba(21,27,43,0.72); --glass-border:rgba(255,255,255,0.08); --glass-blur:blur(16px) saturate(1.4);

  /* ── Typographic Scale (~1.2x modular) ── */
  --text-xs:  11px;   /* badge, мелкие подписи */
  --text-sm:  13px;   /* labels, nav, secondary */
  --text-base: 15px;  /* основной текст, td, формы */
  --text-lg:  18px;   /* card-title, section headers */
  --text-xl:  22px;   /* kpi-value, page title */
  --text-2xl: 28px;   /* auth-logo, hero */

  /* ── Spacing (4px grid) ── */
  --sp-1: 4px;   --sp-2: 8px;   --sp-3: 12px;
  --sp-4: 16px;  --sp-5: 20px;  --sp-6: 24px;
  --sp-8: 32px;  --sp-10: 40px; --sp-12: 48px;
}

/* ── Reset ── */
*{box-sizing:border-box;margin:0;padding:0;}
body{font-family:var(--font);background:var(--bg);color:var(--text);font-size:var(--text-base);line-height:1.5;min-height:100vh;-webkit-font-smoothing:antialiased;}
a{color:var(--primary);text-decoration:none;}
a:hover{color:var(--primary-h);}

.layout{display:flex;min-height:100vh;position:relative;}

/* ── Sidebar (solid, clean) ── */
.sidebar{width:220px;flex-shrink:0;background:#151B2B;border-right:1px solid var(--border);display:flex;flex-direction:column;z-index:10;}
.s-logo{padding:var(--sp-5);font-size:var(--text-xl);letter-spacing:-0.03em;border-bottom:1px solid var(--border);}
.s-logo .num{font-weight:800;color:var(--primary);text-shadow:0 0 18px rgba(99,102,241,0.3);} .s-logo .erra{font-weight:300;color:#fff;}
.s-nav{flex:1;padding:var(--sp-3) 0;overflow-y:auto;}
.s-nav a{display:flex;align-items:center;gap:var(--sp-2);padding:9px var(--sp-5);color:var(--text-muted);font-size:var(--text-sm);font-weight:500;transition:background 0.15s,color 0.15s;border-left:3px solid transparent;}
.s-nav a:hover{background:var(--bg-hover);color:var(--text);}
.s-nav a.active{background:rgba(99,102,241,0.08);color:var(--text);font-weight:600;border-left-color:var(--primary);box-shadow:inset 0 0 20px rgba(99,102,241,0.04);}
.s-nav a svg{width:16px;height:16px;flex-shrink:0;opacity:0.5;}
.s-nav a:hover svg,.s-nav a.active svg{opacity:0.85;}
.s-section{font-size:var(--text-xs);font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#818CF8;padding:var(--sp-5) var(--sp-5) 5px;border-top:1px solid var(--border);}
.s-nav .s-section:first-child{border-top:none;padding-top:14px;}
.s-toggle{cursor:pointer;display:flex;justify-content:space-between;align-items:center;user-select:none;}
.s-toggle:hover{color:#A5B4FC;}
.s-arrow{font-size:8px;transition:transform .2s;}
.s-toggle.open .s-arrow{transform:rotate(180deg);}
.s-sub{max-height:0;overflow:hidden;transition:max-height .25s ease;}
.s-toggle.open+.s-sub{max-height:400px;}
.s-footer{padding:var(--sp-4) var(--sp-5);border-top:1px solid var(--border);font-size:var(--text-xs);color:var(--text-muted);}
.plan-badge{display:inline-block;background:linear-gradient(135deg,#7c3aed,#6366F1,#818CF8,#6366F1,#7c3aed);background-size:300% 100%;animation:accentFlow 6s linear infinite;color:#fff;font-size:10px;font-weight:600;padding:2px 7px;border-radius:4px;text-transform:uppercase;box-shadow:0 1px 6px rgba(99,102,241,0.3);}

/* ── Main ── */
.main{flex:1;display:flex;flex-direction:column;overflow:hidden;}

/* ── Topbar (solid) ── */
.topbar{height:56px;flex-shrink:0;background:#151B2B;border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 28px;gap:var(--sp-4);position:relative;z-index:5;}
.topbar h1{font-size:var(--text-lg);font-weight:600;flex:1;}

/* ── MP Filter (segmented control in topbar) ── */
.mp-filter{display:flex;gap:2px;padding:3px;border:1px solid var(--glass-border);border-radius:999px;background:var(--glass-bg);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);margin-right:var(--sp-2);}
.mp-filter-btn{padding:5px 14px;border-radius:999px;font-size:var(--text-xs);font-weight:600;color:var(--text-muted);background:transparent;border:none;cursor:pointer;font-family:var(--font);transition:background .2s,color .2s,box-shadow .2s;white-space:nowrap;}
.mp-filter-btn:hover{color:var(--text);}
.mp-filter-btn.active{background:linear-gradient(135deg,var(--wb-color),var(--oz-color),var(--ym-color),var(--wb-color));background-size:300% 300%;color:#fff;box-shadow:0 2px 10px rgba(99,102,241,0.35);animation:mpBtnFlow 6s ease infinite,mpGlow 3s ease-in-out infinite alternate;}
@keyframes mpBtnFlow{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
.mp-filter-btn[data-mp="wb"].active{background:var(--wb-color);box-shadow:0 2px 10px rgba(203,17,171,0.35);animation:mpGlowWb 3s ease-in-out infinite alternate;}
.mp-filter-btn[data-mp="ozon"].active{background:var(--oz-color);box-shadow:0 2px 10px rgba(0,91,255,0.35);animation:mpGlowOz 3s ease-in-out infinite alternate;}
.mp-filter-btn[data-mp="ym"].active{background:var(--ym-color);box-shadow:0 2px 10px rgba(255,102,0,0.35);animation:mpGlowYm 3s ease-in-out infinite alternate;}
@keyframes mpGlow{0%{box-shadow:0 2px 12px rgba(99,102,241,0.4),0 0 20px rgba(203,17,171,0.1)}100%{box-shadow:0 4px 24px rgba(99,102,241,0.7),0 0 40px rgba(203,17,171,0.25),0 0 60px rgba(0,91,255,0.1)}}
@keyframes mpGlowWb{0%{box-shadow:0 2px 12px rgba(203,17,171,0.4)}100%{box-shadow:0 4px 24px rgba(203,17,171,0.7),0 0 40px rgba(224,64,160,0.3)}}
@keyframes mpGlowOz{0%{box-shadow:0 2px 12px rgba(0,91,255,0.4)}100%{box-shadow:0 4px 24px rgba(0,91,255,0.7),0 0 40px rgba(61,139,253,0.3)}}
@keyframes mpGlowYm{0%{box-shadow:0 2px 12px rgba(255,102,0,0.4)}100%{box-shadow:0 4px 24px rgba(255,102,0,0.7),0 0 40px rgba(255,133,51,0.3)}}
/* ── Store Switcher (cabinet_id dropdown в шапке) ── */
.store-switcher{position:relative;margin-right:var(--sp-3);}
.store-switcher-btn{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border:1px solid var(--glass-border);border-radius:8px;background:var(--glass-bg);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);color:var(--text);font-size:var(--text-xs);font-weight:600;font-family:var(--font);cursor:pointer;white-space:nowrap;transition:background .2s,border-color .2s;}
.store-switcher-btn:hover{background:rgba(255,255,255,0.08);border-color:rgba(255,255,255,0.25);}
.store-dot{display:inline-block;width:8px;height:8px;border-radius:50%;flex-shrink:0;}
.store-mp{color:var(--text-muted);font-weight:500;}
.store-caret{color:var(--text-muted);font-size:11px;margin-left:4px;}
.store-switcher-menu{position:absolute;top:calc(100% + 6px);left:0;min-width:240px;max-height:480px;overflow-y:auto;background:#1A2336;border:1px solid var(--border);border-radius:10px;box-shadow:0 8px 32px rgba(0,0,0,0.4);padding:6px;display:none;z-index:50;}
.store-switcher-menu.open{display:block;}
.store-item{display:flex;align-items:center;gap:10px;width:100%;padding:8px 10px;border:none;background:transparent;border-radius:6px;color:var(--text);font-size:var(--text-sm);font-family:var(--font);cursor:pointer;text-align:left;transition:background .15s;}
.store-item:hover{background:rgba(255,255,255,0.06);}
.store-item.active{background:rgba(99,102,241,0.15);color:#fff;}
.store-item .store-name{flex:1;font-weight:500;}
.store-item .store-meta{color:var(--text-muted);font-size:11px;font-weight:400;}
.store-group{margin-top:6px;}
.store-group:first-child{margin-top:0;}
.store-group-name{padding:6px 10px 2px;font-size:11px;font-weight:600;text-transform:uppercase;color:var(--text-muted);letter-spacing:0.5px;}

/* Color bar under topbar — animated gradient */
.topbar-accent{height:4px;flex-shrink:0;background:linear-gradient(90deg,var(--wb-color),var(--oz-color),var(--ym-color),var(--wb-color));background-size:300% 100%;animation:accentFlow 8s linear infinite;}
@keyframes accentFlow{0%{background-position:0% 50%}100%{background-position:300% 50%}}
.topbar-accent.mp-wb{background:linear-gradient(90deg,#8B0A72,var(--wb-color),#E040A0,#FF69B4,var(--wb-color),#8B0A72);background-size:300% 100%;}
.topbar-accent.mp-ozon{background:linear-gradient(90deg,#003D99,var(--oz-color),#3D8BFD,#60A5FA,var(--oz-color),#003D99);background-size:300% 100%;}
.topbar-accent.mp-ym{background:linear-gradient(90deg,#CC5200,var(--ym-color),#FF8533,#FFB366,var(--ym-color),#CC5200);background-size:300% 100%;}

.avatar-wrap{position:relative;}
.avatar{width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,#7c3aed,#6366F1,var(--aurora-cyan));background-size:200% 200%;animation:accentFlow 8s ease infinite;display:flex;align-items:center;justify-content:center;font-size:var(--text-sm);font-weight:600;color:#fff;cursor:pointer;transition:box-shadow .15s;}
.avatar:hover{box-shadow:0 0 0 2px rgba(124,58,237,0.5);}
.avatar-menu{position:absolute;top:calc(100% + 8px);right:0;min-width:200px;background:#1C2537;border:1px solid var(--border);border-radius:var(--radius);box-shadow:0 8px 32px rgba(0,0,0,.45);z-index:100;opacity:0;pointer-events:none;transform:translateY(-4px);transition:opacity .15s,transform .15s;}
.avatar-menu.open{opacity:1;pointer-events:all;transform:translateY(0);}
.avatar-menu-header{padding:var(--sp-3) var(--sp-4);border-bottom:1px solid var(--border-hard);font-size:var(--text-xs);color:var(--text-muted);word-break:break-all;}
.avatar-menu a{display:block;padding:10px var(--sp-4);font-size:var(--text-sm);color:var(--text);transition:background .12s;}
.avatar-menu a:hover{background:var(--bg-hover);color:var(--text);}
.avatar-menu-divider{height:1px;background:var(--border-hard);margin:var(--sp-1) 0;}
.content{flex:1;padding:var(--sp-8);overflow-y:auto;animation:fadeIn .25s ease;position:relative;}
.content::before{content:'';position:fixed;top:0;left:220px;right:0;bottom:0;
  background:radial-gradient(ellipse 60% 50% at 70% 10%,rgba(99,102,241,0.06),transparent 60%),
             radial-gradient(ellipse 40% 40% at 20% 80%,rgba(34,211,238,0.03),transparent 60%);
  pointer-events:none;z-index:0;}
.content>*{position:relative;z-index:1;}
@keyframes fadeIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}

/* ── Buttons ── */
.btn{display:inline-flex;align-items:center;gap:6px;padding:9px 18px;border-radius:var(--radius);font-family:var(--font);font-size:var(--text-sm);font-weight:600;cursor:pointer;border:none;transition:background .15s,box-shadow .2s,transform .1s;}
.btn:active{transform:translateY(1px);}
.btn-primary{background:linear-gradient(135deg,#7c3aed,#6366F1);color:#fff;box-shadow:0 2px 12px rgba(99,102,241,0.3);}
.btn-primary:hover{background:linear-gradient(135deg,#6d28d9,#4F46E5,#7c3aed);background-size:200% 200%;color:#fff;box-shadow:0 4px 18px rgba(99,102,241,0.45);}
.btn-secondary{background:transparent;color:var(--text);border:1px solid var(--border-hard);}
.btn-secondary:hover{background:var(--bg-hover);}
.btn-danger{background:var(--danger);color:#fff;}
.btn-sm{padding:6px 12px;font-size:var(--text-xs);}

/* ── Cards (solid bg, clear contrast) ── */
.card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:28px;transition:border-color .2s,box-shadow .2s;}
.card:hover{border-color:rgba(99,102,241,.2);box-shadow:0 2px 16px rgba(0,0,0,.15);}
.card-title{font-size:var(--text-base);font-weight:600;margin-bottom:var(--sp-4);}

.form-group{margin-bottom:var(--sp-5);}
.form-group label{display:block;font-size:var(--text-sm);font-weight:500;color:var(--text-muted);margin-bottom:6px;}
.form-control{width:100%;padding:10px 14px;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);font-family:var(--font);font-size:var(--text-base);outline:none;transition:border-color .15s;}
.form-control:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(99,102,241,0.15);}
.form-hint{font-size:var(--text-xs);color:var(--text-muted);margin-top:5px;}

.alert{padding:var(--sp-3) var(--sp-4);border-radius:var(--radius);margin-bottom:var(--sp-4);font-size:var(--text-sm);}
.alert-danger{background:rgba(239,68,68,.12);border:1px solid rgba(239,68,68,.3);color:#FCA5A5;}
.alert-success{background:rgba(16,185,129,.12);border:1px solid rgba(16,185,129,.3);color:#6EE7B7;}
.alert-info{background:rgba(99,102,241,.12);border:1px solid rgba(99,102,241,.3);color:#A5B4FC;}
.alert-warning{background:rgba(245,158,11,.12);border:1px solid rgba(245,158,11,.3);color:#FCD34D;}

.auth-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;position:relative;}
.auth-wrap::before{content:'';position:fixed;inset:0;background:radial-gradient(ellipse 50% 50% at 30% 30%,rgba(124,58,237,0.12),transparent 70%),radial-gradient(ellipse 40% 40% at 70% 60%,rgba(34,211,238,0.08),transparent 70%);pointer-events:none;z-index:0;}
.auth-box{width:100%;max-width:440px;background:#1C2537;border:1px solid var(--border);border-radius:16px;padding:var(--sp-10);position:relative;z-index:1;}
.auth-logo{font-size:var(--text-2xl);letter-spacing:-0.03em;text-align:center;margin-bottom:28px;}
.auth-logo{font-weight:800;color:var(--primary);} .auth-logo span{color:#fff;font-weight:300;}
.auth-footer{text-align:center;margin-top:var(--sp-5);font-size:var(--text-sm);color:var(--text-muted);}

.steps{display:flex;align-items:center;margin-bottom:var(--sp-8);}
.step{display:flex;align-items:center;gap:var(--sp-2);font-size:var(--text-xs);color:var(--text-muted);}
.step-num{width:26px;height:26px;border-radius:50%;background:var(--bg);border:1px solid var(--border-hard);display:flex;align-items:center;justify-content:center;font-size:var(--text-xs);font-weight:600;flex-shrink:0;}
.step.active .step-num{background:var(--primary);border-color:var(--primary);color:#fff;}
.step.done .step-num{background:var(--success);border-color:var(--success);color:#fff;}
.step.active{color:var(--text);font-weight:500;}
.step-line{flex:1;height:1px;background:var(--border-hard);margin:0 10px;}

.mp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-3);}
.mp-card{border:2px solid var(--border-hard);border-radius:var(--radius);padding:var(--sp-5) var(--sp-3);text-align:center;cursor:pointer;transition:border-color .15s,background .15s;background:var(--bg);}
.mp-card:hover,.mp-card.selected{border-color:var(--primary);background:rgba(99,102,241,.08);}
.mp-logo{font-size:32px;margin-bottom:var(--sp-2);}
.mp-name{font-size:var(--text-sm);font-weight:600;}

table{width:100%;border-collapse:collapse;}
th{text-align:left;padding:10px 14px;font-size:var(--text-xs);font-weight:600;color:var(--text-muted);border-bottom:1px solid var(--border-hard);font-family:var(--font);}
td{padding:var(--sp-3) 14px;border-bottom:1px solid rgba(148,163,184,0.06);font-size:var(--text-sm);}
tr:last-child td{border-bottom:none;}
tr:hover td{background:rgba(99,102,241,0.04);}

/* ── Tooltip ── */
.tip{position:relative;display:inline-flex;align-items:center;justify-content:center;
     width:15px;height:15px;border-radius:50%;background:rgba(124,58,237,.15);
     color:#a78bfa;font-size:9px;font-weight:700;cursor:help;flex-shrink:0;
     vertical-align:middle;margin-left:5px;z-index:500;}
.tip::after{content:attr(data-tip);position:absolute;bottom:calc(100% + 7px);left:50%;
     transform:translateX(-50%);background:#1C2537;color:#CBD5E1;font-size:var(--text-xs);
     font-weight:400;padding:var(--sp-2) var(--sp-3);border-radius:8px;white-space:normal;border:1px solid var(--border);
     width:220px;box-shadow:0 4px 18px rgba(0,0,0,.4);z-index:9999;
     opacity:0;pointer-events:none;transition:opacity .15s;text-align:left;line-height:1.55;}
.tip:hover::after,.tip:focus::after{opacity:1;}

/* ── Glass components (Aurora) ── */
.glass-tabs{display:inline-flex;gap:2px;padding:3px;border-radius:12px;background:var(--glass-bg);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);}
.glass-tab{padding:7px var(--sp-4);border-radius:9px;font-size:var(--text-sm);font-weight:500;color:var(--text-muted);background:transparent;border:none;cursor:pointer;font-family:var(--font);transition:all .2s;text-decoration:none;}
.glass-tab:hover{color:var(--text);box-shadow:0 0 8px rgba(203,17,171,0.12),0 0 8px rgba(0,91,255,0.1),0 0 8px rgba(255,102,0,0.08);}
.glass-tab.active{background:rgba(255,255,255,0.08);color:var(--text);font-weight:600;box-shadow:0 1px 4px rgba(0,0,0,.15),0 0 12px rgba(99,102,241,0.1);}

/* ── KPI cards — Aurora style ── */
.kpi-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:var(--sp-5) var(--sp-5);position:relative;overflow:visible;transition:border-color .2s,box-shadow .2s;}
.kpi-card:hover{border-color:rgba(99,102,241,0.25);box-shadow:0 2px 16px rgba(0,0,0,.15);}
.card.kpi-card[data-accent="blue"],.kpi-card[data-accent="blue"]{border-left:3px solid var(--primary);}
.card.kpi-card[data-accent="green"],.kpi-card[data-accent="green"]{border-left:3px solid var(--success);}
.card.kpi-card[data-accent="purple"],.kpi-card[data-accent="purple"]{border-left:3px solid var(--aurora-purple);}
.card.kpi-card[data-accent="orange"],.kpi-card[data-accent="orange"]{border-left:3px solid var(--warning);}
.card.kpi-card[data-accent="red"],.kpi-card[data-accent="red"]{border-left:3px solid var(--danger);}
.card.kpi-card[data-accent="cyan"],.kpi-card[data-accent="cyan"]{border-left:3px solid var(--aurora-cyan);}
.kpi-label{font-size:var(--text-xs);font-weight:500;color:var(--text-muted);margin-bottom:var(--sp-2);display:flex;align-items:center;gap:6px;}
.kpi-value{font-size:var(--text-xl);font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:-0.02em;margin-bottom:var(--sp-1);color:var(--text);font-family:var(--font);}
.kpi-sub{font-size:var(--text-xs);color:var(--text-muted);display:flex;align-items:center;gap:6px;flex-wrap:wrap;}

/* ── Premium table ── */
table.premium{width:100%;border-collapse:collapse;}
table.premium thead th{padding:var(--sp-3) var(--sp-5);font-size:var(--text-xs);font-weight:600;letter-spacing:.02em;color:var(--text-muted);font-family:var(--font);text-align:left;border-bottom:1px solid var(--border);background:var(--bg);position:sticky;top:0;z-index:2;}
table.premium tbody tr{border-bottom:1px solid rgba(37,48,64,0.25);transition:background .12s;}
table.premium tbody tr:hover{background:rgba(99,102,241,0.03);}
table.premium tbody td{padding:var(--sp-4) var(--sp-5);font-size:var(--text-base);font-family:var(--font);font-variant-numeric:tabular-nums;line-height:1.4;}
table.premium tfoot td{padding:var(--sp-4) var(--sp-5);font-weight:700;font-size:var(--text-base);border-top:2px solid var(--border);background:var(--bg);}

/* ── Sticky first column (mobile scroll) ── */
.table-sticky-col th:first-child,
.table-sticky-col td:first-child{position:sticky;left:0;z-index:1;background:var(--bg-card);}
.table-sticky-col thead th:first-child{z-index:3;background:var(--bg);}
.table-sticky-col tfoot td:first-child{background:var(--bg);}

/* ── Common table utility classes ── */
.th-sort a{color:var(--text);text-decoration:none;}.th-sort a:hover{color:var(--primary);}
.th-sort,.th-r{padding:10px 12px;font-weight:600;white-space:nowrap;}
.th-r{padding:10px 12px;font-weight:600;white-space:nowrap;}
.th-l{padding:10px var(--sp-4);font-weight:600;white-space:nowrap;}
.th-c{padding:10px 12px;font-weight:600;}
.td-r{padding:10px 12px;font-variant-numeric:tabular-nums;}
.td-l{padding:10px var(--sp-4);font-weight:500;}
.td-c{padding:10px 12px;font-variant-numeric:tabular-nums;}

/* Alignment is set via selectors with sufficient specificity to beat
   `table.premium thead th { text-align:left }` (specificity 0,1,3).
   Combined `tag.class` selector gives (0,2,3), which wins.

   Эталон выравнивания для всех табличных шаблонов:
   - th-l / td-l   — текст (артикул, название, label)
   - th-c / td-c   — числа разной длины (рубли, штуки) — визуально центр под заголовком
   - th-r / td-r   — числа одной длины (проценты, даты, флаги) или фиксированные коды
*/
table.premium thead th.th-r,
table.premium tbody td.td-r,
table.premium tfoot td.td-r { text-align:right; font-variant-numeric:tabular-nums; }

table.premium thead th.th-c,
table.premium tbody td.td-c,
table.premium tfoot td.td-c { text-align:center; font-variant-numeric:tabular-nums; }

table.premium thead th.th-l,
table.premium tbody td.td-l,
table.premium tfoot td.td-l { text-align:left; }

/* Числа в .premium tbody всегда табулярными цифрами для ровных колонок,
   независимо от того, проставлен td-r/td-c явно или нет. */
table.premium tbody td.tabnum { font-variant-numeric:tabular-nums; }
.td-neg{color:var(--danger);}
.tr-row{border-bottom:1px solid var(--border);}.tr-row:hover{background:var(--bg-hover);}

/* ── Utility classes ── */
.flex{display:flex;}.flex-between{display:flex;justify-content:space-between;align-items:center;}
.flex-wrap{flex-wrap:wrap;}.flex-center{display:flex;align-items:center;}
.gap-sm{gap:var(--sp-2);}.gap-md{gap:var(--sp-3);}.gap-lg{gap:var(--sp-4);}
.mb-sm{margin-bottom:var(--sp-2);}.mb-md{margin-bottom:var(--sp-4);}.mb-lg{margin-bottom:var(--sp-6);}
.mb-0{margin-bottom:0;}.mb-xs{margin-bottom:var(--sp-1);}
.mt-sm{margin-top:var(--sp-2);}.mt-md{margin-top:var(--sp-4);}
.p-0{padding:0;}.p-3{padding:var(--sp-3);}.p-4{padding:var(--sp-4);}.p-5{padding:var(--sp-5);}.p-6{padding:var(--sp-6);}.p-8{padding:var(--sp-8);}.p-12{padding:var(--sp-12);}
.px-3{padding-left:var(--sp-3);padding-right:var(--sp-3);}.px-4{padding-left:var(--sp-4);padding-right:var(--sp-4);}.px-5{padding-left:var(--sp-5);padding-right:var(--sp-5);}
.py-2{padding-top:var(--sp-2);padding-bottom:var(--sp-2);}.py-3{padding-top:var(--sp-3);padding-bottom:var(--sp-3);}
.pl-5{padding-left:var(--sp-5);}
.text-right{text-align:right;}.text-center{text-align:center;}.text-left{text-align:left;}
.text-sm{font-size:var(--text-xs);}.text-xs{font-size:10px;}
.fs-sm{font-size:var(--text-sm);}.fs-base{font-size:var(--text-base);}.fs-lg{font-size:var(--text-lg);}.fs-xl{font-size:var(--text-xl);}.fs-2xl{font-size:var(--text-2xl);}
.text-success{color:var(--success);}.text-danger{color:var(--danger);}.text-warning{color:var(--warning);}
.text-muted{color:var(--text-muted);}.text-primary{color:var(--primary);}
.fw-500{font-weight:500;}.fw-600{font-weight:600;}.fw-700{font-weight:700;}
.tabnum{font-variant-numeric:tabular-nums;}
.w-full{width:100%;}.overflow-x{overflow-x:auto;}.overflow-hidden{overflow:hidden;}
.d-none{display:none;}.d-block{display:block;}.d-inline{display:inline-block;}
.border-b{border-bottom:1px solid var(--border);}.bg-dark{background:var(--bg);}
.section-title{font-size:var(--text-lg);font-weight:700;color:var(--text);margin-bottom:var(--sp-4);}
.card-section{padding:var(--sp-5);margin-bottom:var(--sp-4);}
.table-wrap{overflow-x:auto;width:100%;border-collapse:collapse;font-size:var(--text-sm);}
.kpi-label-sm{font-size:var(--text-xs);display:block;margin-bottom:var(--sp-1);}
.empty-center{padding:var(--sp-12);text-align:center;}

/* ── MP badges (unified) ── */
.mp-badge{display:inline-block;font-size:10px;font-weight:700;padding:2px 7px;border-radius:4px;text-transform:uppercase;}
.mp-badge-wb{background:rgba(203,17,171,.12);color:var(--wb-color);}
.mp-badge-ozon{background:rgba(0,91,255,.12);color:var(--oz-color);}
.mp-badge-ym{background:rgba(255,102,0,.12);color:var(--ym-color);}

/* ── Status badges ── */
.status-badge{display:inline-block;padding:3px 10px;border-radius:4px;font-size:var(--text-xs);font-weight:600;}
.status-danger{background:rgba(239,68,68,.12);color:var(--danger);}
.status-warn{background:rgba(245,158,11,.12);color:var(--warning);}
.status-ok{background:rgba(16,185,129,.12);color:var(--success);}

/* ── Scrollbar ── */
::-webkit-scrollbar{width:8px;height:8px;}
::-webkit-scrollbar-track{background:transparent;}
::-webkit-scrollbar-thumb{background:rgba(148,163,184,0.15);border-radius:999px;}
::-webkit-scrollbar-thumb:hover{background:rgba(148,163,184,0.25);}

/* ── Burger button (mobile only) ── */
.burger{display:none;background:none;border:none;color:var(--text);cursor:pointer;padding:var(--sp-1);flex-shrink:0;}
.burger svg{display:block;}
.sidebar-backdrop{display:none;position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:9;}

/* ── Skeleton Loader ── */
.skeleton{background:linear-gradient(90deg,var(--bg-card) 25%,rgba(148,163,184,0.08) 50%,var(--bg-card) 75%);background-size:200% 100%;animation:skeletonPulse 1.5s ease-in-out infinite;border-radius:var(--radius);}
.skeleton-text{height:14px;margin-bottom:var(--sp-2);border-radius:4px;}
.skeleton-text:last-child{width:60%;}
.skeleton-kpi{height:36px;width:120px;margin-bottom:var(--sp-2);border-radius:6px;}
.skeleton-chart{height:200px;border-radius:var(--radius);}
.skeleton-row{height:48px;margin-bottom:2px;border-radius:4px;}
@keyframes skeletonPulse{0%{background-position:200% 0}100%{background-position:-200% 0}}

/* ── Empty State ── */
.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--sp-12) var(--sp-8);text-align:center;}
.empty-state-icon{width:64px;height:64px;margin-bottom:var(--sp-6);opacity:0.3;}
.empty-state-title{font-size:var(--text-lg);font-weight:600;margin-bottom:var(--sp-2);color:var(--text);}
.empty-state-desc{font-size:var(--text-sm);color:var(--text-muted);max-width:400px;margin-bottom:var(--sp-6);line-height:1.6;}

/* ── Sync Progress (for onboarding) ── */
.sync-progress{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--sp-6);text-align:center;max-width:480px;margin:var(--sp-8) auto;}
.sync-progress-bar{height:6px;background:var(--bg);border-radius:3px;overflow:hidden;margin:var(--sp-4) 0;}
.sync-progress-fill{height:100%;background:linear-gradient(90deg,var(--primary),var(--aurora-cyan));border-radius:3px;transition:width 0.5s ease;}

/* ── Form Error States ── */
.form-control.is-invalid{border-color:var(--danger);box-shadow:0 0 0 3px rgba(239,68,68,0.15);}
.form-control.is-invalid:focus{border-color:var(--danger);box-shadow:0 0 0 3px rgba(239,68,68,0.25);}
.form-error{font-size:var(--text-xs);color:var(--danger);margin-top:var(--sp-1);display:flex;align-items:center;gap:var(--sp-1);}
.form-error::before{content:'!';display:inline-flex;align-items:center;justify-content:center;width:14px;height:14px;border-radius:50%;background:rgba(239,68,68,0.15);font-size:9px;font-weight:700;flex-shrink:0;}
.form-control.is-valid{border-color:var(--success);}

/* ── Table Scroll Indicators ── */
.table-scroll{position:relative;overflow-x:auto;-webkit-overflow-scrolling:touch;}
.table-scroll::after{content:'';position:absolute;top:0;right:0;bottom:0;width:32px;background:linear-gradient(to right,transparent,var(--bg-card));pointer-events:none;opacity:1;transition:opacity .2s;}
.table-scroll.scrolled-end::after{opacity:0;}
.table-scroll::before{content:'';position:absolute;top:0;left:0;bottom:0;width:32px;background:linear-gradient(to left,transparent,var(--bg-card));pointer-events:none;opacity:0;transition:opacity .2s;z-index:1;}
.table-scroll.scrolled-start::before{opacity:1;}

/* ── Focus visible (keyboard accessibility) ── */
:focus-visible{outline:2px solid var(--primary);outline-offset:2px;}

/* ── ARIA sidebar ── */
.s-nav a[aria-current="page"]{background:rgba(99,102,241,0.08);color:var(--text);font-weight:600;border-left-color:var(--primary);}
.s-toggle[aria-expanded="false"]+.s-sub{max-height:0;}
.s-toggle[aria-expanded="true"]+.s-sub{max-height:400px;}
.s-toggle[aria-expanded="true"] .s-arrow{transform:rotate(180deg);}

/* ── Reduced motion ── */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;}
}

/* ── Light Mode ── */
@media(prefers-color-scheme:light){
  :root{
    --bg:#f8fafc;
    --bg-2:#f1f5f9;
    --bg-card:#ffffff;
    --bg-card-solid:#ffffff;
    --bg-hover:rgba(99,102,241,0.06);
    --surface-2:#f1f5f9;
    --border:#e2e8f0;
    --border-hard:#cbd5e1;
    --text:#1e293b;
    --text-muted:#64748b;
    --glass-bg:rgba(255,255,255,0.72);
    --glass-border:rgba(0,0,0,0.06);
  }
  .sidebar{background:#f1f5f9;}
  .topbar{background:#f8fafc;}
  .s-logo .erra{color:#1e293b;}
  ::-webkit-scrollbar-thumb{background:rgba(0,0,0,0.15);}
  ::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,0.25);}
  .content::before{
    background:radial-gradient(ellipse 60% 50% at 70% 10%,rgba(99,102,241,0.04),transparent 60%),
               radial-gradient(ellipse 40% 40% at 20% 80%,rgba(34,211,238,0.02),transparent 60%);
  }
}

:root.light{
  --bg:#f8fafc;
  --bg-2:#f1f5f9;
  --bg-card:#ffffff;
  --bg-card-solid:#ffffff;
  --bg-hover:rgba(99,102,241,0.06);
  --surface-2:#f1f5f9;
  --border:#e2e8f0;
  --border-hard:#cbd5e1;
  --text:#1e293b;
  --text-muted:#64748b;
  --glass-bg:rgba(255,255,255,0.72);
  --glass-border:rgba(0,0,0,0.06);
}
:root.light .sidebar{background:#f1f5f9;}
:root.light .topbar{background:#f8fafc;}
:root.light .s-logo .erra{color:#1e293b;}
:root.light ::-webkit-scrollbar-thumb{background:rgba(0,0,0,0.15);}
:root.light ::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,0.25);}
:root.light .content::before{
  background:radial-gradient(ellipse 60% 50% at 70% 10%,rgba(99,102,241,0.04),transparent 60%),
             radial-gradient(ellipse 40% 40% at 20% 80%,rgba(34,211,238,0.02),transparent 60%);
}

/* ── Responsive ── */
@media(max-width:768px){
  .sidebar{position:fixed;left:-240px;top:0;bottom:0;width:240px;z-index:20;transition:left .25s ease;box-shadow:none;}
  .sidebar.open{left:0;box-shadow:4px 0 24px rgba(0,0,0,.5);}
  .sidebar-backdrop.open{display:block;}
  .burger{display:block;}
  .content{padding:var(--sp-4);}
  .content::before{left:0;}
  .kpi-card,.dash-kpi-card{padding:14px;}
  .topbar h1{font-size:var(--text-base);}
}

/* ── Extended spacing utilities ── */
.pr-5{padding-right:var(--sp-5);}
.py-1{padding-top:var(--sp-1);padding-bottom:var(--sp-1);}
.ml-2{margin-left:var(--sp-2);}.mt-1{margin-top:var(--sp-1);}.mt-3{margin-top:var(--sp-3);}
.mb-1{margin-bottom:var(--sp-1);}.mb-2{margin-bottom:var(--sp-2);}.mb-3{margin-bottom:var(--sp-3);}

/* ── Extra layout utilities ── */
.flex-col{display:flex;flex-direction:column;}.flex-start{display:flex;align-items:flex-start;}
.gap-xs{gap:var(--sp-1);}.gap-2{gap:2px;}.gap-3{gap:var(--sp-3);}.gap-4{gap:var(--sp-4);}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-4);}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-3);}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-3);}
.grid-auto{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:var(--sp-3);}
.cursor-pointer{cursor:pointer;}.nowrap{white-space:nowrap;}.mono{font-family:var(--mono);}
.uppercase{text-transform:uppercase;}.lsp-wide{letter-spacing:.08em;}

/* ── Conditional color utilities (for dynamic template values) ── */
.color-success{color:var(--success);}.color-danger{color:var(--danger);}.color-warning{color:#F59E0B;}
.color-purple{color:var(--aurora-purple);}.color-cyan{color:var(--aurora-cyan);}
.kpi-value-lg{font-size:24px;font-variant-numeric:tabular-nums;}
.kpi-value-md{font-size:20px;font-variant-numeric:tabular-nums;}
.kpi-value-sm{font-size:15px;font-variant-numeric:tabular-nums;}
.scroll-y-400{max-height:400px;overflow-y:auto;}
.scroll-y-500{max-height:500px;overflow-y:auto;}
.scroll-y-600{max-height:600px;overflow-y:auto;}
.scroll-y-70vh{overflow-x:auto;max-height:70vh;overflow-y:auto;}
.card-header{padding:14px 20px;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;}
.abc-card{padding:18px;}.abc-count{font-size:28px;font-weight:900;}
.matrix-cell{padding:12px;border-radius:6px;cursor:pointer;}

/* ── Form input variant (surface bg) ── */
.input-surface{width:100%;background:var(--surface-2);border:1px solid var(--border);border-radius:8px;padding:10px 14px;font-size:14px;box-sizing:border-box;color:var(--text);font-family:var(--font);}
.input-compact{width:100%;padding:7px;border:1px solid var(--border);border-radius:var(--radius);background:var(--bg);color:var(--text);font-family:var(--font);}
.tab-link{padding:10px 20px;text-decoration:none;border-bottom:2px solid transparent;margin-bottom:-1px;color:var(--text-muted);font-size:var(--text-sm);}
.tab-link.active{border-bottom-color:var(--primary);color:var(--text);}
.mini-card{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius);padding:14px;}
.bg-success{background:#10B981;}.bg-warning{background:#F59E0B;}.bg-danger{background:#EF4444;}
.text-inherit{color:inherit;text-decoration:none;}.mr-2{margin-right:var(--sp-2);}.w-160{width:160px;}
.grid-4-eq{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-3);}