:root{--ink:#e9f2de;--muted:#91a192;--green:#a9ff78;--green2:#58ee83;--amber:#ffc45d;--danger:#ff785e;--panel:rgba(6,15,10,.82);--line:rgba(192,226,183,.18);--shadow:0 20px 70px rgba(0,0,0,.55)}*{box-sizing:border-box}html,body,#app,.game-shell{width:100%;height:100%;margin:0;overflow:hidden}html{background:#020805}body{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#020805;color:var(--ink);user-select:none;-webkit-user-select:none;touch-action:none}.world{position:absolute;inset:0;background:#061008}.world canvas{display:block;width:100%;height:100%}.game-shell{position:relative;isolation:isolate;background:radial-gradient(circle at 50% 45%,#0d2415,#020704 72%)}button,select,input{font:inherit}.hidden{display:none!important}.boot-screen{position:fixed;inset:0;z-index:1000;display:grid;place-content:center;gap:10px;text-align:center;background:radial-gradient(circle at 50% 42%,#17351e 0,#07110a 35%,#020604 75%);transition:opacity .55s,visibility .55s}.boot-screen.ready{opacity:0;visibility:hidden;pointer-events:none}.boot-screen strong{font-size:clamp(30px,6vw,62px);letter-spacing:.18em}.boot-screen small{letter-spacing:.35em;color:#99b28f;font-size:10px}.boot-mark{width:68px;height:68px;margin:auto;border-radius:50%;border:1px solid rgba(176,255,130,.25);box-shadow:0 0 50px rgba(102,255,126,.18);display:grid;place-items:center}.boot-mark span{width:24px;height:20px;border-radius:50% 50% 35% 35%;background:#9eff7a;box-shadow:0 0 24px #69ff79;position:relative}.boot-mark span:after{content:"";position:absolute;left:9px;top:15px;width:6px;height:20px;border-radius:4px;background:#d9e9c2}.cinematic-vignette{position:absolute;inset:0;pointer-events:none;z-index:4;background:radial-gradient(ellipse at center,transparent 35%,rgba(0,0,0,.12) 62%,rgba(0,0,0,.62) 120%),linear-gradient(to bottom,rgba(0,0,0,.35),transparent 17%,transparent 76%,rgba(0,0,0,.48))}.grain{position:absolute;inset:-30%;z-index:5;pointer-events:none;opacity:.045;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='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.72'/%3E%3C/svg%3E");animation:grain 9s steps(9) infinite}@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-3%,2%)}40%{transform:translate(2%,-4%)}60%{transform:translate(4%,4%)}80%{transform:translate(-4%,-2%)}100%{transform:translate(0,0)}}.damage-flash{position:absolute;inset:0;pointer-events:none;z-index:30;opacity:0;background:radial-gradient(circle,transparent 44%,rgba(255,41,28,.68));transition:opacity .15s}.game-shell.damage .damage-flash{opacity:.72}.hud-top{position:absolute;left:0;right:0;top:0;z-index:20;display:grid;grid-template-columns:1fr auto 1fr;align-items:start;padding:18px 22px;pointer-events:none}.brand{display:flex;align-items:center;gap:11px;text-shadow:0 2px 16px #000}.brand strong{display:block;font-size:15px;letter-spacing:.18em}.brand small{display:block;margin-top:3px;font-size:8px;letter-spacing:.25em;color:#9cab9a}.brand-mark{width:34px;height:34px;position:relative}.brand-mark span{position:absolute;left:3px;right:3px;top:5px;height:15px;border-radius:50% 50% 35% 35%;background:linear-gradient(#9aff76,#39894d);box-shadow:0 0 18px rgba(109,255,119,.45)}.brand-mark i{position:absolute;width:7px;height:16px;background:#d7e6bf;left:14px;top:17px;border-radius:5px}.hud-stats{display:flex;gap:7px;padding:5px;border-radius:16px;background:rgba(4,11,7,.52);backdrop-filter:blur(12px);border:1px solid var(--line);box-shadow:0 12px 40px rgba(0,0,0,.25)}.stat{min-width:82px;padding:7px 12px;text-align:center;border-right:1px solid rgba(255,255,255,.07)}.stat:last-child{border:0}.stat span{display:block;font-size:7px;letter-spacing:.23em;color:#869889}.stat b{font-size:17px;color:#f4f9ef}.hud-actions{justify-self:end;display:flex;gap:7px;pointer-events:auto}.hud-btn{border:1px solid var(--line);background:rgba(6,16,10,.62);backdrop-filter:blur(10px);color:#dce9d5;border-radius:9px;padding:8px 11px;font-size:9px;letter-spacing:.08em;text-transform:uppercase;cursor:pointer}.hud-btn:hover{border-color:rgba(158,255,122,.42);background:rgba(20,48,28,.72)}.status-stack{position:absolute;z-index:20;top:82px;left:22px;width:min(335px,42vw);display:grid;gap:7px}.status-row{display:grid;grid-template-columns:110px 1fr 40px;align-items:center;gap:8px;font-size:8px;letter-spacing:.12em;text-shadow:0 1px 7px #000}.status-row>span{display:flex;align-items:center;gap:5px}.status-glyph{font-style:normal;color:var(--green)}.bar-track{height:8px;border-radius:9px;overflow:hidden;background:rgba(0,0,0,.56);border:1px solid rgba(255,255,255,.11);box-shadow:inset 0 1px 5px #000}.bar-fill{height:100%;width:100%;border-radius:inherit;transition:width .25s;box-shadow:0 0 12px currentColor}.bar-fill.base{background:linear-gradient(90deg,#63cf6d,#c8ff7e);color:#89ff79}.bar-fill.player{background:linear-gradient(90deg,#65bcd6,#7df1c3);color:#7deac8}.boss-hud{position:absolute;z-index:21;top:92px;left:50%;transform:translateX(-50%);width:min(620px,62vw);text-align:center}.boss-hud span{font-size:9px;letter-spacing:.28em;color:#ffe0b7;text-shadow:0 2px 9px #000}.boss-track{height:11px;margin-top:7px;border:1px solid rgba(255,186,123,.25);background:rgba(0,0,0,.6);border-radius:20px;overflow:hidden}.boss-fill{height:100%;width:100%;background:linear-gradient(90deg,#a73e28,#ff8b4d,#ffd36e);box-shadow:0 0 20px rgba(255,98,48,.55);transition:width .18s}.crosshair{position:absolute;z-index:18;left:50%;top:50%;width:42px;height:42px;transform:translate(-50%,-50%);pointer-events:none;filter:drop-shadow(0 1px 3px #000)}.crosshair i{position:absolute;background:#e7ffd7;border-radius:2px;box-shadow:0 0 7px rgba(174,255,151,.8);transition:.12s}.crosshair i:nth-child(1){width:1px;height:10px;left:20px;top:0}.crosshair i:nth-child(2){width:1px;height:10px;left:20px;bottom:0}.crosshair i:nth-child(3){height:1px;width:10px;top:20px;left:0}.crosshair i:nth-child(4){height:1px;width:10px;top:20px;right:0}.crosshair span{position:absolute;width:4px;height:4px;border:1px solid #e7ffd7;border-radius:50%;left:19px;top:19px}.crosshair.target-lock i,.crosshair.target-lock span{background:#ffcf69;border-color:#ffcf69;box-shadow:0 0 8px #ff964a}.precision-active .crosshair{transform:translate(-50%,-50%) scale(.8)}.wave-banner{position:absolute;z-index:26;left:50%;top:29%;transform:translateX(-50%);font-weight:800;font-size:clamp(18px,3vw,35px);letter-spacing:.18em;text-transform:uppercase;text-shadow:0 5px 22px #000,0 0 28px rgba(116,255,129,.25);opacity:0;transition:opacity .25s;white-space:nowrap}.wave-banner.show{opacity:1}.toast{position:absolute;z-index:26;left:50%;bottom:112px;transform:translateX(-50%);padding:9px 14px;border-radius:20px;background:rgba(4,12,7,.75);border:1px solid var(--line);font-size:10px;letter-spacing:.06em;backdrop-filter:blur(12px);opacity:0;transition:.25s}.toast.show{opacity:1}.weapon-hud{position:absolute;z-index:20;left:22px;bottom:20px;display:flex;align-items:end;gap:14px;pointer-events:none}.weapon-core{padding:10px 13px 9px;border-left:2px solid rgba(142,255,115,.6);background:linear-gradient(90deg,rgba(3,12,6,.66),transparent);text-shadow:0 2px 7px #000}.weapon-core .eyebrow{display:block;font-size:7px;letter-spacing:.23em;color:#a6b6a5}.weapon-core strong{display:block;margin-top:2px;font-size:15px;letter-spacing:.04em}.weapon-core small{font-size:8px;color:#aebca9}.perk-row{display:flex;flex-wrap:wrap;max-width:360px;gap:4px}.perk-row span{font-size:7px;letter-spacing:.06em;padding:5px 7px;border:1px solid rgba(154,255,120,.22);border-radius:12px;background:rgba(9,30,15,.62);color:#bceab0}.desktop-help{position:absolute;z-index:16;right:22px;bottom:20px;color:rgba(223,238,218,.58);font-size:8px;letter-spacing:.07em;text-shadow:0 1px 4px #000}.orientation-hint{display:none}.modal{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:22px;background:rgba(0,5,2,.64);backdrop-filter:blur(8px)}.modal-card{width:min(940px,94vw);max-height:92vh;overflow:auto;border:1px solid rgba(180,225,169,.19);border-radius:20px;background:linear-gradient(145deg,rgba(11,25,15,.97),rgba(4,10,7,.97));box-shadow:var(--shadow);padding:32px}.modal-card .eyebrow{font-size:9px;letter-spacing:.28em;color:#a9c29f}.modal-card h1,.modal-card h2{margin:9px 0 12px;line-height:1.02}.modal-card h1{font-size:clamp(33px,5.6vw,68px);letter-spacing:-.045em}.modal-card h1 em{font-style:normal;color:#9eff78}.modal-card h2{font-size:32px}.modal-card p{color:#aebbad;line-height:1.55;font-size:13px}.hero-card{position:relative;overflow:hidden;width:min(1180px,96vw);min-height:min(690px,89vh);display:grid;grid-template-columns:1.05fr .95fr;align-items:center;background:linear-gradient(90deg,rgba(4,12,7,.98) 0,rgba(4,12,7,.9) 45%,rgba(4,12,7,.18) 75%,rgba(4,12,7,.34)),url('assets/concept/04_World_UI_ArtBible/The_Colony_Clearing_Arena_Concept.png') center/cover}.hero-card:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 74% 44%,rgba(132,255,98,.12),transparent 30%);pointer-events:none}.hero-copy{position:relative;z-index:3;max-width:650px}.hero-art{position:absolute;right:-1%;bottom:-5%;width:50%;height:90%;z-index:2;background:url('assets/sprites/hero_angle_01.png') center bottom/contain no-repeat;filter:drop-shadow(0 26px 35px rgba(0,0,0,.62))}.feature-chips{display:flex;gap:7px;flex-wrap:wrap;margin:17px 0 22px}.feature-chips span{font-size:7px;letter-spacing:.14em;border:1px solid rgba(162,255,126,.22);background:rgba(17,45,24,.48);padding:6px 8px;border-radius:20px;color:#bde9b0}.control-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:13px 0 22px}.control-grid>div{padding:11px;border:1px solid rgba(255,255,255,.09);border-radius:11px;background:rgba(0,0,0,.2)}.control-grid b{display:block;font-size:9px;letter-spacing:.13em;color:#d8ead1}.control-grid span{display:block;margin-top:5px;color:#8fa08f;font-size:9px;line-height:1.45}.modal-actions{display:flex;gap:9px;flex-wrap:wrap}.modal-actions.center{justify-content:center}.modal-actions button,.upgrade-option{cursor:pointer}.primary,.secondary{border-radius:11px;padding:12px 16px;font-weight:700;font-size:10px;letter-spacing:.12em;text-transform:uppercase}.primary{border:1px solid #8cf171;background:linear-gradient(#aaff78,#68cc64);color:#0b1b0d;box-shadow:0 0 28px rgba(130,255,116,.18)}.secondary{border:1px solid rgba(196,227,185,.22);background:rgba(7,17,10,.72);color:#dce8d6}.settings-card{width:min(670px,92vw)}.settings-grid{display:grid;gap:16px}.sensitivity-control,.select-control,.toggle-control{display:grid;gap:9px;padding:14px;border:1px solid rgba(255,255,255,.08);border-radius:12px;background:rgba(0,0,0,.16)}.sensitivity-control>span,.select-control>span,.toggle-control{display:flex;align-items:center;justify-content:space-between}.sensitivity-control b,.select-control b,.toggle-control b{font-size:9px;letter-spacing:.12em}.sensitivity-control strong{color:#b5ff8f}.sensitivity-control small,.select-control small,.toggle-control small{color:#7f9081;font-size:9px}.sensitivity-control input{accent-color:#8eff74}.select-control select{width:100%;padding:10px;border-radius:9px;border:1px solid rgba(255,255,255,.12);background:#07120b;color:#e8f2e3}.toggle-control input{width:20px;height:20px;accent-color:#8eff74}.upgrade-card{width:min(1050px,95vw);text-align:center}.upgrade-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:20px}.upgrade-option{min-height:220px;text-align:left;border:1px solid rgba(190,226,177,.14);border-radius:15px;background:linear-gradient(145deg,rgba(18,39,23,.86),rgba(5,13,8,.9));color:#e6f0e1;padding:18px;transition:transform .16s,border-color .16s,box-shadow .16s}.upgrade-option:hover{transform:translateY(-5px);border-color:rgba(158,255,120,.45);box-shadow:0 18px 40px rgba(0,0,0,.33)}.upgrade-option .icon{font-size:34px;color:#a4ff78}.upgrade-option .rarity{display:block;font-size:7px;letter-spacing:.2em;color:#d6b96e;margin-top:10px}.upgrade-option strong{display:block;font-size:17px;margin-top:5px}.upgrade-option p{font-size:11px;margin-bottom:0}.danger{color:#ff8b6d!important}.gameover-card{max-width:590px;text-align:center}.mobile-controls{display:none}
@media(max-width:850px){.brand small,.desktop-help{display:none}.hud-top{padding:10px 11px;grid-template-columns:auto 1fr auto}.hud-stats{justify-self:center}.stat{min-width:57px;padding:6px}.hud-actions .hud-btn:first-child{display:none}.hud-btn{padding:7px 8px;font-size:7px}.status-stack{top:62px;left:10px;width:270px}.hero-card{grid-template-columns:1fr;min-height:84vh;padding:24px;background-position:55% center}.hero-copy{max-width:72%}.hero-art{width:55%;height:76%;right:-6%}.hero-card h1{font-size:clamp(34px,8vw,56px)}.upgrade-grid{grid-template-columns:1fr}.modal-card{padding:23px}.control-grid{grid-template-columns:1fr}.weapon-hud{left:10px;bottom:12px}.perk-row{display:none}}
@media(pointer:coarse){.desktop-help{display:none}.mobile-controls{display:block;position:absolute;inset:0;z-index:23;pointer-events:none}.move-zone{position:absolute;left:max(18px,env(safe-area-inset-left));bottom:max(20px,env(safe-area-inset-bottom));width:132px;height:132px;pointer-events:auto}.stick-ring{position:absolute;left:8px;bottom:15px;width:90px;height:90px;border-radius:50%;border:1px solid rgba(230,255,225,.2);background:radial-gradient(circle,rgba(138,255,123,.11),rgba(3,12,6,.3));backdrop-filter:blur(3px)}.stick-knob{position:absolute;width:39px;height:39px;left:25px;top:25px;border-radius:50%;background:rgba(199,255,183,.3);border:1px solid rgba(227,255,217,.44);box-shadow:0 0 22px rgba(105,255,111,.15)}.stick-zone>span{position:absolute;bottom:0;left:36px;font-size:7px;letter-spacing:.18em;color:#92a791}.look-zone{position:absolute;right:0;top:20%;width:58%;height:62%;pointer-events:auto}.look-zone span{display:none}.fire-btn,.dash-btn{position:absolute;right:max(19px,env(safe-area-inset-right));border-radius:50%;pointer-events:auto;color:#eaffdf;background:rgba(8,25,12,.46);border:1px solid rgba(191,255,177,.26);backdrop-filter:blur(5px)}.fire-btn{width:82px;height:82px;bottom:max(28px,env(safe-area-inset-bottom));}.dash-btn{width:57px;height:57px;bottom:max(120px,calc(env(safe-area-inset-bottom) + 112px));right:max(32px,calc(env(safe-area-inset-right) + 12px))}.fire-btn b,.dash-btn b{display:block;font-size:25px}.fire-btn span,.dash-btn span{font-size:7px;letter-spacing:.1em}.weapon-hud{bottom:8px;left:50%;transform:translateX(-50%)}.weapon-core{display:none}.hud-actions #fullscreenBtn{display:none}.crosshair{width:34px;height:34px}.crosshair i:nth-child(1),.crosshair i:nth-child(2){left:16px;height:8px}.crosshair i:nth-child(3),.crosshair i:nth-child(4){top:16px;width:8px}.crosshair span{left:15px;top:15px}.hero-copy{max-width:100%;padding-right:34%}.hero-card p{font-size:11px}.feature-chips{display:none}}
@media(max-height:520px) and (orientation:landscape){.hud-top{padding:7px 10px}.status-stack{top:48px}.hero-card{min-height:96vh}.hero-card h1{font-size:36px;margin:5px 0}.hero-card p{font-size:10px}.control-grid{margin:8px 0}.modal-card{padding:18px}.weapon-hud{bottom:5px}.move-zone{bottom:2px}.fire-btn{bottom:8px}.dash-btn{bottom:93px}.upgrade-option{min-height:160px;padding:12px}}
@media(orientation:portrait) and (pointer:coarse){.orientation-hint{display:block;position:absolute;z-index:60;left:50%;bottom:10px;transform:translateX(-50%);font-size:8px;letter-spacing:.09em;color:#aec1aa;background:rgba(0,0,0,.52);padding:7px 11px;border-radius:20px}.hero-copy{padding-right:0}.hero-art{opacity:.36;width:85%;right:-30%}}
@media(prefers-reduced-motion:reduce){.grain{animation:none}.upgrade-option{transition:none}}