:root {
  --brand:#1677ff; --accent:#ff3b6b; --chart-2:#00a6a6; --chart-3:#7c5cff; --chart-4:#ff9f1c;
  --app-bg:#f5f7fb; --nav-bg:#fff; --panel-bg:#fff; --panel-muted:#f7f9fc;
  --text-main:#172033; --text-muted:#667085; --border-main:#e3e8f0; --border-soft:#edf1f6;
  --input-bg:#fff; --input-text:#172033; --preview-bg:linear-gradient(155deg,color-mix(in srgb,#1677ff 11%,#fff),#f8fafc 54%,color-mix(in srgb,#ff3b6b 9%,#fff)); --preview-text:#172033; --preview-muted:#667085; --preview-action-bg:rgba(255,255,255,.82);
  --radius-control:10px; --radius-card:14px; --panel-shadow:0 1px 2px rgba(31,45,61,.06); --panel-backdrop:none;
  color-scheme:light;
}

/* Shared semantic layer: every dashboard page inherits one configurable system. */
html,body { background:var(--app-bg); color:var(--text-main); }
body { --bg:var(--app-bg); --sidebar:var(--nav-bg); --surface:var(--panel-bg); --surface-2:var(--panel-muted); --surface-3:var(--panel-muted); --line:var(--border-main); --line-soft:var(--border-soft); --text:var(--text-main); --muted:var(--text-muted); --subtle:color-mix(in srgb,var(--text-muted) 72%,transparent); --cyan:var(--brand); --cyan-soft:color-mix(in srgb,var(--brand) 11%,transparent); --pink:var(--accent); --pink-soft:color-mix(in srgb,var(--accent) 11%,transparent); --r-sm:var(--radius-control); --r-lg:var(--radius-card); --shadow:var(--panel-shadow); }
button,input,select { font:inherit; }
button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible { outline:3px solid color-mix(in srgb,var(--brand) 28%,transparent); outline-offset:2px; }

