*{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#0b0907;--bg2:#161109;--bg3:#1e1608;
  --border:#332510;--border2:#4a3518;
  --gold:#e8b84b;--gold2:#7a5520;
  --text:#f0e4c2;--muted:#bfa878;--dim:#9a8050;--faint:#6a5535;
  --up:#6dd47a;--dn:#e05c52;--neu:#bfa878;
  --blue:#6ec4e8;--purple:#b894e0;
  --row-hover:#1a1408;--row-self:#1c1a06;--row-self-hover:#242208;
  --num-col:#d8c898;--bar-bg:#1e1408;--bl-col:#d8c898;
  --td-border:#1e1408;
}
.light{
  --bg:#f5f0e8;--bg2:#ffffff;--bg3:#ede7d8;
  --border:#d8cdb0;--border2:#c8b890;
  --gold:#8a5e0a;--gold2:#c8a030;
  --text:#2a2010;--muted:#6a5530;--dim:#8a7048;--faint:#b0965a;
  --up:#1e7a2a;--dn:#c0200a;--neu:#6a5530;
  --blue:#1a6090;--purple:#6830a8;
  --row-hover:#f0e8d4;--row-self:#fdf8e8;--row-self-hover:#f8f0d0;
  --num-col:#4a3810;--bar-bg:#e8dfc8;--bl-col:#4a3810;
  --td-border:#e0d4b8;
}
/* ── Raven · Black / white / grey ──────────────────────── */
.raven{
  --bg:#fcfcfc;--bg2:#ffffff;--bg3:#efefef;
  --border:#d0d0d0;--border2:#aaaaaa;
  --gold:#111111;--gold2:#e8e8e8;
  --text:#111111;--muted:#505050;--dim:#888888;--faint:#c8c8c8;
  --up:#185c28;--dn:#a81818;--neu:#505050;
  --blue:#18306e;--purple:#4a1278;
  --row-hover:#f0f0f0;--row-self:#f8f2f2;--row-self-hover:#f0eaea;
  --num-col:#222222;--bar-bg:#e4e4e4;--bl-col:#222222;
  --td-border:#e0e0e0;
}
/* ── Nevermore · Poe's gothic midnight ──────────────────── */
.nevermore{
  --bg:#0c0910;--bg2:#13101a;--bg3:#1c1828;
  --border:#2e2442;--border2:#443360;
  --gold:#c8a030;--gold2:#251c08;
  --text:#e2d8f0;--muted:#9880c0;--dim:#6a5890;--faint:#3e2e58;
  --up:#48b860;--dn:#c84040;--neu:#9880c0;
  --blue:#6898d8;--purple:#a86fd8;
  --row-hover:#16121e;--row-self:#1c1808;--row-self-hover:#241e0a;
  --num-col:#c8a030;--bar-bg:#1c1828;--bl-col:#c8a030;
  --td-border:#2e2442;
}
body{background:var(--bg);color:var(--text);font-family:'Georgia',serif;font-size:14px;line-height:1.5}
.page{max-width:1240px;margin:0 auto;padding:20px 16px 60px}

/* ── Header ─────────────────────────────────────────────── */
.header{display:flex;align-items:flex-start;justify-content:space-between;border-bottom:2px solid var(--gold2);padding-bottom:14px;margin-bottom:18px;gap:12px}
.header-left{display:flex;align-items:flex-start;gap:12px}
.header h1{font-size:24px;color:var(--gold);letter-spacing:1px}
.header-meta{font-size:13px;color:var(--muted);margin-top:4px}
.header-right{text-align:right;font-size:13px;color:var(--muted);line-height:1.8;flex-shrink:0}
.badge{display:inline-block;background:var(--gold2);color:var(--gold);font-size:13px;font-weight:bold;border-radius:4px;padding:3px 10px}
.theme-selector{display:flex;background:var(--bg3);border:1px solid var(--border);border-radius:6px;padding:2px;gap:1px;flex-shrink:0}
.theme-btn{background:none;border:none;border-radius:4px;color:var(--dim);cursor:pointer;font-size:11px;padding:5px 10px;font-family:'Georgia',serif;transition:all .15s;letter-spacing:.3px;white-space:nowrap;line-height:1}
.theme-btn:hover{color:var(--text)}
.theme-btn.active{background:var(--bg2);color:var(--gold);font-weight:bold;box-shadow:0 1px 3px rgba(0,0,0,.18)}

/* Raven icon */
.raven-icon{flex-shrink:0;width:50px;height:50px;object-fit:contain;filter:invert(1) sepia(0.4) saturate(4) hue-rotate(5deg)}
.light .raven-icon{filter:none}
.raven .raven-icon{filter:none;opacity:.9}
.nevermore .raven-icon{filter:invert(1) sepia(1) saturate(3) hue-rotate(5deg);opacity:.88}

