:root{--sky:#a8dcf7;--ink:#1d2a33;--panel:#fffffff0;--green:#62d96b;--red:#ff5f52;--amber:#ffc53d;--blue:#5bb5ff;--orange:#ff8a3d;--shadow:0 3px 0 #00000040;--title:"Lilita One", "Arial Black", system-ui, sans-serif;--text:"Nunito", system-ui, sans-serif}*{box-sizing:border-box}html,body{background:var(--sky);height:100%;color:var(--ink);font-family:var(--text);-webkit-user-select:none;user-select:none;margin:0;overflow:hidden}#app,canvas{width:100%;height:100%;display:block;position:fixed;inset:0}canvas{z-index:0}#hud{z-index:10}#screens{z-index:20}.fatal{z-index:30}kbd{min-width:1.6em;font:800 12px var(--text);text-align:center;color:var(--ink);background:#eef3f6;border:1px solid #c9d3da;border-bottom-width:3px;border-radius:5px;margin-right:3px;padding:1px 6px;display:inline-block}#hud{pointer-events:none;opacity:0;color:#fff;text-shadow:0 2px #00000059;transition:opacity .3s;position:fixed;inset:0}#hud.visible{opacity:1}#hud .top{top:max(14px, env(safe-area-inset-top));left:max(16px, env(safe-area-inset-left));right:max(16px, env(safe-area-inset-right));justify-content:space-between;align-items:flex-start;gap:12px;display:flex;position:absolute}.hp{font-family:var(--title);align-items:center;gap:10px;font-size:26px;display:flex}.hp .label{letter-spacing:1px;opacity:.9;font-size:16px}.hp .bar{background:#141e2873;border:2px solid #fffc;border-radius:9px;width:clamp(110px,20vw,240px);height:16px;overflow:hidden}.hp .bar i{background:var(--green);width:100%;height:100%;transition:width .25s;display:block}.hp.enemy .bar i{background:var(--red);margin-left:auto}.hp b{text-align:center;min-width:2.2em}.hp.low b{color:var(--amber);animation:.6s infinite alternate pulse}.mid{text-align:center}.rounds{align-items:center;gap:12px;display:flex}.timer{font-family:var(--title);min-width:3.2em;font-size:34px}.pips{gap:5px;display:flex}.pips i{background:#00000040;border:2px solid #fff;border-radius:50%;width:14px;height:14px}.pips.p i.on{background:var(--green)}.pips.e i.on{background:var(--red)}.phase{letter-spacing:2px;opacity:.85;font-size:12px;font-weight:800}.crosshair{--gap:6px;position:absolute;top:50%;left:50%}.crosshair i{background:#fff;transition:transform 80ms;position:absolute;box-shadow:0 0 0 1px #00000073}.crosshair i:first-child,.crosshair i:nth-child(2){width:2px;height:9px;left:-1px}.crosshair i:nth-child(3),.crosshair i:nth-child(4){width:9px;height:2px;top:-1px}.crosshair i:first-child{top:calc(-9px - var(--gap))}.crosshair i:nth-child(2){top:var(--gap)}.crosshair i:nth-child(3){left:calc(-9px - var(--gap))}.crosshair i:nth-child(4){left:var(--gap)}.crosshair em{background:#fff;border-radius:50%;width:4px;height:4px;position:absolute;top:-2px;left:-2px;box-shadow:0 0 0 1px #00000080}.crosshair.blocked i,.crosshair.blocked em{background:var(--red)}.crosshair.blocked i:first-child,.crosshair.blocked i:nth-child(2),.crosshair.blocked i:nth-child(3),.crosshair.blocked i:nth-child(4){transform:rotate(45deg)}.crosshair:after{content:"";opacity:0;border:3px solid #fff;border-radius:50%;width:28px;height:28px;position:absolute;top:-14px;left:-14px;transform:scale(1.6)}.crosshair.hit:after{animation:.25s ease-out hitmark}.crosshair.head:after{border-color:var(--orange)}.crosshair.scoped i{opacity:0}.scope{opacity:0;background:linear-gradient(#111,#111) 50%/100% 1px no-repeat,linear-gradient(#111,#111) 50%/1px 100% no-repeat,radial-gradient(circle,#0000 0 34vmin,#080a0cf5 calc(34vmin + 2px));transition:opacity 80ms;position:absolute;inset:0}.scope.on{opacity:1}.ring{width:0;height:0;position:absolute;top:50%;left:50%}.ping{transform-origin:50% 100%;width:90px;height:150px;position:absolute;top:-150px;left:-45px}.ping:before{content:"";filter:drop-shadow(0 1px 1px #00000080);border-top:5px solid #fff;border-radius:50% 50% 0 0/100% 100% 0 0;height:18px;position:absolute;top:0;left:0;right:0}.ping.step:before{border-color:#ffffffe6}.ping.shot:before{border-color:var(--orange);border-top-width:7px}.ping.reload:before{border-color:var(--amber);border-top-style:dashed}.ping.damage{width:140px;height:175px;top:-175px;left:-70px}.ping.damage:before{border-color:var(--red);border-top-width:9px}.damage-vignette{opacity:0;background:radial-gradient(#0000 55%,#ff281e8c);position:absolute;inset:0}.damage-vignette.show{animation:.6s ease-out fadeout}.letterbox div{background:#000;height:9vh;transition:transform .25s ease-out;position:absolute;left:0;right:0}.letterbox div:first-child{top:0;transform:translateY(-100%)}.letterbox div:nth-child(2){bottom:0;transform:translateY(100%)}.letterbox span{letter-spacing:2px;opacity:0;font-size:12px;font-weight:800;transition:opacity .2s;position:absolute;bottom:3vh;right:24px}#hud.cinematic .letterbox div{transform:none}#hud.cinematic .letterbox span{opacity:.8}#hud.cinematic .crosshair,#hud.cinematic .weapon,#hud.cinematic .stance{opacity:0}.banner{text-align:center;opacity:0;position:absolute;top:24%;left:0;right:0}.banner h1{font-family:var(--title);letter-spacing:2px;-webkit-text-stroke:2px #00000040;text-shadow:0 5px #0000004d;margin:0;font-size:clamp(44px,9vw,96px);font-weight:400}.banner p{margin:4px 0 0;font-size:18px;font-weight:800}.banner.show{animation:.35s cubic-bezier(.2,1.6,.4,1) forwards pop}.stance{left:max(16px, env(safe-area-inset-left));bottom:max(16px, env(safe-area-inset-bottom));flex-direction:column;gap:6px;max-width:44vw;display:flex;position:absolute}.stance .state{font-family:var(--title);background:#0000004d;border-radius:8px;align-self:flex-start;padding:2px 12px;font-size:20px;transition:background .15s}.stance .state.hidden{background:#2e9e4f}.stance .state.covered{background:#3c7fc2}.stance .state.partly{background:#d08a0f}.stance .state.exposed{background:#d63a2f;animation:.5s infinite alternate pulse}.expose{background:#0000004d;border-radius:3px;width:180px;height:6px;overflow:hidden}.expose i{background:var(--red);width:0;height:100%;transition:width .15s;display:block}.stance .hint{opacity:.9;font-size:13px;font-weight:800}.weapon{right:max(16px, env(safe-area-inset-right));bottom:max(16px, env(safe-area-inset-bottom));text-align:right;position:absolute}.slots{justify-content:flex-end;gap:6px;margin-bottom:6px;display:flex}.slots span{letter-spacing:1px;opacity:.75;background:#00000047;border-radius:7px;padding:3px 8px 3px 4px;font-size:11px;font-weight:800}.slots span kbd{min-width:0;padding:0 4px;font-size:10px}.slots span.active{color:var(--ink);text-shadow:none;opacity:1;background:#fffffff2}.slots span.dry{opacity:.4;text-decoration:line-through}.weapon .name{font-family:var(--title);letter-spacing:1px;font-size:22px}.weapon .ammo b{font-family:var(--title);font-size:48px;font-weight:400;line-height:1}.weapon .ammo span{font-family:var(--title);opacity:.8;margin-left:4px;font-size:22px}.weapon.empty .ammo b{color:var(--red)}.weapon .reload{opacity:0;background:#0000004d;border-radius:3px;width:150px;height:6px;margin:6px 0 0 auto;overflow:hidden}.weapon .reload.on{opacity:1}.weapon .reload i{background:var(--amber);height:100%;display:block}#screens{overscroll-behavior:contain;background:linear-gradient(#143c5a59,#0a1e2d99);justify-content:center;align-items:flex-start;padding:16px;display:none;position:fixed;inset:0;overflow-y:auto}#screens.visible{display:flex}.screen{flex-direction:column;align-items:center;gap:10px;width:100%;max-width:560px;margin:auto;display:flex}.title{font-family:var(--title);color:#fff;letter-spacing:2px;text-shadow:0 6px #e0642b,0 10px 18px #0000004d;margin:0;font-size:clamp(52px,11vw,96px);font-weight:400;line-height:1}.title.win{text-shadow:0 6px #2e9e4f,0 10px 18px #0000004d}.title.lose{text-shadow:0 6px #b73328,0 10px 18px #0000004d}.screen h2{font-family:var(--title);color:#fff;text-shadow:var(--shadow);margin:0;font-size:56px;font-weight:400}.subtitle{color:#fff;text-shadow:0 2px #0000004d;margin:0 0 6px;font-size:18px;font-weight:800}.muted{color:#fff;font-weight:800}.error{color:#fff;background:#d63a2f;border-radius:10px;padding:10px 16px;font-weight:800}.panel{background:var(--panel);border-radius:18px;flex-direction:column;gap:12px;width:100%;padding:20px;display:flex;box-shadow:0 8px #00000026,0 20px 40px #00000040}.panel button{font:400 22px var(--title);letter-spacing:1px;cursor:pointer;color:var(--ink);background:#e4ebf0;border:none;border-radius:12px;padding:12px;transition:transform 60ms,box-shadow 60ms;box-shadow:0 4px #c3cdd4}.panel button:hover{filter:brightness(1.05)}.panel button:active{transform:translateY(3px);box-shadow:0 1px #c3cdd4}.panel button.primary{color:#fff;background:#ff8a3d;font-size:28px;box-shadow:0 4px #c75d1c}.panel button.primary:active{box-shadow:0 1px #c75d1c}.difficulty{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.difficulty button{padding:8px;font-size:17px}.difficulty button.selected{background:var(--blue);color:#fff;box-shadow:0 4px #2f7fc4}.controls{grid-template-columns:1fr 1fr;gap:6px 14px;font-size:13px;font-weight:600;display:grid}.tips{background:#fff7df;border-radius:10px;padding:10px 12px;font-size:13px;font-weight:600;line-height:1.45}.tips b{font-family:var(--title);margin-bottom:2px;font-size:16px;font-weight:400;display:block}.credits{color:#fff;opacity:.9;margin:0;font-size:12px;font-weight:800}.credits a{color:#fff}.loadbar{background:#0000004d;border:2px solid #fff;border-radius:7px;width:min(360px,80vw);height:14px;overflow:hidden}.loadbar i{background:var(--orange);height:100%;transition:width .2s;display:block}.stats{border-collapse:collapse;width:100%;font-weight:800}.stats td{border-bottom:1px solid #e3e9ee;padding:6px 4px}.stats td:last-child{text-align:right;font-family:var(--title);font-size:20px;font-weight:400}.fatal{color:#fff;background:#d63a2f;border-radius:12px;padding:16px 20px;font-weight:800;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}@keyframes pulse{0%{opacity:1}to{opacity:.55}}@keyframes pop{0%{opacity:0;transform:scale(.6)}to{opacity:1;transform:scale(1)}}@keyframes fadeout{0%{opacity:1}to{opacity:0}}@keyframes hitmark{0%{opacity:1;transform:scale(.7)}to{opacity:0;transform:scale(1.4)}}@media (width<=700px){.hp{font-size:18px}.hp .label{display:none}.timer{font-size:24px}.controls{grid-template-columns:1fr}.weapon .ammo b{font-size:34px}.stance .hint{display:none}}.screen.levelselect,.screen.settings-screen{max-width:980px}.panel.narrow{max-width:560px}.panel.wide{max-width:980px}.screen h2{font-size:clamp(36px,7vw,56px)}.hint{color:#5a6670;margin:0;font-size:12.5px;font-weight:600}.buttons{gap:10px;display:flex}.buttons button{flex:1}.levels{grid-template-columns:repeat(auto-fill,minmax(min(280px,100%),1fr));gap:10px;width:100%;display:grid}.card{text-align:left;cursor:pointer;color:#fff;min-height:92px;font-family:var(--text);background:linear-gradient(135deg, var(--a), var(--b));text-shadow:0 1px 2px #00000073;border:3px solid #0000;border-radius:14px;flex-direction:column;gap:2px;padding:12px 14px 12px 50px;transition:transform 80ms;display:flex;position:relative;box-shadow:0 4px #0003}.card:hover{transform:translateY(-2px)}.card.selected{box-shadow:0 0 0 3px var(--orange), 0 4px 0 #0003;border-color:#fff}.card .num{width:28px;height:28px;font:400 16px var(--title);background:#0000004d;border-radius:50%;place-items:center;display:grid;position:absolute;top:12px;left:12px}.card b{font:400 21px var(--title);letter-spacing:.5px}.card small{opacity:.95;font-size:12.5px;font-weight:700}.card .tags{letter-spacing:1px;text-transform:uppercase;opacity:.9;margin-top:auto;font-size:11px;font-weight:800}.options .row,.settings .row{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.options label,.settings .row label{font:400 17px var(--title);min-width:92px}.chips{flex-wrap:wrap;gap:6px;display:flex}.panel .chips button{font:800 13px var(--text);border-radius:20px;padding:6px 11px;box-shadow:0 2px #c3cdd4}.panel .chips button.selected{background:var(--blue);color:#fff;box-shadow:0 2px #2f7fc4}.presets{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.panel .presets button{padding:9px 14px;font-size:17px}.panel .presets button.selected{background:var(--blue);color:#fff;box-shadow:0 4px #2f7fc4}.presets .custom{color:#8a96a0;border:2px dashed #c3cdd4;border-radius:12px;padding:4px 10px;font-size:13px;font-weight:800}.presets .custom.on{color:#fff;background:var(--orange);border-color:var(--orange)}.binds{border-collapse:collapse;width:100%;font-size:14px;font-weight:700}.binds tr.group th{text-align:left;font:400 16px var(--title);color:#3c7fc2;padding:12px 4px 4px}.binds td{border-bottom:1px solid #eef2f5;padding:3px 4px}.binds td:first-child{width:46%}.panel .binds button.bind{width:100%;font:800 14px var(--text);background:#f1f5f8;border-radius:8px;padding:6px 8px;box-shadow:0 2px #c3cdd4}.panel .binds button.bind.listening{background:var(--amber);animation:.5s infinite alternate pulse;box-shadow:0 2px #c7961c}.notice{color:#d0701a;min-height:1.2em;margin:0;font-size:13px;font-weight:800}.settings input[type=range]{min-width:160px;accent-color:var(--orange);flex:1}.settings input[type=checkbox]{width:20px;height:20px;accent-color:var(--orange)}.settings output{font:400 17px var(--title);min-width:3.5em}canvas{transition:filter .8s ease-out}#hud.noskip .letterbox span{opacity:0!important}#hud.dead .banner{top:16%}.deathcard{text-align:center;opacity:0;transition:opacity .5s .4s,transform .5s .4s;position:absolute;bottom:calc(9vh + 18px);left:0;right:0;transform:translateY(12px)}.deathcard h2{font:400 clamp(26px, 4.5vw, 44px) var(--title);letter-spacing:2px;color:#ff6b5e;-webkit-text-stroke:1px #0000004d;margin:0}.deathcard p{letter-spacing:1px;text-transform:uppercase;margin:2px 0 0;font-size:16px;font-weight:800}#hud.dead .deathcard{opacity:1;transform:none}#hud.dead .damage-vignette{opacity:1;background:radial-gradient(#0000 45%,#7800008c);animation:none}#hud.dead .crosshair,#hud.dead .weapon,#hud.dead .stance,#hud.dead .scope,#hud.dead .ring{opacity:0}#hud .top .left{flex-direction:column;gap:6px;display:flex}.coins{font:400 22px var(--title);align-items:center;gap:7px;display:flex}.coins i{background:radial-gradient(circle at 35% 35%,#fff3a8,#ffcc2a 45%,#d99a0a);border-radius:50%;width:18px;height:18px;box-shadow:0 0 0 2px #00000040,0 0 8px #ffd23c99}.coins.bump{animation:.3s ease-out bump}@keyframes bump{40%{transform:scale(1.25)}}.toasts{flex-direction:column;align-items:center;gap:4px;display:flex;position:absolute;top:60%;left:0;right:0}.toast{font:400 24px var(--title);letter-spacing:1px;-webkit-text-stroke:1px #00000059;animation:1.8s ease-out forwards toast}@keyframes toast{0%{opacity:0;transform:translateY(10px)scale(.8)}12%{opacity:1;transform:none}75%{opacity:1}to{opacity:0;transform:translateY(-14px)}}#hud.cinematic .toasts,#hud.dead .toasts{opacity:0}.wallet{color:#fff;font:400 20px var(--title);background:#0000004d;border-radius:20px;align-items:center;gap:8px;padding:5px 14px;display:inline-flex}.wallet i{background:radial-gradient(circle at 35% 35%,#fff3a8,#ffcc2a 45%,#d99a0a);border-radius:50%;width:16px;height:16px}.stats tr.total td{border-top:2px solid #c9d3da;font-size:16px}.stats tr.total td:last-child{color:#d0701a;font-size:24px}.stats td.plus:before{content:"+"}.settings input[type=range]:disabled{opacity:.35}.enemies{flex-direction:column;align-items:flex-end;gap:6px;display:flex}.enemies .hp+.hp{font-size:20px}.enemies .hp+.hp .bar{height:12px}.hp.down{opacity:.4}.hp.down .label{text-decoration:line-through}#screens button:focus-visible,#screens input:focus-visible,#screens a:focus-visible{outline:3px solid var(--amber);outline-offset:3px}#screens .card:focus-visible{outline-offset:2px;transform:translateY(-2px)}.menu-keys{color:#fff;opacity:.85;margin:0;font-size:12px;font-weight:800}.credits-list{color:#3a4750;font-size:13px;font-weight:600;line-height:1.5}.credits-list p{margin:0 0 6px}.credits-list b{font-family:var(--title);letter-spacing:.3px;font-size:14px;font-weight:400}.credits-list a{color:#2f7fc4}