.sidebar,.topbar,.section-nav,.filter-strip,.metric,.report-panel,.reel-preview,.pulse-card,.column-menu,.drill-drawer,.drill-table-wrap { background:var(--panel-bg)!important; border-color:var(--border-main)!important; box-shadow:var(--panel-shadow); backdrop-filter:var(--panel-backdrop); }
.sidebar { color:var(--text-main); }
.brand { background:var(--brand)!important; box-shadow:0 8px 24px color-mix(in srgb,var(--brand) 24%,transparent)!important; }
.brand span { color:#fff!important; }
.nav-icon,.breadcrumb strong,.section-title strong,.nav-item,.page-intro h1,.metric strong,.report-panel td strong,.table-footer b { color:var(--text-main)!important; }
.nav-icon:hover,.nav-icon.active { background:var(--panel-muted)!important; color:var(--brand)!important; }
.nav-icon.active::before { background:var(--brand)!important; }
.topbar { border-bottom:1px solid var(--border-main); }
.context-controls label,.timezone,.profile,.menu-search,.date-range label,.report-tools button,.column-menu,.button.ghost { background:var(--panel-muted)!important; border-color:var(--border-main)!important; color:var(--text-main)!important; border-radius:var(--radius-control)!important; }
.context-controls select,.menu-search input,.date-range input,.ds-ai-form input { color:var(--text-main)!important; }
.date-range input { background:var(--input-bg)!important; color:var(--input-text)!important; border:1px solid var(--border-main)!important; color-scheme:light; box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--brand) 3%,transparent); }
html[data-theme="dark"] .date-range input { color-scheme:dark; }
html[data-theme="light"] .date-range input::-webkit-calendar-picker-indicator { filter:none; opacity:.72; }
html[data-theme="dark"] .date-range input::-webkit-calendar-picker-indicator { filter:invert(1); opacity:.82; }
.context-controls select option { background:var(--panel-bg); color:var(--text-main); }
.section-nav { border-right:1px solid var(--border-main); }
.nav-item:hover,.nav-item.active { background:color-mix(in srgb,var(--brand) 8%,var(--panel-bg))!important; color:var(--brand)!important; }
.nav-item.active i,.pulse-card::before { background:var(--brand)!important; }
.pulse-card { background:linear-gradient(145deg,color-mix(in srgb,var(--brand) 8%,var(--panel-bg)),var(--panel-bg))!important; }
.page-intro .eyebrow,.drill-drawer header span { color:var(--brand)!important; }
.page-intro h1 span { color:var(--brand)!important; text-shadow:none!important; }
.live-state,.mobile-context,.page-intro p,.metric small,.table-footer,.report-tools,.column-menu small { color:var(--text-muted)!important; }
.filter-strip,.metric,.report-panel,.reel-preview { border-radius:var(--radius-card)!important; overflow:hidden; }
.filter-strip { background:var(--panel-bg)!important; }
.quick-range { background:var(--panel-muted)!important; border-radius:var(--radius-control)!important; }
.quick-range button { color:var(--text-muted)!important; }
.quick-range button.active,.button.primary { background:var(--brand)!important; color:#fff!important; box-shadow:0 8px 22px color-mix(in srgb,var(--brand) 22%,transparent)!important; }
.metrics { gap:12px!important; }
.metric { border:1px solid var(--border-main)!important; }
.metric.featured { background:linear-gradient(145deg,color-mix(in srgb,var(--brand) 10%,var(--panel-bg)),var(--panel-bg))!important; }
.metric.featured::after { background:var(--brand)!important; }
.metric-head b { color:var(--brand)!important; background:color-mix(in srgb,var(--brand) 9%,transparent)!important; }
.metric:nth-child(3) .metric-head b,.pink-text { color:var(--accent)!important; background:color-mix(in srgb,var(--accent) 9%,transparent)!important; }
.mini-bars i,.rate-line span { background:var(--brand)!important; }
.view-tabs button { color:var(--text-muted)!important; }
.view-tabs button.active { color:var(--text-main)!important; }
.view-tabs button.active::after { background:linear-gradient(90deg,var(--brand) 62%,var(--accent) 62%)!important; }
.report-panel th,.drill-table-wrap th { background:var(--panel-muted)!important; color:var(--text-muted)!important; }
.report-panel td,.drill-table-wrap td { color:var(--text-muted)!important; border-color:var(--border-soft)!important; }
.report-panel tbody tr:hover,.drill-table-wrap tbody tr:hover { background:color-mix(in srgb,var(--brand) 4%,var(--panel-bg))!important; }
.primary-money,.drill-table-wrap td.drill-base { background:linear-gradient(90deg,color-mix(in srgb,var(--brand) 8%,transparent),transparent)!important; }
.primary-money strong,.drill-table-wrap td.drill-base { color:var(--brand)!important; text-shadow:none!important; }
.primary-money.bonus,.drill-table-wrap td.drill-bonus { background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 8%,transparent),transparent)!important; }
.primary-money.bonus strong,.drill-table-wrap td.drill-bonus { color:var(--accent)!important; text-shadow:none!important; }
.type-chip,.status-chip,.double-chip { background:var(--panel-muted)!important; color:var(--text-muted)!important; border-radius:var(--radius-control)!important; }
.status-chip.claimed,.double-chip.achieved { color:var(--brand)!important; background:color-mix(in srgb,var(--brand) 9%,transparent)!important; }
.drill-overlay { background:rgba(15,23,42,.34)!important; }
.drill-drawer { color:var(--text-main); }
.drill-summary { background:var(--border-main)!important; border-radius:var(--radius-card); overflow:hidden; }
.drill-summary div { background:var(--panel-muted)!important; }
.reel-preview { border-radius:24px!important; }
.reel-stage { background:var(--preview-bg)!important; color:var(--preview-text)!important; border:1px solid color-mix(in srgb,var(--brand) 13%,var(--border-main)); }
.reel-stage::after { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(135deg,color-mix(in srgb,var(--brand) 6%,transparent),transparent 38%,color-mix(in srgb,var(--accent) 5%,transparent)); }
.reel-stage>p,.reel-stage>small,.reel-caption p { color:var(--preview-muted)!important; }
.reel-stage>strong,.reel-caption span { color:var(--brand)!important; text-shadow:none!important; }
.signal-lines i { border-color:color-mix(in srgb,var(--brand) 35%,transparent)!important; }
.signal-lines i:nth-child(2) { border-color:color-mix(in srgb,var(--accent) 35%,transparent)!important; }
.signal-lines i:nth-child(3) { background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--brand) 42%,transparent),transparent)!important; }
.reel-actions i { background:var(--preview-action-bg)!important; color:var(--text-muted); border:1px solid color-mix(in srgb,var(--brand) 9%,var(--border-main)); }
.reel-actions button:first-child i { color:var(--accent)!important; }
.reel-actions button:nth-child(2) i { color:var(--brand)!important; }