/* ── Tabs ────────────────────────────────────────────────── */
.week-tabs{display:flex;gap:6px;margin-bottom:16px;flex-wrap:wrap;align-items:center}
.week-tabs label{font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:var(--dim);margin-right:4px}
.wtab{background:var(--bg2);border:1px solid var(--border);border-radius:5px;padding:7px 16px;cursor:pointer;font-size:13px;color:var(--muted);font-family:'Georgia',serif;transition:all .15s}
.wtab:hover{border-color:var(--gold2);color:var(--text)}
.wtab.active{background:var(--gold2);border-color:var(--gold);color:var(--gold);font-weight:bold}
.wtab-arrow{color:var(--faint);font-size:15px;padding:0 2px}

/* ── Summary cards ───────────────────────────────────────── */
.cards{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;margin-bottom:16px}
.card{background:var(--bg2);border:1px solid var(--border);border-radius:6px;padding:13px 15px}
.card-label{font-size:11px;text-transform:uppercase;letter-spacing:1.2px;color:var(--dim)}
.card-val{font-size:22px;color:var(--gold);font-weight:bold;margin-top:4px;line-height:1.1}
.card-sub{font-size:12px;color:var(--muted);margin-top:3px}
.card-delta{font-size:12px;margin-top:3px}

/* ── Highlights ──────────────────────────────────────────── */
.stars-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:11px;margin-bottom:18px}
.star-card{background:var(--bg2);border:1px solid var(--border);border-left:3px solid var(--faint);border-radius:6px;padding:12px 14px}
.star-card.hot{border-left-color:var(--gold)}
.star-card.rising{border-left-color:var(--up)}
.star-name{font-size:14px;color:var(--gold);font-weight:bold}
.star-stat{font-size:20px;color:var(--up);font-weight:bold;margin:4px 0}
.star-sub{font-size:12px;color:var(--muted);line-height:1.5}

/* ── Charts ──────────────────────────────────────────────── */
.charts-row{display:grid;grid-template-columns:2fr 1fr 1fr;gap:12px;margin-bottom:18px}
.chart-box{background:var(--bg2);border:1px solid var(--border);border-radius:6px;padding:14px 16px;min-width:0;overflow:hidden}
.chart-title{font-size:11px;text-transform:uppercase;letter-spacing:1.5px;color:var(--dim);margin-bottom:10px}
.chart-wrap{position:relative;height:140px}

