*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{--night:#040c10;--deep:#0a1a18;--purple:#111a28;--paper:#edf3ff;--gold:#ffd93d;--warm:#ff6b6b;--cool:#4d96ff;--teal:#4aff8b;--brass:#c8aa64;--soft:#a6b5d5;--line:rgba(100,132,201,.2);--glass:rgba(6,14,16,.9);--shadow:0 30px 100px rgba(0,0,0,.5);--rad:22px}
body{min-height:100vh;color:var(--paper);font-family:"Trebuchet MS",Verdana,sans-serif;background:radial-gradient(circle at top,rgba(74,255,139,.06),transparent 32%),radial-gradient(circle at 15% 25%,rgba(77,150,255,.08),transparent 28%),radial-gradient(circle at 80% 20%,rgba(255,217,61,.05),transparent 24%),linear-gradient(145deg,var(--night),var(--deep) 50%,var(--purple))}
body::before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.04;background:radial-gradient(circle,rgba(255,255,255,.4) 1px,transparent 1px);background-size:40px 40px}
.topbar{width:min(1320px,calc(100% - 40px));margin:0 auto;min-height:64px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{font-size:1.4rem;font-weight:900;color:transparent;background:linear-gradient(45deg,var(--warm),var(--gold));background-clip:text;-webkit-background-clip:text;letter-spacing:.04em;text-decoration:none}
.trail{display:flex;align-items:center;gap:10px;color:var(--soft);font-size:.9rem}.trail a{color:var(--teal);text-decoration:none}
.bloom-shell{width:min(1320px,calc(100% - 40px));margin:0 auto;padding:10px 0 34px}
.intro{display:flex;justify-content:space-between;align-items:end;gap:32px;margin:12px 0 16px}
.eyebrow{font-size:.68rem;color:var(--teal);font-weight:800;text-transform:uppercase;letter-spacing:.2em;margin-bottom:6px}
h1{font:clamp(2.2rem,4.5vw,3.8rem)/1 Georgia,serif;color:var(--paper);letter-spacing:-.04em}
.lede{color:var(--soft);line-height:1.6;max-width:680px;margin-top:8px;font-size:.95rem}
.legend{display:flex;gap:8px;flex-shrink:0}.legend span{min-width:76px;text-align:center;padding:10px 8px;border:1px solid rgba(74,255,139,.12);background:rgba(74,255,139,.03);border-radius:14px;color:var(--soft);font-size:.72rem}.legend strong{display:block;font:1.4rem Georgia,serif;color:var(--teal);margin-bottom:2px}
.ad-slot{position:relative;width:100%;min-height:76px;margin-bottom:10px;display:flex;justify-content:center;align-items:center;padding:5px;border:1px dashed var(--line);border-radius:12px;overflow:hidden;background:linear-gradient(180deg,rgba(255,255,255,.02),rgba(255,255,255,.005)),rgba(5,10,15,.65)}.ad-slot::before{content:"Ad Zone";position:absolute;top:5px;right:8px;color:rgba(166,181,213,.45);font-size:.6rem;letter-spacing:.08em;text-transform:uppercase}.ad-placeholder{color:#7b89ab;font-size:.76rem;letter-spacing:.08em;text-transform:uppercase}
.ad-slot .adsbygoogle{display:block;width:100%;min-width:240px;min-height:60px}
.game-frame{overflow:hidden;border-radius:var(--rad);background:var(--glass);border:1px solid rgba(74,255,139,.12);box-shadow:var(--shadow);backdrop-filter:blur(14px)}
.hud{min-height:78px;display:grid;grid-template-columns:1.4fr 1fr auto;gap:16px;align-items:center;padding:11px 16px;background:linear-gradient(90deg,rgba(3,10,14,.94),rgba(6,18,14,.93));border-bottom:1px solid rgba(74,255,139,.08)}
.label{display:block;font-size:.6rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--soft)}.hud-story strong{font:1.08rem Georgia,serif;color:var(--teal);display:inline-block;margin:2px 0}.hud-story p{color:#b0c4b8;font-size:.75rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:420px}
.res-grid{display:flex;gap:10px;flex-wrap:wrap}.res{display:flex;align-items:center;gap:3px;padding:3px 7px;background:rgba(0,0,0,.2);border-radius:7px;font-size:.76rem;border:1px solid rgba(255,255,255,.04)}.res b{color:var(--gold)}
.speed-ctrl{display:flex;align-items:center;gap:5px}.stability{font-size:.7rem;color:var(--soft);margin-left:6px}.stability b{color:var(--teal)}
.viewport{position:relative;aspect-ratio:16/8.2;min-height:460px;background:#060d10;overflow:hidden}
canvas{display:block;width:100%;height:100%;touch-action:none}
.overlay{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);border:1px solid rgba(74,255,139,.2);border-radius:var(--rad);background:rgba(4,10,16,.96);box-shadow:0 24px 80px rgba(0,0,0,.55);backdrop-filter:blur(14px)}.overlay[hidden]{display:none}
.start,.finale{width:min(540px,calc(100% - 32px));padding:30px}.start h2,.finale h2{font:1.8rem Georgia,serif;color:var(--teal);margin-bottom:8px}.start>p:not(.eyebrow),.finale>p:not(.eyebrow){color:var(--soft);line-height:1.55;margin-bottom:7px;font-size:.9rem}
.finale{border-color:rgba(74,255,139,.35);box-shadow:0 24px 90px rgba(0,0,0,.58),0 0 60px rgba(74,255,139,.06)}
button{font:inherit;font-weight:800;border-radius:999px;padding:11px 16px;cursor:pointer;border:1px solid transparent;transition:all .14s}button:hover{transform:translateY(-1px)}
.primary{background:var(--gold);color:#102030}.secondary{background:rgba(255,255,255,.035);color:var(--paper);border-color:var(--line)}.small{font-size:.76rem;padding:7px 12px}
.actions{display:flex;gap:8px;margin-top:20px;flex-wrap:wrap}
.toast{position:absolute;bottom:55px;left:50%;transform:translateX(-50%) translateY(5px);padding:9px 16px;border-radius:999px;background:rgba(4,10,16,.95);border:1px solid rgba(74,255,139,.28);max-width:88vw;text-align:center;opacity:0;transition:opacity .2s,transform .2s;color:var(--paper);pointer-events:none;font-size:.8rem;z-index:100}.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.tutorial-box{position:absolute;left:16px;top:12px;width:min(320px,calc(100% - 32px));padding:14px 16px;border-radius:14px;border:1px solid rgba(255,217,61,.25);background:rgba(4,8,16,.95);z-index:90;box-shadow:0 12px 40px rgba(0,0,0,.4)}.tutorial-box[hidden]{display:none}.tutorial-box strong{display:block;color:var(--gold);font-size:.78rem;margin-bottom:6px;text-transform:uppercase;letter-spacing:.1em}.tutorial-box p{color:var(--paper);font-size:.82rem;line-height:1.45;margin-bottom:10px}.tutorial-box button{margin-top:2px}
.help-panel{position:absolute;right:16px;top:12px;width:min(340px,calc(100% - 32px));max-height:calc(100% - 24px);overflow-y:auto;padding:16px 18px;border-radius:14px;border:1px solid rgba(74,255,139,.25);background:rgba(4,10,16,.96);z-index:90;box-shadow:0 12px 40px rgba(0,0,0,.45)}.help-panel[hidden]{display:none}.help-panel h3{color:var(--teal);font-size:.88rem;margin:12px 0 6px;border-bottom:1px solid rgba(74,255,139,.12);padding-bottom:4px}.help-panel h3:first-child{margin-top:0}.help-panel p{color:var(--paper);font-size:.78rem;line-height:1.4;margin-bottom:6px}.help-panel ul,.help-panel ol{color:var(--soft);font-size:.74rem;line-height:1.5;margin:4px 0 8px 18px}.help-panel li{margin-bottom:4px}.help-panel b{color:var(--gold)}
.build-bar{display:flex;flex-wrap:wrap;gap:5px;padding:9px 12px;background:rgba(2,8,12,.9);border-top:1px solid rgba(74,255,139,.10);align-items:center}
.bbtn{padding:6px 10px;border-radius:9px;border:1px solid var(--line);background:rgba(255,255,255,.03);color:var(--paper);font-size:.72rem;cursor:pointer;white-space:nowrap;transition:all .1s}.bbtn:hover{background:rgba(255,255,255,.07);transform:translateY(-1px)}.bb-node{border-color:rgba(77,150,255,.25)}.bb-edge{border-color:rgba(200,170,100,.25)}.bb-lock{opacity:.35;cursor:not-allowed}.bb-cancel{border-color:rgba(255,107,107,.25);color:#ff6b6b}.bb-budget{background:rgba(255,217,61,.08);border-color:rgba(255,217,61,.25);color:var(--gold);font-weight:900;font-size:.8rem;padding:6px 10px;border-radius:9px}
.touch-controls{display:none;padding:9px 10px;gap:7px;background:rgba(2,8,12,.9);border-top:1px solid rgba(74,255,139,.08)}.touch-actions{display:grid;grid-template-columns:1fr 1fr 1fr 1fr;gap:6px}.touch-action{min-height:42px;padding:7px 5px;color:var(--paper);font-size:.72rem;border-color:rgba(74,255,139,.14);background:rgba(74,255,139,.05);border-radius:10px;-webkit-tap-highlight-color:transparent}.touch-action:active{background:rgba(74,255,139,.13);transform:scale(.95)}.primary-action{grid-column:1/-1;color:#102030;background:var(--gold)}.primary-action:active{background:#ffe46a}
.underbar{padding:11px 14px;display:flex;align-items:center;justify-content:space-between;gap:14px;background:rgba(2,8,12,.8);border-top:1px solid rgba(74,255,139,.08)}.controls{display:flex;flex-wrap:wrap;gap:6px 12px;color:var(--soft);font-size:.7rem}.controls kbd{font:inherit;font-weight:800;padding:2px 5px;border-radius:5px;color:var(--paper);border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.05);margin-right:2px;font-size:.68rem}
@media(max-width:900px){.intro{display:block}.legend{margin-top:14px}.hud{grid-template-columns:1fr;gap:9px}.res-grid{justify-content:flex-start}.speed-ctrl{justify-content:flex-start}.viewport{min-height:400px;aspect-ratio:1/.82}.underbar{flex-direction:column;align-items:stretch}}
@media(hover:none),(pointer:coarse),(max-width:760px){.touch-controls{display:flex}.underbar .controls{display:none}.underbar{padding:7px 10px}.underbar button{align-self:flex-end;padding:6px 11px;font-size:.68rem}}
@media(max-width:440px){.touch-actions{grid-template-columns:1fr 1fr}.touch-action{min-height:40px;font-size:.68rem}.start,.finale{padding:20px}.build-bar{padding:7px 8px;gap:4px}.bbtn{padding:5px 8px;font-size:.68rem}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}