/* Reusable system actions, global search and drawers. */
.ds-system-actions { display:flex; align-items:center; gap:7px; margin-right:3px; }
.ds-system-actions button { height:34px; display:flex; align-items:center; gap:7px; padding:0 10px; border:1px solid var(--border-main); border-radius:var(--radius-control); background:var(--panel-bg); color:var(--text-main); cursor:pointer; }
.ds-system-actions button:hover { border-color:color-mix(in srgb,var(--brand) 35%,var(--border-main)); background:var(--panel-muted); }
.ds-system-actions span { font-size:10px; font-weight:650; }
.ds-system-actions kbd,.ds-search kbd { padding:2px 5px; border:1px solid var(--border-main); border-bottom-width:2px; border-radius:5px; background:var(--panel-muted); color:var(--text-muted); font-size:8px; font-family:inherit; }
.ds-overlay { position:fixed; z-index:110; inset:0; background:rgba(15,23,42,.28); backdrop-filter:blur(3px); opacity:0; pointer-events:none; transition:opacity .2s ease; }
.ds-overlay.open { opacity:1; pointer-events:auto; }
.ds-drawer { position:fixed; z-index:120; inset:0 0 0 auto; width:min(480px,96vw); display:flex; flex-direction:column; background:var(--panel-bg); color:var(--text-main); border-left:1px solid var(--border-main); box-shadow:-24px 0 80px rgba(15,23,42,.16); transform:translateX(102%); transition:transform .24s ease; backdrop-filter:var(--panel-backdrop); }
.ds-drawer.open { transform:translateX(0); }
.ds-drawer>header { display:flex; justify-content:space-between; gap:20px; padding:26px 26px 20px; border-bottom:1px solid var(--border-main); }
.ds-drawer>header small { color:var(--brand); font-size:9px; font-weight:800; letter-spacing:.16em; }
.ds-drawer h2 { margin:6px 0 5px; font-size:27px; letter-spacing:-.04em; }
.ds-drawer header p { margin:0; color:var(--text-muted); font-size:11px; }
.ds-drawer header>button { width:36px; height:36px; border:1px solid var(--border-main); border-radius:50%; background:var(--panel-muted); color:var(--text-main); cursor:pointer; font-size:20px; }
.ds-drawer-body { flex:1; overflow:auto; padding:8px 26px 24px; }
.ds-drawer fieldset { margin:22px 0 0; padding:0; border:0; }
.ds-drawer legend { margin-bottom:10px; color:var(--text-main); font-size:12px; font-weight:750; }
.ds-segments { display:grid; grid-template-columns:repeat(3,1fr); gap:6px; padding:5px; background:var(--panel-muted); border:1px solid var(--border-soft); border-radius:var(--radius-card); }
.ds-segments button { min-height:38px; border:0; border-radius:var(--radius-control); background:transparent; color:var(--text-muted); cursor:pointer; font-size:10px; }
.ds-segments button.active { background:var(--panel-bg); color:var(--brand); box-shadow:var(--panel-shadow); font-weight:750; }
.ds-palette-grid,.ds-depth-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.ds-palette-grid button,.ds-depth-grid button { min-height:92px; display:flex; flex-direction:column; align-items:flex-start; justify-content:flex-end; gap:4px; padding:11px; border:1px solid var(--border-main); border-radius:var(--radius-card); background:var(--panel-bg); color:var(--text-main); cursor:pointer; text-align:left; }
.ds-palette-grid button.active,.ds-depth-grid button.active { border-color:var(--brand); box-shadow:0 0 0 2px color-mix(in srgb,var(--brand) 12%,transparent); }
.ds-palette-grid i { width:100%; height:18px; margin-bottom:auto; border-radius:7px; background:linear-gradient(90deg,var(--brand) 0 46%,var(--accent) 46% 68%,var(--chart-2) 68%); }
.ds-palette-grid button:nth-child(2) i { background:linear-gradient(90deg,#6d4aff 0 46%,#d946ef 46% 68%,#0ea5e9 68%); }
.ds-palette-grid button:nth-child(3) i { background:linear-gradient(90deg,#078b67 0 46%,#e5484d 46% 68%,#2563eb 68%); }
.ds-palette-grid span,.ds-depth-grid b { font-size:10px; }
.ds-palette-grid small,.ds-depth-grid small { color:var(--text-muted); font-size:8px; }
.ds-depth-grid span { margin-bottom:auto; color:var(--brand); font-size:22px; }
.ds-drawer>footer { min-height:62px; display:flex; align-items:center; justify-content:space-between; padding:0 26px; border-top:1px solid var(--border-main); color:var(--text-muted); font-size:9px; }
.ds-drawer>footer button { height:34px; padding:0 12px; border:1px solid var(--border-main); border-radius:var(--radius-control); background:var(--panel-muted); color:var(--text-main); cursor:pointer; }
.ds-search { position:fixed; z-index:130; top:12vh; left:50%; width:min(620px,92vw); overflow:hidden; border:1px solid var(--border-main); border-radius:calc(var(--radius-card) + 4px); background:var(--panel-bg); color:var(--text-main); box-shadow:0 28px 90px rgba(15,23,42,.22); transform:translate(-50%,-14px) scale(.98); opacity:0; pointer-events:none; transition:.18s ease; backdrop-filter:var(--panel-backdrop); }
.ds-search.open { transform:translate(-50%,0) scale(1); opacity:1; pointer-events:auto; }
.ds-search header { height:64px; display:grid; grid-template-columns:30px 1fr auto; align-items:center; gap:8px; padding:0 18px; border-bottom:1px solid var(--border-main); color:var(--brand); font-size:21px; }
.ds-search input { width:100%; border:0; outline:0; background:transparent; color:var(--text-main); font-size:15px; }
.ds-search-results { max-height:390px; overflow:auto; padding:9px; }
.ds-search-results a { min-height:65px; display:grid; grid-template-columns:36px 1fr auto; align-items:center; gap:10px; padding:0 12px; border-radius:var(--radius-control); color:var(--text-main); text-decoration:none; }
.ds-search-results a:hover,.ds-search-results a:focus { background:var(--panel-muted); }
.ds-search-results a>span { color:var(--brand); font-size:9px; font-weight:800; }
.ds-search-results b,.ds-search-results small { display:block; }
.ds-search-results b { font-size:12px; }
.ds-search-results small { margin-top:4px; color:var(--text-muted); font-size:9px; }
.ds-search-results i { color:var(--text-muted); font-style:normal; }
.ds-search footer { padding:10px 18px; border-top:1px solid var(--border-main); color:var(--text-muted); font-size:9px; }
.ds-no-results { display:grid; place-items:center; min-height:160px; color:var(--text-muted); text-align:center; }
.ds-no-results b,.ds-no-results small { display:block; }
.ds-ai-fab { position:fixed; z-index:90; right:22px; bottom:22px; width:50px; height:50px; display:grid; place-items:center; border:0; border-radius:17px; background:var(--brand); color:#fff; box-shadow:0 14px 35px color-mix(in srgb,var(--brand) 32%,transparent); cursor:pointer; }
.ds-ai-fab span { font-size:12px; font-weight:850; }
.ds-ai-fab i { position:absolute; right:6px; top:6px; width:7px; height:7px; border:2px solid var(--brand); border-radius:50%; background:#39d98a; }
.ds-ai-stream { flex:1; overflow:auto; padding:22px; background:var(--panel-muted); }
.ds-ai-stream article { display:grid; grid-template-columns:28px minmax(0,1fr); gap:10px; margin-bottom:16px; }
.ds-ai-stream article>span { width:28px; height:28px; display:grid; place-items:center; border-radius:9px; background:var(--brand); color:#fff; font-size:8px; font-weight:800; }
.ds-ai-stream article.user>span { background:var(--text-main); }
.ds-ai-stream article>div { padding:12px 14px; border:1px solid var(--border-main); border-radius:4px var(--radius-card) var(--radius-card); background:var(--panel-bg); box-shadow:var(--panel-shadow); }
.ds-ai-stream b { font-size:11px; }
.ds-ai-stream p { margin:5px 0 0; color:var(--text-muted); font-size:10px; line-height:1.65; }
.ds-ai-stream .thinking>span { animation:ds-pulse 1s ease-in-out infinite; }
.ds-ai-prompts { display:flex; flex-wrap:wrap; gap:6px; padding:12px 18px 0; border-top:1px solid var(--border-main); background:var(--panel-bg); }
.ds-ai-prompts button { padding:7px 9px; border:1px solid var(--border-main); border-radius:999px; background:var(--panel-muted); color:var(--text-muted); cursor:pointer; font-size:9px; }
.ds-ai-prompts button:hover { color:var(--brand); border-color:var(--brand); }
.ds-ai-form { display:grid; grid-template-columns:1fr auto; gap:8px; padding:12px 18px 18px; background:var(--panel-bg); }
.ds-ai-form input { min-width:0; height:42px; padding:0 12px; border:1px solid var(--border-main); border-radius:var(--radius-control); background:var(--panel-muted); outline:0; }
.ds-ai-form button { padding:0 16px; border:0; border-radius:var(--radius-control); background:var(--brand); color:#fff; cursor:pointer; font-weight:750; }
@keyframes ds-pulse { 50% { transform:scale(.9); opacity:.55; } }

html[data-depth="glass"] .metric,html[data-depth="glass"] .report-panel,html[data-depth="glass"] .filter-strip,html[data-depth="glass"] .topbar,html[data-depth="glass"] .section-nav { background:var(--panel-bg)!important; }

@media (max-width:1180px) { .ds-system-actions button span,.ds-system-actions kbd { display:none; } }
@media (max-width:860px) { .ds-system-actions { display:flex; position:fixed; z-index:65; right:14px; top:13px; } .ds-system-actions button { width:34px; justify-content:center; padding:0; } .ds-ai-fab { right:14px; bottom:14px; } }
@media (max-width:560px) { .ds-palette-grid,.ds-depth-grid { grid-template-columns:1fr; } .ds-palette-grid button,.ds-depth-grid button { min-height:68px; } .ds-drawer>header,.ds-drawer-body { padding-left:18px; padding-right:18px; } .ds-drawer>footer { padding:0 18px; } }
@media (prefers-reduced-motion:reduce) { .ds-ai-stream .thinking>span { animation:none; } }