/* ── Insights (merged highlights + auto-insights) ─────── */
.ins-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:18px;align-items:start}
.ins-card{background:var(--bg2);border:1px solid var(--border);border-top:3px solid var(--border2);border-radius:7px;padding:10px 12px;display:flex;flex-direction:column;gap:2px}
.ins-card.tall{grid-row:span 3}
.ins-card.gold{border-top-color:var(--gold)}
.ins-card.info{border-top-color:var(--blue)}
.ins-card.good{border-top-color:var(--up)}
.ins-card.warn{border-top-color:var(--dn)}
.ins-label{font-size:10px;text-transform:uppercase;letter-spacing:1.5px;color:var(--dim);line-height:1.3}
.ins-val{font-size:20px;font-weight:bold;color:var(--text);line-height:1.1;margin:1px 0}
.ins-text{font-size:12px;color:var(--muted);line-height:1.5}
.ins-list{list-style:none;padding:0;margin:4px 0 0}
.ins-list li{font-size:12px;color:var(--text);padding:2px 0;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.ins-list li:last-child{border-bottom:none}

/* ── Main data grid ──────────────────────────────────────── */
.main-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:18px;align-items:stretch}
.st{font-size:11px;text-transform:uppercase;letter-spacing:2px;color:var(--muted);border-bottom:1px solid var(--border);padding-bottom:6px;margin:0 0 11px}
.tbl-wrap{background:var(--bg2);border:1px solid var(--border);border-radius:6px;overflow:hidden}
.scroll{max-height:520px;overflow-y:auto}
.mb-col{display:flex;flex-direction:column}
.mb-col .mb-scroll{flex:1 1 0;min-height:0;overflow-y:auto;max-height:none}
table{width:100%;border-collapse:collapse}
thead th{background:var(--bg3);color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:1px;padding:8px 10px;text-align:left;font-weight:normal;position:sticky;top:0;z-index:1}
td{padding:7px 10px;border-top:1px solid var(--td-border);font-size:13px}
tr:hover td{background:var(--row-hover)}
.tr-self td{background:var(--row-self) !important}
.tr-self:hover td{background:var(--row-self-hover) !important}
.cn{color:var(--text)}.cn.gold{color:var(--gold);font-weight:bold}
.num{text-align:right;font-variant-numeric:tabular-nums;color:var(--num-col)}
.pct{text-align:right;font-size:12px;width:56px}
.dlt{text-align:right;font-size:12px;width:64px}
.rnk{color:var(--faint);font-size:12px;width:24px}
.up{color:var(--up)}.dn{color:var(--dn)}.neu{color:var(--neu)}
.tb{display:inline-block;font-size:10px;padding:1px 5px;border-radius:3px;text-transform:uppercase;letter-spacing:.4px;margin-left:3px;vertical-align:middle}
.tL{background:#5a2000;color:var(--gold)}
.tS{background:#0e2840;color:var(--blue)}
.tO{background:#0e2814;color:var(--up)}
.tV{background:#231840;color:var(--purple)}
.tSo{background:#2e1808;color:#d8a070}
.tN{background:#14142e;color:#9898e0}
.light .tL{background:#fde8c0;color:#7a4000}
.light .tS{background:#d0e8f8;color:#0a4878}
.light .tO{background:#d0f0d8;color:#0a5020}
.light .tV{background:#e8d8f8;color:#4820a0}
.light .tSo{background:#fde0c8;color:#7a3808}
.light .tN{background:#d8d8f8;color:#2828a0}
.raven .tL{background:#1a1a1a;color:#ffffff}
.raven .tS{background:#2a4060;color:#b8d8f0}
.raven .tO{background:#1a3828;color:#a8e0b8}
.raven .tV{background:#30185a;color:#d0b0f0}
.raven .tSo{background:#3a2010;color:#f0c898}
.raven .tN{background:#555555;color:#ffffff}

/* ── Top bars ────────────────────────────────────────────── */
.bar-row{display:flex;align-items:center;gap:8px;padding:4px 0}
.bl{width:140px;font-size:12px;color:var(--bl-col);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex-shrink:0}
.bt{flex:1;background:var(--bar-bg);border-radius:2px;height:11px}
.bf{height:11px;border-radius:2px}
.bv{width:54px;text-align:right;font-size:12px;color:var(--muted);flex-shrink:0}
hr{border:none;border-top:1px solid var(--border);margin:16px 0}
.note{font-size:12px;color:var(--dim);margin-top:5px;font-style:italic}
.legend{display:flex;gap:16px;flex-wrap:wrap;align-items:center;font-size:12px;color:var(--dim)}
.ldot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:4px}

@media(max-width:1100px){
  .cards{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:800px){
  .cards{grid-template-columns:1fr}
  .charts-row{grid-template-columns:1fr}
  .main-grid{grid-template-columns:1fr}
  .ins-grid{grid-template-columns:1fr}
  .ins-card.tall{grid-row:span 1}
  /* Header stacks vertically on mobile */
  .header{flex-direction:column;gap:12px}
  .header-right{text-align:left;width:100%}
  .header-right>div{flex-direction:column!important;align-items:flex-start!important;gap:8px!important}
  .theme-selector{width:100%}
  .theme-btn{flex:1;text-align:center}
  .header-meta{font-size:11px}
  .header h1{font-size:18px}
  .raven-icon{width:38px;height:38px}
}
#snow-canvas{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:9999;opacity:0;transition:opacity 1.2s}

/* View switcher */
.view-tabs{display:flex;gap:8px;margin-bottom:12px}
.vtab{background:var(--bg3);border:1px solid var(--border);border-radius:6px;padding:8px 18px;cursor:pointer;font-size:13px;color:var(--muted);font-family:Georgia,serif}
.vtab:hover{border-color:var(--gold2);color:var(--text)}
.vtab.active{background:var(--gold2);border-color:var(--gold);color:var(--gold);font-weight:bold}
.vtab-alert{
  outline:2px solid #d03030;
  outline-offset:2px;
  animation:vtab-pulse-red 2.4s ease-in-out infinite;
}
.vtab-alert:hover,.vtab-alert.active{
  color:var(--text);
}
@keyframes vtab-pulse-red{
  0%,100%{outline-color:#d03030;box-shadow:0 0 0 0 rgba(208,48,48,.55)}
  50%{outline-color:#ff4040;box-shadow:0 0 0 7px rgba(208,48,48,0)}
}
.view-panel.hidden{display:none}
.tournament-empty{padding:24px;background:var(--bg2);border:1px solid var(--border);border-radius:6px;color:var(--muted);font-style:italic}
