/* Shared app styles: one palette and one set of primitives for the in-app pages
   (manager, scoreboard, friends, calc). Load it BEFORE a page's own <style> so a
   page can still override; a page should not redefine anything that lives here.
   The landing page keeps its own marketing palette on purpose. */
:root{
  --bg:#0e1117;--surface:#161b22;--surface2:#1c2230;--border:#30363d;
  --text:#e6edf3;--text2:#8b949e;
  /* was #6e7681 (3.8:1 on --surface at .62-.72rem); this clears AA on both */
  --muted:#848d97;
  --accent:#a371f7;--green:#3fb950;--yellow:#d29922;--red:#f85149;--blue:#58a6ff;--orange:#f0883e;
  --qb:#f778ba;--rb:#3fb950;--wr:#58a6ff;--te:#d29922;--k:#8b949e;--def:#bc8cff;
}
body{background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;margin:0}
.page-wrap{padding:24px;max-width:1280px;margin:0 auto}
@media(max-width:600px){.page-wrap{padding:14px 10px}}
.sub{color:var(--text2);font-size:.86rem;max-width:760px;line-height:1.5;margin-bottom:14px}
.val{color:var(--muted);font-size:.72rem}

.toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:16px;font-size:.84rem;color:var(--text2)}
.toolbar select,.toolbar button{background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:7px;padding:6px 10px;font-size:.84rem;cursor:pointer}
.toolbar button:hover{border-color:var(--accent)}

.chip{display:inline-flex;align-items:center;gap:4px;font-size:.68rem;font-weight:600;padding:2px 8px;border-radius:999px;border:1px solid var(--border);color:var(--text2);background:var(--bg);white-space:nowrap}
.chip.dyn{color:#bc8cff;border-color:#4b2a7a}.chip.keeper{color:var(--yellow);border-color:#5a4410}
.chip.sf,.chip.bb,.chip.info{color:var(--blue);border-color:#1f4a7a}
.chip.tep,.chip.chop{color:var(--orange);border-color:#6a3b12}
.chip.hot,.chip.bad{color:var(--red);border-color:#7a2828}
.chip.warn{color:var(--yellow);border-color:#5a4410}.chip.good{color:var(--green);border-color:#1f5a2e}
.chip.live{color:#ff7b72;border-color:#7a2828;background:#2a1414}
.chip.ext{color:var(--muted);border-style:dashed}
a.chip{text-decoration:none}a.chip:hover{border-color:var(--accent)}

/* One primary button: the accent, everywhere. */
.btn-primary{background:var(--accent);color:#0e1117;border:1px solid var(--accent);border-radius:7px;padding:8px 14px;font-weight:600;font-size:.86rem;cursor:pointer}
.btn-primary:hover{filter:brightness(1.08)}
.btn-primary:disabled{opacity:.5;cursor:default}

.skeleton{height:150px;border-radius:12px;background:linear-gradient(100deg,#161b22 30%,#1c222b 50%,#161b22 70%);background-size:200% 100%;animation:sk 1.2s linear infinite}
@keyframes sk{from{background-position:200% 0}to{background-position:-200% 0}}
.empty,.error{grid-column:1/-1;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:28px;color:var(--text2);text-align:center}
.error{border-color:#7a2828;color:#ff7b72}
.error a,.empty a{color:var(--accent)}
a.ext{color:var(--accent);text-decoration:none;font-size:.74rem;white-space:nowrap}

:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* Pages own their own motion (the scoreboard marquee has a scrollable fallback);
   only the shared primitives are handled here. */
@media(prefers-reduced-motion:reduce){.skeleton{animation:none}}