:root{color-scheme:dark;--bg:#0d1324;--surface:#151e32;--surface2:#1c2940;--line:#324059;--soft:#8997ae;--white:#f3f7fc;--mint:#70e8b4;--orange:#fca66a;font-family:DM Sans,Arial,sans-serif}*{box-sizing:border-box}body{margin:0;color:var(--white);background:radial-gradient(circle at 85% 3%,#193244 0,transparent 31%),radial-gradient(circle at 0% 18%,#182742 0,transparent 30%),var(--bg);min-height:100vh}button,input,select{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}.shell{max-width:1140px;margin:auto;padding:0 28px}.nav{height:104px;display:flex;align-items:center;justify-content:space-between}.brand{display:inline-flex;gap:13px;align-items:center;font-family:'Space Grotesk',sans-serif;font-size:18px;font-weight:700;letter-spacing:.09em;line-height:1}.brand small{display:block;letter-spacing:.24em;font-size:9px;margin-top:5px;color:#a2b1c9}.brand-mark{display:grid;place-content:center;background:var(--mint);width:43px;height:43px;border-radius:12px;color:#0c2330;font-weight:700;font-size:20px;letter-spacing:-.09em}.brand-mark span{font-size:12px;color:#0c2330}.button{border:1px solid var(--line);border-radius:10px;padding:13px 19px;font-size:13px;font-weight:800;transition:filter .2s}.button:hover{filter:brightness(1.13)}.button.outline{color:var(--white);background:rgba(255,255,255,.025)}.button.primary{color:#0d1e24;background:var(--mint);border-color:var(--mint)}.hero{padding:72px 0 78px;border-bottom:1px solid var(--line)}.eyebrow{display:flex;align-items:center;gap:11px;font-weight:800;font-size:11px;letter-spacing:.18em;color:var(--mint)}.eyebrow-line{width:22px;height:3px;background:var(--mint)}.eyebrow.subtle{color:var(--soft);letter-spacing:.16em}.hero-row{display:flex;align-items:end;justify-content:space-between;gap:24px}.hero h1{font-family:'Space Grotesk',sans-serif;letter-spacing:-.07em;font-weight:700;font-size:clamp(56px,7.5vw,98px);line-height:.99;margin:25px 0}.hero h1 span{color:var(--mint)}.hero p{max-width:510px;line-height:1.65;color:#acbbcf;margin:0;font-size:16px}.hero-ornament{display:flex;align-items:flex-end;gap:10px;min-width:240px;height:168px;opacity:.8}.hero-ornament span{font-family:'Space Grotesk',sans-serif;font-weight:700;border:1px solid #4d6a78;background:#203849;border-radius:9px 9px 3px 3px;flex:1;display:flex;align-items:flex-end;padding:14px;letter-spacing:-.05em;font-size:28px;color:#8cc5c5}.hero-ornament span:nth-child(1){height:56%}.hero-ornament span:nth-child(2){height:100%;border-color:#58ac9e;background:#234b4b;color:var(--mint)}.hero-ornament span:nth-child(3){height:76%}.section-head{display:flex;align-items:end;justify-content:space-between;margin:48px 0 21px}.section-head h2{font-family:'Space Grotesk',sans-serif;font-size:27px;letter-spacing:-.045em;margin:8px 0 0}.game-count{font-size:10px;font-weight:800;letter-spacing:.12em;color:var(--soft)}.game-picker{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:36px}.game-tile{display:flex;text-align:left;align-items:center;gap:13px;min-height:94px;background:var(--surface);border:1px solid var(--line);border-radius:13px;padding:16px;color:var(--white);transition:border-color .15s,background .15s}.game-tile:hover{background:var(--surface2)}.game-tile.active{border-color:var(--mint);background:#183335}.game-tile-icon{height:43px;width:43px;min-width:43px;background:#26334d;border:1px solid #3b4c63;border-radius:11px;display:grid;place-items:center;font-size:20px;font-family:'Space Grotesk';font-weight:700;color:var(--mint)}.game-tile.active .game-tile-icon{background:#2b5953;border-color:#488f7c}.game-tile strong{font-size:13px;display:block}.game-tile small{display:block;color:#9dabbe;font-size:10px;line-height:1.5;margin-top:5px}.tile-arrow{margin-left:auto;color:var(--soft);align-self:flex-start;font-size:16px}.board{background:var(--surface);border:1px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:0 24px 60px rgba(0,0,0,.12)}.board-top{padding:31px 33px;display:flex;justify-content:space-between;gap:18px;align-items:center}.board-top h2{font-family:'Space Grotesk',sans-serif;font-size:30px;letter-spacing:-.04em;margin:9px 0 7px}.board-subtitle{color:#a8b5c8;margin:0;font-size:13px}.board-filters{display:flex;flex-direction:column;align-items:flex-start;gap:8px}.select-label{font-size:10px;letter-spacing:.1em;color:var(--soft);font-weight:800}.board-filters select{color:var(--white);background:#202e45;border:1px solid #45536a;padding:11px 35px 11px 13px;border-radius:8px;min-width:154px}.stats{display:flex;margin:0 33px 30px;border:1px solid var(--line);border-radius:10px;background:#19263b}.stats>div{padding:19px 23px;flex:1;border-right:1px solid var(--line)}.stats>div:last-child{border-right:0}.stat-label{font-size:9px;color:#8fa2b9;font-weight:800;letter-spacing:.14em;display:block;margin-bottom:6px}.stats strong{font-family:'Space Grotesk';font-size:23px;letter-spacing:-.04em}.board-heading{background:#0e192a;padding:15px 33px;display:flex;justify-content:space-between;color:#8494af;font-size:10px;font-weight:800;letter-spacing:.14em}.leader-row{display:flex;align-items:center;justify-content:space-between;min-height:74px;padding:14px 33px;border-top:1px solid #29364e}.rank-player{display:flex;align-items:center;gap:16px}.rank-num{color:#8c9fb4;font-family:'Space Grotesk';font-size:14px;min-width:26px}.top .rank-num{color:var(--mint);font-weight:700}.avatar{height:39px;width:39px;background:#293a52;color:#a9c2db;display:grid;place-items:center;border-radius:50%;font-weight:800}.top-1 .avatar{background:#4f4631;color:#ffd37d}.top-2 .avatar{background:#3b4958;color:#cad6e5}.top-3 .avatar{background:#514038;color:#e9b292}.nickname{font-size:14px;font-weight:700}.score{font-family:'Space Grotesk';font-size:21px;letter-spacing:-.04em;font-weight:700;white-space:nowrap}.score small{font-family:DM Sans;font-size:10px;letter-spacing:0;color:var(--soft);margin-left:4px}.top-1 .score{color:#ffd37d}.board-footer{padding:17px 33px;background:#101b2c;display:flex;justify-content:space-between;align-items:center;color:#91a2b9;font-size:12px}.text-button{background:none;border:0;color:var(--mint);font-weight:700}.empty{min-height:150px;display:flex;gap:9px;flex-direction:column;align-items:center;justify-content:center;color:#96a6bd;font-size:14px;text-align:center;padding:25px}.empty strong{font-size:20px;color:var(--white)}.info-strip{border:1px solid #345c55;background:linear-gradient(120deg,#183c3d,#192c37);border-radius:14px;padding:25px 29px;margin:34px 0 70px;display:flex;gap:16px;align-items:center;justify-content:space-between}.info-strip h3{font-family:'Space Grotesk';margin:0 0 4px;font-size:22px}.info-strip p{color:#acccca;margin:0;max-width:610px;font-size:13px;line-height:1.5}.footer{border-top:1px solid var(--line);color:#8b9cb5;min-height:94px;display:flex;justify-content:space-between;align-items:center;font-size:12px}.footer div{display:flex;gap:22px}.footer a:hover{color:var(--mint)}@media(max-width:850px){.game-picker{grid-template-columns:repeat(2,1fr)}.hero-ornament{min-width:170px;height:120px}}@media(max-width:610px){.shell{padding:0 16px}.nav{height:77px}.hero{padding:53px 0}.hero h1{font-size:50px}.hero-ornament{display:none}.section-head{margin-top:34px}.game-picker{grid-template-columns:1fr;gap:9px;margin-bottom:24px}.game-tile{min-height:75px}.board-top{flex-wrap:wrap;padding:24px 20px}.board-top h2{font-size:25px}.board-filters{width:100%}.board-filters select{width:100%}.stats{margin:0 15px 20px}.stats>div{padding:13px 11px}.stats strong{font-size:18px}.stat-label{font-size:8px}.board-heading,.leader-row,.board-footer{padding-left:18px;padding-right:18px}.board-footer{gap:15px}.rank-player{gap:10px}.score{font-size:18px}.info-strip{align-items:stretch;flex-direction:column}.info-strip .button{width:100%}.footer{gap:15px}.brand{font-size:14px}.button{font-size:11px;padding:11px 13px}}

.play-link{font-size:11px;font-weight:900;letter-spacing:.08em;color:#0b272c;background:#70e8b4;border-radius:7px;padding:11px 14px;text-align:center;margin-bottom:8px}.play-link[hidden]{display:none}.board-filters select{min-width:160px}


/* Byron Arcade Leaderboard | Brand theme v1.2
   Official logo palette: orange #e07526, white, charcoal, limited multi-colour accents.
   Overrides the original template without changing application behaviour. */
:root {
  color-scheme: dark;
  --bg: #0d0c0b;
  --surface: #171513;
  --surface2: #231e19;
  --line: #39312b;
  --soft: #b3a59b;
  --white: #fffaf6;
  --mint: #e07526;
  --orange: #e07526;
  --byron-orange: #e07526;
  --byron-cream: #f6e6c6;
  --byron-green: #188267;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
}
body {
  background:
    radial-gradient(ellipse at 88% 5%, rgba(224,117,38,.14), transparent 32%),
    radial-gradient(ellipse at 2% 40%, rgba(24,130,103,.045), transparent 27%),
    var(--bg);
}
body::before {
  content: "";
  position: absolute;
  z-index: 3;
  top: 0; left: 0; right: 0;
  height: 4px;
  background: linear-gradient(90deg,#188267 0%,#f6e6c6 19%,#e07526 39%,#dd5e34 61%,#6b1e5b 79%,#e07526 100%);
}
.shell { max-width: 1200px; }
.nav { height: 110px; gap: 22px; border-bottom: 1px solid rgba(255,255,255,.075); }
.brand { gap: 20px; letter-spacing: normal; }
.brand-logo { width: clamp(148px, 17vw, 200px); height: auto; display:block; object-fit:contain; }
.brand-divider { height: 38px; width: 1px; flex: none; background: #524239; }
.brand-title { font-weight: 900; font-size: 17px; letter-spacing: .18em; line-height: 1.18; color: #fff; }
.brand-title small { margin-top: 4px; font-size: 10px; letter-spacing: .24em; color: var(--byron-orange); }
.brand-mark { display: none; }
.button { border-radius: 5px; padding: 13px 20px; letter-spacing: .025em; }
.button.outline { border-color: #625247; background: rgba(255,255,255,.025); }
.button.outline:hover { border-color: var(--byron-orange); background: rgba(224,117,38,.10); }
.button.primary { color: #150e09; background: #e07526; border-color: #e07526; }
.button.primary:hover, .play-link:hover { filter: brightness(1.15); }
button:focus-visible, a:focus-visible, select:focus-visible, input:focus-visible { outline: 2px solid #f6b37b; outline-offset: 3px; }
.hero { position:relative; padding: 82px 0 84px; border-bottom: 1px solid #43352a; overflow:hidden; }
.eyebrow { color: var(--byron-orange); }
.eyebrow-line { background: var(--byron-orange); }
.eyebrow.subtle { color: #ab9586; }
.hero-eyebrow-tag { color: #897b70; }
.hero-row { align-items:center; position:relative; }
.hero h1 { font-family: Inter, ui-sans-serif, system-ui, Arial, sans-serif; font-size: clamp(52px, 7.6vw, 93px); font-weight: 850; letter-spacing: 0em; line-height: 1.04; margin: 30px 0 23px; }
.hero h1 span { color: var(--byron-orange); }
.hero h1 .title-stop { color: #f6e6c6; }
.hero p { color: #c0b5ad; max-width: 580px; font-size: 16px; line-height: 1.8; }
.hero-chips { display: flex; flex-wrap:wrap; gap: 9px; margin-top: 27px; }
.hero-chips span { border: 1px solid #574335; color: #cead91; font-size: 10px; font-weight: 800; letter-spacing: .13em; padding: 9px 12px; border-radius: 4px; background: rgba(224,117,38,.04); }
.hero-ornament { position:relative; height:240px; min-width:275px; align-items:flex-end; gap:10px; padding-bottom: 4px; opacity:1; }
.hero-ornament>span { z-index: 1; border: 1px solid #684327; border-bottom: 4px solid #e07526; background: linear-gradient(140deg,#462617,#221710); color:#ffd5ad; border-radius: 7px 7px 2px 2px; height: 60%; padding:16px; font-family:inherit; font-size:29px; font-weight:850; }
.hero-ornament>span:nth-of-type(1) { height:61%; }
.hero-ornament>span:nth-of-type(2) { height:89%; background:linear-gradient(155deg,#d66f22,#7d3912); border-color:#f1a36a; color:#fff9f3; }
.hero-ornament>span:nth-of-type(3) { height:73%; }
.arcade-rings { position:absolute; right:-20px; top:-10px; width:260px; height:210px; background:repeating-radial-gradient(circle at 64% 48%,transparent 0px, transparent 17px,rgba(224,117,38,.28) 18px,rgba(224,117,38,.28) 20px, transparent 21px,transparent 25px,rgba(246,230,198,.15) 26px,rgba(246,230,198,.15) 28px,transparent 29px,transparent 33px); opacity:.55; pointer-events:none; }
.section-head { margin-top:52px; }
.section-head h2, .board-top h2, .info-strip h3 { font-family:inherit; font-weight:820; }
.game-count { color:#b5a79c; }
.game-tile { background:#191714; border-color:#3b312a; border-radius:8px; }
.game-tile:hover { background:#231e19; border-color:#815132; }
.game-tile.active { border-color:#e07526; background:linear-gradient(105deg,rgba(224,117,38,.16),rgba(224,117,38,.055)); }
.game-tile-icon { border-color:#654532; background:#382319; color:#f1a36a; border-radius:6px; }
.game-tile.active .game-tile-icon { background:#e07526; color:#1c1009; border-color:#e07526; }
.game-tile small { color:#b8aaa0; }
.board { background:var(--surface); border-color:#43352b; border-radius:9px; box-shadow:0 25px 80px rgba(0,0,0,.28); }
.board-top { gap:28px; }
.board-subtitle { color:#b7a99e; }
.board-filters select { background:#25201c; border-color:#5e4e42; border-radius:5px; }
.board-filters select:focus { border-color:#e07526; }
.stats { background:#201b17; border-color:#48392e; border-radius:6px; }
.stats strong { font-family:inherit; color:#fff9f4; }
.stat-label { color:#c0a795; }
.board-heading { background:#120f0d; color:#b19b8a; border-top:1px solid #312921; }
.leader-row { border-top:1px solid #302924; }
.leader-row:hover { background:rgba(224,117,38,.045); }
.rank-num { font-family:inherit; color:#c0ada0; }
.top .rank-num { color:var(--byron-orange); }
.avatar { background:#33261e; color:#f3c5a6; border-radius:7px; }
.top-1 .avatar { background:#684021; color:#ffddb0; }
.top-2 .avatar { background:#403b37; color:#f5f0e8; }
.top-3 .avatar { background:#4b3026; color:#eabca2; }
.score { font-family:inherit; }
.score small { font-family:inherit; }
.top-1 .score { color:#f0a25f; }
.board-footer { background:#13110f; color:#a99d92; }
.text-button { color:var(--byron-orange); }
.play-link { background:var(--byron-orange); color:#160c05; border-radius:5px; }
.info-strip { position:relative; overflow:hidden; border-color:#73452c; background:linear-gradient(110deg,#332016,#1d1814 75%); border-radius:8px; padding:34px; }
.info-strip::before { content:""; position:absolute; left:0;top:0;bottom:0;width:5px; background:linear-gradient(#188267,#f6e6c6,#e07526,#6b1e5b); }
.info-strip .eyebrow { font-size:10px; letter-spacing:.15em; margin-bottom:7px; }
.info-strip h3 { font-size:25px; margin-bottom:9px; }
.info-strip p { color:#d2bbae; }
.footer { color:#a99a8c; border-color:#3b3129; }
.footer span small { display:block; font-size:9px; letter-spacing:.16em; margin-top:8px; color:#806c5d; }
.footer a:hover { color:#e07526; }
@media(max-width:850px) {
  .hero-ornament { min-width:195px; height:185px; }
  .brand-logo { width:155px; }
  .brand-title { font-size:13px; }
}
@media(max-width:610px) {
  .nav { height:84px; gap:10px; }
  .brand { gap:12px; }
  .brand-logo { width:105px; }
  .brand-divider { height:29px; }
  .brand-title { font-size:10px; letter-spacing:.12em; }
  .brand-title small { font-size:8px; letter-spacing:.14em; }
  .hero { padding:54px 0 55px; }
  .hero h1 { font-size:clamp(43px,10.3vw,60px); margin:24px 0 19px; }
  .hero p { font-size:14px; }
  .hero-chips { gap:5px; margin-top:23px; }
  .hero-chips span { padding:7px 8px; font-size:8px; }
  .info-strip { padding:27px 22px; }
  .info-strip h3 { font-size:22px; }
  .footer { padding-top:22px; padding-bottom:25px; align-items:flex-start; }
  .footer div { padding-top:3px; }
  .button { font-size:11px; padding:11px 12px; }
}
@media(prefers-reduced-motion:reduce) { *,*:before,*:after { scroll-behavior:auto!important; transition:none!important; } }