
:root{color-scheme:dark;--ink:#ebe6d6;--muted:#999889;--coal:#0d100f;--panel:#151917;--line:#353b35;--acid:#d3f04c;--rust:#e7734f}
*{box-sizing:border-box}html{min-height:100%;background:#090b0a}body{margin:0;min-height:100vh;color:var(--ink);font-family:Consolas,"Courier New",monospace;background:radial-gradient(circle at 82% 5%,#283128 0,transparent 33%),linear-gradient(135deg,#0b0e0c,#111713 55%,#080a09);letter-spacing:.01em}
.grain{position:fixed;inset:0;pointer-events:none;opacity:.06;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E")}
main{width:min(1280px,calc(100% - 40px));margin:0 auto;padding:24px 0 80px}.masthead{position:relative;min-height:590px;border:1px solid var(--line);overflow:hidden;background:#0b0f0e}.hero-art{position:absolute;inset:0;background-image:linear-gradient(90deg,rgba(5,8,7,.97) 0,rgba(5,8,7,.88) 34%,rgba(5,8,7,.2) 68%,rgba(5,8,7,.06)),linear-gradient(0deg,#0b0f0e 0,transparent 28%),url("/leaderboard-assets/nox-coastal-relay.png");background-position:center;background-size:cover;filter:saturate(.8) contrast(1.08)}.hero-copy{position:relative;z-index:1;min-height:590px;padding:34px 38px 48px;display:flex;flex-direction:column;align-items:flex-start}.brand-mark{display:flex;align-items:center;gap:11px;margin-bottom:auto;color:var(--ink);text-transform:uppercase}.brand-mark b{font-family:Impact,"Arial Narrow",sans-serif;font-size:2.5rem;line-height:.8;letter-spacing:.04em}.brand-mark span{padding-left:10px;border-left:1px solid var(--acid);color:var(--acid);font-size:.62rem;font-weight:700;line-height:1.05;letter-spacing:.12em}.eyebrow,.kicker,.profile-eyebrow{color:var(--acid);font-size:.72rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase}.masthead h1{margin:16px 0 12px;font-family:Impact,"Arial Narrow",sans-serif;font-size:clamp(4.2rem,10vw,8.7rem);font-weight:900;line-height:.75;letter-spacing:-.045em;text-transform:uppercase;text-shadow:0 4px 28px #000}.masthead h1 span{color:transparent;-webkit-text-stroke:1px var(--ink)}.masthead p{max-width:560px;margin-bottom:0;color:#c0c0b2;font-size:.92rem;line-height:1.7}.status{position:absolute;right:38px;top:38px;color:#b5b6aa;font-size:.72rem;text-transform:uppercase}.status i{display:inline-block;width:8px;height:8px;margin-right:8px;border-radius:50%;background:var(--acid);box-shadow:0 0 12px var(--acid)}.status.full{color:#f0a38c}.status.full i{background:var(--rust);box-shadow:0 0 12px var(--rust)}.relay-card{position:absolute;z-index:1;right:32px;bottom:30px;width:230px;padding:15px 16px;border:1px solid rgba(235,230,214,.27);background:rgba(7,10,9,.72);backdrop-filter:blur(7px);text-transform:uppercase}.relay-card span,.relay-card small{display:block;color:#858b81;font-size:.58rem;letter-spacing:.13em}.relay-card b{display:block;margin:5px 0 12px;color:var(--acid);font-size:.84rem;letter-spacing:.08em}.relay-card small{line-height:1.5;letter-spacing:.05em}.board{margin-top:24px}
.board{position:relative;border:1px solid var(--line);background:rgba(18,23,20,.92);box-shadow:16px 16px 0 rgba(0,0,0,.24)}.board:before{content:"";position:absolute;left:-1px;top:-1px;width:110px;height:4px;background:var(--acid)}.board-head{display:flex;align-items:end;justify-content:space-between;gap:24px;padding:28px 30px 22px}.board h2{margin:5px 0 0;font-family:Impact,"Arial Narrow",sans-serif;font-size:2.4rem;letter-spacing:.01em;text-transform:uppercase}.controls{display:flex;align-items:end;gap:10px}.search{display:grid;gap:5px;color:var(--muted);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase}.search input{width:220px;border:1px solid var(--line);border-radius:0;padding:10px 12px;background:#0d110f;color:var(--ink);font:inherit;outline:none}.search input:focus{border-color:var(--acid);box-shadow:0 0 0 2px rgba(211,240,76,.12)}button{font:inherit}.outline{height:38px;border:1px solid var(--line);padding:0 14px;background:transparent;color:var(--ink);cursor:pointer;text-transform:uppercase}.outline:hover,.outline:focus-visible{border-color:var(--acid);color:var(--acid)}.tabs{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.tabs button{border:0;border-right:1px solid var(--line);padding:15px 10px;background:#0e120f;color:var(--muted);cursor:pointer;font-size:.74rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.tabs button:last-child{border-right:0}.tabs button:hover,.tabs button:focus-visible{color:var(--ink)}.tabs button.active{background:var(--acid);color:#11150f}
.table-wrap{min-height:320px}table{width:100%;border-collapse:collapse}th{padding:13px 30px;color:#797d72;font-size:.66rem;text-align:left;letter-spacing:.12em;text-transform:uppercase}th:last-child,td:last-child{text-align:right}td{border-top:1px solid #292e29;padding:16px 30px}tbody tr{cursor:pointer;transition:background .12s}tbody tr:hover,tbody tr:focus-within{background:#1d241e}td.rank{width:90px;color:#6f756c;font-size:.8rem}td.name button{border:0;padding:0;background:none;color:var(--ink);cursor:pointer;font-weight:700;text-align:left}td.value{color:var(--acid);font-weight:700}.notice,.empty{padding:44px 30px;color:var(--rust);text-align:center}.empty{color:var(--muted)}footer{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding:14px 30px;color:#73776d;font-size:.66rem;text-transform:uppercase}
dialog{width:min(760px,calc(100% - 32px));max-height:88vh;border:1px solid #4a5148;border-radius:0;padding:32px;background:#111612;color:var(--ink);box-shadow:24px 24px 0 rgba(0,0,0,.45)}dialog::backdrop{background:rgba(3,5,4,.82);backdrop-filter:blur(5px)}dialog h2{margin:6px 0 24px;font-family:Impact,"Arial Narrow",sans-serif;font-size:3.4rem;text-transform:uppercase}dialog h3{margin:28px 0 12px;color:var(--muted);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase}.close{position:absolute;right:16px;top:13px;border:0;background:none;color:var(--muted);font-size:2rem;cursor:pointer}.close:hover{color:var(--acid)}.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}.stat{padding:14px;background:#0c100d}.stat b{display:block;color:var(--acid);font-size:1.1rem}.stat span{color:var(--muted);font-size:.64rem;text-transform:uppercase}.skill-list{display:grid;grid-template-columns:repeat(2,1fr);gap:7px}.skill{display:grid;grid-template-columns:1fr auto;gap:3px 12px;padding:10px 12px;background:#1a201b}.skill small{grid-column:1/-1;color:var(--muted)}.chip-list{display:flex;flex-wrap:wrap;gap:6px}.chip{padding:6px 8px;border:1px solid var(--line);color:#b8baaf;font-size:.7rem}
@media(max-width:720px){main{width:min(100% - 20px,1280px);padding-top:10px}.masthead,.hero-copy{min-height:570px}.hero-art{background-image:linear-gradient(180deg,rgba(5,8,7,.55),rgba(5,8,7,.94) 62%,#0b0f0e),url("/leaderboard-assets/nox-coastal-relay.png");background-position:64% center}.hero-copy{padding:22px 22px 36px}.brand-mark{margin-bottom:auto}.status{position:static;margin:0 0 22px}.masthead h1{font-size:clamp(3.8rem,23vw,6.2rem)}.masthead p{font-size:.8rem}.relay-card{display:none}.board-head{align-items:stretch;flex-direction:column}.controls{align-items:stretch}.search{flex:1}.search input{width:100%}.tabs{grid-template-columns:repeat(2,1fr)}th,td{padding-left:14px;padding-right:14px}footer{gap:12px;padding-left:14px;padding-right:14px}.stat-grid{grid-template-columns:repeat(2,1fr)}.skill-list{grid-template-columns:1fr}}
