:root{--app: #070809;--panel: #101113;--panel-alt: #181a1e;--card-deep: #141518;--accent: #8494a3;--accent-soft: #97a3b0;--accent-bright: #b6c0c9;--accent-deep: #394450;--burgundy: #634e46;--burgundy-deep: #4a0f17;--gold: #ffd700;--text: #ffffff;--text-accent: #c4cad1;--text-body: #c0c5cb;--text-sub: #8d949d;--text-muted: #79818b;--btn-primary: #1f8048;--btn-primary-hi: #2aa05a;--btn-primary-border: #7dffb8;--solo: #44ff99;--solo-bg: #0a2a10;--match: #ffd700;--duel: #2266cc;--duel-bg: #03122e;--fire: #ff8800;color-scheme:dark}*{box-sizing:border-box}html,body{margin:0}body{min-height:100vh;background:var(--app);color:var(--text);font-family:Arial,Helvetica,system-ui,sans-serif;line-height:1.55;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}.bg{position:fixed;inset:0;z-index:-2;background:url(/login-bg.webp) center / cover no-repeat;opacity:.5;image-rendering:pixelated}.bg:after{content:"";position:absolute;inset:0;background:radial-gradient(120% 80% at 50% 0%,transparent 30%,rgba(7,8,9,.75) 100%),linear-gradient(to bottom,#07080940,#070809eb)}.beams{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden}.beam{position:absolute;top:-20vh;width:8vw;min-width:60px;height:130vh;background:linear-gradient(to right,#fff4cd00,#fff4cd29,#fff4cd00);-webkit-mask-image:linear-gradient(to bottom,#000 0%,transparent 85%);mask-image:linear-gradient(to bottom,#000 0%,transparent 85%);transform:rotate(14deg);animation:beam-flicker 6s ease-in-out infinite}.beam-1{left:26%;animation-delay:0s}.beam-2{left:44%;opacity:.75;animation-delay:-2s}.beam-3{left:62%;opacity:.6;animation-delay:-4s}@keyframes beam-flicker{0%,to{opacity:.55}50%{opacity:.95}}@media(prefers-reduced-motion:reduce){.beam{animation:none}}.container{width:min(1080px,100% - 2.5rem);margin-inline:auto}.header{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-block:1.1rem}.header .brand{display:flex;align-items:baseline;gap:.45rem}.brand-kaboom{font-weight:700;font-size:1.4rem;letter-spacing:.04em;color:var(--burgundy);-webkit-text-stroke:1px rgba(0,0,0,.53);text-shadow:0 2px 10px rgba(74,15,23,.53)}.brand-arena{font-weight:700;font-size:.85rem;letter-spacing:.18em;color:var(--text)}.nav{display:flex;gap:1.15rem;font-size:.9rem}.nav a{color:var(--text-sub);text-decoration:none;transition:color .15s}.nav a:hover{color:var(--accent-bright)}.hero{padding-block:clamp(2.5rem,9vw,5.5rem) clamp(2rem,6vw,3.5rem);text-align:center}.logo-kaboom{display:block;font-size:clamp(3rem,13vw,6.5rem);font-weight:700;line-height:.95;letter-spacing:.02em;color:var(--burgundy);-webkit-text-stroke:3px rgba(0,0,0,.53);paint-order:stroke fill;text-shadow:0 3px 16px rgba(74,15,23,.7)}.logo-arena{display:block;margin-top:.35rem;font-size:clamp(1.1rem,4vw,2rem);font-weight:700;letter-spacing:.42em;text-indent:.42em;color:var(--text);-webkit-text-stroke:1.5px rgba(11,13,16,.53);paint-order:stroke fill}.hero p{margin:1.4rem auto 2rem;max-width:48ch;color:var(--text-body);font-size:clamp(.98rem,2.2vw,1.12rem)}.actions{display:flex;gap:.75rem;justify-content:center;flex-wrap:wrap}.btn{display:inline-block;padding:.75rem 1.7rem;border-radius:10px;font-weight:700;font-size:.98rem;text-decoration:none;border:1.5px solid transparent;transition:background-color .15s,border-color .15s,transform .08s}.btn:active{transform:scale(.97)}.btn-primary{background:#1f8048e0;border-color:#7dffb880;color:var(--text)}.btn-primary:hover{background:var(--btn-primary-hi);border-color:var(--btn-primary-border)}.btn-ghost{background:#ffffff12;border-color:#ffffff38;color:var(--text-accent)}.btn-ghost:hover{background:#ffffff1f;border-color:var(--accent-bright);color:var(--text)}.section{padding-block:clamp(2rem,7vw,3.5rem)}.section-title{margin:0 0 1.4rem;font-size:clamp(1.35rem,3.4vw,1.9rem);font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--text);text-shadow:0 2px 12px rgba(0,0,0,.6)}.grid{display:grid;gap:.9rem;grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}.card{padding:1.15rem 1.25rem;border-radius:20px;background:#ffffff12;border:1.5px solid rgba(255,255,255,.22);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transition:background-color .15s,border-color .15s,transform .12s}.card:hover{background:#ffffff1a;border-color:var(--accent-soft);transform:translateY(-3px)}.card .icon{font-size:1.7rem;line-height:1}.card h3{margin:.55rem 0 .3rem;font-size:1.02rem;font-weight:700;color:var(--text)}.card p{margin:0;color:var(--text-sub);font-size:.9rem}.mode-card{padding:1.25rem;border-radius:16px;border:1.5px solid;background:#101113db;transition:transform .12s,box-shadow .15s}.mode-card:hover{transform:translateY(-3px)}.mode-card h3{margin:0 0 .35rem;font-size:1.05rem;font-weight:700;letter-spacing:.04em}.mode-card p{margin:0;font-size:.9rem;color:var(--text-body)}.mode-solo{border-color:var(--solo);background:#0a2a10b8}.mode-solo h3{color:var(--solo)}.mode-solo:hover{box-shadow:0 0 24px #44ff992e}.mode-match{border-color:var(--match);background:#261a00b8}.mode-match h3{color:var(--match)}.mode-match:hover{box-shadow:0 0 24px #ffd7002e}.mode-duel{border-color:var(--duel);background:#03122ec7}.mode-duel h3{color:#6fa8ff}.mode-duel:hover{box-shadow:0 0 24px #2266cc47}.footer{margin-block:clamp(2rem,6vw,3.5rem) 2.5rem;padding:1.4rem 1.5rem;border-radius:16px;background:#101113f7;border:1.5px solid rgba(151,163,176,.5);font-size:.88rem;color:#ffffffab}.footer h4{margin:0 0 .9rem;font-size:1.05rem;font-weight:700;letter-spacing:.12em;color:var(--text);text-align:center}.footer-row{display:flex;gap:.6rem;margin-bottom:.4rem}.footer-row dt{width:7rem;flex:none;color:#ffffffab}.footer-row dd{margin:0;color:var(--text)}.footer-row a{color:var(--accent-bright);font-weight:700;text-decoration:none}.footer-row a:hover{color:var(--text)}.footer .mono{font-family:monospace}.footer .copy{margin:1.1rem 0 0;text-align:center;font-size:.72rem;color:#ffffff87}@media(max-width:560px){.nav{display:none}.footer-row dt{width:6rem}}