/* Hub page and the shared player badge. Same palette as Decimal Divers so modules feel like one place. */
:root{
  color-scheme:dark;
  --hub-bg:#0b0d0a; --hub-panel:#141711; --hub-panel2:#1c2018; --hub-line:#30362a;
  --hub-fg:#ebe7d4; --hub-muted:#9a9d88; --hub-accent:#f2c230; --hub-ink:#18140a;
  --hub-gold:#f2c230; --hub-silver:#c9cdd2; --hub-bronze:#c98a52; --hub-good:#78d672; --hub-bad:#ff6646;
}
.hub-badge{display:inline-flex;align-items:center;gap:8px;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;color:var(--hub-muted);text-decoration:none;border:1px solid var(--hub-line);padding:6px 10px;background:var(--hub-panel)}
.hub-badge b{color:var(--hub-fg);font-weight:700;text-transform:none;letter-spacing:0;font-size:.9rem}
.hub-badge i{font-style:normal;color:var(--hub-accent)}
.hub-badge:hover{border-color:var(--hub-muted)}

.hub-page{margin:0;background:var(--hub-bg);color:var(--hub-fg);font:16px/1.45 'Chakra Petch','Segoe UI',system-ui,sans-serif;min-height:100vh}
.hub-page *{box-sizing:border-box}
.hub-band{height:10px;background:repeating-linear-gradient(-45deg,var(--hub-accent) 0 12px,var(--hub-ink) 12px 24px)}
.hub-wrap{max-width:1000px;margin:0 auto;padding:22px 16px 48px}
.hub-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:12px;margin-bottom:24px}
.hub-head h1{font-family:'Saira Stencil One',Impact,sans-serif;font-weight:400;font-size:clamp(2rem,6vw,3rem);line-height:1;margin:0;color:var(--hub-accent)}
.hub-sub{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--hub-muted);margin-top:6px}
.hub-h2{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:.8rem;letter-spacing:.16em;text-transform:uppercase;color:var(--hub-muted);margin:0 0 12px;font-weight:500}
.hub-kids{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px}
.hub-kid{font:inherit;font-size:1.3rem;font-weight:700;color:var(--hub-fg);background:var(--hub-panel);border:2px solid var(--hub-line);padding:22px 14px;cursor:pointer;text-align:center}
.hub-kid:hover,.hub-kid:focus-visible{border-color:var(--hub-accent);outline:none}
.hub-kid.guest{font-size:1rem;font-weight:600;color:var(--hub-muted)}
.hub-empty{color:var(--hub-muted);border:1px dashed var(--hub-line);padding:16px;margin-bottom:10px}
.hub-mods{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}
.hub-mod{display:flex;flex-direction:column;gap:8px;background:var(--hub-panel);border:1px solid var(--hub-line);border-left:4px solid var(--hub-accent);padding:16px 18px;color:inherit;text-decoration:none}
.hub-mod:hover{background:var(--hub-panel2);border-color:var(--hub-muted);border-left-color:var(--hub-accent)}
.hub-mod h3{margin:0;font-size:1.35rem}
.hub-mod .subj{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--hub-muted)}
.hub-mod p{margin:0;color:var(--hub-muted);font-size:.95rem}
.hub-prog{display:flex;gap:4px;margin-top:4px}
.hub-prog i{width:16px;height:16px;border-radius:50%;border:2px dashed var(--hub-line)}
.hub-prog i.gold{background:var(--hub-gold);border:2px solid var(--hub-gold)}
.hub-prog i.silver{background:var(--hub-silver);border:2px solid var(--hub-silver)}
.hub-prog i.bronze{background:var(--hub-bronze);border:2px solid var(--hub-bronze)}
.hub-foot{margin-top:36px;font-size:.8rem;color:var(--hub-muted)}
.hub-foot a{color:var(--hub-muted)}
[hidden]{display:none!important}
