:root{--green: #1f8a3b;--green-d: #0b1a10;--red: #e31b23;--yellow: #ffd000;--cream: #fff6d8;--violet: #8b4dff;--ink: #140c0a}*{box-sizing:border-box;user-select:none;-webkit-user-select:none}html,body{margin:0;min-height:100%;height:100%;height:100dvh;background:#050c07;overflow:hidden;touch-action:none;font-family:"Press Start 2P",monospace;color:var(--cream);box-sizing:border-box;padding:max(14px,env(safe-area-inset-top,0px)) max(12px,env(safe-area-inset-right,0px)) max(18px,env(safe-area-inset-bottom,0px)) max(12px,env(safe-area-inset-left,0px))}#app{position:relative;width:100%;height:100%;overflow:hidden;background:var(--green-d)}#c{display:block;width:100%;height:100%;cursor:pointer}#flash{position:absolute;inset:0;pointer-events:none;opacity:0;background:#fff;z-index:40}#scanlines{position:absolute;inset:0;pointer-events:none;z-index:50;background:repeating-linear-gradient(to bottom,rgba(0,0,0,.08) 0px,rgba(0,0,0,.08) 1px,transparent 1px,transparent 3px);mix-blend-mode:multiply}#boot,#title,#intro,#ending,#moments-menu,#glory{position:absolute;inset:0;display:none;align-items:center;justify-content:center;flex-direction:column;z-index:20;text-align:center;pointer-events:none}#boot.on,#title.on,#intro.on,#ending.on,#moments-menu.on,#glory.on{display:flex}#title.on,#ending.on,#moments-menu.on{pointer-events:auto}#boot{background:#071109}.boot-title{font-size:18px;color:var(--yellow);letter-spacing:4px}.boot-track{width:min(420px,70vw);height:14px;border:3px solid var(--yellow);margin:22px 0 12px}#boot-bar{height:100%;width:0;background:var(--green)}#boot-label{font-size:8px;opacity:.7}#hud{position:absolute;top:10px;left:12px;right:12px;display:none;justify-content:space-between;align-items:flex-start;z-index:15;pointer-events:none;gap:8px}#hud.on{display:flex}.hud-left,.hud-mid,.hud-right{background:#0e2414;border:3px solid var(--yellow);box-shadow:3px 3px #7a1218;padding:8px 10px;min-width:120px}.hud-right{min-width:156px}.cmr{color:var(--yellow);font-size:9px;margin-bottom:6px}#hud-score{font-size:14px}.hud-mid{text-align:center;flex:1;max-width:420px}#hud-meta{font-size:8px;line-height:1.5;color:var(--yellow)}#hud-timer{font-size:12px;margin-top:6px}#hud-hearts{color:var(--red);font-size:11px;letter-spacing:1px;white-space:nowrap}#roar{position:absolute;left:50%;bottom:14px;transform:translate(-50%);display:none;align-items:center;gap:10px;z-index:15;pointer-events:none;background:#0e2414;border:3px solid var(--yellow);padding:8px 12px}#roar.on{display:flex}#roar.full{border-color:#fff;box-shadow:0 0 16px var(--yellow)}#roar.pulse{animation:pop .25s ease-out}#roar-label{font-size:8px;color:var(--yellow)}.roar-track{width:min(280px,42vw);height:12px;background:#132a18;border:2px solid #fff6d8}#roar-fill{height:100%;width:0;background:linear-gradient(90deg,var(--green),var(--yellow),var(--red))}#roar-banner{position:absolute;top:22%;left:50%;transform:translate(-50%,-50%) scale(.6);font-size:clamp(18px,4vw,36px);color:var(--yellow);text-shadow:4px 4px 0 var(--red);opacity:0;pointer-events:none;z-index:18}#roar-banner.on{animation:roarIn .4s ease-out forwards}#prompt{position:absolute;top:46%;left:50%;transform:translate(-50%,-50%);font-size:clamp(22px,6vw,52px);color:#fff;text-shadow:4px 4px 0 var(--ink);display:none;z-index:16;pointer-events:none;letter-spacing:2px;animation:pulse .7s ease-in-out infinite}#prompt.on{display:block}#popup{position:absolute;top:30%;left:50%;transform:translate(-50%,-50%) scale(.4);font-size:clamp(18px,5vw,42px);z-index:17;pointer-events:none;opacity:0;text-align:center;max-width:90vw;line-height:1.3}#popup.on{animation:popIn .35s cubic-bezier(.2,1.4,.3,1) forwards}#popup[data-kind=perfect]{color:var(--yellow);text-shadow:4px 4px 0 var(--red)}#popup[data-kind=good]{color:#fff;text-shadow:4px 4px 0 var(--green)}#popup[data-kind=bad]{color:var(--red);text-shadow:4px 4px 0 var(--ink)}#popup[data-kind=wild]{color:#ff9a3c;text-shadow:4px 4px 0 var(--ink)}#popup[data-kind=calm]{color:var(--cream);text-shadow:3px 3px 0 #000}#gauge,#power,#target{position:absolute;z-index:16;pointer-events:none;display:none}#gauge.on,#power.on,#target.on{display:block}#gauge{left:50%;bottom:70px;transform:translate(-50%);width:min(520px,78vw)}.g-track{position:relative;height:22px;background:#132a18;border:3px solid var(--cream)}.g-good{position:absolute;left:32%;width:36%;top:0;bottom:0;background:#f5c51855}.g-perfect{position:absolute;left:44%;width:12%;top:0;bottom:0;background:#1f8a3bcc}#gauge-cursor{position:absolute;top:-6px;width:8px;height:34px;background:#fff;transform:translate(-50%);box-shadow:2px 2px #000}.g-cap{font-size:8px;margin-top:6px;text-align:center;color:var(--yellow)}#power{right:18px;top:28%;height:180px;width:28px}.p-track{height:160px;border:3px solid var(--cream);background:#132a18;position:relative}#power-fill{position:absolute;left:0;right:0;bottom:0;height:0;background:var(--red)}#power.sweet #power-fill{background:var(--yellow)}#target{left:50%;top:18%;transform:translate(-50%);width:min(360px,50vw);height:70px}.t-frame{position:absolute;inset:0;border:4px solid #fff;background:#1f8a3b33}#target-mark{position:absolute;top:-8px;width:14px;height:86px;background:var(--yellow);transform:translate(-50%);box-shadow:2px 2px #000}#zones{position:absolute;inset:0;pointer-events:none;display:none;z-index:12}#zones.on{display:block}.zone{position:absolute;width:16vw;height:16vw;max-width:120px;max-height:120px;border:3px dashed rgba(255,246,216,.35);border-radius:8px}.zone.hot{border-color:var(--yellow);background:#ffd00033;box-shadow:0 0 18px #ffd00088}#title{background:linear-gradient(180deg,#07110940,#071109b8)}.t-kicker{font-size:9px;letter-spacing:6px;color:var(--yellow);margin-bottom:16px}h1{font-size:clamp(28px,8vw,72px);line-height:1.15;margin:0;color:var(--cream);text-shadow:6px 6px 0 var(--red),-3px 0 0 var(--green)}.t-sub{margin:18px 0 28px;font-size:clamp(8px,2vw,12px);letter-spacing:4px;color:var(--yellow)}#challenge{display:none;margin:-8px 0 22px}#challenge.on{display:block}.ch-kicker{font-size:8px;letter-spacing:3px;color:var(--cream);opacity:.8}#challenge-score{margin-top:8px;font-size:clamp(18px,5vw,32px);color:var(--yellow);text-shadow:3px 3px 0 var(--red)}button{font-family:inherit;font-size:14px;padding:14px 28px;cursor:pointer;background:var(--yellow);color:var(--ink);border:4px solid var(--cream);box-shadow:4px 4px 0 var(--red);letter-spacing:2px}button:hover{transform:translate(1px,1px);box-shadow:3px 3px 0 var(--red)}button:active{transform:translate(3px,3px);box-shadow:0 0 0 var(--red)}.t-hint{margin-top:18px;font-size:7px;opacity:.7}.t-row{display:flex;gap:8px;margin-top:28px;image-rendering:pixelated}.t-row img{width:64px;height:64px;object-fit:cover;border:3px solid var(--yellow);background:#2a0a40}.t-footer{position:absolute;left:0;right:0;bottom:16px;font-size:7px;letter-spacing:1px;color:var(--cream);opacity:.72}#nameplate{position:absolute;transform:translate(-50%,-100%);display:none;pointer-events:none;z-index:16;text-align:center;background:#0e2414ee;border:3px solid var(--yellow);padding:6px 10px;white-space:nowrap}#nameplate.on{display:block}#nameplate-name{display:block;font-size:8px;color:var(--cream)}#nameplate-role{display:block;font-size:6px;color:var(--yellow);margin-top:4px;letter-spacing:1px}#intro{background:#0711098c;flex-direction:row;gap:28px;pointer-events:none}#intro-portrait{width:min(220px,30vw);height:min(220px,30vw);object-fit:cover;border:4px solid var(--yellow);image-rendering:pixelated;background:#2a0a40}#intro-kicker{font-size:8px;color:var(--yellow);letter-spacing:4px}#intro-title{font-size:clamp(20px,5vw,40px);margin:10px 0;text-shadow:4px 4px 0 var(--red)}#intro-sub{font-size:9px;color:var(--yellow);margin-bottom:12px}#intro-flavor{font-size:8px;line-height:1.6;max-width:360px;opacity:.85}#ending{background:#07110959}.e-stack{text-shadow:4px 4px 0 var(--red)}.e1{font-size:clamp(28px,7vw,64px);color:var(--yellow)}.e2{font-size:clamp(10px,2.4vw,16px);margin:16px 0;letter-spacing:2px}.e3{font-size:clamp(22px,5vw,40px)}.e4{margin-top:18px;font-size:10px;color:var(--yellow);letter-spacing:3px}.e-score{margin-top:22px;text-shadow:none}.e-score-label{font-size:8px;letter-spacing:2px;color:var(--cream);opacity:.8}#end-score{margin-top:8px;font-size:clamp(18px,4vw,28px);color:var(--yellow)}.e-btns{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:36px;max-width:92vw}#btn-share{background:var(--green);color:var(--cream)}#glory{background:transparent;z-index:19;padding:8vh 6vw}#glory[data-tone=wide]{background:linear-gradient(180deg,#07110914,#07110959)}#glory[data-tone=quiet]{background:linear-gradient(180deg,#07110926,#07110973)}#glory-kicker{font-size:clamp(8px,2vw,12px);letter-spacing:4px;color:var(--yellow);margin-bottom:12px}#glory-title{font-size:clamp(16px,4.4vw,36px);line-height:1.35;color:var(--cream);text-shadow:4px 4px 0 var(--red);max-width:16ch}#glory[data-tone=hero] #glory-title{font-size:clamp(20px,5.2vw,42px);color:var(--yellow)}#glory-sub{margin-top:16px;font-size:clamp(16px,4vw,32px);color:var(--cream)}#glory-lines{margin-top:18px;display:flex;flex-direction:column;gap:10px}.glory-line{font-size:clamp(8px,2vw,12px);letter-spacing:1px;color:var(--cream);opacity:.9}#moments-menu{background:#071109b8}.mm-card{background:#0e2414;border:4px solid var(--yellow);padding:22px;display:flex;flex-direction:column;gap:10px;min-width:min(420px,88vw);pointer-events:auto}.mm-card h2{margin:0 0 8px;font-size:16px;color:var(--yellow)}.mm-card button{font-size:10px;text-align:left}.mm-card .ghost{background:transparent;color:var(--cream);box-shadow:none;text-align:center}@keyframes pop{50%{transform:translate(-50%) scale(1.06)}}@keyframes popIn{to{opacity:1;transform:translate(-50%,-50%) scale(1)}}@keyframes pulse{50%{transform:translate(-50%,-50%) scale(1.08)}}@keyframes roarIn{to{opacity:1;transform:translate(-50%,-50%) scale(1)}}@media(max-width:700px){html,body{padding:max(18px,env(safe-area-inset-top,0px)) max(14px,env(safe-area-inset-right,0px)) max(24px,env(safe-area-inset-bottom,0px)) max(14px,env(safe-area-inset-left,0px))}.hud-left,.hud-mid,.hud-right{padding:6px 7px}#hud-score{font-size:11px}.t-row img{width:44px;height:44px}#intro{flex-direction:column}button{font-size:12px}#hud{top:8px;left:8px;right:8px}#roar{bottom:10px}}
