:root{--bg:#100d15;--panel:#191420;--panel2:#211a28;--ink:#f7f1df;--muted:#a99eaa;--gold:#f3c968;--amber:#d98d3b;--green:#98d98c;--red:#d75b62;--purple:#a47be4;--line:rgba(255,255,255,.09)}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:radial-gradient(circle at 70% 10%,#2a1c32 0,#100d15 42%,#0b0910 100%);color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif}body{min-height:100vh}button{font:inherit;color:inherit;cursor:pointer}.topbar{height:72px;display:flex;align-items:center;justify-content:space-between;padding:0 4vw;border-bottom:1px solid var(--line);background:rgba(10,8,13,.65);backdrop-filter:blur(12px);position:sticky;top:0;z-index:20}.brand{display:flex;gap:10px;align-items:baseline;font-weight:900;letter-spacing:.12em;color:inherit;text-decoration:none}.brand-mark{color:var(--gold);font-size:25px}.brand small{color:var(--muted);letter-spacing:.05em;font-weight:500}.top-actions{display:flex;gap:10px}.screen{display:none;min-height:calc(100vh - 72px);padding:48px 5vw}.screen.active{display:block}.hero-screen.active{display:grid;grid-template-columns:1.1fr .9fr;align-items:center;overflow:hidden}.eyebrow{font-size:12px;letter-spacing:.23em;font-weight:900;color:var(--gold);text-transform:uppercase}.hero-copy h1{font-family:Georgia,serif;font-size:clamp(58px,8vw,116px);line-height:.78;margin:16px 0 26px;letter-spacing:-.055em}.hero-copy h1 span{color:var(--ink)}.hero-copy h1 em{color:var(--gold);font-style:italic}.lede{font-size:20px;line-height:1.55;max-width:680px;color:#d2c9d1}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin:30px 0}.primary,.secondary,.ghost{border:1px solid var(--line);border-radius:12px;padding:11px 16px;background:var(--panel2)}.primary{background:linear-gradient(135deg,#d59a43,#f0c86d);color:#23170c;border:0;font-weight:900}.secondary{background:#2a2033;font-weight:800}.big{padding:15px 24px;font-size:16px}.ghost{background:transparent}.ghost:hover,.secondary:hover{border-color:rgba(243,201,104,.5)}.feature-strip{display:flex;gap:20px;flex-wrap:wrap;color:var(--muted);font-size:13px}.hive-art{height:620px;position:relative}.moon{position:absolute;width:360px;height:360px;border-radius:50%;background:radial-gradient(circle at 40% 40%,#ffecae,#df9a4a 53%,rgba(217,141,59,0) 56%);filter:drop-shadow(0 0 35px rgba(243,201,104,.25));left:25%;top:12%}.hex{position:absolute;width:160px;height:180px;clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);border:1px solid #fff;background:rgba(248,214,126,.08)}.h1{left:3%;top:55%}.h2{right:4%;top:48%;transform:scale(.7)}.h3{right:16%;top:9%;transform:scale(.35)}.bee-silhouette{position:absolute;left:44%;top:44%;font-size:96px;filter:grayscale(1) contrast(3) drop-shadow(0 12px 18px #000);transform:rotate(-12deg)}.section-heading{text-align:center;max-width:720px;margin:0 auto 36px}.section-heading h2{font-family:Georgia,serif;font-size:48px;margin:8px}.section-heading p:not(.eyebrow){color:var(--muted)}.class-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;max-width:1280px;margin:0 auto 28px}.class-card{background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.018));border:1px solid var(--line);border-radius:20px;padding:25px;min-height:430px;display:flex;flex-direction:column;transition:.2s}.class-card:hover{transform:translateY(-5px);border-color:rgba(243,201,104,.45);box-shadow:0 20px 50px rgba(0,0,0,.25)}.class-icon{font-size:62px}.class-card h3{font-family:Georgia,serif;font-size:30px;margin:10px 0 2px}.class-card .role{color:var(--gold);font-size:12px;font-weight:900;letter-spacing:.12em}.class-card p{color:#bdb3bd;line-height:1.45}.class-traits{display:grid;gap:7px;margin:10px 0 20px;font-size:13px}.class-traits span{padding:7px 9px;background:rgba(255,255,255,.04);border-radius:7px}.class-card button{margin-top:auto}.game-screen{padding:14px 2vw;min-height:0}.game-layout{height:calc(100vh - 100px);display:grid;grid-template-columns:220px 1fr 220px;gap:12px}.hud-panel{background:rgba(20,16,26,.87);border:1px solid var(--line);border-radius:16px;padding:15px;overflow:auto}.left-panel{text-align:center}.portrait{width:68px;height:68px;display:grid;place-items:center;font-size:42px;border:1px solid var(--line);border-radius:50%;margin:0 auto 8px;background:#2b2231}.left-panel small{display:block;color:var(--muted);font-size:11px}.meter{margin-top:18px;text-align:left}.meter label{display:flex;justify-content:space-between;font-size:11px;color:var(--muted);margin-bottom:5px}.meter>div,.cooldown{height:7px;background:#0e0c11;border-radius:10px;overflow:hidden}.meter i,.cooldown i{display:block;height:100%;width:100%;background:linear-gradient(90deg,#b33f4b,#e26a68)}.meter.xp i{background:linear-gradient(90deg,#8d64cb,#c69bea)}.stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:15px 0}.stats-grid span{background:#211a28;padding:8px;border-radius:8px;font-size:12px}.ability-card{padding:12px;border:1px solid rgba(243,201,104,.16);background:rgba(243,201,104,.05);border-radius:10px;text-align:left}.ability-card>span{float:right;font-size:9px;background:#49371d;padding:3px 5px;border-radius:4px}.ability-card strong{font-size:12px}.ability-card small{margin:3px 0 9px;line-height:1.35}.cooldown i{background:var(--gold)}.materials{display:flex;justify-content:space-between;margin-top:15px;font-size:12px}.arena-wrap{position:relative;display:grid;place-items:center;min-width:0;background:#09080c;border:1px solid var(--line);border-radius:16px;overflow:hidden}#gameCanvas{width:100%;height:100%;object-fit:contain;background:#16121b}.arena-top{position:absolute;top:14px;left:16px;right:16px;display:flex;justify-content:space-between;pointer-events:none;text-shadow:0 2px 4px #000}.arena-top small,.scorebox small{display:block;color:#e9c76e;font-size:10px;letter-spacing:.15em}.arena-top strong{font-family:Georgia,serif;font-size:21px}.scorebox{text-align:right}.scorebox b{font-size:22px}.scorebox span{display:block;font-size:11px;color:var(--gold)}.objective{position:absolute;bottom:17px;left:50%;transform:translateX(-50%);background:rgba(11,9,14,.72);border:1px solid var(--line);border-radius:20px;padding:8px 15px;font-size:12px}.toast{position:absolute;top:70px;left:50%;transform:translate(-50%,-10px);opacity:0;background:#211a28;border:1px solid rgba(243,201,104,.35);padding:10px 14px;border-radius:9px;transition:.25s;pointer-events:none}.toast.show{opacity:1;transform:translate(-50%,0)}.side-title{margin:5px 0 10px;display:flex;justify-content:space-between;align-items:center}.side-title span{font-size:10px;font-weight:900;letter-spacing:.18em;color:var(--gold)}.side-title small{font-size:9px;color:var(--muted)}.resonances{display:grid;gap:6px;margin-bottom:18px}.resonance{display:grid;grid-template-columns:25px 1fr auto;gap:7px;align-items:center;padding:7px;background:#211a28;border-radius:8px;font-size:10px}.resonance.active{outline:1px solid rgba(243,201,104,.25)}.relics{display:grid;grid-template-columns:1fr 1fr;gap:6px}.relic{height:58px;border:1px solid var(--line);border-radius:8px;padding:6px;background:#17131c;font-size:9px;overflow:hidden}.relic b{display:block;font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.relic small{color:var(--muted)}.run-stats{display:grid;gap:8px;font-size:11px}.run-stats span{display:flex;justify-content:space-between;padding:7px;background:#211a28;border-radius:7px}.path-cards{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;max-width:1200px;margin:0 auto}.path-card{border:1px solid var(--line);background:linear-gradient(180deg,#241d2b,#17131c);min-height:260px;border-radius:18px;padding:18px;display:flex;flex-direction:column;transition:.2s}.path-card:hover{transform:translateY(-4px);border-color:rgba(243,201,104,.5)}.path-card .node-icon{font-size:38px}.path-card h3{font-family:Georgia,serif;font-size:24px;margin:10px 0}.path-card p{font-size:13px;color:var(--muted);line-height:1.45}.path-card .risk{margin-top:auto;color:var(--gold);font-size:11px}.run-summary-bar{max-width:1200px;margin:24px auto 0;padding:14px;border-top:1px solid var(--line);display:flex;justify-content:center;gap:32px;color:var(--muted);font-size:12px}.end-screen{text-align:center;padding-top:8vh}.end-screen h2{font-family:Georgia,serif;font-size:48px}.final-score small{display:block;color:var(--muted);letter-spacing:.2em}.final-score strong{font-size:90px;font-family:Georgia,serif;color:var(--gold)}.final-stats{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin:20px}.final-stats span{background:#211a28;padding:12px 16px;border-radius:10px}.end-screen .hero-actions{justify-content:center}.muted{color:var(--muted)}.modal{position:fixed;inset:0;background:rgba(5,4,7,.78);display:grid;place-items:center;z-index:100;padding:20px;backdrop-filter:blur(6px)}.modal.hidden{display:none}.modal-card{width:min(850px,95vw);max-height:88vh;overflow:auto;background:#1b1621;border:1px solid rgba(243,201,104,.22);border-radius:20px;padding:28px;position:relative;box-shadow:0 30px 100px #000}.modal-close{position:absolute;right:14px;top:12px;background:transparent;border:0;font-size:28px;color:var(--muted)}.choice-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:20px}.choice{border:1px solid var(--line);background:#241d2b;border-radius:13px;padding:16px;text-align:left;min-height:170px}.choice:hover{border-color:rgba(243,201,104,.5)}.choice .tag{color:var(--gold);font-size:10px;font-weight:900;letter-spacing:.12em}.choice h3{font-family:Georgia,serif;margin:8px 0}.choice p{font-size:12px;color:var(--muted);line-height:1.4}.choice .sigil{font-size:11px}.auth-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.auth-grid form{display:grid;gap:10px}.auth-grid input{background:#100d15;border:1px solid var(--line);border-radius:8px;padding:11px;color:#fff}.leaderboard{width:100%;border-collapse:collapse}.leaderboard th,.leaderboard td{text-align:left;padding:10px;border-bottom:1px solid var(--line);font-size:13px}.leaderboard th{color:var(--gold);font-size:10px;letter-spacing:.1em}.leaderboard-toggle{display:flex;gap:8px;margin:14px 0}.leaderboard-toggle button.active{background:var(--gold);color:#23170c}.craft-list{display:grid;gap:10px;margin-top:15px}.craft-option{display:flex;justify-content:space-between;gap:15px;border:1px solid var(--line);border-radius:10px;padding:13px;background:#211a28;text-align:left}.craft-option small{display:block;color:var(--muted)}

/* Configurable keyboard controls */
.control-list{display:grid;gap:10px;margin:22px 0 18px}.control-row{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:12px 14px;border:1px solid rgba(255,255,255,.09);background:rgba(255,255,255,.025);border-radius:12px}.control-row>span{font-weight:700}.control-bind{min-width:120px;font-family:inherit;font-weight:800}.control-bind.listening{outline:2px solid rgba(239,198,97,.55)}.control-presets{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}

/* Player-facing home refresh */
.topbar{height:68px;padding:0 clamp(18px,4vw,64px);background:rgba(8,7,11,.86);border-bottom-color:rgba(243,201,104,.08)}
.brand{align-items:center}.brand-mark{font-size:20px}.brand>span:not(.brand-mark){font-size:14px}.brand small{font-size:11px}.top-actions{align-items:center;gap:8px}.top-actions .ghost{padding:10px 13px;border-radius:10px;color:#d9d1da}.top-actions .ghost:hover{background:rgba(255,255,255,.035);color:#fff}.lang-switch{min-width:46px;font-weight:900;color:var(--gold)!important}.arcade-link{color:#b48be7!important}
.hero-screen.active{min-height:calc(100vh - 68px);padding:clamp(28px,5vh,64px) clamp(24px,7vw,110px);grid-template-columns:minmax(0,1.03fr) minmax(380px,.97fr);gap:clamp(24px,5vw,72px);position:relative}
.hero-screen:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 73% 42%,rgba(230,159,70,.12),transparent 26%),linear-gradient(120deg,rgba(255,255,255,.012),transparent 34%);pointer-events:none}
.hero-copy{position:relative;z-index:2;max-width:820px}.game-index{display:flex;align-items:center;gap:12px;color:#8e8592;font-size:11px;font-weight:800;letter-spacing:.16em;margin-bottom:26px}.game-index span{color:var(--gold)}.game-index i{width:38px;height:1px;background:rgba(243,201,104,.4)}.game-index b{font-size:10px;color:#8e8592}.hero-copy .eyebrow{font-size:11px;color:#e5b85b;letter-spacing:.2em}.hero-copy h1{font-size:clamp(64px,7.2vw,110px);line-height:.82;margin:14px 0 24px;max-width:820px}.hero-copy h1 em{display:inline-block;text-shadow:0 0 44px rgba(243,201,104,.13)}.lede{font-size:clamp(17px,1.35vw,21px);max-width:720px;color:#c8bec9;line-height:1.6}.hero-actions{margin:30px 0 28px;gap:10px}.hero-actions .big{min-height:58px;border-radius:14px;padding:13px 20px}.hero-actions .primary{min-width:180px;display:flex;align-items:center;justify-content:space-between;gap:28px;font-size:17px;box-shadow:0 12px 40px rgba(213,154,67,.16)}.hero-actions .primary b{font-size:22px}.hero-actions .secondary{min-width:210px;display:grid;text-align:left;gap:2px}.hero-actions .secondary span{font-weight:900}.hero-actions .secondary small{font-size:10px;font-weight:500;color:#a99eaa}.feature-strip{display:grid;grid-template-columns:repeat(4,max-content);gap:9px}.feature-strip span{display:flex;align-items:baseline;gap:6px;padding:8px 11px;border:1px solid rgba(255,255,255,.055);border-radius:999px;background:rgba(255,255,255,.025);font-size:11px}.feature-strip span:before{content:none}.feature-strip b{color:var(--gold);font-size:13px}.feature-strip i{font-style:normal;color:#a99eaa}
.hive-art{height:min(68vh,640px);min-height:500px;position:relative;z-index:1;border:1px solid rgba(243,201,104,.08);border-radius:34px;background:linear-gradient(160deg,rgba(255,255,255,.025),rgba(255,255,255,.008));overflow:hidden;box-shadow:inset 0 1px rgba(255,255,255,.025),0 30px 100px rgba(0,0,0,.18)}.art-glow{position:absolute;width:70%;aspect-ratio:1;border-radius:50%;left:17%;top:4%;background:radial-gradient(circle,rgba(243,201,104,.17),transparent 68%);filter:blur(8px)}.moon{width:min(58%,360px);height:auto;aspect-ratio:1;left:22%;top:13%;background:radial-gradient(circle at 38% 34%,#ffefbd 0,#f2bf68 42%,#d88b39 72%,#7c4924 100%);filter:drop-shadow(0 0 46px rgba(243,201,104,.2))}.hex{border:1px solid rgba(243,201,104,.24);background:rgba(243,201,104,.035)}.h1{left:4%;top:56%;transform:scale(.72)}.h2{right:2%;top:46%;transform:scale(.57)}.h3{right:17%;top:10%;transform:scale(.28)}.h4{left:12%;top:9%;transform:scale(.2)}.bee-silhouette{left:46%;top:42%;font-size:82px;filter:grayscale(1) contrast(2.5) drop-shadow(0 14px 20px rgba(0,0,0,.7));animation:beeFloat 4.2s ease-in-out infinite}.art-card{position:absolute;left:24px;right:24px;bottom:24px;border:1px solid rgba(243,201,104,.11);border-radius:16px;padding:14px 16px;background:rgba(10,8,13,.65);backdrop-filter:blur(12px);display:flex;align-items:center;justify-content:space-between;gap:20px}.art-card span{font-size:9px;letter-spacing:.18em;color:#9c909d}.art-card strong{font-family:Georgia,serif;font-size:18px;color:#eee5d7}@keyframes beeFloat{50%{transform:translateY(-10px) rotate(-8deg)}}

@media(max-width:1100px){.hero-screen.active{grid-template-columns:1fr .82fr;padding-inline:4vw}.feature-strip{grid-template-columns:repeat(2,max-content)}.top-actions{gap:4px}.top-actions .ghost{padding:9px}.top-actions .ghost span:first-child:not([data-fr]){display:none}}
@media(max-width:900px){.hero-screen.active{grid-template-columns:1fr;padding-top:44px}.hive-art{height:340px;min-height:340px;margin-top:8px}.moon{width:240px;left:calc(50% - 120px);top:34px}.bee-silhouette{left:48%;top:42%;font-size:64px}.art-card{left:16px;right:16px;bottom:16px}.class-grid{grid-template-columns:1fr 1fr}.game-layout{grid-template-columns:160px 1fr}.right-panel{display:none}.path-cards{grid-template-columns:repeat(2,1fr)}.brand small{display:none}}
@media(max-width:650px){.screen{padding:28px 16px}.topbar{height:auto;min-height:64px;padding:10px 14px}.top-actions{gap:3px}.top-actions .ghost{padding:8px 9px;font-size:12px}.top-actions .ghost>span:first-child:not([data-fr]){display:none}.arcade-link{display:none}.brand>span:not(.brand-mark){font-size:12px}.hero-screen.active{padding:34px 18px 44px}.game-index{margin-bottom:18px}.hero-copy h1{font-size:clamp(50px,15vw,72px)}.lede{font-size:16px}.hero-actions{display:grid;grid-template-columns:1fr 1fr}.hero-actions .primary,.hero-actions .secondary{min-width:0}.feature-strip{grid-template-columns:1fr 1fr}.hive-art{min-height:300px;height:300px}.art-card strong{font-size:14px}.class-grid{grid-template-columns:1fr}.game-layout{display:block;height:calc(100vh - 95px)}.left-panel{display:none}.arena-wrap{height:100%}.path-cards{grid-template-columns:1fr 1fr}.auth-grid,.choice-grid{grid-template-columns:1fr}.final-score strong{font-size:60px}}
