:root{--font-sans: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--font-mono: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace;--bg: #f7f8fa;--surface: #ffffff;--surface-2: #f0f2f5;--border: #e3e6ea;--text: #1c2024;--text-muted: #5b6470;--text-faint: #8a929c;--accent: #4f46e5;--accent-contrast: #ffffff;--ok: #15803d;--warn: #b45309;--danger: #b91c1c;--danger-bg: #fef2f2;--radius: 10px;--radius-sm: 6px;--shadow-1: 0 1px 2px rgba(16, 24, 40, .06), 0 1px 3px rgba(16, 24, 40, .1);--shadow-2: 0 4px 12px rgba(16, 24, 40, .1);--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 24px;--space-6: 32px;--role-admin: #4f46e5;--role-distributor: #0d9488;--role-reseller: #c026d3;--role-customer: #2563eb}@media (prefers-color-scheme: dark){:root{--bg: #0f1115;--surface: #171a21;--surface-2: #1f232c;--border: #2a2f3a;--text: #e7eaf0;--text-muted: #9aa3b2;--text-faint: #6b7280;--accent: #818cf8;--accent-contrast: #0f1115;--danger-bg: #2a1416;--shadow-1: 0 1px 2px rgba(0, 0, 0, .4);--shadow-2: 0 6px 18px rgba(0, 0, 0, .5)}}body[data-role=ADMIN]{--accent: var(--role-admin)}body[data-role=DISTRIBUTOR]{--accent: var(--role-distributor)}body[data-role=RESELLER]{--accent: var(--role-reseller)}body[data-role=CUSTOMER]{--accent: var(--role-customer)}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:var(--font-sans);background:var(--bg);color:var(--text);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}h1,h2,h3{margin:0;font-weight:650;letter-spacing:-.01em}h1{font-size:22px}h2{font-size:17px}h3{font-size:14px}.ds-shell{display:grid;grid-template-columns:240px 1fr;min-height:100vh}.ds-sidebar{background:var(--surface);border-right:1px solid var(--border);padding:var(--space-4);display:flex;flex-direction:column;gap:var(--space-4)}.ds-main{display:flex;flex-direction:column;min-width:0}.ds-topbar{height:56px;flex:none;display:flex;align-items:center;justify-content:space-between;padding:0 var(--space-5);border-bottom:1px solid var(--border);background:var(--surface)}.ds-content{padding:var(--space-5);overflow:auto}@media (max-width: 720px){.ds-shell{grid-template-columns:1fr}.ds-sidebar{display:none}}.ds-brand{display:flex;align-items:center;gap:var(--space-2);font-weight:700}.ds-brand-mark{width:26px;height:26px;border-radius:7px;background:var(--accent);color:var(--accent-contrast);display:grid;place-items:center;font-size:13px;font-weight:800}.ds-nav{display:flex;flex-direction:column;gap:2px}.ds-nav a{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);color:var(--text-muted);font-weight:550;text-decoration:none}.ds-nav a:hover{background:var(--surface-2);color:var(--text)}.ds-nav a.active{background:var(--accent);color:var(--accent-contrast)}.ds-nav-section{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--text-faint);margin:var(--space-3) 0 var(--space-1) var(--space-2)}.ds-badge{display:inline-flex;align-items:center;gap:6px;padding:3px 9px;border-radius:999px;font-size:12px;font-weight:650;background:var(--surface-2);color:var(--text-muted);border:1px solid var(--border)}.ds-badge[data-role]{color:var(--accent-contrast);border:none}.ds-badge[data-role=ADMIN]{background:var(--role-admin)}.ds-badge[data-role=DISTRIBUTOR]{background:var(--role-distributor)}.ds-badge[data-role=RESELLER]{background:var(--role-reseller)}.ds-badge[data-role=CUSTOMER]{background:var(--role-customer)}.ds-badge.ok{color:var(--ok)}.ds-badge.warn{color:var(--warn)}.ds-badge.danger{color:var(--danger)}.ds-btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid var(--border);background:var(--surface);color:var(--text);padding:7px 14px;border-radius:var(--radius-sm);font:inherit;font-weight:600;cursor:pointer;line-height:1}.ds-btn:hover{background:var(--surface-2)}.ds-btn:disabled{opacity:.5;cursor:not-allowed}.ds-btn.primary{background:var(--accent);color:var(--accent-contrast);border-color:transparent}.ds-btn.primary:hover{filter:brightness(1.05)}.ds-btn.danger{color:var(--danger);border-color:var(--danger)}.ds-btn.sm{padding:4px 9px;font-size:12px}.ds-btn.ghost{background:transparent;border-color:transparent;color:var(--text-muted)}.ds-btn.ghost:hover{background:var(--surface-2);color:var(--text)}.ds-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-1)}.ds-card-head{padding:var(--space-4) var(--space-5);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;gap:var(--space-3)}.ds-card-body{padding:var(--space-5)}.ds-card-title{font-size:15px;font-weight:650}.ds-card-sub{color:var(--text-muted);font-size:13px;margin-top:2px}.ds-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:var(--space-4)}.ds-stat{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:var(--space-4) var(--space-5)}.ds-stat-label{color:var(--text-muted);font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.04em}.ds-stat-value{font-size:24px;font-weight:700;margin-top:6px;letter-spacing:-.02em}.ds-table-wrap{overflow-x:auto}.ds-table{width:100%;border-collapse:collapse;font-size:13px}.ds-table th,.ds-table td{text-align:left;padding:10px 14px;border-bottom:1px solid var(--border);white-space:nowrap}.ds-table th{color:var(--text-muted);font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:.03em}.ds-table tbody tr:hover{background:var(--surface-2)}.ds-mono{font-family:var(--font-mono);font-size:12px;color:var(--text-muted)}.ds-field{display:flex;flex-direction:column;gap:5px;margin-bottom:var(--space-4)}.ds-label{font-size:12px;font-weight:600;color:var(--text-muted)}.ds-input,.ds-select{font:inherit;padding:8px 10px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);color:var(--text)}.ds-input:focus,.ds-select:focus{outline:2px solid var(--accent);outline-offset:-1px}.ds-switcher{position:relative}.ds-switcher-btn{display:flex;align-items:center;gap:var(--space-2);padding:6px 10px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);cursor:pointer;font:inherit;max-width:280px}.ds-switcher-menu{position:absolute;right:0;top:calc(100% + 6px);min-width:260px;z-index:20;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-2);padding:var(--space-2);max-height:320px;overflow:auto}.ds-switcher-item{display:block;width:100%;text-align:left;padding:8px 10px;border:none;background:transparent;border-radius:var(--radius-sm);cursor:pointer;font:inherit;color:var(--text)}.ds-switcher-item:hover{background:var(--surface-2)}.ds-banner{padding:10px var(--space-5);display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);font-weight:600}.ds-banner.impersonating{background:var(--role-reseller);color:#fff}.ds-row{display:flex;align-items:center;gap:var(--space-3)}.ds-row.between{justify-content:space-between}.ds-stack{display:flex;flex-direction:column;gap:var(--space-4)}.ds-muted{color:var(--text-muted)}.ds-empty{padding:var(--space-6);text-align:center;color:var(--text-muted)}.ds-spinner{width:18px;height:18px;border:2px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:ds-spin .7s linear infinite}@keyframes ds-spin{to{transform:rotate(360deg)}}.ds-todo{font-size:12px;color:var(--warn);border:1px dashed var(--warn);border-radius:var(--radius-sm);padding:6px 10px;display:inline-block}.ds-login{min-height:100vh;display:grid;place-items:center;background:var(--bg)}.ds-login-card{width:360px;max-width:92vw;text-align:center;padding:var(--space-6)}.ds-chart{width:100%;overflow-x:auto}.ds-chart svg{width:100%;height:auto;display:block}.ds-chart-empty{padding:var(--space-6);text-align:center;color:var(--text-muted)}.ds-grid{stroke:var(--border);stroke-width:1}.ds-grid.zero{stroke:var(--text-faint);stroke-dasharray:0}.ds-axis{fill:var(--text-faint);font-size:11px;font-family:var(--font-sans)}.ds-line{stroke:var(--accent);stroke-width:2.5;stroke-linejoin:round;stroke-linecap:round}.ds-dot{fill:var(--accent);stroke:var(--surface);stroke-width:1.5}.ds-legend{display:flex;flex-wrap:wrap;gap:var(--space-3);margin-top:var(--space-2);padding-left:64px}.ds-legend-item{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--text-muted)}.ds-legend-item i{width:11px;height:11px;border-radius:3px;display:inline-block}.ds-spark{width:100%;height:30px;margin-top:var(--space-2)}.ds-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:var(--space-4)}.ds-metric{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:var(--space-4) var(--space-5);box-shadow:var(--shadow-1)}.ds-metric-label{color:var(--text-muted);font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.04em}.ds-metric-value{font-size:27px;font-weight:700;margin-top:6px;letter-spacing:-.02em}.ds-metric-sub{font-size:12px;color:var(--text-muted);margin-top:2px}.ds-metric-sub .up{color:var(--ok);font-weight:600}.ds-metric-sub .down{color:var(--danger);font-weight:600}.ds-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4)}@media (max-width: 900px){.ds-grid-2{grid-template-columns:1fr}}.ds-plan-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:var(--space-4)}.ds-plan{border:1px solid var(--border);border-radius:var(--radius);padding:var(--space-4);background:var(--surface)}.ds-plan h4{margin:0 0 2px;font-size:15px}.ds-plan .price{font-size:22px;font-weight:700;letter-spacing:-.02em}.ds-plan .price span{font-size:13px;font-weight:500;color:var(--text-muted)}.ds-plan ul{margin:var(--space-3) 0 0;padding-left:18px;color:var(--text-muted);font-size:13px}.ds-plan li{margin:2px 0}.ds-chip{display:inline-block;padding:2px 8px;border-radius:999px;font-size:11px;font-weight:600;background:var(--surface-2);color:var(--text-muted);margin:2px 4px 2px 0}.ds-section-title{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--text-faint);margin:var(--space-5) 0 var(--space-2)}