:root{--green:#7dffb3;--bg:#14161a;--panel:#1e2127d1;--text:#e8ece9;--muted:#8f9aa1;--bad:#ff7a8a;--font:"Press Start 2P",ui-monospace,monospace}*{box-sizing:border-box}html,body{overflow:hidden;background:var(--bg);color:var(--text);font-family:var(--font);height:100%;margin:0}#scene{position:fixed;image-rendering:pixelated;width:100%;height:100%;transition:opacity 1.8s ease-in-out;inset:0}#hud,#controls,#inventory{transition:opacity 1.6s ease-in-out}body.intro #scene,body.intro #hud,body.intro #controls,body.intro #inventory{opacity:0;pointer-events:none}.line{display:inline-block;opacity:0}body.intro-play .line-presents{animation:presents-in 1.2s cubic-bezier(.16,1,.3,1).15s forwards}body.intro-play .line-urinal{animation:title-in 1.6s cubic-bezier(.16,1,.3,1)1.5s forwards}body.intro-play .line-etiquette{animation:title-in 1.6s cubic-bezier(.16,1,.3,1)2.4s forwards}body.intro-play .line-start{animation:line-fade .9s ease-out 4.2s forwards}body.intro-skip .line{opacity:1;animation:none!important}@keyframes presents-in{0%{opacity:0;letter-spacing:16px;filter:blur(6px)}to{opacity:1;letter-spacing:3px;filter:blur(0)}}@keyframes title-in{0%{opacity:0;transform:translateY(28px)scale(1.12);filter:blur(12px);letter-spacing:10px}60%{opacity:1}to{opacity:1;transform:none;filter:blur(0);letter-spacing:normal}}@keyframes line-fade{0%{opacity:0}to{opacity:1}}#hud{position:fixed;display:flex;letter-spacing:1px;text-shadow:0 2px #00000080;pointer-events:none;justify-content:space-between;align-items: center;gap:16px;padding:14px 20px;font-size:13px;top:0;left:0;right:0}#hud-left{display:flex;flex-direction:column;gap:12px}#hud-score{color:var(--green);font-size:18px}#hud-active{display:flex;color:#ffd36e;flex-direction:column;gap:6px;font-size:8px;line-height:1.6}#hud-lives{color:var(--bad);font-size:16px}#hud-combo{color:var(--green);margin-right:8px}#banner{position:fixed;text-align:center;background:var(--panel);border:2px solid var(--green);opacity:0;pointer-events:none;min-width:min(560px,92vw);max-width:92vw;padding:14px 22px;transition:opacity .2s,transform .2s;top:64px;left:50%;transform:translate(-50%,-8px)}#banner.show{opacity:1;transform:translate(-50%)}#banner[data-tone=great]{border-color:var(--green);box-shadow:0 0 24px #7dffb359}#banner[data-tone=good]{border-color:#7df9ff}#banner[data-tone=bad]{border-color:var(--bad);box-shadow:0 0 24px #ff7a8a4d}#banner-title{margin-bottom:10px;font-size:18px}#banner[data-tone=great] #banner-title{color:var(--green)}#banner[data-tone=bad] #banner-title{color:var(--bad)}#banner-detail{color:var(--muted);font-size:10px;line-height:1.7}#banner-shop{display:flex;justify-content:center;gap:12px;margin-top:14px}#banner-shop:empty{display:none}.card{display:flex;border:2px solid var(--green);background:#14161ae6;flex-direction:column;align-items: center;gap:8px;width:150px;padding:12px 8px;transition:opacity .15s,filter .15s}.card .key{color:var(--green);font-size:9px}.card .icon{font-size:30px;line-height:1}.card .name{color:var(--text);font-size:10px}.card .blurb{color:var(--muted);min-height:3.4em;font-size:7px;line-height:1.7}.card .price{color:#ffd36e;font-size:10px}.card.dim{opacity:.35;filter:grayscale(1);border-color:var(--muted)}.card.dim .price{color:var(--bad)}.card.nope{animation:nope .3s steps(4)}@keyframes nope{25%{transform:translate(-5px)}75%{transform:translate(5px)}}#drops{position:fixed;overflow:hidden;pointer-events:none;width:140px;top:78px;bottom:40px;left:20px}.drop{position:absolute;color:var(--bad);text-shadow:0 2px #0009;animation:drop-fall var(--dur,2.4s)cubic-bezier(.5,0,.9,.6)forwards;top:0}.drop.gain{color:var(--green);animation:gain-rise 1.6s ease-out forwards;top:auto;bottom:0}@keyframes gain-rise{0%{transform:translateY(0);opacity:1}to{transform:translateY(-90px);opacity:0}}#hud-dirty{display:none;color:var(--bg);animation:blink .9s steps(2,start)infinite;background:#ffd36e;margin-right:14px;padding:6px 8px;font-size:9px}#hud-dirty.show{display:inline-block}@keyframes drop-fall{0%{transform:translateY(0);opacity:1}80%{opacity:1}to{transform:translateY(70vh);opacity:0}}#controls{position:fixed;display:flex;gap:8px;bottom:14px;right:16px}#controls button{font-family:var(--font);color:var(--green);background:var(--panel);border:2px solid var(--green);cursor:pointer;padding:10px 12px;font-size:9px}#controls button:hover{background:#7dffb326}#controls #boss-button{color:var(--bad);border-color:var(--bad)}#inventory{position:fixed;display:flex;gap:6px;bottom:14px;left:16px}#tooltip{position:fixed;z-index:30;white-space:pre-line;color:var(--text);border:2px solid var(--green);opacity:0;pointer-events:none;background:#14161af2;max-width:260px;padding:8px 10px;font-size:8px;line-height:1.8;transform:translate(14px,calc(-100% - 12px))}#tooltip.show{opacity:1}.slot{position:relative;display:flex;background:var(--panel);border:2px solid var(--muted);justify-content:center;align-items: center;width:40px;height:40px;font-size:20px}.slot.full{border-color:var(--green)}.slot .n{position:absolute;color:var(--muted);font-size:7px;top:2px;left:3px}.slot.full .n{color:var(--green)}.prompt{display:flex;flex-direction:column;align-items: center;gap:22px}.sound-hint{color:var(--muted);margin:0;transition:opacity .6s ease-in-out;font-size:9px}#sound-hint.hidden{display:block;opacity:0}#controls #boss-button:hover{background:#ff7a8a2e}#toast{position:fixed;color:var(--bad);background:var(--panel);border:2px solid var(--bad);opacity:0;pointer-events:none;padding:10px 16px;transition:opacity .15s,transform .15s;font-size:12px;top:10px;left:50%;transform:translate(-50%,-6px)}#toast.show{opacity:1;transform:translate(-50%)}#hint{position:fixed;text-align:center;color:var(--muted);text-shadow:0 2px #0009;pointer-events:none;max-width:92vw;margin:0;font-size:10px;line-height:1.7;bottom:70px;left:50%;transform:translate(-50%)}#fps{position:fixed;letter-spacing:1px;color:var(--green);text-shadow:0 2px #0009;pointer-events:none;font-size:8px;bottom:4px;left:50%;transform:translate(-50%)}#fps:empty{display:none}#fade{position:fixed;background:var(--bg);opacity:0;pointer-events:none;transition:opacity .95s ease-in-out;inset:0}#fade.on{opacity:1}#flash{position:fixed;opacity:0;pointer-events:none;background:#fff;inset:0}#flash.go{animation:camera-flash .45s ease-out}@keyframes camera-flash{0%{opacity:.95}to{opacity:0}}.screen{position:fixed;display:flex;text-align:center;background:#14161ad1;flex-direction:column;justify-content:center;align-items: center;gap:22px;padding:24px;inset:0}.hidden{display:none}#title{background:radial-gradient(#14161ab8 0%,#14161a2e 75%);transition:opacity .9s ease-in-out}#title.hidden{display:flex;opacity:0;pointer-events:none}.screen h1{color:var(--green);text-shadow:0 0 22px #7dffb380,4px 4px #00000080;margin:0;font-size:clamp(28px,7vw,56px);line-height:1.2}.brand{letter-spacing:3px;color:var(--muted);margin:0;font-size:11px}.rules{margin:0;font-size:11px;line-height:2.1}.rules b{color:var(--green)}.pitch{color:var(--muted);max-width:460px;margin:0;font-size:10px;line-height:1.9}.cta{color:var(--green);margin:0;font-size:11px}.button{color:var(--bg);background:var(--green);text-decoration:none;padding:14px 22px;font-size:12px;box-shadow:4px 4px #00000080}.button:hover{filter:brightness(1.1)}.blink{animation:blink 1.1s steps(2,start)infinite}@keyframes blink{to{visibility:hidden}}@media (max-width:640px){#hud{padding:10px 12px;font-size:9px}#hud-score{font-size:13px}}
