:root{--ink: #1a1a1a;--ink-halo: rgba(255, 255, 255, .5);--mono: ui-monospace, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;--gutter: 14px;--safe-top: env(safe-area-inset-top, 0px);--safe-right: env(safe-area-inset-right, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px);--safe-left: env(safe-area-inset-left, 0px);--buzz-blur: 0px}*{margin:0;padding:0;box-sizing:border-box}body{overflow:hidden;background:#f0f4f8;font-family:var(--mono);font-size:13px;line-height:1.4;color:var(--ink);-webkit-font-smoothing:antialiased}#canvas{display:block;width:100vw;height:100vh}#canvas,#ui,#clock,#depression-meter{filter:blur(var(--buzz-blur));transition:filter 1s ease-out}#ui,#clock,#depression-meter,#action-buttons{position:fixed;z-index:1000;text-shadow:0 0 2px var(--ink-halo),0 0 6px var(--ink-halo);text-transform:lowercase;letter-spacing:.02em;white-space:nowrap}#ui{top:calc(var(--gutter) + var(--safe-top));left:calc(var(--gutter) + var(--safe-left));max-width:min(60vw,640px);display:flex;flex-direction:column;gap:2px;pointer-events:none;white-space:normal}#readout{display:flex;gap:1.5em}.counter span{display:inline-block;min-width:2ch;font-weight:700;transition:transform .15s ease-out}.counter.animate span{animation:bounce .25s ease-out}@keyframes bounce{0%{transform:scale(1)}50%{transform:scale(1.3)}to{transform:scale(1)}}.status{opacity:.75}#missed-display{display:none}#missed-display.visible{display:block;animation:linger-then-fade 5s forwards}@keyframes linger-then-fade{85%{opacity:.75}to{opacity:0}}#clock{top:calc(var(--gutter) + var(--safe-top));right:calc(var(--gutter) + var(--safe-right));font-variant-numeric:tabular-nums;opacity:.75}#depression-meter{bottom:calc(var(--gutter) + var(--safe-bottom));left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:2px}#depression-label{font-size:1.15em}#depression-blocks{font-size:2.4em;line-height:1;letter-spacing:.04em}#depression-filled{transition:color .5s ease-out}#depression-empty{opacity:.4}#action-buttons{bottom:calc(var(--gutter) + var(--safe-bottom));right:calc(var(--gutter) + var(--safe-right));display:flex;gap:8px}#action-buttons button{font:inherit;letter-spacing:inherit;text-transform:inherit;color:var(--ink);background:transparent;border:1px solid var(--ink);border-radius:0;padding:6px 14px;min-height:32px;cursor:pointer;text-shadow:inherit;transition:background .15s ease,color .15s ease;-webkit-tap-highlight-color:transparent}#action-buttons button:hover{background:var(--ink);color:var(--ink-halo);text-shadow:none}#action-buttons button:active{transform:translateY(1px)}@media(max-width:600px),(pointer:coarse){#action-buttons button{padding:10px 18px;min-height:44px}}@media(max-width:600px){#depression-meter{bottom:calc(var(--gutter) + var(--safe-bottom) + 60px);left:0;right:0;transform:none}#depression-blocks{font-size:2em}}@media(max-width:400px){#clock{display:none}}#bonanza-display{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);font-size:clamp(28px,8vw,72px);font-weight:900;color:#d4584a;text-shadow:0 0 20px #d4584a,0 0 40px #d4584a,0 0 60px #ff6b5b,4px 4px 0 #8b2a1a;z-index:5000;animation:bonanza-flash .15s ease-in-out infinite alternate;letter-spacing:clamp(1px,.5vw,4px);max-width:90vw;text-align:center;text-transform:uppercase;font-family:Impact,Arial Black,sans-serif}@keyframes bonanza-flash{0%{color:#d4584a;text-shadow:0 0 20px #d4584a,0 0 40px #d4584a,0 0 60px #ff6b5b,4px 4px 0 #8b2a1a;transform:translate(-50%,-50%) scale(1)}to{color:#ff8a7a;text-shadow:0 0 30px #ff8a7a,0 0 60px #ff8a7a,0 0 90px #ffaa9a,4px 4px 0 #8b2a1a;transform:translate(-50%,-50%) scale(1.05)}}#sip-can{position:fixed;bottom:0;left:5vw;transform:translateY(100%) scale(.5);height:70vh;max-height:500px;z-index:4000;pointer-events:none;image-rendering:auto}#sip-can.sipping{animation:sip-up 2.5s ease-in-out}@keyframes sip-up{0%{transform:translateY(100%) scale(.5)}10%{transform:translateY(-40%) scale(.5)}12%{transform:translateY(-40%) rotate(-3deg) scale(.5)}14%{transform:translateY(-40%) rotate(3deg) scale(.5)}16%{transform:translateY(-40%) rotate(-2deg) scale(.5)}18%{transform:translateY(-40%) rotate(1deg) scale(.5)}20%{transform:translateY(-40%) rotate(0) scale(.5)}70%{transform:translateY(-40%) scale(.5)}to{transform:translateY(100%) scale(.5)}}#puff-mild{position:fixed;bottom:0;right:5vw;height:60vh;max-height:450px;z-index:4000;pointer-events:none;image-rendering:auto;transform:rotate(-30deg) translateY(100%) scale(.5);transform-origin:bottom center}#puff-mild.puffing{animation:puff-up 3s ease-in-out}@keyframes puff-up{0%{transform:rotate(-30deg) translateY(100%) scale(.5)}12%{transform:rotate(-30deg) translateY(-40%) scale(.5)}75%{transform:rotate(-30deg) translateY(-40%) scale(.5)}to{transform:rotate(-30deg) translateY(100%) scale(.5)}}#debug-menu{position:fixed;bottom:20px;left:20px;background:#0f172af2;padding:20px;border-radius:12px;z-index:3000;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.15);min-width:280px;pointer-events:auto}.debug-title{color:#fbbf24;font-size:18px;font-weight:700;margin-bottom:15px;padding-bottom:10px;border-bottom:1px solid rgba(255,255,255,.2)}.debug-section{margin-bottom:15px}.debug-label{color:#94a3b8;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px}.debug-buttons{display:flex;flex-wrap:wrap;gap:6px}.debug-btn{background:#ffffff1a;border:1px solid rgba(255,255,255,.2);color:#e2e8f0;padding:8px 12px;border-radius:6px;font-size:13px;font-weight:500;cursor:pointer;transition:all .15s ease}.debug-btn:hover{background:#fff3;border-color:#ffffff4d}.debug-btn.active{background:#3b82f6;border-color:#3b82f6;color:#fff}.debug-btn.fish-btn:hover{transform:scale(1.05)}.debug-close{color:#64748b;font-size:11px;text-align:center;margin-top:10px;font-style:italic}
