:root{--ui-bg: rgba(18, 16, 34, .9);--ui-border: #4a5588;--ui-text: #f0f2fa;--ui-dim: #98a2c0;--accent: #ffd166;--hot: #ff66cc;--pixel-font: "VT323", "Courier New", monospace;--body-font: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace}*{margin:0;padding:0;box-sizing:border-box}html,body{width:100%;height:100%;overflow:hidden;background:#0c0e16;overscroll-behavior:none;touch-action:none}#app{position:relative;width:100vw;height:100vh}#game-canvas{display:block;image-rendering:pixelated;image-rendering:crisp-edges}#ui-root{position:absolute;inset:0;pointer-events:none;font-family:var(--body-font);color:var(--ui-text);letter-spacing:.02em}.crosshair{position:absolute;top:50%;left:50%;width:6px;height:6px;margin:-3px 0 0 -3px;background:#ffffffd9;outline:2px solid rgba(16,18,30,.6)}.hud-meters{position:absolute;top:12px;left:12px;background:var(--ui-bg);border:2px solid var(--ui-border);padding:10px 12px;display:flex;flex-direction:column;gap:5px;box-shadow:4px 4px #00000059}.meter-row{display:grid;grid-template-columns:96px 110px 34px;align-items:center;gap:8px;font-family:var(--pixel-font);font-size:17px;text-transform:uppercase}.meter-bar{height:10px;background:#11141f;border:1px solid var(--ui-border)}.meter-fill{height:100%;width:50%;transition:width .3s steps(8)}.meter-fill.meter-low{animation:blink .8s steps(2) infinite}@keyframes blink{50%{opacity:.35}}.meter-value{text-align:right;color:var(--ui-dim)}.hud-corner{position:absolute;top:12px;right:12px;text-align:right;display:flex;flex-direction:column;align-items:flex-end;gap:4px}.hud-clock{background:var(--ui-bg);border:2px solid var(--ui-border);padding:4px 10px;font-family:var(--pixel-font);font-size:22px;box-shadow:4px 4px #00000059}.hud-clock.demo-day{border-color:#d62828;color:#ff8fa3;animation:blink 1s steps(2) infinite}.hud-location{background:var(--ui-bg);border:2px solid var(--ui-border);padding:3px 10px;font-family:var(--pixel-font);font-size:17px;color:var(--accent)}.hud-mute{font-size:12px;color:var(--ui-dim);padding:2px 4px}.hud-quest{position:absolute;top:148px;left:12px;width:280px;background:var(--ui-bg);border:2px solid var(--ui-border);padding:8px 12px;box-shadow:4px 4px #00000059}.quest-head{font-family:var(--pixel-font);font-size:16px;color:var(--accent);margin-bottom:3px;letter-spacing:.08em}.quest-body{font-size:12px;line-height:1.5}.hud-prompt{position:absolute;bottom:130px;left:50%;transform:translate(-50%);background:var(--ui-bg);border:2px solid var(--accent);padding:4px 14px;font-family:var(--pixel-font);font-size:20px;box-shadow:4px 4px #00000059}.dialogue-box{position:absolute;bottom:18px;left:50%;transform:translate(-50%);width:min(700px,92vw);background:var(--ui-bg);border:3px solid var(--ui-border);padding:12px 16px;box-shadow:6px 6px #0006}.dialogue-name{font-family:var(--pixel-font);font-size:19px;color:var(--accent);text-transform:uppercase;margin-bottom:6px}.dialogue-text{font-size:14px;line-height:1.55}.dialogue-hint{margin-top:8px;font-size:11px;color:var(--ui-dim);text-align:right}.doc-wrap{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#0a0c1459;pointer-events:none}.doc-paper{width:min(440px,88vw);min-height:280px;padding:26px 30px 20px;background:repeating-linear-gradient(transparent,transparent 25px,rgba(120,90,50,.16) 26px),linear-gradient(168deg,#f6eed9,#efe3c6 60%,#e6d6b2);color:#3a3026;border:2px solid #b59b6e;box-shadow:0 0 0 6px #4a3a24e6,12px 14px #00000073;transform:rotate(-1.2deg);animation:paperin .18s steps(4);display:flex;flex-direction:column}@keyframes paperin{0%{transform:rotate(-1.2deg) translateY(30px) scale(.85);opacity:0}to{transform:rotate(-1.2deg);opacity:1}}.doc-title{font-family:var(--pixel-font);font-size:23px;border-bottom:2px solid rgba(120,90,50,.5);padding-bottom:6px;margin-bottom:12px}.doc-body{font-size:13.5px;line-height:26px;flex:1;white-space:pre-line}.doc-hint{font-family:var(--pixel-font);font-size:15px;text-align:right;color:#8a7350;margin-top:10px}.touch-wrap{position:absolute;inset:0;pointer-events:none}.joy-base{position:absolute;left:26px;bottom:30px;width:124px;height:124px;border-radius:50%;background:#12102259;border:2px solid rgba(255,255,255,.35);pointer-events:auto;touch-action:none;display:flex;align-items:center;justify-content:center}.joy-nub{width:52px;height:52px;border-radius:50%;background:#ffd166bf;border:2px solid #1a1028;box-shadow:0 3px #0006}.touch-btn{position:absolute;pointer-events:auto;touch-action:none;border-radius:50%;border:3px solid #1a1028;font-family:var(--pixel-font);color:#1a1028;box-shadow:0 4px #00000073;user-select:none;-webkit-user-select:none}.touch-btn.pressed{transform:translateY(3px);box-shadow:0 1px #00000073}.btn-a{right:26px;bottom:64px;width:76px;height:76px;font-size:34px;background:#7ae582d9}.btn-b{right:114px;bottom:28px;width:64px;height:64px;font-size:28px;background:#ff66ccd9}.btn-pitch{right:48px;bottom:158px;width:58px;height:58px;font-size:14px;background:#ffd166d9}.btn-pause{top:12px;left:50%;transform:translate(-50%);width:44px;height:44px;font-size:18px;background:#98a2c0b3}.toast-wrap{position:absolute;bottom:18px;right:14px;display:flex;flex-direction:column-reverse;gap:6px;max-width:330px}.toast{background:var(--ui-bg);border:2px solid var(--ui-border);border-left:4px solid var(--accent);padding:8px 10px;font-size:12px;line-height:1.45;opacity:0;transform:translate(20px);transition:all .25s steps(5)}.toast.show{opacity:1;transform:translate(0)}.day-banner{position:absolute;top:34%;left:50%;transform:translate(-50%,-50%);font-family:var(--pixel-font);font-size:52px;color:#fff;text-shadow:4px 4px 0 #1a1028,-2px -2px 0 #1a1028,2px -2px 0 #1a1028,-2px 2px 0 #1a1028;text-transform:uppercase;white-space:nowrap}.day-banner.pop{animation:bannerpop 2.6s steps(12) forwards}@keyframes bannerpop{0%{opacity:0;transform:translate(-50%,-50%) scale(.6)}12%{opacity:1;transform:translate(-50%,-50%) scale(1.05)}80%{opacity:1}to{opacity:0;transform:translate(-50%,-50%) scale(1)}}.modal-wrap{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#080a128c;pointer-events:auto}.event-card{width:min(540px,92vw);background:var(--ui-bg);border:3px solid var(--accent);padding:18px 20px;box-shadow:8px 8px #00000080;animation:cardin .25s steps(6)}@keyframes cardin{0%{transform:translateY(-24px) scale(.92);opacity:0}to{transform:none;opacity:1}}.event-title{font-family:var(--pixel-font);font-size:26px;color:var(--accent);margin-bottom:10px;text-transform:uppercase}.event-body{font-size:13px;line-height:1.6;margin-bottom:14px}.event-choice{display:block;width:100%;margin-bottom:8px;background:#1b2030;border:2px solid var(--ui-border);color:var(--ui-text);font-family:var(--body-font);font-weight:600;font-size:12.5px;text-align:left;padding:10px 12px;cursor:pointer}.event-choice:hover{border-color:var(--accent);background:#232b42}.event-hint{font-size:11px;color:var(--ui-dim);text-align:right}.screen-wrap{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#080a12c7;pointer-events:auto}.screen-panel{width:min(660px,94vw);max-height:92vh;overflow-y:auto;background:var(--ui-bg);border:3px solid var(--ui-border);padding:26px 32px;text-align:center;box-shadow:10px 10px #00000080}.title-small{font-family:var(--pixel-font);font-size:16px;color:var(--ui-dim);letter-spacing:.3em;margin-bottom:8px}.title-big{font-family:var(--pixel-font);font-size:84px;line-height:.9;color:var(--accent);text-shadow:5px 5px 0 #1a1028;letter-spacing:.04em}.title-sub{font-family:var(--pixel-font);font-size:24px;color:var(--hot);letter-spacing:.28em;margin:6px 0 16px}.title-mid{font-family:var(--pixel-font);font-size:38px;margin-bottom:12px;line-height:1.1}.title-mid.win{color:#7ae582}.title-mid.lose{color:#ff5d6c}.screen-text{font-size:13px;line-height:1.7;margin-bottom:13px}.screen-text.dim,.dim{color:var(--ui-dim)}.controls-grid{display:grid;grid-template-columns:auto auto;gap:3px 18px;justify-content:center;font-size:12.5px;margin-bottom:14px;text-align:left}.controls-grid span:nth-child(odd){color:var(--accent);text-align:right;font-weight:600}.big-button{background:var(--accent);color:#1a1028;border:3px solid #1a1028;font-family:var(--pixel-font);font-size:26px;padding:8px 22px;cursor:pointer;box-shadow:4px 4px #00000080;margin-top:6px}.big-button:hover{transform:translate(-1px,-1px);box-shadow:6px 6px #00000080}.big-button:active{transform:translate(2px,2px);box-shadow:1px 1px #00000080}