/* Approved smoked-glass theme. Loaded after the legacy stylesheet. */
:root {
    --bg: #090b0d;
    --surface: rgba(20, 24, 28, .68);
    --surface-2: rgba(34, 38, 42, .62);
    --panel: rgba(20, 24, 28, .68);
    --border: rgba(226, 193, 128, .20);
    --text: #f6f4ef;
    --muted: #aaa9a5;
}

body {
    position: relative;
    min-height: 100vh;
    background:
        radial-gradient(circle at 87% 18%, rgba(65, 126, 188, .16), transparent 30%),
        radial-gradient(circle at 93% 70%, rgba(211, 147, 42, .16), transparent 31%),
        radial-gradient(circle at 17% 75%, rgba(177, 120, 34, .09), transparent 27%),
        linear-gradient(145deg, #080a0c 0%, #0b0e11 48%, #12100c 100%);
    background-attachment: fixed;
}

.topbar {
    border-color: rgba(226, 193, 128, .16);
    background: linear-gradient(105deg, rgba(9, 12, 15, .78), rgba(11, 16, 21, .64));
    box-shadow: 0 12px 38px rgba(0, 0, 0, .30), inset 0 -1px rgba(255, 255, 255, .025);
    backdrop-filter: blur(24px) saturate(135%);
    -webkit-backdrop-filter: blur(24px) saturate(135%);
}

.admin-sections {
    border-color: rgba(226, 193, 128, .18);
    background: radial-gradient(circle at 26% 24%, rgba(203, 149, 51, .09), transparent 32%), linear-gradient(180deg, rgba(15, 18, 20, .78), rgba(9, 13, 16, .66));
    box-shadow: 18px 0 44px rgba(0, 0, 0, .28), inset -1px 0 rgba(255, 255, 255, .025);
    backdrop-filter: blur(26px) saturate(125%);
    -webkit-backdrop-filter: blur(26px) saturate(125%);
}

.admin-sections-head,
.admin-sections-note,
.admin-nav-group + .admin-nav-group { border-color: rgba(226, 193, 128, .12); }
.admin-nav-group.active { background: linear-gradient(90deg, rgba(208, 151, 45, .15), rgba(208, 151, 45, .045)); }
.admin-nav-group.active::before { background: #d6a64b; box-shadow: 0 0 16px rgba(214, 166, 75, .34); }
.admin-nav-group.active .admin-section-icon,
.admin-subsections > a.active,
.overview-eyebrow,
.admin-sections-head > span { color: #e4b961; }
.admin-subsections > a.active { background: linear-gradient(90deg, rgba(202, 145, 43, .20), rgba(202, 145, 43, .07)); }

.card,
.overview-kpi,
.overview-decision,
.acquisition-metric,
.economy-kpi,
.economy-health-hero,
.overview-insights,
.overview-economy-health,
.first-purchase-kpis,
.first-purchase-distribution,
.first-purchase-insight {
    border-color: rgba(226, 193, 128, .23);
    background: linear-gradient(145deg, rgba(255, 255, 255, .045), rgba(255, 255, 255, .008) 38%), linear-gradient(155deg, rgba(24, 29, 33, .72), rgba(13, 17, 20, .60));
    box-shadow: 0 16px 38px rgba(0, 0, 0, .22), inset 0 1px rgba(255, 244, 221, .055), inset 1px 0 rgba(255, 255, 255, .018);
    backdrop-filter: blur(20px) saturate(125%);
    -webkit-backdrop-filter: blur(20px) saturate(125%);
}

.overview-kpi:hover,
.overview-decision:hover,
.card:hover { border-color: rgba(235, 200, 132, .34); }

.overview-insight,
.economy-coverage-item,
.economy-server-hints > div,
.first-purchase-kpis article,
.first-purchase-distribution,
.first-purchase-insight { background: linear-gradient(145deg, rgba(255, 255, 255, .035), rgba(9, 13, 16, .30)); }

.topbar .btn,
.btn,
input,
select,
textarea,
.overview-range,
.overview-custom-range,
.economy-resource-tabs button,
.acquisition-source-trigger,
.acquisition-source-menu {
    border-color: rgba(226, 193, 128, .20);
    background: rgba(21, 26, 30, .60);
    box-shadow: inset 0 1px rgba(255, 255, 255, .035), 0 5px 18px rgba(0, 0, 0, .12);
    backdrop-filter: blur(16px) saturate(120%);
    -webkit-backdrop-filter: blur(16px) saturate(120%);
}

.btn:hover,
.topbar .btn:hover,
.economy-resource-tabs button:hover {
    border-color: rgba(233, 194, 118, .38);
    background: rgba(44, 43, 39, .72);
}
.btn-primary {
    border-color: rgba(69, 145, 244, .68);
    background: linear-gradient(145deg, rgba(47, 132, 243, .88), rgba(30, 103, 205, .86));
}
.overview-range button.active,
.economy-resource-tabs button.active {
    border-color: rgba(221, 178, 94, .28);
    background: linear-gradient(145deg, rgba(207, 150, 43, .20), rgba(59, 112, 176, .14));
    color: #fff8e9;
}

th,
td,
.overview-previous,
.economy-nonfree-total,
.first-purchase-source-table { border-color: rgba(226, 193, 128, .13); }
tbody tr:hover { background: rgba(211, 162, 72, .055); }
.chart-grid { stroke: rgba(196, 185, 163, .18); }
.chart-y-label, .chart-x-label { fill: #aaa9a5; }

@media (max-width: 760px) {
    .topbar,
    .admin-sections,
    .card,
    .overview-kpi,
    .overview-decision,
    .acquisition-metric,
    .economy-kpi {
        backdrop-filter: blur(14px) saturate(115%);
        -webkit-backdrop-filter: blur(14px) saturate(115%);
    }
}

@media (prefers-reduced-transparency: reduce) {
    .topbar,
    .admin-sections,
    .card,
    .overview-kpi,
    .overview-decision,
    .acquisition-metric,
    .economy-kpi {
        background-color: #12171b;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }
}

/* ============================================================
   Approved reference layout
   ============================================================ */
.admin-shell-body {
    display: grid;
    grid-template-columns: 236px minmax(0, 1fr);
    gap: 0;
    min-height: 100vh;
    width: 100%;
    margin: 0;
    padding: 0;
}

.admin-workspace {
    display: flex;
    min-width: 0;
    min-height: 100vh;
    flex-direction: column;
}

.admin-workspace > .container {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 14px 20px 34px;
}

.admin-sections {
    position: sticky;
    z-index: 32;
    top: 0;
    width: 236px;
    height: 100vh;
    max-height: 100vh;
    border-width: 0 1px 0 0;
    border-radius: 0;
}

.admin-sections-head {
    display: flex;
    height: 82px;
    padding: 0 18px;
    align-items: center;
    gap: 11px;
    border-bottom: 1px solid rgba(226, 193, 128, .15);
}

.admin-brand-mark {
    display: grid;
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
    place-items: center;
    border: 1px solid rgba(236, 190, 98, .34);
    border-radius: 9px;
    background: linear-gradient(145deg, rgba(224, 169, 59, .20), rgba(224, 169, 59, .05));
    color: #e4b961;
    box-shadow: 0 0 22px rgba(218, 165, 60, .12), inset 0 1px rgba(255,255,255,.08);
}
.admin-brand-mark svg { width: 22px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.admin-sections-head > strong { display: flex; align-items: baseline; gap: 5px; color: #f7f0df; font-size: 19px; letter-spacing: .035em; }
.admin-sections-head > strong small { color: #d3ab5b; font-size: 11px; letter-spacing: .08em; }

.admin-sections-list { gap: 3px; padding: 10px 8px 22px; }
.admin-nav-group { border: 0; border-radius: 8px; background: transparent; }
.admin-nav-group + .admin-nav-group { padding-top: 4px; border-top: 1px solid rgba(226, 193, 128, .08); }
.admin-nav-group.active { box-shadow: none; }
.admin-nav-group.active::before { top: 7px; bottom: 7px; width: 2px; }
.admin-section-item { min-height: 42px; padding: 7px 10px; border-radius: 7px; gap: 10px; }
.admin-section-item strong { font-size: 12px; font-weight: 590; }
.admin-section-icon { flex-basis: 25px; }
.admin-section-icon svg { width: 16px; height: 16px; }
.admin-section-chevron { font-size: 14px; }
.admin-subsections { gap: 2px; padding: 1px 8px 8px 39px; }
.admin-subsections > a,
.admin-subsections > span { min-height: 31px; padding: 6px 9px 6px 13px; border-radius: 6px; font-size: 10px; }
.admin-subsections > a.active { color: #f1cd81; box-shadow: inset 0 1px rgba(255,255,255,.025); }
.admin-sections-note { display: none; }

.topbar {
    position: sticky;
    z-index: 28;
    top: 0;
    display: grid;
    grid-template-columns: minmax(250px, 1fr) minmax(300px, 470px) auto;
    width: 100%;
    height: 82px;
    padding: 0 20px;
    align-items: center;
    gap: 20px;
    border-width: 0 0 1px;
}

.topbar-context { min-width: 0; }
.topbar-context h1 { margin: 0 0 3px; color: #f7f5ef; font-size: 23px; font-weight: 650; letter-spacing: -.035em; }
.topbar-context p { margin: 0; overflow: hidden; color: #969a9d; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }

.topbar-search {
    display: flex;
    min-width: 0;
    height: 38px;
    padding: 0 10px;
    align-items: center;
    gap: 9px;
    border: 1px solid rgba(226, 193, 128, .17);
    border-radius: 8px;
    background: rgba(8, 12, 15, .48);
    box-shadow: inset 0 1px rgba(255,255,255,.035);
}
.topbar-search svg { width: 17px; height: 17px; flex: 0 0 17px; fill: none; stroke: #c9ae78; stroke-width: 1.7; }
.topbar-search input { min-width: 0; height: auto; padding: 0; border: 0; background: transparent; box-shadow: none; color: #e9e8e4; font-size: 10px; }
.topbar-search input:focus { border: 0; box-shadow: none; }
.topbar-search kbd { padding: 3px 6px; border: 1px solid rgba(226,193,128,.18); border-radius: 5px; color: #8f9397; font: 9px/1 Inter, sans-serif; white-space: nowrap; }

.topbar-actions { display: flex; align-items: center; justify-content: flex-end; gap: 10px; }
.topbar-icon-button {
    position: relative;
    display: grid;
    width: 35px;
    height: 35px;
    padding: 0;
    place-items: center;
    border: 0;
    background: transparent;
    color: #dad8d1;
    cursor: pointer;
}
.topbar-icon-button svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.topbar-icon-button i { position: absolute; top: 5px; right: 5px; width: 6px; height: 6px; border-radius: 50%; background: #f0ad31; box-shadow: 0 0 0 2px #11161a; }
.topbar-icon-button[disabled] { cursor: progress; opacity: .65; }
.topbar-icon-button.is-busy svg { animation: topbar-icon-spin 900ms linear infinite; }
@keyframes topbar-icon-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .topbar-icon-button.is-busy svg { animation: none; } }
.topbar-profile { display: flex; min-width: 145px; padding: 4px 4px 4px 7px; align-items: center; gap: 8px; border: 0; background: transparent; color: #efede6; cursor: pointer; text-align: left; }
.topbar-avatar { display: grid; width: 34px; height: 34px; flex: 0 0 34px; place-items: center; border: 1px solid rgba(226,193,128,.24); border-radius: 50%; background: linear-gradient(145deg,#3c4854,#1b2228); color: #f1c66e; font-weight: 700; }
.topbar-profile > span:nth-child(2) { min-width: 0; flex: 1; }
.topbar-profile strong,
.topbar-profile small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.topbar-profile strong { font-size: 10px; }
.topbar-profile small { margin-top: 2px; color: #8e9397; font-size: 8px; }
.topbar-profile b { color: #a5a7a7; font-size: 14px; }

.overview-head { min-height: 38px; margin: 0 0 10px; align-items: center; justify-content: flex-end; }
.overview-head > div:first-child { display: none; }
.overview-controls { width: 100%; flex-direction: row; align-items: center; justify-content: flex-end; gap: 9px; }
.overview-range,
.overview-custom-range { min-height: 36px; border-radius: 8px; background: rgba(18, 22, 25, .54); }
.overview-range button { min-height: 32px; padding: 0 13px; font-size: 9px; }
.overview-custom-range { padding: 4px; }
.overview-custom-range label { font-size: 8px; }
.overview-custom-range input { height: 26px; font-size: 9px; }

#overview-content { display: flex; flex-direction: column; }
#overview-content > .overview-meta { order: 0; }
#overview-content > .overview-kpis { order: 1; }
#overview-content > .overview-grid-main { order: 2; }
#overview-content > .overview-grid-main + .overview-grid { order: 3; }
#overview-content > .overview-decision-metrics { order: 4; }
#overview-content > .overview-economy-health { order: 5; }
#overview-content > .overview-insights { order: 6; }
#overview-content > .overview-scope { order: 7; }
.overview-meta { margin: 0 0 10px; font-size: 8px; }

.overview-kpis {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 9px;
    margin-bottom: 10px;
}
.overview-kpi {
    min-height: 145px;
    padding: 13px 14px 11px;
    border-radius: 9px;
}
.overview-kpi::before { display: none; }
.overview-kpi-top { justify-content: flex-start; gap: 8px; color: #d8d8d4; }
.overview-kpi-top > span:last-child { color: #d8d8d4; font-size: 10px; font-weight: 590; letter-spacing: 0; text-transform: none; }
.overview-kpi-icon { display: grid; width: 27px; height: 27px; flex: 0 0 27px; place-items: center; border-radius: 50%; background: rgba(59,130,246,.13); color: #4d91ff; }
.overview-kpi-icon svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; }
.overview-kpi.green .overview-kpi-icon { background: rgba(34,197,94,.12); color: #35c978; }
.overview-kpi.orange .overview-kpi-icon { background: rgba(245,158,11,.14); color: #e9ac35; }
.overview-kpi.violet .overview-kpi-icon { background: rgba(139,92,246,.14); color: #9b73ee; }
.overview-kpi.cyan .overview-kpi-icon { background: rgba(6,182,212,.13); color: #36bcd0; }
.overview-kpi-body { display: flex; min-width: 0; margin-top: 10px; align-items: flex-end; justify-content: space-between; gap: 8px; }
.overview-kpi-body > div { min-width: 0; }
.overview-kpi-body strong { display: block; overflow: hidden; color: #f5f4ef; font-size: clamp(20px, 1.55vw, 28px); line-height: 1.05; text-overflow: ellipsis; white-space: nowrap; }
.overview-kpi-body small { display: block; margin-top: 5px; overflow: hidden; color: #8e9396; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.overview-kpi-spark { width: min(42%, 132px); height: 38px; flex: 0 0 min(42%, 132px); overflow: visible; }
.overview-kpi-spark polyline { fill: none; stroke: #3d83f7; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; filter: drop-shadow(0 0 4px rgba(61,131,247,.24)); }
.overview-kpi.green .overview-kpi-spark polyline { stroke: #37c979; }
.overview-kpi.orange .overview-kpi-spark polyline { stroke: #e9a927; }
.overview-kpi.violet .overview-kpi-spark polyline { stroke: #9871eb; }
.overview-previous { margin-top: 9px; padding-top: 7px; border-top: 0; color: #85898c; font-size: 8px; }
.overview-delta { margin-right: 3px; padding: 0; background: transparent !important; font-size: 8px; }

.overview-grid,
.overview-grid-main { gap: 9px; margin-bottom: 9px; }
.overview-grid-main { grid-template-columns: minmax(0, 2.05fr) minmax(275px, .95fr); }
.overview-grid:not(.overview-grid-main) { grid-template-columns: minmax(260px, .85fr) minmax(0, 2.15fr); }
.overview-grid .overview-panel-wide { grid-column: auto; }
.overview-panel { padding: 14px; border-radius: 9px; }
.overview-panel-head { margin-bottom: 10px; }
.overview-panel-head h2 { font-size: 13px; }
.overview-panel-head p,
.overview-legend { font-size: 8px; }
.overview-chart { min-height: 180px; }
.overview-chart.revenue { min-height: 150px; }
.overview-decision-metrics { grid-template-columns: repeat(4, minmax(0,1fr)); gap: 9px; margin: 0 0 9px; }
.overview-decision { min-height: 76px; padding: 11px 12px; border-radius: 8px; }
.overview-decision strong { font-size: 18px; }
.overview-economy-health,
.overview-insights { margin: 0 0 9px; border-radius: 9px; }
.overview-insights { padding: 12px 14px; }
.overview-insight { min-height: 52px; }
.overview-scope { margin-top: 0; border-radius: 8px; }

@media (max-width: 1500px) {
    .overview-kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .topbar { grid-template-columns: minmax(220px, 1fr) minmax(260px, 380px) auto; }
}

@media (max-width: 1100px) {
    .admin-shell-body { display: block; }
    .admin-workspace { width: 100%; }
    .admin-sections { position: fixed; z-index: 42; top: 0; left: 0; width: min(260px, calc(100vw - 48px)); height: 100vh; max-height: 100vh; }
    .admin-workspace > .container { padding: 13px 14px 30px; }
    .topbar { grid-template-columns: auto minmax(170px, 1fr) minmax(210px, 330px) auto; padding: 0 14px; gap: 12px; }
    .admin-nav-toggle { display: block; }
    .overview-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
    .topbar { height: 66px; grid-template-columns: auto minmax(0, 1fr) auto; padding: 0 10px; }
    .topbar-context h1 { font-size: 18px; }
    .topbar-context p,
    .topbar-search { display: none; }
    .topbar-profile { min-width: 0; padding: 0; }
    .topbar-profile > span:nth-child(2),
    .topbar-profile b { display: none; }
    .admin-workspace > .container { padding: 10px 9px 28px; }
    .overview-controls { align-items: stretch; flex-direction: column; }
    .overview-range,
    .overview-custom-range { width: 100%; }
    .overview-range { display: grid; grid-template-columns: repeat(3,1fr); }
    .overview-custom-range { justify-content: space-between; }
    .overview-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .overview-grid-main,
    .overview-grid:not(.overview-grid-main) { grid-template-columns: 1fr; }
    .overview-panel-wide { grid-column: auto; }
    .overview-decision-metrics { grid-template-columns: repeat(2, minmax(0,1fr)); }
}

@media (max-width: 480px) {
    .overview-kpis,
    .overview-decision-metrics { grid-template-columns: 1fr; }
    .overview-kpi { min-height: 132px; }
}

/* Shared date filter */
.date-filter-enhanced-source { display: none !important; }
.admin-date-filter { position: relative; z-index: 24; }
.admin-date-filter-trigger {
    display: flex;
    min-width: 154px;
    height: 38px;
    padding: 0 11px;
    align-items: center;
    gap: 9px;
    border: 1px solid rgba(226, 193, 128, .20);
    border-radius: 8px;
    background: linear-gradient(145deg, rgba(255,255,255,.04), rgba(18,22,25,.64));
    box-shadow: inset 0 1px rgba(255,255,255,.04), 0 8px 22px rgba(0,0,0,.14);
    color: #d8d7d2;
    cursor: pointer;
    font: inherit;
}
.admin-date-filter-trigger:hover,
.admin-date-filter.open .admin-date-filter-trigger { border-color: rgba(231, 192, 116, .42); background: rgba(40, 39, 35, .72); }
.admin-date-filter-trigger svg { width: 16px; height: 16px; flex: 0 0 16px; fill: none; stroke: #d3ad61; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.admin-date-filter-trigger span { min-width: 0; flex: 1; overflow: hidden; font-size: 10px; font-weight: 590; text-align: left; text-overflow: ellipsis; white-space: nowrap; }
.admin-date-filter-trigger b { color: #8e9499; font-size: 14px; transition: transform .16s ease; }
.admin-date-filter.open .admin-date-filter-trigger b { transform: rotate(180deg); }

.admin-date-filter-popover {
    position: absolute;
    z-index: 80;
    top: calc(100% + 7px);
    right: 0;
    width: 304px;
    overflow: hidden;
    border: 1px solid rgba(226, 193, 128, .22);
    border-radius: 10px;
    background: linear-gradient(150deg, rgba(34,38,41,.96), rgba(15,19,22,.96));
    box-shadow: 0 24px 70px rgba(0,0,0,.46), inset 0 1px rgba(255,255,255,.055);
    backdrop-filter: blur(28px) saturate(130%);
    -webkit-backdrop-filter: blur(28px) saturate(130%);
}
.admin-date-presets { display: grid; padding: 12px 10px; gap: 2px; }
.admin-date-presets button {
    min-height: 35px;
    padding: 0 12px;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: #c5c5c1;
    cursor: pointer;
    font: 590 10px Inter, sans-serif;
    text-align: left;
}
.admin-date-presets button:hover { background: rgba(220, 168, 68, .10); color: #f0ca7a; }
.admin-date-presets hr { width: calc(100% - 24px); height: 1px; margin: 7px 12px; border: 0; background: rgba(226,193,128,.16); }

.admin-date-specific { width: 382px; max-width: calc(100vw - 24px); }
.admin-date-filter-popover:has(.admin-date-specific) { width: 382px; }
.admin-date-inputs { display: grid; grid-template-columns: 1fr auto 1fr; padding: 13px; align-items: center; gap: 8px; border-bottom: 1px solid rgba(226,193,128,.13); }
.admin-date-inputs span { min-height: 34px; padding: 0 10px; display: flex; align-items: center; border: 1px solid rgba(226,193,128,.16); border-radius: 7px; background: rgba(8,12,15,.36); color: #deddd8; font-size: 10px; }
.admin-date-inputs i { color: #7e8489; font-style: normal; }
.admin-date-calendar { padding: 12px 14px 14px; }
.admin-date-calendar-head { display: grid; grid-template-columns: 30px 1fr 30px; align-items: center; margin-bottom: 10px; }
.admin-date-calendar-head strong { color: #e5e2da; font-size: 11px; text-align: center; }
.admin-date-calendar-head button { width: 28px; height: 28px; border: 0; border-radius: 6px; background: transparent; color: #aeb2b5; cursor: pointer; font-size: 18px; }
.admin-date-calendar-head button:hover { background: rgba(255,255,255,.055); color: #f1c979; }
.admin-date-weekdays,
.admin-date-days { display: grid; grid-template-columns: repeat(7, 1fr); }
.admin-date-weekdays { margin-bottom: 5px; }
.admin-date-weekdays span { padding: 4px 0; color: #777e84; font-size: 8px; text-align: center; }
.admin-date-days button,
.admin-date-days .empty { height: 34px; }
.admin-date-days button { position: relative; z-index: 1; padding: 0; border: 0; border-radius: 0; background: transparent; color: #c8c9c7; cursor: pointer; font: 550 9px Inter, sans-serif; }
.admin-date-days button:hover:not(:disabled) { border-radius: 7px; background: rgba(70,145,235,.18); color: #78b5ff; }
.admin-date-days button.in-range { background: rgba(65,141,230,.14); color: #7db7fa; }
.admin-date-days button.start,
.admin-date-days button.end { border-radius: 8px; background: #4c95e8; color: #fff; font-weight: 700; }
.admin-date-days button:disabled { color: #42484d; cursor: not-allowed; }

.admin-date-filter-footer { display: flex; min-height: 58px; padding: 10px 13px; align-items: center; justify-content: space-between; gap: 10px; border-top: 1px solid rgba(226,193,128,.13); }
.admin-date-filter-footer button { min-height: 34px; padding: 0 13px; border: 1px solid rgba(226,193,128,.18); border-radius: 7px; background: rgba(255,255,255,.035); color: #b7b9b8; cursor: pointer; font: 600 9px Inter, sans-serif; }
.admin-date-filter-footer .admin-date-apply,
.admin-date-filter-footer .admin-date-relative-apply { margin-left: auto; border-color: rgba(75,146,231,.55); background: #397fd0; color: #fff; }
.admin-date-filter-footer button:disabled { opacity: .42; cursor: not-allowed; }

.admin-date-relative { width: 330px; max-width: calc(100vw - 24px); }
.admin-date-filter-popover:has(.admin-date-relative) { width: 330px; }
.admin-date-relative > div:first-child { display: grid; grid-template-columns: auto 78px 1fr; padding: 18px 14px 10px; align-items: center; gap: 9px; }
.admin-date-relative input,
.admin-date-relative select { height: 36px; border-radius: 7px; font-size: 10px; }
.admin-date-relative p { margin: 0; padding: 0 14px 15px; color: #858b90; font-size: 8px; line-height: 1.45; }

@media (max-width: 760px) {
    .admin-date-filter { width: 100%; }
    .admin-date-filter-trigger { width: 100%; }
    .admin-date-filter-popover,
    .admin-date-filter-popover:has(.admin-date-specific),
    .admin-date-filter-popover:has(.admin-date-relative) { right: 0; left: 0; width: min(100%, 382px); max-width: calc(100vw - 18px); }
    .admin-date-specific,
    .admin-date-relative { width: 100%; }
}

/* ============================================================
   Indigo theme system — shared Dark / Light design tokens
   ============================================================ */
:root,
:root[data-theme="dark"] {
    --ui-bg: #17182f;
    --ui-bg-soft: #1b1d38;
    --ui-sidebar: #202242;
    --ui-topbar: rgba(27, 29, 56, .96);
    --ui-panel: #242748;
    --ui-panel-raised: #292c51;
    --ui-control: #202342;
    --ui-border: rgba(162, 168, 218, .16);
    --ui-border-strong: rgba(169, 126, 255, .36);
    --ui-text: #f7f7ff;
    --ui-text-soft: #d6d7e9;
    --ui-muted: #9599bc;
    --ui-primary: #8b3dff;
    --ui-primary-soft: rgba(139, 61, 255, .16);
    --ui-primary-hover: #9d5cff;
    --ui-cyan: #21c8e7;
    --ui-green: #31d38b;
    --ui-coral: #ff5d70;
    --ui-orange: #ff9f43;
    --ui-shadow: 0 14px 34px rgba(6, 7, 24, .22);
    --ui-shadow-soft: 0 8px 20px rgba(6, 7, 24, .14);
}

:root[data-theme="light"] {
    --ui-bg: #f0eff8;
    --ui-bg-soft: #f6f5fb;
    --ui-sidebar: #fbfaff;
    --ui-topbar: rgba(250, 249, 255, .96);
    --ui-panel: #ffffff;
    --ui-panel-raised: #faf9ff;
    --ui-control: #f7f6fc;
    --ui-border: rgba(82, 79, 132, .13);
    --ui-border-strong: rgba(124, 55, 232, .30);
    --ui-text: #20213f;
    --ui-text-soft: #424566;
    --ui-muted: #747895;
    --ui-primary: #7c2ee8;
    --ui-primary-soft: rgba(124, 46, 232, .10);
    --ui-primary-hover: #6d24d4;
    --ui-cyan: #08afd4;
    --ui-green: #16ad70;
    --ui-coral: #ec405b;
    --ui-orange: #eb8626;
    --ui-shadow: 0 12px 30px rgba(56, 52, 105, .08);
    --ui-shadow-soft: 0 5px 16px rgba(56, 52, 105, .07);
}

html { background: var(--ui-bg); }

body {
    color: var(--ui-text);
    background: var(--ui-bg);
    font-family: "Inter", ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-feature-settings: "cv02", "cv03", "cv04", "cv11";
    font-variation-settings: "slnt" 0;
    transition: background-color .2s ease, color .2s ease;
}

body::before,
body::after { display: none !important; }

.admin-shell-body { background: var(--ui-bg); }

.admin-sections {
    border-color: var(--ui-border);
    background: var(--ui-sidebar);
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

.admin-sections-head {
    border-color: var(--ui-border);
    background: transparent;
}

.admin-brand-mark {
    border-color: rgba(139, 61, 255, .28);
    background: var(--ui-primary-soft);
    color: var(--ui-primary-hover);
    box-shadow: none;
}

.admin-sections-head > strong,
.admin-sections-head > strong small { color: var(--ui-text); }
.admin-sections-head > strong { font-weight: 760; letter-spacing: -.025em; }
.admin-sections-head > strong small { color: var(--ui-primary-hover); font-weight: 720; }
.admin-sections-head > span,
.overview-eyebrow { color: var(--ui-primary-hover); }

.admin-nav-group,
.admin-nav-group + .admin-nav-group { border-color: var(--ui-border); }

.admin-nav-group.active {
    background: var(--ui-primary-soft);
}

.admin-nav-group.active::before {
    background: var(--ui-primary);
    box-shadow: none;
}

.admin-section-item { color: var(--ui-text-soft); }
.admin-section-item:hover { background: rgba(139, 61, 255, .07); color: var(--ui-text); }
.admin-section-item strong { font-weight: 620; }
.admin-section-chevron,
.admin-section-icon { color: var(--ui-muted); }
.admin-nav-group.active .admin-section-icon { color: var(--ui-primary-hover); }
.admin-subsections > a,
.admin-subsections > span { color: var(--ui-muted); }
.admin-subsections > a:hover { color: var(--ui-text); background: rgba(139, 61, 255, .07); }
.admin-subsections > a.active {
    color: var(--ui-primary-hover);
    background: var(--ui-primary-soft);
    box-shadow: none;
}

.topbar {
    border-color: var(--ui-border);
    background: var(--ui-topbar);
    box-shadow: none;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.topbar-context h1 {
    color: var(--ui-text);
    font-weight: 720;
    letter-spacing: -.035em;
}
.topbar-context p { color: var(--ui-muted); font-size: 11px; }

.topbar-search,
.topbar .btn,
.btn,
input,
select,
textarea,
.overview-range,
.overview-custom-range,
.economy-resource-tabs button,
.acquisition-source-trigger,
.acquisition-source-menu,
.admin-date-filter-trigger {
    border-color: var(--ui-border);
    background: var(--ui-control);
    color: var(--ui-text-soft);
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

.topbar-search:focus-within,
input:focus,
select:focus,
textarea:focus,
.admin-date-filter.open .admin-date-filter-trigger {
    border-color: var(--ui-border-strong);
    box-shadow: 0 0 0 3px var(--ui-primary-soft);
}

.topbar-search svg,
.admin-date-filter-trigger svg { stroke: var(--ui-primary-hover); }
.topbar-search input { color: var(--ui-text); }
.topbar-search input::placeholder { color: var(--ui-muted); }
.topbar-search kbd {
    border-color: var(--ui-border);
    color: var(--ui-muted);
    background: var(--ui-panel-raised);
}

.topbar-actions { gap: 8px; }
.topbar-icon-button { color: var(--ui-text-soft); border-radius: 9px; }
.topbar-icon-button:hover { background: var(--ui-primary-soft); color: var(--ui-primary-hover); }
.topbar-icon-button i { background: var(--ui-coral); box-shadow: 0 0 0 2px var(--ui-topbar); }
.topbar-profile { color: var(--ui-text); border-radius: 10px; }
.topbar-profile:hover { background: var(--ui-primary-soft); }
.topbar-profile small,
.topbar-profile b { color: var(--ui-muted); }
.topbar-avatar {
    border-color: var(--ui-border);
    background: var(--ui-primary-soft);
    color: var(--ui-primary-hover);
}

.theme-toggle {
    width: 48px;
    height: 30px;
    padding: 0;
    border: 1px solid var(--ui-border);
    border-radius: 999px;
    background: var(--ui-control);
    color: var(--ui-muted);
    cursor: pointer;
}
.theme-toggle-track { position: relative; display: block; width: 100%; height: 100%; }
.theme-toggle svg {
    position: absolute;
    z-index: 1;
    top: 7px;
    width: 14px;
    height: 14px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.theme-icon-moon { left: 7px; }
.theme-icon-sun { right: 7px; }
.theme-toggle i {
    position: absolute;
    z-index: 2;
    top: 4px;
    left: 4px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: var(--ui-primary);
    box-shadow: 0 3px 8px rgba(48, 24, 95, .24);
    transition: transform .2s ease;
}
:root[data-theme="light"] .theme-toggle i { transform: translateX(18px); }
.theme-toggle:hover { border-color: var(--ui-border-strong); }

.card,
.overview-kpi,
.overview-decision,
.acquisition-metric,
.economy-kpi,
.economy-health-hero,
.overview-insights,
.overview-economy-health,
.first-purchase-kpis,
.first-purchase-distribution,
.first-purchase-insight,
.overview-panel,
.realtime-panel,
.player360-panel {
    border-color: var(--ui-border);
    background: var(--ui-panel);
    box-shadow: var(--ui-shadow-soft);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

.card:hover,
.overview-kpi:hover,
.overview-decision:hover { border-color: var(--ui-border-strong); }

.overview-kpi,
.overview-panel,
.overview-decision,
.card { border-radius: 12px; }

.overview-kpi-top,
.overview-kpi-top > span:last-child,
.overview-kpi-body strong,
.overview-panel-head h2,
.overview-decision strong,
.economy-kpi strong,
.acquisition-metric strong,
h1, h2, h3, h4 { color: var(--ui-text); }

.overview-kpi-top > span:last-child,
.overview-panel-head h2,
.card h2,
.card h3 { font-weight: 670; }
.overview-kpi-body strong { font-weight: 740; letter-spacing: -.035em; }

.overview-kpi-body small,
.overview-previous,
.overview-panel-head p,
.overview-legend,
.overview-meta,
.sub,
.muted,
.help,
.empty { color: var(--ui-muted); }

.overview-kpi-icon { background: rgba(139, 61, 255, .13); color: #a568ff; }
.overview-kpi.green .overview-kpi-icon { background: rgba(49, 211, 139, .13); color: var(--ui-green); }
.overview-kpi.orange .overview-kpi-icon { background: rgba(255, 159, 67, .14); color: var(--ui-orange); }
.overview-kpi.violet .overview-kpi-icon { background: rgba(139, 61, 255, .15); color: #a568ff; }
.overview-kpi.cyan .overview-kpi-icon { background: rgba(33, 200, 231, .13); color: var(--ui-cyan); }

.overview-kpi-spark polyline { stroke: #8f4cff; filter: none; }
.overview-kpi.green .overview-kpi-spark polyline { stroke: var(--ui-green); }
.overview-kpi.orange .overview-kpi-spark polyline { stroke: var(--ui-orange); }
.overview-kpi.violet .overview-kpi-spark polyline { stroke: #a568ff; }
.overview-kpi.cyan .overview-kpi-spark polyline { stroke: var(--ui-cyan); }

.overview-range button.active,
.economy-resource-tabs button.active,
.btn-primary {
    border-color: var(--ui-primary);
    background: var(--ui-primary);
    color: #fff;
    box-shadow: 0 6px 16px rgba(124, 46, 232, .20);
}
.btn-primary:hover { background: var(--ui-primary-hover); border-color: var(--ui-primary-hover); }
.btn:hover,
.topbar .btn:hover,
.economy-resource-tabs button:hover {
    border-color: var(--ui-border-strong);
    background: var(--ui-primary-soft);
    color: var(--ui-text);
}

.overview-insight,
.economy-coverage-item,
.economy-server-hints > div,
.first-purchase-kpis article,
.first-purchase-distribution,
.first-purchase-insight {
    border-color: var(--ui-border);
    background: var(--ui-panel-raised);
}

table { color: var(--ui-text-soft); }
th { color: var(--ui-muted); font-weight: 600; }
th, td,
.overview-previous,
.economy-nonfree-total,
.first-purchase-source-table { border-color: var(--ui-border); }
tbody tr:hover { background: var(--ui-primary-soft); }

.chart-grid { stroke: var(--ui-border); }
.chart-y-label,
.chart-x-label { fill: var(--ui-muted); }

.admin-date-filter-trigger:hover,
.admin-date-filter.open .admin-date-filter-trigger {
    border-color: var(--ui-border-strong);
    background: var(--ui-control);
}
.admin-date-filter-trigger b { color: var(--ui-muted); }
.admin-date-filter-popover {
    border-color: var(--ui-border);
    background: var(--ui-panel);
    color: var(--ui-text);
    box-shadow: var(--ui-shadow);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}
.admin-date-presets button { color: var(--ui-text-soft); }
.admin-date-presets button:hover { background: var(--ui-primary-soft); color: var(--ui-primary-hover); }
.admin-date-presets hr,
.admin-date-inputs,
.admin-date-filter-footer { border-color: var(--ui-border); }
.admin-date-presets hr { background: var(--ui-border); }
.admin-date-inputs span {
    border-color: var(--ui-border);
    background: var(--ui-control);
    color: var(--ui-text);
}
.admin-date-inputs i,
.admin-date-weekdays span,
.admin-date-relative p { color: var(--ui-muted); }
.admin-date-calendar-head strong { color: var(--ui-text); }
.admin-date-calendar-head button { color: var(--ui-muted); }
.admin-date-calendar-head button:hover { background: var(--ui-primary-soft); color: var(--ui-primary-hover); }
.admin-date-days button { color: var(--ui-text-soft); }
.admin-date-days button:hover:not(:disabled),
.admin-date-days button.in-range { background: var(--ui-primary-soft); color: var(--ui-primary-hover); }
.admin-date-days button.start,
.admin-date-days button.end { background: var(--ui-primary); color: #fff; }
.admin-date-filter-footer button {
    border-color: var(--ui-border);
    background: var(--ui-control);
    color: var(--ui-text-soft);
}
.admin-date-filter-footer .admin-date-apply,
.admin-date-filter-footer .admin-date-relative-apply { border-color: var(--ui-primary); background: var(--ui-primary); color: #fff; }

.modal-overlay { background: rgba(13, 14, 34, .68); }
.modal,
.auth-card {
    border-color: var(--ui-border);
    background: var(--ui-panel);
    color: var(--ui-text);
    box-shadow: var(--ui-shadow);
}
.toast { background: var(--ui-panel-raised); border-color: var(--ui-border); color: var(--ui-text); }

:root[data-theme="light"] .admin-navigation-backdrop { background: rgba(37, 36, 67, .28); }
:root[data-theme="light"] .overview-kpi,
:root[data-theme="light"] .overview-panel,
:root[data-theme="light"] .card { box-shadow: var(--ui-shadow-soft); }

@media (max-width: 1100px) {
    .admin-navigation-backdrop {
        z-index: 40;
        background: rgba(8, 9, 28, .56);
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }
    .admin-sections { z-index: 42; box-shadow: 18px 0 36px rgba(8, 9, 28, .18); }
}

@media (max-width: 760px) {
    .theme-toggle { width: 42px; }
    .theme-toggle i { width: 18px; height: 18px; top: 5px; }
    :root[data-theme="light"] .theme-toggle i { transform: translateX(16px); }
    .theme-toggle svg { display: none; }
}

/* ============================================================
   Dashboard layout v2 — structure matched to the approved mockup
   ============================================================ */
.admin-shell-body {
    grid-template-columns: 214px minmax(0, 1fr);
}

.admin-sections {
    width: 214px;
}

.admin-sections-head {
    height: 68px;
    padding: 0 16px;
}

.admin-brand-mark {
    width: 30px;
    height: 30px;
    flex-basis: 30px;
    border-radius: 8px;
}

.admin-sections-head > strong { font-size: 17px; }
.admin-sections-list { padding: 10px 8px 20px; gap: 2px; }
.admin-nav-group + .admin-nav-group { margin-top: 3px; padding-top: 5px; }
.admin-section-item { min-height: 39px; padding: 6px 9px; }
.admin-section-item strong { font-size: 11px; }
.admin-subsections { padding: 0 7px 7px 37px; }
.admin-subsections > a,
.admin-subsections > span { min-height: 28px; font-size: 9px; }

.topbar {
    grid-template-columns: minmax(190px, 1fr) minmax(270px, 410px) auto auto;
    height: 68px;
    padding: 0 18px;
    gap: 14px;
}

.topbar-context h1 { font-size: 21px; }
.topbar-context p { font-size: 10px; }
.topbar-search { height: 36px; }
.topbar-page-actions { display: flex; min-width: 0; align-items: center; justify-content: flex-end; }
.topbar-page-actions:empty { display: none; }
.topbar-actions { min-width: max-content; }
.topbar-profile { min-width: 128px; }

.admin-workspace > .container {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 14px 18px 28px;
}

.overview-page > .overview-head { display: none; }
.overview-dashboard-meta { margin: 0 1px 10px; font-size: 9px; }

.overview-primary-kpis {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 10px;
}

.overview-primary-kpis .overview-kpi {
    min-height: 132px;
    padding: 12px 13px 10px;
}

.overview-primary-kpis .overview-kpi-top { gap: 8px; }
.overview-primary-kpis .overview-kpi-icon {
    width: 29px;
    height: 29px;
    flex-basis: 29px;
    border-radius: 8px;
}
.overview-primary-kpis .overview-kpi-top > span:last-child { font-size: 10px; }
.overview-primary-kpis .overview-kpi-body { margin-top: 9px; }
.overview-primary-kpis .overview-kpi-body strong { font-size: clamp(20px, 1.45vw, 27px); }
.overview-primary-kpis .overview-kpi-body small { max-width: 170px; font-size: 8px; }
.overview-primary-kpis .overview-kpi-spark { align-self: flex-end; height: 34px; }
.overview-primary-kpis .overview-previous { margin-top: 7px; padding-top: 5px; }

.overview-dashboard-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.16fr) minmax(0, 1fr) minmax(235px, .58fr);
    align-items: stretch;
    gap: 10px;
    margin-bottom: 14px;
}

.overview-dashboard-grid > .overview-panel { min-width: 0; min-height: 334px; }
.overview-dashboard-grid .overview-chart { min-height: 232px; }
.overview-dashboard-grid .overview-chart.revenue { min-height: 232px; }

.overview-dashboard-side {
    display: grid;
    min-width: 0;
    grid-template-rows: minmax(0, 1.1fr) minmax(122px, .9fr);
    gap: 10px;
}

.overview-dashboard-side .overview-panel { min-height: 0; padding: 14px; }
.overview-dashboard-retention .retention-list { gap: 13px; }
.overview-dashboard-retention .retention-track { height: 6px; }
.overview-dashboard-retention .retention-row small { display: none; }
.overview-dashboard-retention .retention-value { color: var(--ui-primary-hover); font-size: 13px; }

.overview-dashboard-side .overview-economy-health {
    display: block;
    min-width: 0;
    min-height: 122px;
    margin: 0;
    padding: 13px;
    border-color: var(--ui-border);
    border-radius: 12px;
    background: var(--ui-panel);
    box-shadow: var(--ui-shadow-soft);
    transform: none;
}
.overview-dashboard-side .overview-economy-health:hover { border-color: var(--ui-border-strong); transform: none; }
.overview-dashboard-side .overview-economy-symbol,
.overview-dashboard-side .overview-economy-processing { display: none; }
.overview-dashboard-side .overview-economy-copy > span { color: var(--ui-primary-hover); font-size: 8px; }
.overview-dashboard-side .overview-economy-copy strong { color: var(--ui-text); font-size: 12px; }
.overview-dashboard-side .overview-economy-copy small { display: none; }
.overview-dashboard-side .overview-economy-resources {
    grid-template-columns: 1fr;
    margin-top: 10px;
    border: 0;
    gap: 7px;
}
.overview-dashboard-side .overview-economy-resource {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    align-items: center;
    padding: 0;
    border: 0;
}
.overview-dashboard-side .overview-economy-resource > span { grid-row: 1 / span 2; color: var(--ui-text-soft); font-weight: 650; }
.overview-dashboard-side .overview-economy-resource strong { margin: 0; font-size: 10px; }
.overview-dashboard-side .overview-economy-resource small { font-size: 8px; }
.overview-dashboard-side .overview-economy-open {
    position: absolute;
    top: 13px;
    right: 13px;
    color: var(--ui-primary-hover);
    font-size: 8px;
}
.overview-dashboard-side .overview-economy-health { position: relative; }
.overview-dashboard-side .overview-economy-health.processing { display: grid; place-content: center; text-align: center; }
.overview-dashboard-side .overview-economy-processing-bars { margin-top: 9px; }

.overview-supporting-section { margin: 0 0 14px; }
.overview-section-heading {
    display: flex;
    margin: 0 2px 9px;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
}
.overview-section-heading span {
    display: block;
    margin-bottom: 2px;
    color: var(--ui-primary-hover);
    font-size: 8px;
    font-weight: 760;
    letter-spacing: .08em;
    text-transform: uppercase;
}
.overview-section-heading h2 { margin: 0; font-size: 13px; }
.overview-section-heading small { color: var(--ui-muted); font-size: 8px; }
.overview-supporting-grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 8px;
}
.overview-supporting-grid .overview-decision {
    min-height: 86px;
    padding: 10px;
    border-radius: 10px;
    background: var(--ui-panel);
    box-shadow: var(--ui-shadow-soft);
}
.overview-supporting-grid .overview-decision::before { width: 2px; }
.overview-supporting-grid .overview-decision > .overview-delta {
    position: absolute;
    top: 8px;
    right: 8px;
    max-width: 52px;
    overflow: hidden;
    background: transparent;
    font-size: 8px;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.overview-supporting-grid .overview-decision > div > span { max-width: 74%; font-size: 8px; }
.overview-supporting-grid .overview-decision strong { margin: 8px 0 4px; font-size: 17px; }
.overview-supporting-grid .overview-decision small { font-size: 8px; }

.overview-dashboard-lower {
    display: grid;
    grid-template-columns: minmax(270px, .65fr) minmax(0, 1.35fr);
    align-items: stretch;
    gap: 10px;
    margin-bottom: 10px;
}
.overview-dashboard-lower > * { min-width: 0; margin: 0; }
.overview-dashboard-lower .overview-insights { border-color: var(--ui-border); background: var(--ui-panel); box-shadow: var(--ui-shadow-soft); }
.overview-dashboard-lower .overview-insight-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.overview-dashboard-lower .overview-insight { background: var(--ui-panel-raised); }

.overview-panel { padding: 13px; }
.overview-panel-head { margin-bottom: 10px; }
.overview-panel-head h2 { font-size: 13px; }
.overview-panel-head p { font-size: 9px; }
.overview-legend { font-size: 8px; }
.overview-money-summary strong { color: var(--ui-green); font-size: 13px; }
.overview-money-summary span { font-size: 8px; }

.chart-tooltip > rect { fill: var(--ui-panel-raised); stroke: var(--ui-border-strong); filter: var(--ui-shadow-soft); }
.chart-tooltip-date,
.chart-tooltip-value { fill: var(--ui-text); }
.chart-tooltip-label { fill: var(--ui-muted); }
.chart-hover-dot { stroke: var(--ui-panel); }

.overview-scope {
    border-color: var(--ui-border);
    background: var(--ui-panel-raised);
    color: var(--ui-muted);
    font-size: 9px;
}
.overview-scope strong { color: var(--ui-primary-hover); }

@media (max-width: 1450px) {
    .overview-dashboard-grid { grid-template-columns: minmax(0, 1.2fr) minmax(0, .95fr) minmax(225px, .62fr); }
    .overview-supporting-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 1180px) {
    .admin-shell-body { display: block; }
    .admin-sections { width: min(250px, calc(100vw - 52px)); }
    .topbar { grid-template-columns: auto minmax(170px, 1fr) auto auto; }
    .topbar-search { display: none; }
    .overview-primary-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .overview-dashboard-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .overview-dashboard-side { grid-column: 1 / -1; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: none; }
}

@media (max-width: 760px) {
    .topbar { grid-template-columns: auto minmax(0, 1fr) auto; gap: 8px; }
    .topbar-page-actions { grid-column: 1 / -1; position: fixed; z-index: 30; right: 9px; bottom: 9px; }
    .topbar-page-actions .admin-date-filter-trigger { min-width: 138px; box-shadow: var(--ui-shadow); }
    .admin-workspace > .container { padding: 10px 9px 26px; }
    .overview-dashboard-meta { align-items: flex-start; flex-direction: column; gap: 4px; }
    .overview-primary-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .overview-primary-kpis .overview-kpi { min-height: 124px; }
    .overview-dashboard-grid { grid-template-columns: 1fr; }
    .overview-dashboard-grid > .overview-panel { min-height: 300px; }
    .overview-dashboard-side { grid-column: auto; grid-template-columns: 1fr; }
    .overview-supporting-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .overview-dashboard-lower { grid-template-columns: 1fr; }
}

@media (max-width: 460px) {
    .overview-primary-kpis,
    .overview-supporting-grid { grid-template-columns: 1fr; }
    .overview-section-heading { align-items: flex-start; flex-direction: column; gap: 3px; }
}

/* ============================================================
   Reference-matched compact dashboard layout
   ============================================================ */
body { font-family: Inter, "Segoe UI", Arial, sans-serif; }

.admin-shell-body { grid-template-columns: 160px minmax(0, 1fr); }
.admin-sections {
    width: 160px;
    border-right: 1px solid var(--ui-border);
    background: var(--ui-sidebar);
    box-shadow: none;
}
.admin-sections-head {
    height: 60px;
    padding: 0 12px;
    gap: 8px;
}
.admin-brand-mark {
    width: 30px;
    height: 30px;
    flex-basis: 30px;
    border-radius: 6px;
    background: linear-gradient(145deg, rgba(139,92,246,.30), rgba(107,33,168,.18));
    color: #9b5cff;
}
.admin-brand-mark svg { width: 19px; }
.admin-sections-head > strong { display: block; font-size: 14px; line-height: 1.05; }
.admin-sections-head > strong small { display: block; margin-top: 2px; color: var(--ui-text); font-size: 8px; letter-spacing: .08em; }
.admin-sections-list {
    height: calc(100vh - 110px);
    padding: 3px 6px 58px;
    overflow-y: auto;
    scrollbar-width: thin;
}
.admin-nav-group { border-radius: 5px; }
.admin-nav-group + .admin-nav-group { margin-top: 0; padding-top: 2px; }
.admin-section-item { min-height: 31px; padding: 4px 7px; gap: 7px; }
.admin-section-item strong { font-size: 9px; font-weight: 600; }
.admin-section-icon { flex-basis: 18px; }
.admin-section-icon svg { width: 14px; height: 14px; }
.admin-section-chevron { font-size: 10px; }
.admin-subsections { gap: 0; padding: 0 5px 5px 29px; }
.admin-subsections > a,
.admin-subsections > span { min-height: 25px; padding: 4px 7px; border-radius: 4px; font-size: 8px; }
.admin-subsections > .planned small { display: none; }
.admin-system-status {
    position: absolute;
    right: 7px;
    bottom: 8px;
    left: 7px;
    display: flex;
    min-height: 39px;
    padding: 7px;
    align-items: center;
    gap: 7px;
    border: 1px solid var(--ui-border);
    border-radius: 6px;
    background: var(--ui-panel-raised);
}
.admin-system-status > span { display: grid; width: 22px; height: 22px; place-items: center; border-radius: 5px; color: var(--ui-primary-hover); }
.admin-system-status svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.7; }
.admin-system-status strong,
.admin-system-status small { display: block; white-space: nowrap; }
.admin-system-status strong { color: var(--ui-text); font-size: 8px; }
.admin-system-status small { margin-top: 3px; color: var(--ui-muted); font-size: 6px; }
.admin-system-status small i { display: inline-block; width: 5px; height: 5px; margin-right: 3px; border-radius: 50%; background: var(--ui-green); }

.topbar {
    grid-template-columns: minmax(260px, 1fr) minmax(250px, 310px) auto auto;
    height: 60px;
    padding: 0 16px;
    gap: 11px;
    border-bottom: 1px solid var(--ui-border);
    box-shadow: none;
}
.topbar-context h1 { margin-bottom: 1px; font-size: 16px; font-weight: 700; }
.topbar-context p { font-size: 8px; }
.topbar-search { height: 30px; border-radius: 5px; }
.topbar-search svg { width: 14px; height: 14px; }
.topbar-search input { font-size: 8px; }
.topbar-search kbd { padding: 2px 4px; font-size: 7px; }
.topbar-page-actions .admin-date-filter-trigger { min-width: 160px; height: 30px; border-radius: 5px; font-size: 8px; }
.topbar-actions { gap: 6px; }
.source-badge { padding: 5px 7px; font-size: 6px; }
.theme-toggle { transform: scale(.82); }
.topbar-icon-button { width: 29px; height: 29px; }
.topbar-icon-button svg { width: 16px; height: 16px; }
.topbar-profile { min-width: 104px; padding: 2px; gap: 6px; }
.topbar-avatar { width: 27px; height: 27px; flex-basis: 27px; font-size: 10px; }
.topbar-profile strong { font-size: 8px; }
.topbar-profile small { font-size: 6px; }

.admin-workspace > .container { width: 100%; max-width: none; margin: 0; padding: 2px 16px 14px; }
.overview-dashboard-meta { display: none; }
.overview-primary-kpis { gap: 8px; margin: 0 0 7px; }
.overview-primary-kpis .overview-kpi {
    position: relative;
    min-height: 131px;
    height: 131px;
    padding: 10px 11px 8px;
    overflow: hidden;
    border-radius: 7px;
}
.overview-primary-kpis .overview-kpi-top { gap: 7px; }
.overview-primary-kpis .overview-kpi-icon { width: 27px; height: 27px; flex-basis: 27px; border-radius: 6px; }
.overview-primary-kpis .overview-kpi-top > span:last-child { font-size: 9px; font-weight: 650; }
.overview-primary-kpis .overview-kpi-body { display: block; margin-top: 3px; }
.overview-primary-kpis .overview-kpi-body strong { font-size: clamp(19px, 1.6vw, 25px); line-height: 1.05; }
.overview-primary-kpis .overview-kpi-body small { display: none; }
.overview-primary-kpis .overview-kpi-spark {
    position: absolute;
    right: 10px;
    bottom: 6px;
    left: 10px;
    width: calc(100% - 20px);
    height: 31px;
}
.overview-primary-kpis .overview-previous {
    position: relative;
    z-index: 1;
    width: max-content;
    margin-top: 5px;
    padding: 0;
    font-size: 7px;
}
.overview-primary-kpis .overview-delta { font-size: 8px; font-weight: 700; }

.overview-dashboard-grid {
    grid-template-columns: minmax(0, 1.55fr) minmax(0, 1.25fr) minmax(235px, .82fr);
    height: 207px;
    gap: 8px;
    margin-bottom: 7px;
}
.overview-dashboard-grid > .overview-panel { min-height: 0; height: 207px; padding: 10px; border-radius: 7px; }
.overview-panel-head { margin-bottom: 4px; }
.overview-panel-head h2 { font-size: 10px; }
.overview-panel-head p { display: none; }
.overview-legend { font-size: 7px; }
.overview-dashboard-grid .overview-chart,
.overview-dashboard-grid .overview-chart.revenue { min-height: 0; height: 165px; }
.overview-dashboard-grid .chart-x-label,
.overview-dashboard-grid .chart-y-label { font-size: 7px; }
.overview-dashboard-revenue .overview-money-summary { display: none; }
.overview-dashboard-side { grid-template-rows: 116px 84px; gap: 7px; height: 207px; }
.overview-dashboard-side .overview-panel { height: 116px; padding: 8px 10px; border-radius: 7px; }
.overview-dashboard-retention .overview-panel-head { margin-bottom: 6px; }
.overview-dashboard-retention .retention-list { gap: 2px; }
.overview-dashboard-retention .retention-row { gap: 2px; }
.overview-dashboard-retention .retention-row > div:first-child { font-size: 8px; }
.overview-dashboard-retention .retention-value { font-size: 8px; }
.overview-dashboard-retention .retention-track { height: 4px; }
.overview-dashboard-side .overview-economy-health { min-height: 84px; height: 84px; padding: 7px 10px; border-radius: 7px; }
.overview-dashboard-side .overview-economy-copy > span { font-size: 6px; }
.overview-dashboard-side .overview-economy-copy strong { font-size: 9px; }
.overview-dashboard-side .overview-economy-resources { margin-top: 5px; gap: 3px; }
.overview-dashboard-side .overview-economy-resource { grid-template-columns: 27px minmax(0, 1fr); }
.overview-dashboard-side .overview-economy-resource > span { font-size: 7px; }
.overview-dashboard-side .overview-economy-resource strong { font-size: 7px; }
.overview-dashboard-side .overview-economy-resource small { font-size: 6px; }
.overview-dashboard-side .overview-economy-open { top: 9px; right: 9px; font-size: 6px; }
.overview-dashboard-side .overview-economy-health.processing { padding: 9px 10px; place-content: center start; text-align: left; }
.overview-dashboard-side .overview-economy-processing-bars { width: 100%; margin-top: 4px; }

.overview-recent-activity {
    min-height: 151px;
    padding: 8px 10px 6px;
    overflow: hidden;
    border-radius: 7px;
}
.overview-recent-head { display: flex; min-height: 22px; align-items: flex-start; justify-content: space-between; }
.overview-recent-head h2 { margin: 0; font-size: 10px; }
.overview-recent-head a { padding: 4px 8px; border: 1px solid var(--ui-border); border-radius: 4px; color: var(--ui-text-soft); font-size: 7px; text-decoration: none; }
.overview-recent-table-wrap { overflow-x: auto; }
.overview-recent-activity table { width: 100%; table-layout: fixed; border-collapse: collapse; }
.overview-recent-activity th,
.overview-recent-activity td { height: 22px; padding: 3px 7px; overflow: hidden; border-bottom: 1px solid var(--ui-border); color: var(--ui-text-soft); font-size: 7px; text-align: left; text-overflow: ellipsis; white-space: nowrap; }
.overview-recent-activity th { height: 18px; color: var(--ui-muted); font-weight: 550; }
.overview-recent-activity th:nth-child(1) { width: 12%; }
.overview-recent-activity th:nth-child(2) { width: 10%; }
.overview-recent-activity th:nth-child(3) { width: 29%; }
.overview-recent-activity th:nth-child(4) { width: 15%; }
.overview-recent-activity th:nth-child(5) { width: 12%; }
.overview-recent-activity th:nth-child(6) { width: 12%; }
.overview-recent-activity th:last-child { width: 24px; }
.overview-activity-type,
.overview-activity-status { display: inline-flex; padding: 2px 5px; border: 1px solid rgba(139,92,246,.35); border-radius: 4px; background: rgba(139,92,246,.10); color: var(--ui-primary-hover); line-height: 1; }
.overview-activity-type.purchase { border-color: rgba(34,197,94,.30); background: rgba(34,197,94,.09); color: var(--ui-green); }
.overview-activity-type.new-user { border-color: rgba(6,182,212,.30); background: rgba(6,182,212,.09); color: var(--ui-cyan); }
.overview-activity-status.completed,
.overview-activity-status.active { border-color: rgba(34,197,94,.30); background: rgba(34,197,94,.09); color: var(--ui-green); }
.overview-row-menu { padding: 0; border: 0; background: transparent; color: var(--ui-muted); font-size: 13px; }

@media (max-width: 1180px) {
    .admin-shell-body { display: block; }
    .admin-sections { width: min(230px, calc(100vw - 48px)); }
    .topbar { grid-template-columns: auto minmax(150px, 1fr) auto auto; }
    .overview-primary-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .overview-dashboard-grid { height: auto; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .overview-dashboard-grid > .overview-panel { height: 230px; }
    .overview-dashboard-side { grid-column: 1 / -1; height: 110px; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: none; }
    .overview-dashboard-side .overview-panel,
    .overview-dashboard-side .overview-economy-health { height: 110px; }
}

@media (max-width: 760px) {
    .topbar { height: 58px; grid-template-columns: auto minmax(0, 1fr) auto; }
    .topbar-page-actions { position: fixed; right: 8px; bottom: 8px; }
    .admin-workspace > .container { padding: 8px 8px 20px; }
    .overview-primary-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .overview-dashboard-grid { grid-template-columns: 1fr; }
    .overview-dashboard-grid > .overview-panel { height: 235px; }
    .overview-dashboard-side { grid-column: auto; height: auto; grid-template-columns: 1fr; }
    .overview-dashboard-side .overview-panel,
    .overview-dashboard-side .overview-economy-health { height: 112px; }
    .overview-recent-activity { min-height: 180px; }
    .overview-recent-activity table { min-width: 720px; }
}

@media (max-width: 460px) {
    .overview-primary-kpis { grid-template-columns: 1fr; }
}

/* Exact compact sidebar from the approved reference. */
.admin-shell-body { grid-template-columns: 158px minmax(0, 1fr); }
.admin-sections {
    width: 158px;
    border-right: 1px solid #283149;
    background: linear-gradient(180deg, #0b1224 0%, #10172b 58%, #0c1325 100%);
    box-shadow: none;
}
.admin-sections-head {
    height: 51px;
    padding: 0 11px;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 7px;
    border-bottom: 0;
}
.admin-brand-mark {
    width: 29px;
    height: 29px;
    flex-basis: 29px;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    color: #9747ff;
}
.admin-brand-mark svg { width: 27px; height: 27px; stroke-width: 1.8; }
.admin-sections-head > strong {
    display: flex;
    align-items: baseline;
    gap: 4px;
    color: #f7f8ff;
    font-size: 14px;
    font-weight: 780;
    line-height: 1;
    letter-spacing: -.025em;
    white-space: nowrap;
}
.admin-sections-head > strong small {
    display: inline;
    margin: 0;
    color: #f7f8ff;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .01em;
}
.admin-sections-list {
    height: calc(100vh - 51px);
    padding: 0 0 54px;
    gap: 0;
    overflow-y: auto;
}
.admin-nav-group,
.admin-nav-group.active {
    position: relative;
    margin: 0;
    padding: 0 6px 4px;
    border: 0;
    border-bottom: 1px solid #242e47;
    border-radius: 0;
    background: transparent !important;
    box-shadow: none;
}
.admin-nav-group + .admin-nav-group {
    margin: 0;
    padding-top: 0;
    border-top: 0;
}
.admin-nav-group::before,
.admin-nav-group.active::before { display: none; }
.admin-section-item {
    min-height: 27px;
    padding: 8px 7px 3px;
    border-radius: 0;
    color: #aeb6cc;
    gap: 4px;
}
.admin-section-item:hover { background: transparent; color: #dce2f3; }
.admin-section-item .admin-section-icon { display: none; }
.admin-section-item strong {
    color: #aeb6cc;
    font-size: 7.5px;
    font-weight: 560;
    letter-spacing: .065em;
    text-transform: uppercase;
}
.admin-section-chevron {
    margin-left: auto;
    color: #aeb6cc;
    font-size: 10px;
    line-height: 1;
}
.admin-subsections,
.admin-nav-group.collapsed .admin-subsections {
    display: grid;
    gap: 1px;
    padding: 0;
}
.admin-subsections > a,
.admin-subsections > span,
.admin-nav-group.collapsed .admin-subsections > .admin-section-summary {
    display: flex;
    min-height: 31px;
    padding: 6px 7px;
    align-items: center;
    gap: 8px;
    border-radius: 3px;
    color: #eef1fb;
    font-size: 9px;
    font-weight: 540;
}
.admin-subsections > a::before,
.admin-subsections > span::before { display: none; }
.admin-subsection-icon {
    display: grid;
    width: 17px;
    height: 17px;
    flex: 0 0 17px;
    place-items: center;
    color: #bac3d8;
}
.admin-subsection-icon svg {
    width: 16px;
    height: 16px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.65;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.admin-subsections > a:hover { background: rgba(112, 54, 204, .17); color: #fff; }
.admin-subsections > a.active {
    background: linear-gradient(90deg, #4f239c, #5e29ad);
    color: #fff;
    box-shadow: inset 0 0 0 1px rgba(164, 104, 255, .12);
}
.admin-subsections > a.active .admin-subsection-icon { color: #fff; }
.admin-section-summary { color: #eef1fb !important; }
.admin-nav-group:not(.collapsed) > .admin-subsections > .admin-section-summary { display: none; }
.admin-nav-group.collapsed > .admin-subsections > :not(.admin-section-summary) { display: none; }
.admin-subsections > .planned { display: none !important; }
.admin-system-status {
    right: 7px;
    bottom: 6px;
    left: 7px;
    min-height: 42px;
    padding: 6px 8px;
    gap: 7px;
    border-color: #29334b;
    border-radius: 4px;
    background: #121a2e;
    box-shadow: inset 0 1px rgba(255,255,255,.025);
}
.admin-system-status > span {
    width: 20px;
    height: 20px;
    color: #b8c1d7;
}
.admin-system-status strong { font-size: 7px; font-weight: 620; }
.admin-system-status small { margin-top: 2px; font-size: 5.5px; }
.admin-system-status small i { width: 5px; height: 5px; }

html[data-theme="light"] .admin-sections {
    border-color: #d7daea;
    background: linear-gradient(180deg, #fbfbff, #f3f3fb);
}
html[data-theme="light"] .admin-sections-head > strong,
html[data-theme="light"] .admin-sections-head > strong small,
html[data-theme="light"] .admin-subsections > a,
html[data-theme="light"] .admin-subsections > span { color: #202542; }
html[data-theme="light"] .admin-nav-group { border-color: #dedfee; }
html[data-theme="light"] .admin-section-item strong,
html[data-theme="light"] .admin-section-chevron { color: #59617a; }
html[data-theme="light"] .admin-subsections > a.active { color: #fff; }
html[data-theme="light"] .admin-system-status { border-color: #dedfee; background: #fff; }

@media (max-width: 1180px) {
    .admin-shell-body { display: block; }
    .admin-sections { width: min(230px, calc(100vw - 48px)); }
    .admin-sections-head { padding-right: 14px; padding-left: 14px; }
    .admin-section-item { padding-right: 11px; padding-left: 11px; }
    .admin-subsections > a,
    .admin-subsections > span,
    .admin-nav-group.collapsed .admin-subsections > .admin-section-summary { padding-right: 11px; padding-left: 11px; }
}

/* ============================================================
   Readable reference dashboard system
   ============================================================ */
:root,
:root[data-theme="dark"] {
    --ui-bg: #0f1429;
    --ui-bg-soft: #121831;
    --ui-topbar: rgba(15, 20, 41, .97);
    --ui-panel: #171d38;
    --ui-panel-raised: #1d2443;
    --ui-control: #141a33;
    --ui-border: rgba(148, 159, 211, .20);
    --ui-border-strong: rgba(157, 92, 255, .45);
    --ui-text: #f7f8ff;
    --ui-text-soft: #d9def0;
    --ui-muted: #98a3c0;
    --ui-primary: #8f4cff;
    --ui-primary-soft: rgba(143, 76, 255, .16);
    --ui-primary-hover: #a46bff;
    --ui-cyan: #21c8e7;
    --ui-green: #31d38b;
    --ui-coral: #ff5d70;
    --ui-orange: #ff714d;
}

html { font-size: 16px; }
body { font-size: 14px; line-height: 1.45; }
button, input, select, textarea { font: inherit; }

.admin-workspace > .container { padding: 10px 14px 30px; }
.topbar { height: 42px; padding-right: 11px; padding-left: 11px; }
.topbar-context h1 { font-size: 18px; font-weight: 740; line-height: 1.1; }
.topbar-context p { font-size: 11px; line-height: 1.35; }
.topbar-search input { font-size: 12px; }
.topbar-search kbd { font-size: 9px; }
.topbar-page-actions .admin-date-filter-trigger,
.admin-date-filter-trigger,
.admin-date-filter-trigger span { font-size: 11px; }
.topbar-profile strong { font-size: 11px; }
.topbar-profile small { font-size: 9px; }
.source-badge { display: none; }

/* Navigation remains compact, but no label is below readable UI size. */
.admin-section-item strong { font-size: 9px; font-weight: 650; }
.admin-subsections > a,
.admin-subsections > span,
.admin-nav-group.collapsed .admin-subsections > .admin-section-summary { font-size: 11px; font-weight: 560; }
.admin-system-status strong { font-size: 9px; }
.admin-system-status small { font-size: 7.5px; }

/* Shared surfaces used by operations, analytics, players and support. */
.card,
.overview-kpi,
.overview-panel,
.overview-decision,
.realtime-panel,
.realtime-kpi,
.economy-kpi,
.acquisition-panel,
.acquisition-metric,
.player360-panel {
    border-color: var(--ui-border);
    background: var(--ui-panel);
    box-shadow: inset 0 1px rgba(255,255,255,.02);
}
.page-head { margin-bottom: 16px; }
.page-head h1 { font-size: 24px; line-height: 1.15; }
.page-head p, .page-head small { font-size: 12px; }
.card h2, .card h3 { line-height: 1.25; }
.btn { min-height: 36px; padding: 8px 13px; font-size: 12px; }
.btn-sm { min-height: 30px; padding: 6px 10px; font-size: 11px; }
input, select, textarea, label { font-size: 12px; }
table th, table td { font-size: 12px; line-height: 1.35; }
table th { font-weight: 650; }
.empty, .muted { font-size: 12px; }

/* KPI row from the approved reference. */
.overview-primary-kpis { gap: 10px; margin-bottom: 9px; }
.overview-primary-kpis .overview-kpi {
    min-height: 132px;
    padding: 13px 14px 10px;
    border-radius: 8px;
}
.overview-primary-kpis .overview-kpi-top { gap: 9px; }
.overview-primary-kpis .overview-kpi-icon { width: 30px; height: 30px; flex-basis: 30px; border-radius: 7px; }
.overview-primary-kpis .overview-kpi-icon svg { width: 18px; height: 18px; }
.overview-primary-kpis .overview-kpi-top > span:last-child { font-size: 11px; font-weight: 650; }
.overview-primary-kpis .overview-kpi-body { margin-top: 5px; }
.overview-primary-kpis .overview-kpi-body strong {
    font-size: clamp(23px, 1.45vw, 30px);
    font-weight: 730;
    letter-spacing: -.025em;
}
.overview-primary-kpis .overview-kpi-spark { height: 40px; }
.overview-primary-kpis .overview-previous {
    margin-top: 5px;
    padding-top: 3px;
    color: var(--ui-text-soft);
    font-size: 10px;
}
.overview-primary-kpis .overview-delta { font-size: 10px; }

/* Exact chart language: violet/cyan activity and violet/orange revenue. */
.overview-dashboard-grid { height: 207px; gap: 9px; margin-bottom: 8px; }
.overview-dashboard-grid > .overview-panel { height: 207px; padding: 11px 12px; border-radius: 8px; }
.overview-panel-head { margin-bottom: 6px; }
.overview-panel-head h2 { font-size: 13px; font-weight: 680; }
.overview-panel-head p { font-size: 10px; }
.overview-legend { gap: 14px; font-size: 10px; }
.legend-dot { width: 7px; height: 7px; }
.legend-dot.active, .legend-dot.revenue { background: #9a58ff; }
.legend-dot.new { background: #22d3ee; }
.legend-dot.purchases { background: #ff684d; }
.overview-dashboard-grid .overview-chart,
.overview-dashboard-grid .overview-chart.revenue { height: 162px; }
.overview-dashboard-grid .chart-x-label,
.overview-dashboard-grid .chart-y-label,
.economy-trend-chart .chart-x-label,
.economy-trend-chart .chart-y-label,
.acquisition-chart text { font-size: 9.5px; }
.chart-grid { stroke: rgba(154, 166, 215, .17); stroke-width: 1; }
.chart-line { stroke-width: 2.3; }
.chart-line.active { stroke: #9a58ff; }
.chart-line.new { stroke: #22d3ee; stroke-dasharray: none; }
.overview-chart > polygon { opacity: .08; }
.overview-kpi-spark polyline { stroke-width: 2; }
.revenue-bar { opacity: .94; }
.revenue-bar.revenue-primary { fill: #8f4cff; }
.revenue-bar.purchase-secondary { fill: #ff684d; }
.revenue-tooltip-dot { fill: #9a58ff; }
.purchase-tooltip-dot { fill: #ff684d; stroke: var(--ui-panel); stroke-width: 1.5; }
.chart-tooltip-date { font-size: 10px; }
.chart-tooltip-label { font-size: 9.5px; }
.chart-tooltip-value { font-size: 10.5px; }

/* Retention and economy side stack. */
.overview-dashboard-side { height: 207px; grid-template-rows: 116px 84px; gap: 7px; }
.overview-dashboard-side .overview-panel { height: 116px; padding: 9px 12px; }
.overview-dashboard-retention .retention-list { gap: 4px; }
.overview-dashboard-retention .retention-row { gap: 3px; }
.overview-dashboard-retention .retention-row > div:first-child,
.overview-dashboard-retention .retention-value { font-size: 10px; }
.overview-dashboard-retention .retention-track { height: 5px; }
.overview-dashboard-side .overview-economy-health { min-height: 84px; height: 84px; padding: 8px 12px; }
.overview-dashboard-side .overview-economy-copy > span { font-size: 8px; }
.overview-dashboard-side .overview-economy-copy strong { font-size: 11px; }
.overview-dashboard-side .overview-economy-resource > span,
.overview-dashboard-side .overview-economy-resource strong { font-size: 9px; }
.overview-dashboard-side .overview-economy-resource small,
.overview-dashboard-side .overview-economy-open { font-size: 8px; }
.overview-dashboard-side .overview-economy-health.processing {
    display: grid;
    grid-template-columns: 24px minmax(150px, 210px) minmax(80px, 1fr);
    place-content: normal;
    align-items: center;
    gap: 9px;
    text-align: left;
}
.overview-dashboard-side .overview-economy-health.processing .overview-economy-copy strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.overview-dashboard-side .overview-economy-health.processing .overview-economy-processing-bars {
    width: 100%;
    margin: 0;
}

/* Reference table rhythm. */
.overview-recent-activity { min-height: 158px; padding: 8px 12px; border-radius: 8px; }
.overview-recent-head { min-height: 22px; align-items: center; }
.overview-recent-head h2 { font-size: 13px; }
.overview-recent-head a { padding: 5px 10px; font-size: 10px; }
.overview-recent-activity th { height: 18px; padding: 2px 8px; font-size: 10px; }
.overview-recent-activity td { height: 22px; padding: 3px 8px; font-size: 10px; }
.overview-activity-type,
.overview-activity-status { padding: 2px 6px; font-size: 9px; }

/* Realtime */
.realtime-head h1 { font-size: 26px; }
.realtime-head p,
.realtime-health-summary p,
.realtime-panel-head p { font-size: 12px; }
.realtime-health-summary h2 { font-size: 18px; }
.realtime-kpi > strong { font-size: 25px; }
.realtime-kpi span, .realtime-kpi small { font-size: 11px; }
.realtime-panel-head h2 { font-size: 16px; }
.realtime-event strong,
.realtime-match strong,
.realtime-coverage strong { font-size: 12px; }
.realtime-event small,
.realtime-event time,
.realtime-match span,
.realtime-coverage span { font-size: 10px; }

/* Acquisition */
.acquisition-meta { font-size: 12px; }
.acquisition-observation-control > span { font-size: 10px; }
.acquisition-summary span, .acquisition-metric span { font-size: 11px; }
.acquisition-summary strong { font-size: 22px; }
.acquisition-summary small, .acquisition-metric small { font-size: 11px; }
.acquisition-panel h2 { font-size: 17px; }
.acquisition-panel p { font-size: 12px; }
.acquisition-legend, .acquisition-source-row span { font-size: 11px; }
.acquisition-metric strong { font-size: 24px; }
.acquisition-table td, .acquisition-table th { font-size: 11px; }

/* Economy */
.economy-health-message h2 { font-size: 20px; }
.economy-health-message p, .economy-health-message > div { font-size: 11px; }
.economy-resource-tabs button span { font-size: 12px; }
.economy-resource-tabs button small { font-size: 9px; }
.economy-kpi span { font-size: 10px; }
.economy-kpi > strong { font-size: 24px; }
.economy-kpi small { font-size: 10px; }
.economy-flow-legend, .economy-origin-row > div:first-child { font-size: 11px; }
.economy-origin-row small { font-size: 9px; }
.economy-event-table td, .economy-event-table th { padding: 10px 9px; font-size: 11px; }
.economy-flow-pill, .economy-origin-pill, .economy-quality { font-size: 8px; }

/* Player 360 and generic management screens. */
.player360-identity h2 { font-size: 25px; }
.player360-panel-head h3 { font-size: 17px; }
.player360-info span { font-size: 11px; }
.player360-info strong { font-size: 13px; }
.player360-wallet-item strong { font-size: 19px; }
.player360-wallet-item small,
.player360-inventory-item span,
.player360-inventory-item small { font-size: 11px; }

@media (max-width: 1450px) {
    .overview-primary-kpis .overview-kpi-body strong { font-size: 23px; }
    .overview-primary-kpis .overview-previous { font-size: 9.5px; }
}

@media (max-width: 1180px) {
    .topbar-context h1 { font-size: 17px; }
    .overview-dashboard-grid { height: auto; }
    .overview-dashboard-grid > .overview-panel { height: 260px; }
    .overview-dashboard-grid .overview-chart,
    .overview-dashboard-grid .overview-chart.revenue { height: 210px; }
    .overview-dashboard-side { height: auto; }
}

@media (max-width: 760px) {
    .admin-workspace > .container { padding: 10px 9px 24px; }
    .overview-primary-kpis .overview-kpi { min-height: 126px; }
    .overview-recent-activity th,
    .overview-recent-activity td { font-size: 10px; }
}

/* Sidebar sizing and chart legibility refinements. */
.admin-shell-body { grid-template-columns: 184px minmax(0, 1fr); }
.admin-sections { width: 184px; }
.admin-sections-head { padding-right: 13px; padding-left: 13px; }
.admin-section-item { padding-right: 9px; padding-left: 9px; }
.admin-section-item strong { font-size: 9.5px; }
.admin-subsections > a,
.admin-subsections > span,
.admin-nav-group.collapsed .admin-subsections > .admin-section-summary {
    padding-right: 9px;
    padding-left: 9px;
    font-size: 11.5px;
}
.admin-system-status { display: none !important; }

/* KPI text and its sparkline own separate horizontal zones. */
.overview-primary-kpis .overview-kpi-spark {
    right: 12px;
    bottom: 8px;
    left: auto;
    width: 39%;
    height: 35px;
}
.overview-primary-kpis .overview-previous {
    width: 57%;
    max-width: 57%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Every line renderer uses a smooth SVG path, never a jagged polyline. */
.overview-kpi-spark path {
    fill: none;
    stroke: #8f4cff;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.overview-kpi.green .overview-kpi-spark path { stroke: var(--ui-green); }
.overview-kpi.orange .overview-kpi-spark path { stroke: var(--ui-orange); }
.overview-kpi.violet .overview-kpi-spark path { stroke: #a568ff; }
.overview-kpi.cyan .overview-kpi-spark path { stroke: var(--ui-cyan); }
.chart-line,
.acquisition-line,
.economy-trend-line,
.player-chart-line {
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-dasharray: none !important;
}
.chart-area { pointer-events: none; }

/* Axis labels live in dedicated margins and remain readable over grid lines. */
.chart-x-label,
.chart-y-label,
.acquisition-chart > text {
    paint-order: stroke;
    stroke: var(--ui-panel);
    stroke-width: 3px;
    stroke-linejoin: round;
}
.chart-x-label { dominant-baseline: auto; }
.chart-y-label { dominant-baseline: middle; }
.overview-dashboard-grid .overview-chart,
.overview-dashboard-grid .overview-chart.revenue,
.economy-trend-chart,
.acquisition-chart,
.player360-chart { overflow: visible; }

@media (max-width: 1180px) {
    .admin-sections { width: min(244px, calc(100vw - 48px)); }
}