.admin-header { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:22px 5%; border-bottom:1px solid var(--line); background:white; }
.admin-header nav { display:flex; align-items:center; gap:24px; font-size:14px; }
.admin-header button { border:1px solid var(--line); background:white; padding:10px 16px; border-radius:6px; }
.admin-main { max-width:1280px; margin:0 auto; padding:52px 36px; }
.dashboard-heading { display:flex; gap:28px; justify-content:space-between; align-items:end; margin-bottom:30px; }
.dashboard-heading h1 { font-size:40px; letter-spacing:-1.2px; margin:12px 0; }
.dashboard-heading p, .panel p, .metrics p, .login-panel p { color:var(--muted); font-size:16px; line-height:1.6; }
.eyebrow { font-size:12px; color:var(--blue); }
.controls { display:flex; align-items:end; gap:14px; flex-shrink:0; }
.controls label { font-size:13px; font-weight:600; }
.controls select { display:block; margin-top:7px; padding:12px; border:1px solid #a5bdb6; border-radius:6px; background:white; color:var(--ink); font-size:15px; }
.controls .button { height:46px; font-size:14px; }
.freshness { display:flex; flex-wrap:wrap; gap:12px 28px; font-size:13px; color:var(--muted); margin-bottom:20px; }
.metrics { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-bottom:24px; }
.metrics article { background:white; padding:28px; border:1px solid var(--line); border-radius:12px; }
.metrics article:first-child { background:#103e46; color:white; }
.metrics article:first-child p { color:#d3e4df; }
.metrics article > span { font-size:15px; font-weight:600; }
.metrics strong { display:block; font-size:44px; margin:16px 0 10px; line-height:1; }
.metrics p { font-size:13px; }
.panel { background:white; padding:28px; margin-bottom:24px; border:1px solid var(--line); border-radius:12px; min-width:0; }
.panel h2 { font-size:22px; letter-spacing:-.4px; margin-bottom:7px; }
.panel > p { font-size:14px; }
.panel-title { display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap; }
.legend { display:flex; gap:8px; align-items:center; font-size:13px; }
.legend i { display:inline-block; width:10px; height:10px; border-radius:3px; }
.view-dot { background:#1a6c61; }
.visitor-dot { background:#c68828; margin-left:12px; }
.chart { margin-top:30px; }
.chart svg { width:100%; height:auto; stroke:none; overflow:visible; }
.chart text { fill:#536c69; font:12px WebSys Sans,Arial,sans-serif; }
.breakdowns { display:grid; grid-template-columns:1.2fr 1.2fr 1fr; gap:20px; }
.ranking { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:15px 0; border-bottom:1px solid var(--line); font-size:14px; overflow-wrap:anywhere; }
.ranking strong { flex-shrink:0; }
.empty { padding:20px 0; font-size:15px; color:var(--muted); }
.table-scroll { overflow-x:auto; }
table { width:100%; border-collapse:collapse; text-align:left; font-size:14px; margin-top:20px; }
th, td { padding:14px 12px; border-bottom:1px solid var(--line); white-space:nowrap; }
th { background:#edf3ef; color:#335c54; font-weight:600; }
th:not(:first-child), td:not(:first-child) { text-align:right; }
.methodology { padding:10px 0; color:var(--muted); font-size:14px; line-height:1.75; }
.methodology summary { cursor:pointer; font-weight:600; color:var(--ink); }
.methodology p { margin-top:16px; max-width:900px; }
.notice { background:#fff1e9; border:1px solid #c48775; padding:20px; border-radius:8px; margin-bottom:24px; line-height:1.7; }
.notice a { text-decoration:underline; }
.login-panel { padding:36px; max-width:530px; border:1px solid var(--line); border-radius:12px; background:white; }
.login-panel h2 { font-size:28px; line-height:1.25; margin:16px 0; }
.login-panel label { display:block; font-size:14px; font-weight:600; margin-top:22px; }
.login-panel input { width:100%; margin-top:8px; padding:14px; border:1px solid #91ada6; border-radius:6px; font-size:16px; }
.login-panel .button { margin:24px 0; }
.login-panel a { text-decoration:underline; color:var(--blue); }
button:disabled { opacity:.65; cursor:wait; }
@media(max-width:900px) { .breakdowns { grid-template-columns:1fr 1fr; } .dashboard-heading { align-items:start; flex-direction:column; } }
@media(max-width:600px) { .admin-main { padding:30px 20px; } .admin-header { flex-wrap:wrap; padding:20px; } .admin-header nav { gap:16px; } .metrics,.breakdowns { grid-template-columns:1fr; } .metrics article { padding:24px; } .dashboard-heading h1 { font-size:33px; } .panel { padding:22px; } .login-panel { padding:26px; } }
.geography-row { grid-template-columns:2fr 1fr; }
.geography-panel { background:linear-gradient(140deg,#fff 65%,#f1f8f4); }
.compact-filter { font-size:12px; color:var(--muted); }
.compact-filter select { display:block; border:1px solid #a5bdb6; border-radius:6px; padding:10px; margin-top:6px; color:var(--ink); background:white; font-size:14px; }
.bar-row { margin-top:20px; }
.bar-heading { display:flex; justify-content:space-between; align-items:baseline; gap:14px; font-size:13px; }
.bar-heading span { overflow-wrap:anywhere; }
.bar-heading strong { white-space:nowrap; font-size:12px; color:#335c54; font-weight:600; }
.bar-track { height:7px; border-radius:6px; background:#edf3ef; margin-top:10px; overflow:hidden; }
.bar-track span { display:block; height:100%; border-radius:6px; }
.device-chart { max-width:240px; margin:14px auto 0; }
.device-chart svg { width:100%; }
.device-chart text { fill:#536c69; font:13px WebSys Sans,Arial,sans-serif; }
.device-chart .donut-total { font-size:31px; font-weight:600; fill:#123b37; }
.panel .chart-note { font-size:12px; margin-top:22px; line-height:1.7; }
.chart-note a { text-decoration:underline; }
.hourly-table { margin-top:20px; font-size:13px; }
.hourly-table summary { cursor:pointer; }
@media(max-width:900px) { .geography-row { grid-template-columns:1.4fr 1fr; } }
@media(max-width:600px) { .geography-row { grid-template-columns:1fr; } .bar-heading { font-size:12px; } .bar-heading strong { font-size:11px; } .chart { overflow-x:auto; } .chart svg { min-width:560px; } }
