:root{--void: #05070c;--panel: #0c1119;--panel2: #131b28;--edge: #24406b;--cyan: #7fd4ff;--cyan-d: #3a7fa8;--amber: #ffc23b;--red: #ff3b30;--green: #43e08a;--text: #c9d8ee;--dim: #6f89ad;--ad-w: 320px;--ad-h: 50px}*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{height:100%}body{min-height:100dvh;background:#000;overflow:hidden;display:flex;align-items:center;justify-content:center;font-family:ui-monospace,SF Mono,Menlo,Courier New,monospace;-webkit-font-smoothing:none;text-rendering:optimizeSpeed;user-select:none;-webkit-user-select:none;color:var(--text);letter-spacing:1px}button{font-family:inherit}.device{position:relative;width:min(440px,100vw);height:min(900px,100dvh);background:var(--void);display:flex;flex-direction:column;border:2px solid var(--edge);box-shadow:0 0 40px #7fd4ff14}.topbar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:8px;background:linear-gradient(180deg,var(--panel2),var(--panel));border-bottom:2px solid var(--edge);padding:calc(6px + env(safe-area-inset-top)) 10px 6px;z-index:10}.lives{display:flex;gap:4px;align-items:center}.life{width:16px;height:10px;background-image:var(--life-icon);background-size:contain;background-repeat:no-repeat;image-rendering:pixelated;transition:opacity .15s linear}.life.lost{opacity:.28}.life.empty{display:none}.score{font-size:22px;color:#fff;text-shadow:0 0 10px rgba(127,212,255,.45);font-variant-numeric:tabular-nums}.best{font-size:11px;color:var(--dim);text-align:right;font-variant-numeric:tabular-nums}.scanner{display:block;width:100%;height:18px;background:#070b12;border-bottom:1px solid var(--edge);image-rendering:pixelated}#fieldwrap{position:relative;flex:1;background:var(--void);overflow:hidden;touch-action:none}#field-canvas{display:block;width:100%;height:100%;image-rendering:pixelated}.buffs{position:absolute;top:8px;left:0;right:0;display:flex;justify-content:center;gap:6px;z-index:5;pointer-events:none}.chip{font-size:11px;padding:3px 8px;border:1px solid currentColor;background:#05070cb3;display:none}.chip.on{display:block}.chip.shield{color:var(--cyan)}.chip.medal{color:var(--amber)}.countdown{position:absolute;inset:0;display:none;flex-direction:column;align-items:center;justify-content:center;z-index:15;pointer-events:none;text-align:center}.countdown.show{display:flex}.cd-label{font-size:13px;color:var(--cyan);letter-spacing:3px}.cd-n{font-size:76px;color:#fff;line-height:1.1;text-shadow:0 0 24px rgba(127,212,255,.7)}.prompt{position:absolute;inset:0;display:none;align-items:center;justify-content:center;z-index:16;pointer-events:none}.prompt.show{display:flex}.prompt-box{border:2px solid var(--cyan);background:#05070cd1;padding:16px 26px;text-align:center;box-shadow:0 0 24px #7fd4ff59}.prompt-title{font-size:17px;letter-spacing:4px;color:var(--cyan)}.prompt-hand{margin-top:8px;font-size:22px;color:#fff;animation:swipe 1s ease-in-out infinite alternate}@keyframes swipe{0%{transform:translate(-34px)}to{transform:translate(34px)}}.bonus-hud{position:absolute;bottom:12px;left:0;right:0;display:none;justify-content:center;font-size:14px;letter-spacing:3px;color:var(--amber);z-index:6;pointer-events:none;text-shadow:0 0 10px rgba(255,194,59,.5)}.bonus-hud.show{display:flex}.callout{position:absolute;left:0;right:0;display:none;justify-content:center;text-align:center;z-index:14;pointer-events:none}.callout.show{display:flex}.callout.warn{top:14%;font-size:15px;letter-spacing:3px;color:var(--red);text-shadow:0 0 12px rgba(255,59,48,.7);animation:blink .4s steps(2) infinite}@keyframes blink{50%{opacity:.15}}.callout.yahoo{top:26%;font-size:34px;letter-spacing:3px;color:var(--amber);text-shadow:0 0 18px rgba(255,194,59,.8),3px 3px 0 #8a4b00;animation:yahoo .5s ease-out}@keyframes yahoo{0%{transform:scale(.4) rotate(-8deg);opacity:0}60%{transform:scale(1.15) rotate(3deg);opacity:1}to{transform:scale(1) rotate(0);opacity:1}}.callout.evaded{top:20%;font-size:17px;letter-spacing:3px;color:var(--green);text-shadow:0 0 14px rgba(67,224,138,.7)}.screen{position:absolute;inset:0;display:none;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:#05070cdb;z-index:20;text-align:center;padding:20px}.screen.show{display:flex}.ad-banner{display:none;position:absolute;left:0;right:0;bottom:0;z-index:25;height:calc(var(--ad-h) + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);overflow:hidden;background:var(--panel);border-top:2px solid var(--edge);text-align:center;transform:translateZ(0)}.ad-banner .adsbygoogle{min-height:var(--ad-h)}.ad-dev{display:inline-flex;align-items:center;justify-content:center;width:var(--ad-w);height:var(--ad-h);background:#fff;color:#05070c;font-size:11px;letter-spacing:2px}#fieldwrap:has(#screen-title.show) .ad-banner,#fieldwrap:has(#screen-over.show) .ad-banner{display:block}#fieldwrap:has(#screen-title.show) #screen-title{padding-bottom:var(--ad-h)}#fieldwrap:has(#screen-over.show) #screen-over{padding-bottom:calc(20px + var(--ad-h))}#device.ad-first-visit:has(#screen-title.show) .ad-banner{display:none}#device.ad-first-visit:has(#screen-title.show) #screen-title{padding-bottom:0}#screen-title{background:linear-gradient(180deg,#05070c59,#05070cc7 32% 68%,#05070c40)}.cabinet{padding:0;gap:0;justify-content:space-between;--band-h: 16%}.marquee,.deck{flex:none;width:100%;height:var(--band-h);background:var(--panel) center / cover no-repeat;display:flex;align-items:center;justify-content:center}.marquee{background-image:url(src/assets/hero.png);border-bottom:2px solid var(--edge)}.deck{background-image:url(src/assets/deck.png);padding:0;cursor:pointer;touch-action:manipulation;width:auto;align-self:stretch;margin:0 12px 12px;border:2px solid var(--edge);border-radius:26px/34px;box-shadow:inset 0 0 12px #7fd4ff29,0 0 22px #05070ccc}.deck:active{filter:brightness(1.25)}.cab-screen{flex:1;width:100%;min-height:0;padding:12px;display:flex}.cab-glass{flex:1;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;border:2px solid var(--edge);border-radius:26px/34px;box-shadow:inset 0 0 30px #05070c8c,inset 0 0 12px #7fd4ff29,0 0 22px #05070ccc;background:radial-gradient(ellipse at center,#05070c00,#05070c2e 62%,#05070c80)}.app-version{position:absolute;right:16px;bottom:10px;font-size:10px;letter-spacing:1px;color:var(--dim);font-variant-numeric:tabular-nums;pointer-events:none}.board{list-style:none;width:min(210px,70%);margin:6px 0 2px;font-size:13px;letter-spacing:2px}.board li{display:flex;justify-content:space-between;align-items:baseline;gap:8px;padding:2px 0}.board-name{color:var(--cyan)}.board-score{color:var(--text);font-variant-numeric:tabular-nums}.board li:first-child:not(.board-you) .board-name,.board li:first-child:not(.board-you) .board-score{color:var(--amber)}.board li.board-you .board-name,.board li.board-you .board-score{color:var(--amber);text-shadow:0 0 10px rgba(255,194,59,.55)}.score-line{font-size:14px;letter-spacing:3px;color:var(--amber);margin-top:4px}.runs-line{font-size:11px;letter-spacing:3px;color:var(--dim)}.logo{font-size:40px;letter-spacing:8px;color:var(--cyan);text-shadow:0 0 20px rgba(127,212,255,.6)}.sub{font-size:12px;color:var(--dim);letter-spacing:4px}.screen h2{font-size:20px;letter-spacing:4px;color:var(--red)}.final{font-size:46px;color:#fff;font-variant-numeric:tabular-nums}.dim{font-size:13px;color:var(--dim);line-height:1.6}.tiny{font-size:11px;color:var(--dim)}.newbest{font-size:14px;color:var(--amber);letter-spacing:3px}.initials{display:flex;flex-direction:column;align-items:center;gap:4px;font-size:11px;letter-spacing:3px;color:var(--dim)}.initials-in{width:108px;padding:6px 0 6px 8px;font:22px ui-monospace,SF Mono,Menlo,Courier New,monospace;letter-spacing:8px;text-align:center;text-transform:uppercase;color:var(--cyan);background:var(--panel);border:1px solid var(--edge);border-radius:0;-webkit-appearance:none}.initials-in:focus{outline:none;border-color:var(--cyan);box-shadow:0 0 12px #7fd4ff59}.initials-in::placeholder{color:var(--edge)}.btn-share-title{margin-top:10px;padding:8px 18px;font-size:11px}.btn{margin-top:8px;padding:14px 26px;font-size:15px;letter-spacing:3px;color:var(--void);background:var(--cyan);border:none;cursor:pointer;touch-action:manipulation}.btn:active{transform:translateY(1px)}.btn.primary{box-shadow:0 0 18px #7fd4ff66}.btn.ghost{margin-top:4px;padding:11px 22px;font-size:13px;color:var(--dim);background:none;border:1px solid var(--edge)}
