@import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap');
*{box-sizing:border-box}html,body{margin:0;background:#050505;color:#fff;font-family:'Press Start 2P',monospace;touch-action:manipulation}html,body{min-height:100%;overscroll-behavior:none}button,a{font-family:inherit}header{height:48px;display:flex;align-items:center;justify-content:space-between;padding:8px 14px;border-bottom:3px solid #7d6b49;background:#0a0907;position:relative;z-index:20}header a,header button{color:#f5d34b;background:#111;border:1px solid #7d6b49;padding:8px;text-decoration:none;font-size:10px}.screen{min-height:calc(100vh - 48px);display:grid;place-items:center;padding:10px}.titleScreen{grid-template-rows:minmax(0,1fr) auto;min-height:calc(100dvh - 48px);position:relative;overflow:hidden}.posterWrap{width:min(1200px,100%);height:min(calc(100dvh - 125px),calc(100vh - 125px));display:grid;place-items:center;min-height:0}.poster{width:100%;height:100%;object-fit:contain;image-rendering:auto}.bigButton{font:12px inherit;padding:15px 20px;background:#b61e12;color:#ffd72d;border:3px solid #f4e3ad;box-shadow:4px 4px #5d120b;cursor:pointer;text-transform:uppercase}.bigButton:active{transform:translate(2px,2px);box-shadow:2px 2px #5d120b}.gamebox{width:min(100vw,980px);height:min(calc(100vh - 68px),810px);border:5px solid #d8caa0;background:#080705;position:relative;overflow:hidden;box-shadow:0 0 0 5px #8f1d13}.topbar{height:112px;display:flex;justify-content:space-between;align-items:center;padding:12px 18px;background:#090807;border-bottom:4px solid #b32012}.logo b{font-size:35px;color:#ffcf24;text-shadow:4px 4px #b52a10;display:block}.logo span{font-size:17px;color:#fff;line-height:1.3}.hud{display:flex;gap:18px;font-size:10px;text-align:right}.hud b{display:block;font-size:24px;color:#ffd02a;margin-top:6px}.hud>div{border:2px solid #6f5a39;padding:9px 12px;background:#111}#arena{height:calc(100% - 205px);position:relative;overflow:hidden;touch-action:none;background:radial-gradient(circle at 50% 20%,#281b0f 0,#120d08 48%,#070605 100%);border-bottom:4px solid #6d4a23}.stageBack{position:absolute;top:18px;left:18px;color:#d9c18d;border:4px solid #604b2d;padding:10px;background:#0c0a07;z-index:2}.stageBack span{font-size:18px}.stageBack small{display:block;font-size:8px;margin-top:7px}.guitarWall{position:absolute;left:24px;top:115px;font-size:62px;color:#8a4725;opacity:.65}.cody{position:absolute;width:64%;max-width:585px;left:50%;bottom:-2%;transform:translateX(-50%);z-index:4;filter:drop-shadow(0 12px 12px rgba(0,0,0,.6))}.cody img{width:100%;display:block;border:4px solid #6e4c2d;background:#0b0805;image-rendering:auto}.cody:after{content:"";position:absolute;inset:4px;background:repeating-linear-gradient(0deg,rgba(0,0,0,.07) 0 2px,transparent 2px 4px);pointer-events:none;mix-blend-mode:multiply}#mouth{position:absolute;left:50%;top:51%;width:15%;height:12%;border-radius:50%;transform:translate(-50%,-50%);pointer-events:none}.meterWrap{position:absolute;right:16px;top:18px;z-index:8;text-align:center}.meterTitle{font-size:10px;line-height:1.35;color:#fff;background:#111;padding:7px 4px;border:3px solid #eee;border-bottom:0}.meter{width:52px;height:315px;border:4px solid #eee;background:#111;padding:4px;position:relative}.meter:before{content:"";position:absolute;inset:4px;background:linear-gradient(to top,#4ee137 0 25%,#f2d330 25% 55%,#f58b22 55% 78%,#e82619 78% 100%);opacity:.25}.meter #fill{position:absolute;bottom:4px;left:4px;right:4px;height:0;background:linear-gradient(to top,#4ee137 0 25%,#f2d330 25% 55%,#f58b22 55% 78%,#e82619 78% 100%);transition:.2s;z-index:1}#status{position:absolute;bottom:12px;left:12px;z-index:9;padding:11px;background:#080808;border:2px solid #e8d7a4;color:#fff;font-size:10px;max-width:65%;line-height:1.3}.nugget{position:absolute;left:8%;bottom:14%;width:92px;z-index:12;cursor:grab;user-select:none;touch-action:none;filter:drop-shadow(3px 4px 0 #4e2c0a);transform:rotate(8deg)}.powerup{position:absolute;right:12%;bottom:17%;width:150px;z-index:11;cursor:pointer;filter:drop-shadow(4px 4px 0 #3c2350);animation:powerPulse .7s infinite alternate}#burst{position:absolute;pointer-events:none;color:#ffd52e;font-size:18px;z-index:20}.controlsRow{height:48px;display:flex;justify-content:space-around;gap:14px;align-items:center;background:#0d0c0a;color:#eee;font-size:7px;padding:7px 10px;text-align:center}.controlsRow b{color:#ffd42a}.feedButton{display:block;width:calc(100% - 24px);margin:6px 12px 12px;padding:13px 10px}.overbox{text-align:center;border:5px solid #d9c899;padding:18px;background:#100604;box-shadow:0 0 40px #a11;width:min(92vw,760px)}.overbox h1{color:#ef2c18;font-size:38px;text-shadow:4px 4px #641008}.overbox img{width:min(72vw,520px);max-height:48vh;object-fit:cover;border:4px solid #7d5a2f}.overbox h2{color:#ff3a20;font-size:13px;line-height:1.4}.overbox p{color:#ffd32a}.rage-1{animation:codyWobble .32s infinite alternate}.rage-2{animation:codyWobble .16s infinite alternate}.rage-3{animation:codyShake .07s infinite}.miss{animation:nuggetMiss .18s}.pop{animation:scorePop .32s forwards}.hot{filter:drop-shadow(0 0 16px rgba(255,60,20,.8)) saturate(1.2)}@keyframes codyWobble{to{transform:translateX(-50%) rotate(.8deg)}}@keyframes codyShake{0%{transform:translateX(-51%)}100%{transform:translateX(-49%)}}@keyframes nuggetMiss{50%{transform:rotate(90deg) scale(1.3)}}@keyframes scorePop{0%{opacity:0;transform:scale(.5)}50%{opacity:1;transform:scale(1.5)}100%{opacity:0;transform:translateY(-25px)}}@keyframes powerPulse{to{transform:scale(1.06) rotate(-2deg)}}
@media(max-width:700px){header{height:42px;padding:6px 8px}header a,header button{font-size:7px;padding:7px}.screen{min-height:calc(100dvh - 42px);padding:0}.titleScreen{height:calc(100dvh - 42px);min-height:0;grid-template-rows:minmax(0,1fr) auto;padding:0 0 max(10px,env(safe-area-inset-bottom))}.posterWrap{height:auto;min-height:0;width:100%;padding:4px}.poster{max-height:calc(100dvh - 112px);object-fit:contain}.titleScreen .bigButton{position:relative;z-index:30;width:calc(100% - 20px);margin:0 10px;min-height:50px;font-size:11px}.gamebox{height:calc(100dvh - 42px);border-width:2px;width:100vw}.topbar{height:90px;padding:8px}.logo b{font-size:24px}.logo span{font-size:11px}.hud{gap:5px;font-size:6px}.hud>div{padding:6px}.hud b{font-size:14px}.cody{width:87%;bottom:3%}.meter{height:240px;width:42px}.meterTitle{font-size:7px}.meterWrap{right:6px}.nugget{width:72px}.powerup{width:112px}.stageBack{transform:scale(.7);transform-origin:top left}.guitarWall{font-size:40px}.controlsRow{height:42px;font-size:6px;line-height:1.35}.feedButton{font-size:9px;padding:11px 6px}.overbox h1{font-size:27px}.overbox h2{font-size:10px}.bigButton{font-size:10px}}