:root{--hud-h: 100px;--ink: #f2ede4;--sans: ui-sans-serif, -apple-system, "Segoe UI", Roboto, sans-serif}*{margin:0;padding:0;box-sizing:border-box}html,body{width:100%;height:100%;overflow:hidden;background:#12100e;overscroll-behavior:none;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;font-family:var(--sans)}#scene{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:none}:root{--messing: #b99653;--messing-hell: #f2e7ca;--gruen: #2b3528;--gruen-aktiv: #47563f;--gruen-dunkel: #1f2a1d;--sage: #a8b599;--feld-b: clamp(52px, 16vw, 66px);--feld-h: clamp(50px, 15vw, 60px);--tafel-h: calc(var(--feld-h) + 14px)}#hud{position:fixed;left:0;right:0;bottom:0;height:calc(var(--hud-h) + env(safe-area-inset-bottom));padding:0 12px env(safe-area-inset-bottom);display:flex;align-items:center;justify-content:space-between;gap:10px;z-index:10;opacity:0;pointer-events:none;transition:opacity .9s ease}body.playing #hud{opacity:1;pointer-events:auto;transition-delay:2.5s}button{appearance:none;border:0;background:none;color:inherit;font:inherit;cursor:pointer;touch-action:manipulation}.nav{flex:0 0 auto;width:var(--feld-h);height:var(--feld-h);display:grid;place-items:center;border-radius:4px;color:var(--messing);background:var(--gruen-dunkel);box-shadow:0 3px 9px #0e100c66;transition:transform .14s ease,background .18s ease,opacity .25s ease}.nav svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.3;stroke-linecap:round;stroke-linejoin:round}.nav.pressed{transform:scale(.94);background:#2c3b28;transition-duration:.05s}.nav[disabled]{opacity:.4}#weapons{flex:0 0 auto;display:flex;padding:6px;height:var(--tafel-h);border-radius:5px;background:var(--gruen);border:1px solid var(--messing);box-shadow:inset 0 1px #fff6e01f,0 4px 12px #0e100c73}.weapon{position:relative;width:var(--feld-b);height:var(--feld-h);display:grid;place-items:center;border-radius:3px;color:var(--sage);transition:color .2s ease,background .2s ease,box-shadow .2s ease}.weapon+.weapon:before{content:"";position:absolute;left:0;top:9px;bottom:9px;width:1px;background:linear-gradient(to bottom,transparent,rgba(185,150,83,.5),transparent)}.weapon svg{width:30px;height:30px;display:block}.weapon.pressed svg{transform:scale(.9);transition:transform .1s ease}.weapon[aria-checked=true]{color:var(--messing-hell);background:var(--gruen-aktiv);box-shadow:inset 0 0 0 1px var(--messing)}.weapon[aria-checked=true]+.weapon:before,.weapon[aria-checked=true]:before{opacity:0}.mute{position:fixed;top:calc(env(safe-area-inset-top) + 10px);right:calc(env(safe-area-inset-right) + 12px);width:38px;height:38px;display:grid;place-items:center;z-index:10;border-radius:4px;color:var(--messing);background:var(--gruen-dunkel);box-shadow:0 3px 9px #0e100c66;opacity:0;pointer-events:none;transition:opacity .9s ease,transform .14s ease,background .18s ease}body.playing .mute{opacity:.72;pointer-events:auto;transition-delay:2.5s}.mute svg{width:21px;height:21px;display:block}.mute.pressed{transform:scale(.94);background:#2c3b28;transition-duration:.05s}.mute .kreuz{display:none}.mute[aria-pressed=true]{color:var(--sage)}.mute[aria-pressed=true] .welle{display:none}.mute[aria-pressed=true] .kreuz{display:block}#score{position:fixed;top:calc(env(safe-area-inset-top) + 10px);left:calc(env(safe-area-inset-left) + 12px);z-index:10;display:flex;flex-direction:column;gap:2px;padding:5px 7px 6px;border-radius:4px;color:var(--messing);background:var(--gruen-dunkel);box-shadow:0 3px 9px #0e100c66;opacity:0;pointer-events:none;transition:opacity .9s ease}body.playing #score{opacity:.86;transition-delay:2.5s}body.won #score,body.won #hud,body.won .mute{opacity:0;pointer-events:none;transition-delay:0s}.score-label{font-size:8px;line-height:1;letter-spacing:.2em;text-indent:.2em;text-transform:uppercase;color:var(--sage)}.score-val{font-size:16px;line-height:1;text-align:center;font-variant-numeric:tabular-nums}.score-val b{font-weight:600;color:var(--messing-hell)}.score-val i{font-style:normal;opacity:.7}#hits{position:fixed;inset:0;z-index:12;pointer-events:none;overflow:hidden}.hit{position:absolute;width:6em;margin-left:-3em;text-align:center;font-family:var(--sans);font-size:clamp(1.25rem,4.8vw,1.55rem);font-weight:400;letter-spacing:.01em;line-height:1;font-variant-numeric:tabular-nums;color:var(--messing-hell);text-shadow:0 1px 5px rgba(14,16,12,.5),0 0 11px rgba(14,16,12,.38);opacity:0}#loader{position:fixed;inset:0;z-index:20;display:grid;place-items:center;background:#12100e;transition:opacity .7s ease}#loader.gone{opacity:0;pointer-events:none}.loader-bar{width:132px;height:2px;background:#ffffff1f;overflow:hidden}.loader-bar i{display:block;width:40%;height:100%;background:var(--ink);animation:slide 1.1s ease-in-out infinite}@keyframes slide{0%{transform:translate(-110%)}to{transform:translate(360%)}}#start,#win{position:fixed;inset:0;z-index:15;display:grid;place-items:center;padding:calc(env(safe-area-inset-top) + 24px) 24px calc(env(safe-area-inset-bottom) + 28px);text-align:center;color:var(--ink);background:radial-gradient(118% 76% at 50% 46%,#12100d57,#12100d66 38%,#12100dbd),linear-gradient(to bottom,#12100dc7,#12100d1f 32%,#12100d2e 60%,#12100dd6);opacity:0;transition:opacity .9s ease}#win{z-index:16;pointer-events:none;background:radial-gradient(118% 76% at 50% 46%,#12100d6b,#12100d80 38%,#12100dc7),linear-gradient(to bottom,#12100dcc,#12100d29 32%,#12100d33 60%,#12100ddb)}#win.in{pointer-events:auto}#start.in,#win.in{opacity:1}body.playing #start{opacity:0;pointer-events:none;transform:scale(1.09);filter:blur(6px);transition:opacity 1.1s cubic-bezier(.4,0,.7,1),transform 1.5s cubic-bezier(.32,0,.2,1),filter 1.1s ease}.start-inner{display:flex;flex-direction:column;align-items:center;gap:0;width:100%;max-width:34rem;font-family:Cormorant Garamond,Cormorant,Didot,Times New Roman,serif}.start-inner>*{max-width:100%;opacity:0;transform:translateY(14px)}.in .start-inner>*{animation:rise 1.5s cubic-bezier(.16,.8,.26,1) forwards}.in .start-title{animation-delay:.18s}.in .start-rule{animation-delay:.58s}.in .start-lede{animation-delay:.7s}.in .start-btn{animation-delay:.88s}@keyframes rise{to{opacity:1;transform:translateY(0)}}.start-title{margin:0;font-weight:300;line-height:1;text-wrap:balance}.start-title span{display:block;font-size:clamp(1.3rem,6.2vw,2.1rem);font-weight:400;letter-spacing:.34em;text-indent:.34em;text-transform:uppercase;color:#f7f0e2}.start-title em{display:block;margin-top:.06em;font-style:italic;font-size:clamp(3.9rem,24vw,9rem);line-height:.9;letter-spacing:.012em;color:#f7f0e2;text-shadow:0 2px 30px rgba(0,0,0,.55),0 1px 2px rgba(0,0,0,.4)}.start-lede{max-width:18rem;margin:1.4em 0 0;font-size:clamp(.98rem,4.2vw,1.16rem);font-weight:300;line-height:1.5;letter-spacing:.012em;text-wrap:balance;color:#f7f0e2d1;text-shadow:0 1px 12px rgba(0,0,0,.55)}.start-lede+.start-btn{margin-top:1.9em}.start-rule{display:flex;align-items:center;gap:.85em;width:min(19rem,74%);margin-top:1.5em;color:var(--messing)}.start-rule i{flex:1;height:1px;background:linear-gradient(to right,transparent,rgba(198,163,92,.75))}.start-rule i+b+i{background:linear-gradient(to left,transparent,rgba(198,163,92,.75))}.start-rule b{font-size:.6rem;font-weight:400;line-height:1;opacity:.9}.start-btn{margin-top:2.4em;padding:.85em 1.9em;font-family:var(--sans);font-size:clamp(.86rem,3.6vw,.96rem);font-weight:400;letter-spacing:.1em;text-indent:.1em;text-transform:uppercase;color:var(--messing);border-radius:4px;background:var(--gruen-dunkel);box-shadow:0 3px 9px #0e100c66;transition:transform .14s ease,background .18s ease}.start-btn.pressed{transform:scale(.96);background:#2c3b28;transition-duration:.05s}@media (max-height: 560px){#start{padding:calc(env(safe-area-inset-top) + 12px) 24px calc(env(safe-area-inset-bottom) + 14px)}.start-title{margin-top:.4em}.start-title span{font-size:clamp(1rem,3.2vh,1.5rem)}.start-title em{font-size:clamp(2.4rem,15vh,4.6rem)}.start-rule{margin-top:.85em}.start-lede{margin-top:.85em;font-size:clamp(.85rem,2.6vh,1rem);line-height:1.4}.start-btn{margin-top:1.5em;padding:.8em 1.8em}.start-lede+.start-btn{margin-top:1.1em}}@media (prefers-reduced-motion: reduce){.start-inner>*{opacity:1;transform:none;animation:none!important}body.playing #start{transform:none;filter:none}}