:root { --bg:#171817; --bg-deep:#101110; --panel:#202120; --panel-2:#272925; --panel-3:#2e302b; --line:#4a4c43; --line-soft:rgba(201,195,140,0.12); --line-strong:#6c6b58; --text:#f0f0eb; --muted:#aaa996; --muted-dark:#77786d; --accent:#ffaa00; --accent-2:#c9c38c; --olive:#4a5942; --olive-hover:#5d6759; --olive-dark:#343d30; --green:#78f778; --yellow:#ffcc00; --red:#ff6464; --purple:#c5a6e8; --radius:6px; --shadow:0 12px 34px rgba(0,0,0,0.42); --mono:"Lucida Console","Courier New",monospace; --ui:Verdana,Geneva,Arial,sans-serif; }

* { box-sizing:border-box; }

html { scroll-behavior:smooth; background:var(--bg-deep); }

body { margin:0; min-height:100vh; color:var(--text); font:13px/1.45 var(--ui); background:linear-gradient(rgba(12,13,12,0.86),rgba(12,13,12,0.92)),url("images/background.webp") center / cover fixed no-repeat,var(--bg-deep); }

button,input,select { font:inherit; }

button { cursor:pointer; }

code,kbd,.mono { font-family:var(--mono); }

::selection { color:#111; background:var(--accent); }

.hidden { display:none !important; }

.app-shell { min-height:100vh; display:grid; grid-template-columns:232px minmax(0,1fr); }

.sidebar { position:sticky; top:0; z-index:20; height:100vh; padding:16px 12px; display:flex; flex-direction:column; background:rgba(25,26,24,0.97); border-right:1px solid var(--line-strong); box-shadow:7px 0 22px rgba(0,0,0,0.22); }

.brand { display:flex; gap:10px; align-items:center; padding:5px 7px 16px; margin-bottom:9px; border-bottom:1px solid var(--line-soft); }

.brand-logo { width:34px; height:34px; object-fit:contain; flex-shrink:0; padding:2px; background:#171817; border:1px solid var(--line-strong); border-radius:3px; }

.brand-mark { width:42px; height:42px; display:flex; align-items:center; justify-content:center; flex-shrink:0; color:var(--accent); background:#1a1a1a; border:1px solid var(--line-strong); border-radius:3px; font-weight:900; }

.brand-mark img { width:32px; height:32px; object-fit:contain; }

.brand strong,.archive-site-title { display:block; margin:0; color:#fff; font:inherit; font-size:14px; font-weight:700; text-transform:uppercase; letter-spacing:0.4px; }

.brand span { display:block; max-width:150px; margin-top:3px; color:var(--accent-2); font-size:10px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

.nav { display:grid; gap:3px; }

.nav-link { width:100%; min-height:36px; padding:8px 10px; border:1px solid transparent; border-radius:3px; background:transparent; color:#aaa; text-align:left; text-transform:uppercase; letter-spacing:0.45px; font-size:11px; font-weight:700; transition:background 0.15s ease,color 0.15s ease,border-color 0.15s ease; }

.nav-link:hover { color:var(--accent-2); background:rgba(201,195,140,0.06); border-color:rgba(201,195,140,0.12); }

.nav-link.active { color:#fff; background:var(--olive); border-color:#65715e; box-shadow:inset 3px 0 0 var(--accent); }

.sidebar-footer { margin-top:auto; padding:14px 7px 2px; display:grid; gap:8px; color:var(--muted); }

.sidebar-footer small { font-size:9px; }

.main { min-width:0; }

.file-button,.ghost-button,.icon-button,.month-nav-button { border:1px solid; border-color:#77776b #34352f #34352f #77776b; border-radius:3px; color:#e8e8e3; background:#262724; transition:background 0.15s ease,color 0.15s ease,border-color 0.15s ease; }

.file-button,.ghost-button { min-height:32px; padding:6px 10px; text-align:center; text-transform:uppercase; font-size:10px; font-weight:700; letter-spacing:0.35px; }

.file-button:hover,.ghost-button:hover,.icon-button:hover,.month-nav-button:hover:not(:disabled) { color:var(--accent); background:var(--olive-hover); border-color:#8e8c74 #36372f #36372f #8e8c74; }

.file-button:active,.ghost-button:active,.icon-button:active,.month-nav-button:active:not(:disabled) { border-color:#34352f #77776b #77776b #34352f; }

.file-button input { display:none; }

.icon-button { width:37px; height:37px; padding:0; color:#fff; font-size:18px; }

.topbar { position:sticky; top:0; z-index:15; min-height:58px; padding:9px 18px; display:flex; gap:14px; align-items:center; background:rgba(26,27,25,0.97); border-bottom:1px solid var(--line-strong); box-shadow:0 5px 16px rgba(0,0,0,0.22); }

.global-search-wrap { position:relative; flex:1; max-width:680px; }

.global-search { width:100%; height:36px; padding:0 55px 0 34px; outline:none; color:#fff; background:rgba(0,0,0,0.34); border:1px solid #5b5c50; border-radius:3px; font-family:var(--mono); font-size:11px; }

.global-search::placeholder { color:#77786d; }

.global-search:focus { color:var(--accent); background:#1c1d1b; border-color:var(--accent); box-shadow:none; }

.search-icon { position:absolute; left:11px; top:6px; color:var(--accent-2); font-size:18px; pointer-events:none; }

kbd { position:absolute; right:9px; top:8px; min-width:21px; padding:1px 5px; text-align:center; color:#a8a58a; background:#292a27; border:1px solid #55564d; border-radius:2px; font-size:10px; }

.search-results { position:absolute; top:41px; z-index:30; width:100%; max-height:430px; overflow:auto; padding:4px; background:#1a1b19; border:1px solid var(--line-strong); border-radius:3px; box-shadow:var(--shadow); }

.search-result { width:100%; display:flex; justify-content:space-between; gap:15px; padding:8px 9px; color:#eee; background:transparent; border:0; border-bottom:1px solid rgba(255,255,255,0.035); border-radius:2px; text-align:left; }

.search-result:last-child { border-bottom:0; }

.search-result:hover { color:var(--accent); background:rgba(201,195,140,0.09); }

.search-result small { color:var(--muted); }

.topbar-actions { margin-left:auto; }

.mobile-only { display:none; }

.archive-month-nav { display:inline-flex; align-items:center; gap:3px; padding:2px; background:rgba(0,0,0,0.26); border:1px solid rgba(255,255,255,0.08); border-radius:4px; }

.month-nav-button { width:31px; height:30px; padding:0; font-size:15px; line-height:1; }

.month-nav-button:disabled { opacity:0.38; cursor:default; }

.archive-month-label { min-width:126px; padding:0 8px; text-align:center; color:var(--accent-2); font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:0.35px; }

.status-banner { margin:14px 18px 0; padding:8px 11px; border:1px solid var(--line); border-radius:3px; font-size:11px; }

.status-banner.info { color:var(--accent-2); background:rgba(74,89,66,0.35); border-color:rgba(201,195,140,0.28); }

.status-banner.success { color:#bdf5bd; background:rgba(46,92,50,0.28); border-color:rgba(120,247,120,0.25); }

.status-banner.error { color:#ffc0c0; background:rgba(110,42,42,0.26); border-color:rgba(255,100,100,0.28); }

.view { display:none; padding:22px 18px 48px; }

.view.active { display:block; }

.page-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:28px; margin:0 0 16px; padding-bottom:11px; border-bottom:1px solid rgba(201,195,140,0.13); }

.page-heading h2 { margin:2px 0 0; color:#fff; font-size:clamp(24px,3vw,34px); line-height:1.08; letter-spacing:-0.02em; text-transform:uppercase; }

.page-heading p { max-width:650px; margin:0 0 3px; color:#aaa; text-align:right; font-size:11px; }

.eyebrow { color:var(--accent); font-size:9px; font-weight:700; text-transform:uppercase; letter-spacing:0.11em; }

.stat-grid { display:grid; grid-template-columns:repeat(6,minmax(120px,1fr)); gap:8px; margin-bottom:14px; }

.stat-grid.compact { grid-template-columns:repeat(5,minmax(130px,1fr)); }

.stat-card { position:relative; min-height:86px; padding:11px 12px; overflow:hidden; background:rgba(27,28,26,0.93); border:1px solid var(--line); border-radius:var(--radius); box-shadow:0 5px 13px rgba(0,0,0,0.12); }

.stat-card::before { content:""; position:absolute; inset:0 auto 0 0; width:3px; background:var(--olive); }

.stat-card::after { content:none; }

.stat-card .label { display:block; color:var(--muted); font-size:9px; font-weight:700; text-transform:uppercase; letter-spacing:0.45px; }

.stat-card .value { display:block; margin-top:6px; color:#fff; font-size:clamp(18px,2vw,25px); font-weight:700; letter-spacing:-0.025em; }

.stat-card .sub { display:block; margin-top:2px; color:#858579; font-size:9px; }

.dashboard-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }

.span-2 { grid-column:span 2; }

.panel { min-width:0; overflow:hidden; background:rgba(27,28,26,0.94); border:1px solid var(--line); border-radius:var(--radius); box-shadow:0 7px 18px rgba(0,0,0,0.14); }

.panel-head { min-height:56px; padding:11px 13px 9px; display:flex; justify-content:space-between; gap:12px; align-items:center; background:linear-gradient(180deg,#2b2d28,#242622); border-bottom:1px solid var(--line); }

.panel-head h2 { margin:2px 0 0; color:#eee; font-size:14px; letter-spacing:0; }

.chart { display:block; width:100%; padding:8px 10px 10px; }

.leader-list { padding:5px 11px 9px; }

.leader-row { display:grid; grid-template-columns:25px minmax(0,1fr) auto; align-items:center; gap:8px; padding:8px 2px; border-bottom:1px solid var(--line-soft); }

.leader-row:last-child { border-bottom:0; }

.leader-row:hover .leader-name,.leader-row:hover .leader-value { color:var(--accent); }

.leader-rank { color:#77786d; font:700 10px var(--mono); }

.leader-name { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:700; }

.leader-sub { color:var(--muted); font-size:9px; }

.leader-value { color:var(--accent-2); text-align:right; font:700 11px var(--mono); }

.text-button { padding:4px 6px; color:var(--accent-2); background:transparent; border:0; font-size:10px; text-transform:uppercase; }

.text-button:hover { color:var(--accent); }

.segmented { display:inline-flex; gap:2px; padding:2px; background:rgba(0,0,0,0.25); border:1px solid rgba(255,255,255,0.08); border-radius:5px; }

.segmented button { padding:4px 8px; color:#888; background:transparent; border:0; border-radius:3px; font-size:9px; font-weight:700; text-transform:uppercase; letter-spacing:0.35px; }

.segmented button:hover:not(.active) { color:#ccc; background:rgba(255,255,255,0.05); }

.segmented button.active { color:#fff; background:var(--olive); }

.page-segment { margin:-3px 0 12px; }

.table-wrap { width:100%; overflow:auto; }

.table-wrap.tall { max-height:calc(100vh - 225px); min-height:420px; background:rgba(0,0,0,0.24); border:1px solid var(--line); border-radius:var(--radius); }

table { width:100%; border-collapse:collapse; font-size:11px; }

th { position:sticky; top:0; z-index:2; padding:9px 9px; color:var(--accent-2); background:#1a1a1a; border-bottom:1px solid rgba(201,195,140,0.23); font-size:9px; text-transform:uppercase; letter-spacing:0.4px; font-weight:700; text-align:left; white-space:nowrap; }

th[data-key] { cursor:pointer; }

th[data-key]:hover { color:var(--accent); }

th,td { padding:8px 9px; }

td { color:#e7e7e2; border-bottom:1px solid rgba(255,255,255,0.035); white-space:nowrap; }

tbody tr:nth-child(even) { background:rgba(255,255,255,0.018); }

tbody tr { transition:background 0.1s ease,color 0.1s ease; }

tbody tr.clickable { cursor:pointer; }

tbody tr:hover { background:rgba(201,195,140,0.10); }

tbody tr:hover td { color:var(--accent); }

.name-cell { display:flex; align-items:center; gap:8px; max-width:260px; }

.name-cell .primary { overflow:hidden; text-overflow:ellipsis; font-weight:700; }

.flag { display:inline-block; min-width:21px; font-size:16px; line-height:1; }

.mono { font-size:10px; }

.good { color:var(--green); }

.warn { color:var(--yellow); }

.bad { color:var(--red); }

.accent,.search-highlight { color:var(--accent); }

.pill { display:inline-flex; align-items:center; min-height:19px; padding:2px 6px; color:#c7c7be; background:#30312d; border:1px solid #484942; border-radius:3px; font-size:9px; font-weight:700; text-transform:uppercase; }

.pill.active { color:#c8ffc8; background:rgba(59,102,54,0.34); border-color:rgba(120,247,120,0.22); }

.pill.inactive { color:#ffc4c4; background:rgba(112,48,48,0.28); border-color:rgba(255,100,100,0.20); }

.coverage { display:inline-flex; gap:3px; }

.dot { width:7px; height:7px; border-radius:1px; background:#45463f; }

.dot.on { background:var(--green); box-shadow:0 0 5px rgba(120,247,120,0.25); }

.filter-bar { display:flex; flex-wrap:wrap; gap:7px; align-items:center; margin-bottom:9px; padding:8px; background:rgba(25,26,24,0.92); border:1px solid var(--line); border-radius:var(--radius); }

.filter-bar input,.filter-bar select { height:31px; min-width:125px; padding:0 8px; outline:none; color:#eee; background:rgba(0,0,0,0.30); border:1px solid #5d5e52; border-radius:3px; font-family:var(--mono); font-size:10px; }

.filter-bar input:focus,.filter-bar select:focus { color:var(--accent); border-color:var(--accent); }

.filter-bar input[type="search"] { min-width:210px; }

.filter-bar label { display:inline-flex; align-items:center; gap:6px; color:var(--muted); font-size:10px; }

.filter-bar label input { min-width:75px; width:84px; }

.filter-bar .check input { min-width:0; width:auto; height:auto; accent-color:var(--olive); }

.table-meta { display:flex; justify-content:space-between; gap:12px; margin:0 2px 7px; color:var(--muted); font-size:9px; }

.ranking-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; margin-bottom:12px; }

.ranking-card { overflow:hidden; background:rgba(27,28,26,0.94); border:1px solid var(--line); border-radius:var(--radius); }

.ranking-card h3 { margin:0; padding:10px 11px; color:var(--accent-2); background:#242622; border-bottom:1px solid var(--line-soft); font-size:11px; text-transform:uppercase; letter-spacing:0.35px; }

.top-gap { margin-top:10px; }

.award-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }

.award { min-height:110px; padding:12px; background:rgba(30,31,28,0.95); border:1px solid var(--line); border-radius:var(--radius); box-shadow:inset 3px 0 0 rgba(74,89,66,0.9); }

.award-icon { font-size:18px; }

.award-title { margin-top:7px; color:var(--muted); font-size:9px; font-weight:700; text-transform:uppercase; letter-spacing:0.07em; }

.award-name { margin-top:4px; overflow:hidden; color:#fff; font-weight:700; font-size:14px; text-overflow:ellipsis; white-space:nowrap; }

.award-value { margin-top:3px; color:var(--accent); font:700 11px var(--mono); }

.metric-list { padding:8px 13px 11px; }

.metric-row { display:flex; justify-content:space-between; gap:20px; padding:8px 0; border-bottom:1px solid var(--line-soft); }

.metric-row:last-child { border:0; }

.metric-row span:first-child { color:var(--muted); }

.metric-row strong { color:#fff; text-align:right; }

.milestone-grid { padding:11px; display:grid; grid-template-columns:repeat(3,1fr); gap:7px; }

.milestone { padding:10px; background:rgba(0,0,0,0.20); border:1px solid var(--line-soft); border-radius:4px; }

.milestone strong { display:block; color:#fff; font-size:16px; }

.milestone span { color:var(--muted); font-size:9px; }

.empty-state { padding:26px; color:var(--muted); text-align:center; }

.modal { position:fixed; inset:0; z-index:100; display:grid; place-items:center; padding:22px; }

.modal-backdrop { position:absolute; inset:0; background:rgba(0,0,0,0.72); }

.modal-card { position:relative; z-index:1; width:min(1120px,96vw); max-height:92vh; overflow:auto; background:#1b1c1a; border:1px solid; border-color:#7b7c6d #353630 #353630 #7b7c6d; border-radius:4px; box-shadow:0 24px 70px rgba(0,0,0,0.58); }

.modal-close { position:sticky; z-index:4; top:9px; float:right; width:29px; height:27px; margin:9px 9px -38px 0; padding:0; color:#ddd; background:#262724; border:1px solid; border-color:#77776b #34352f #34352f #77776b; border-radius:2px; font-size:18px; line-height:1; }

.modal-close:hover { color:var(--accent); background:var(--olive-hover); }

.modal-header { padding:18px 20px 14px; background:#2c3029; border-bottom:1px solid #5d614e; }

.modal-header h2 { margin:4px 0 6px; color:#fff; font-size:23px; letter-spacing:-0.02em; }

.modal-header p { margin:0; color:var(--accent-2); font-size:10px; }

.modal-body { padding:15px 17px 23px; }

.profile-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }

.profile-card { padding:10px; background:rgba(0,0,0,0.20); border:1px solid var(--line); border-radius:4px; }

.profile-card span { display:block; color:var(--muted); font-size:9px; text-transform:uppercase; }

.profile-card strong { display:block; margin-top:4px; color:#fff; font-size:16px; }

.profile-section { margin-top:14px; }

.profile-section h3 { margin:0 0 8px; color:var(--accent-2); font-size:12px; text-transform:uppercase; }

.two-col { display:grid; grid-template-columns:1fr 1fr; gap:10px; }

.bar-list { display:grid; gap:7px; }

.bar-row { display:grid; grid-template-columns:86px minmax(0,1fr) 60px; gap:8px; align-items:center; }

.bar-track { height:6px; overflow:hidden; background:#101110; border:1px solid #45463f; border-radius:2px; }

.bar-fill { height:100%; background:linear-gradient(90deg,var(--olive),var(--accent-2)); border-radius:1px; }

.small-table { max-height:320px; overflow:auto; background:rgba(0,0,0,0.18); border:1px solid var(--line); border-radius:4px; }

.archive-toast { position:fixed; right:18px; bottom:18px; z-index:120; max-width:min(360px,calc(100vw - 28px)); padding:9px 11px; color:#ffd1d1; background:#351d1d; border:1px solid rgba(255,100,100,0.36); border-radius:3px; box-shadow:var(--shadow); font-size:10px; }

.archive-toast.success { color:#c8ffc8; background:#233523; border-color:rgba(120,247,120,0.30); }

* { scrollbar-width:thin; scrollbar-color:#5d614e #181918; }

::-webkit-scrollbar { width:10px; height:10px; }

::-webkit-scrollbar-track { background:#181918; }

::-webkit-scrollbar-thumb { background:#4d5148; border:2px solid #181918; }

::-webkit-scrollbar-thumb:hover { background:#646957; }

@media (max-width:1250px) {

    .stat-grid { grid-template-columns:repeat(4,1fr); }

    .dashboard-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }

    .ranking-grid { grid-template-columns:repeat(2,1fr); }

    .award-grid { grid-template-columns:repeat(3,1fr); }

}

@media (max-width:850px) {

    .app-shell { display:block; }

    .sidebar { position:fixed; left:-255px; width:232px; transition:left 0.2s ease; box-shadow:var(--shadow); }

    .sidebar.open { left:0; }

    .mobile-only { display:inline-grid; place-items:center; }

    .topbar { padding:8px 10px; }

    .view { padding:18px 11px 42px; }

    .status-banner { margin:10px 11px 0; }

    .page-heading { align-items:flex-start; flex-direction:column; gap:6px; }

    .page-heading p { text-align:left; }

    .stat-grid,.stat-grid.compact { grid-template-columns:repeat(2,1fr); }

    .dashboard-grid,.two-col { grid-template-columns:1fr; }

    .span-2 { grid-column:auto; }

    .ranking-grid,.award-grid { grid-template-columns:1fr; }

    .profile-grid { grid-template-columns:repeat(2,1fr); }

    .table-meta { flex-direction:column; gap:3px; }

    .modal { padding:7px; }

    .modal-card { width:100%; max-height:96vh; }

}

@media (max-width:720px) {

    .archive-month-nav { margin-left:auto; }

    .archive-month-label { min-width:105px; }

    .topbar { gap:8px; }

    .global-search { padding-right:12px; }

    .global-search-wrap kbd { display:none; }

}

@media (max-width:500px) {

    .stat-grid,.stat-grid.compact,.profile-grid { grid-template-columns:1fr 1fr; }

    .milestone-grid { grid-template-columns:repeat(2,1fr); }

    .archive-month-label { min-width:92px; padding:0 4px; font-size:9px; }

    .month-nav-button { width:28px; }

}

/* Archive history additions */
.span-4 { grid-column:span 4; }
.clock-summary { margin:12px; }
.clock-heatmap { padding:4px 14px 16px; overflow-x:auto; }
.clock-grid { min-width:850px; display:grid; grid-template-columns:56px repeat(24,minmax(28px,1fr)); gap:3px; align-items:center; }
.clock-corner,.clock-hour,.clock-day { color:var(--muted); font:9px var(--mono); }
.clock-hour { text-align:center; }
.clock-day { text-align:right; padding-right:5px; font-weight:700; }
.clock-cell { min-height:28px; display:grid; place-items:center; background:rgba(255,170,0,var(--heat)); border:1px solid rgba(201,195,140,var(--border)); border-radius:2px; color:var(--text); font:9px var(--mono); }
.clock-cell:hover { outline:1px solid var(--accent); }
.history-summary { margin-bottom:10px; }
.history-charts { margin-top:10px; }
.section-subhead { margin:15px 0 7px; color:var(--accent-2); font-size:11px; text-transform:uppercase; letter-spacing:.45px; }
.section-note { margin:-4px 0 10px; color:var(--muted); font-size:10px; }
.day-strip { display:grid; grid-template-columns:repeat(auto-fill,minmax(31px,1fr)); gap:4px; }
.day-cell { min-height:31px; display:grid; place-items:center; background:rgba(255,170,0,var(--heat)); border:1px solid rgba(201,195,140,var(--border)); border-radius:2px; color:var(--text); font:9px var(--mono); }
.day-cell:hover { border-color:var(--accent); }
@media (max-width:1250px){ .span-4 { grid-column:span 2; } }
@media (max-width:850px){ .span-4 { grid-column:auto; } }


/* v5 additions layered on snet_archive_fixed_v3 */
.interesting-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.interesting-row { grid-template-columns:58px minmax(0,1fr) auto; }
.interesting-row .leader-rank { min-width:52px; }
.interesting-row .leader-name { max-width:460px; }
.interesting-row .leader-sub { margin-top:2px; }
.map-status { margin-left:2px; }
@media (max-width:850px){ .interesting-grid { grid-template-columns:1fr; } }


/* v6 deep insight additions */
.page-subheading { margin:18px 0 10px; padding-top:11px; border-top:1px solid rgba(201,195,140,.13); }
.page-subheading h2 { margin:2px 0 2px; color:#eee; font-size:16px; }
.page-subheading p { margin:0; color:var(--muted); font-size:10px; }
.insight-grid { grid-template-columns:repeat(2,minmax(0,1fr)); margin-bottom:16px; }
.advanced-added { border-top:1px solid rgba(201,195,140,.08); padding-top:14px; }
.match-insights { margin-top:0; margin-bottom:14px; padding-top:0; border-top:0; }
.metric-row .good,.small-table .good { color:var(--green); }
.metric-row .bad,.small-table .bad { color:var(--red); }
@media (max-width:850px){ .insight-grid { grid-template-columns:1fr; } }

/* v7 grouped navigation + analysis pages */
.grouped-nav { gap:4px; overflow:auto; padding-right:2px; align-content:start; grid-auto-rows:max-content; }
.nav-group { height:max-content; align-self:start; border:1px solid rgba(201,195,140,.08); border-radius:4px; background:rgba(0,0,0,.10); }
.nav-group-label { width:100%; min-height:28px; padding:6px 8px; display:flex; align-items:center; color:var(--accent-2); background:rgba(255,255,255,.025); border-bottom:1px solid rgba(201,195,140,.07); font-size:9px; font-weight:700; letter-spacing:.8px; text-transform:uppercase; cursor:default; user-select:none; }
.nav-group-items { padding:3px; display:grid; gap:1px; align-content:start; grid-auto-rows:max-content; }
.nav-group .nav-link { min-height:31px; padding:6px 8px 6px 12px; font-size:10px; }
.segmented button:disabled { opacity:.35; cursor:not-allowed; color:#777; }
.segmented button:disabled:hover { background:transparent; color:#777; }
.compare-controls { position:relative; z-index:40; padding:12px; display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.compare-controls.panel { overflow:visible; }
.compare-select-grid { flex:1 1 680px; display:grid; grid-template-columns:repeat(4,minmax(150px,1fr)); gap:8px; }
.compare-select-grid.two { grid-template-columns:repeat(2,minmax(180px,1fr)); }
.compare-select-grid.one { grid-template-columns:minmax(220px,440px); }
.compare-select-grid.search-grid { grid-template-columns:repeat(2,minmax(260px,1fr)); }
.compare-select-grid select { width:100%; height:34px; padding:0 8px; outline:none; color:#eee; background:rgba(0,0,0,.30); border:1px solid #5d5e52; border-radius:3px; font-family:var(--mono); font-size:10px; }

.compare-select-grid select:focus { border-color:var(--accent); color:var(--accent); }
.search-picker { position:relative; z-index:1; min-width:0; }
.search-picker:focus-within { z-index:80; }
.compare-search-input { width:100%; height:34px; padding:0 30px 0 9px; outline:none; color:#eee; background:rgba(0,0,0,.30); border:1px solid #5d5e52; border-radius:3px; font-family:var(--mono); font-size:10px; }
.compare-search-input::placeholder { color:#77786d; }
.compare-search-input:focus { border-color:var(--accent); color:var(--accent); background:#1c1d1b; }
.search-picker.has-value .compare-search-input { color:#fff; border-color:rgba(201,195,140,.48); }
.search-picker::after { content:'⌕'; position:absolute; right:9px; top:7px; color:var(--accent-2); font-size:14px; line-height:1; pointer-events:none; }
.compare-search-results { position:absolute; left:0; right:0; top:38px; z-index:90; max-height:300px; overflow:auto; padding:4px; background:#1a1b19; border:1px solid var(--line-strong); border-radius:3px; box-shadow:var(--shadow); }
.compare-search-result { width:100%; display:block; padding:8px 9px; color:#eee; background:transparent; border:0; border-bottom:1px solid rgba(255,255,255,.035); border-radius:2px; text-align:left; cursor:pointer; }
.compare-search-result:last-child { border-bottom:0; }
.compare-search-result:hover,.compare-search-result.active { color:var(--accent); background:rgba(201,195,140,.09); }
.compare-search-result-main { display:block; min-width:0; overflow-wrap:anywhere; white-space:normal; font-size:11px; font-weight:700; line-height:1.25; }
.compare-search-result-sub { display:block; margin-top:3px; color:var(--muted); font-size:9px; line-height:1.2; white-space:normal; }
.compare-search-result-meta { display:block; max-width:100%; margin-top:2px; overflow:hidden; color:#77786d; font-family:var(--mono); font-size:8px; line-height:1.2; text-overflow:ellipsis; white-space:nowrap; }
.compare-search-empty { padding:10px; color:var(--muted); font-size:10px; text-align:center; }

.compare-table table { min-width:820px; }
.compare-table th:first-child,.compare-table td:first-child { position:sticky; left:0; z-index:2; background:#252723; }
.padded { padding:10px 12px; }
.page-subheading { margin:4px 0 10px; }
.page-subheading h2 { margin:2px 0 3px; color:#eee; font-size:17px; }
.page-subheading p { margin:0; color:var(--muted); font-size:10px; }
.session-sequence { display:flex; flex-wrap:wrap; gap:5px; }
.session-sequence .pill { max-width:220px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.insight-note { padding:9px 11px; margin-bottom:10px; color:var(--muted); background:rgba(0,0,0,.16); border:1px solid rgba(201,195,140,.10); border-radius:4px; font-size:10px; }
.inline-good { color:var(--green); }
.inline-warn { color:var(--yellow); }
@media (max-width:1100px){ .compare-select-grid { grid-template-columns:repeat(2,minmax(160px,1fr)); } }
@media (max-width:720px){ .compare-select-grid,.compare-select-grid.two,.compare-select-grid.one,.compare-select-grid.search-grid { grid-template-columns:1fr; } .compare-controls { align-items:stretch; } }
.grouped-nav { flex:1 1 auto; min-height:0; align-content:start; grid-auto-rows:max-content; }


/* v8 single-month historical explorer */
.filter-bar { overflow:visible; position:relative; z-index:25; }
.filter-search-picker { flex:1 1 230px; min-width:210px; }
.filter-search-picker .compare-search-results { z-index:120; }
.control-label { display:block; margin:0 0 5px; color:var(--muted); font-size:9px; font-weight:700; text-transform:uppercase; letter-spacing:.45px; }
.rotation-explorer { overflow:visible; position:relative; z-index:35; padding:12px; }
.rotation-explorer-grid { display:grid; grid-template-columns:repeat(3,minmax(220px,1fr)); gap:10px; }
.archive-calendar { display:grid; grid-template-columns:repeat(7,minmax(92px,1fr)); gap:5px; padding:12px; }
.calendar-weekday { padding:5px 4px; color:var(--accent-2); font:700 9px var(--mono); text-align:center; text-transform:uppercase; }
.calendar-empty { min-height:82px; border:1px solid transparent; }
.calendar-day { min-height:82px; padding:7px; display:flex; flex-direction:column; gap:4px; color:var(--text); background:rgba(255,170,0,var(--heat)); border:1px solid rgba(201,195,140,.16); border-radius:3px; text-align:left; cursor:pointer; }
.calendar-day:hover { border-color:var(--accent); background:rgba(255,170,0,calc(var(--heat) + .05)); }
.calendar-day.no-data { opacity:.55; background:rgba(0,0,0,.12); }
.calendar-date { color:#fff; font:700 13px var(--mono); }
.calendar-metric { color:var(--muted); font-size:9px; }
.calendar-day.has-data .calendar-metric strong { color:var(--accent-2); }
.mini-month-heatmap { display:grid; grid-template-columns:repeat(7,28px); gap:3px; align-items:center; }
.mini-month-heatmap .mini-day { width:28px; height:28px; display:grid; place-items:center; background:rgba(255,170,0,var(--heat)); border:1px solid rgba(201,195,140,.13); border-radius:2px; color:var(--text); font:8px var(--mono); }
.mini-month-heatmap .mini-blank { width:28px; height:28px; }
.player-match-filters { display:grid; grid-template-columns:repeat(5,minmax(120px,1fr)); gap:7px; margin-bottom:9px; }
.player-match-filters input,.player-match-filters select { width:100%; height:31px; padding:0 7px; color:#eee; background:rgba(0,0,0,.28); border:1px solid #505247; border-radius:3px; font:9px var(--mono); }
.context-links { display:flex; flex-wrap:wrap; gap:6px; margin-top:9px; }
.context-link { padding:5px 8px; color:var(--accent-2); background:rgba(0,0,0,.18); border:1px solid rgba(201,195,140,.22); border-radius:3px; cursor:pointer; font:9px var(--mono); }
.search-group-title { padding:7px 9px 4px; color:var(--accent-2); font:700 8px var(--mono); text-transform:uppercase; letter-spacing:.7px; border-top:1px solid rgba(255,255,255,.04); }
.search-group-title:first-child { border-top:0; }
.quick-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; align-items:center; padding:7px 8px; border-bottom:1px solid rgba(255,255,255,.04); }
.quick-row:last-child { border-bottom:0; }
.quick-main { min-width:0; }
.quick-name { color:#eee; font-size:10px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.quick-sub { margin-top:2px; color:var(--muted); font-size:8px; }
.quick-actions { display:flex; gap:4px; }
.quick-action { padding:4px 6px; color:var(--accent-2); background:transparent; border:1px solid rgba(201,195,140,.18); border-radius:2px; cursor:pointer; font-size:8px; }
.encounter-matrix-wrap table { min-width:880px; }
.encounter-matrix-wrap th,.encounter-matrix-wrap td { text-align:center; min-width:47px; }
.encounter-matrix-wrap th:first-child,.encounter-matrix-wrap td:first-child { position:sticky; left:0; z-index:3; background:#242622; text-align:left; }
.encounter-cell { background:rgba(255,170,0,var(--heat)); font:9px var(--mono); }
.matrix-nation-button { padding:0; color:var(--accent-2); background:none; border:0; cursor:pointer; font:700 9px var(--mono); }
.session-joinleave { font-size:9px; }
.badge-row { display:flex; flex-wrap:wrap; gap:5px; margin-top:6px; }
.archive-badge { padding:3px 6px; color:var(--accent-2); background:rgba(201,195,140,.08); border:1px solid rgba(201,195,140,.18); border-radius:999px; font:8px var(--mono); }
@media (max-width:1100px){ .rotation-explorer-grid { grid-template-columns:1fr; } .player-match-filters { grid-template-columns:repeat(2,minmax(120px,1fr)); } }
@media (max-width:850px){ .archive-calendar { grid-template-columns:repeat(7,minmax(50px,1fr)); overflow-x:auto; } .calendar-day,.calendar-empty { min-height:68px; } }
@media (max-width:620px){ .archive-calendar { min-width:620px; } .player-match-filters { grid-template-columns:1fr; } }

/* v9 single-month exploration suite */
.who-online-controls { display:grid; grid-template-columns:repeat(4,minmax(170px,1fr)) auto auto; align-items:end; }
.who-online-controls label { min-width:0; }
.who-online-controls select { width:100%; height:34px; padding:0 8px; color:#eee; background:rgba(0,0,0,.30); border:1px solid #5d5e52; border-radius:3px; font:10px var(--mono); }
.matrix-wrap { max-height:72vh; overflow:auto; }
.matrix-wrap table { border-collapse:separate; border-spacing:0; min-width:max-content; }
.matrix-wrap th { position:sticky; top:0; z-index:4; max-width:120px; min-width:54px; overflow:hidden; background:#282a26; text-overflow:ellipsis; white-space:nowrap; }
.matrix-wrap th:first-child { left:0; z-index:7; min-width:190px; }
.matrix-row-label { position:sticky; left:0; z-index:3; min-width:190px; max-width:240px; background:#242622; white-space:nowrap; }
.matrix-cell { min-width:54px; height:32px; background:rgba(255,170,0,var(--heat)); text-align:center; font:9px var(--mono); }
.matrix-cell.clickable:hover { outline:1px solid var(--accent); outline-offset:-1px; }
.server-timeline { position:relative; display:grid; gap:0; padding:0 4px 24px 26px; }
.server-timeline::before { content:''; position:absolute; top:4px; bottom:8px; left:11px; width:1px; background:rgba(201,195,140,.22); }
.timeline-event { position:relative; min-height:58px; padding:9px 11px 9px 14px; border-bottom:1px solid rgba(255,255,255,.045); }
.timeline-event.clickable { cursor:pointer; }
.timeline-event.clickable:hover { background:rgba(201,195,140,.055); }
.timeline-dot { position:absolute; left:-20px; top:16px; width:9px; height:9px; border:2px solid #191a18; border-radius:50%; background:var(--accent-2); box-shadow:0 0 0 1px rgba(201,195,140,.32); }
.timeline-population .timeline-dot { background:#e9a03b; }
.timeline-international .timeline-dot { background:#79b8ff; }
.timeline-revival .timeline-dot { background:#b58cff; }
.timeline-session .timeline-dot { background:#9bd46d; }
.timeline-time { color:var(--muted); font:8px var(--mono); text-transform:uppercase; }
.timeline-title { margin-top:3px; color:#eee; font-size:11px; font-weight:700; }
.timeline-sub { margin-top:2px; color:var(--muted); font-size:9px; }
.playback-controls { display:grid; grid-template-columns:auto auto auto 100px minmax(260px,1fr); gap:8px; align-items:center; padding:12px; overflow:visible; }
.playback-controls select { height:34px; color:#eee; background:#1d1e1c; border:1px solid #55574c; border-radius:3px; font:9px var(--mono); }
.playback-controls input[type="range"] { width:100%; accent-color:var(--accent); }
.playback-frame { padding:18px; min-height:220px; }
.playback-map { color:#fff; font:700 clamp(24px,4vw,48px) var(--mono); letter-spacing:-.04em; overflow-wrap:anywhere; }
.playback-meta { margin-top:5px; color:var(--accent-2); font:9px var(--mono); }
.playback-lobby { display:grid; grid-template-columns:2fr 1fr; gap:14px; margin-top:18px; }
.playback-lobby h3 { margin:0 0 7px; color:var(--muted); font-size:9px; text-transform:uppercase; }
.session-row { margin-top:8px; border-top:1px solid rgba(201,195,140,.12); }
.v9-added { border-top:1px solid rgba(201,195,140,.11); padding-top:13px; }
.filter-bar input[type="number"] { min-width:72px; }
.filter-bar select { min-width:120px; }
#view-players .filter-bar label,#view-matches .filter-bar label { white-space:nowrap; }
@media (max-width:1200px){ .who-online-controls { grid-template-columns:repeat(2,minmax(180px,1fr)); } .playback-controls { grid-template-columns:repeat(4,auto); } .playback-controls input[type="range"] { grid-column:1/-1; } }
@media (max-width:760px){ .who-online-controls { grid-template-columns:1fr; } .playback-lobby { grid-template-columns:1fr; } .playback-controls { grid-template-columns:1fr 1fr; } .playback-controls input[type="range"] { grid-column:1/-1; } }

/* v10 deeper archive explorer */
.three-col { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.inline-link { padding:0; color:var(--accent-2); background:none; border:0; font:inherit; cursor:pointer; text-decoration:underline; text-underline-offset:2px; }
.inline-link:hover { color:var(--accent); }
@media (max-width:900px){ .three-col { grid-template-columns:1fr; } }

.brand-home-link { color: inherit; text-decoration: none; }
.brand-home-link:hover { text-decoration: underline; }
