*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{width:100%;height:100%;overflow:hidden;background:#0a0a1a;color:#fff;font-family:system-ui,sans-serif;touch-action:none}#app{position:relative;width:100%;height:100%}#app canvas{position:absolute;top:0;left:0;display:block}#result-row{position:fixed;top:0;left:0;right:0;height:62px;z-index:50;display:flex;align-items:center;justify-content:center;gap:clamp(4px,1.5vw,8px);padding:0 12px}#progress-strip{position:fixed;top:62px;left:0;right:0;height:38px;z-index:50;display:flex;align-items:center;justify-content:center;gap:6px}.progress-dot{width:10px;height:10px;border-radius:50%;background:#ffffff26;transition:background .3s ease,transform .2s ease;flex-shrink:0}.progress-dot.active{background:#ffffff73;transform:scale(1.3)}.progress-dot.done{background:#33d4f5;transform:scale(1)}#game-counter{font-size:12px;color:#ffffff59;margin-left:10px;font-variant-numeric:tabular-nums}.slot{width:clamp(32px,11vw,46px);height:clamp(32px,11vw,46px);border-radius:50%;border:2px solid rgba(255,255,255,.12);background:#ffffff0a;display:flex;align-items:center;justify-content:center;font-size:clamp(11px,3vw,15px);font-weight:700;color:#fff;flex-shrink:0}.slot.filled{border-color:transparent}.slot.pop{animation:slot-pop .25s ease-out forwards}@keyframes slot-pop{0%{transform:scale(.5);opacity:.3}65%{transform:scale(1.15)}to{transform:scale(1);opacity:1}}#splash{position:fixed;top:0;right:0;bottom:0;left:0;z-index:300;display:flex;align-items:center;justify-content:center;background:#0a0a1a;transition:opacity .4s ease;cursor:pointer}#splash.hidden{opacity:0;pointer-events:none}.splash-content{text-align:center;-webkit-user-select:none;user-select:none}.splash-title{font-size:clamp(48px,14vw,80px);font-weight:800;letter-spacing:-.02em;background:linear-gradient(135deg,#ffb347,#c47aff,#33d4f5);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:16px}.splash-sub{font-size:clamp(16px,4vw,22px);color:#ffffff80;letter-spacing:.1em;text-transform:uppercase}#rotate-overlay{display:none;position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;background:#0a0a1a;align-items:center;justify-content:center}@media (orientation: landscape){#rotate-overlay{display:flex}}.rotate-message{font-size:clamp(18px,5vw,28px);font-weight:600;color:#fff9;letter-spacing:.05em}#summary{position:fixed;top:0;right:0;bottom:0;left:0;z-index:200;display:flex;flex-direction:column;align-items:center;background:#0a0a1a;transition:opacity .4s ease;overflow-y:auto;padding:24px 16px 32px}#summary.hidden{opacity:0;pointer-events:none}.summary-title{font-size:clamp(22px,6vw,32px);font-weight:800;letter-spacing:-.01em;background:linear-gradient(135deg,#ffb347,#c47aff,#33d4f5);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:20px;flex-shrink:0}.summary-lines{width:100%;max-width:480px;display:flex;flex-direction:column;gap:10px;flex-shrink:0}.summary-line{display:flex;align-items:center;gap:8px}.summary-line-label{font-size:11px;font-weight:600;color:#ffffff59;width:28px;flex-shrink:0;text-align:right}.summary-balls{display:flex;gap:clamp(3px,1vw,6px);flex-wrap:nowrap}.summary-ball{width:clamp(28px,9vw,40px);height:clamp(28px,9vw,40px);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:clamp(10px,2.8vw,14px);font-weight:700;color:#fff;flex-shrink:0}#play-again-btn{margin-top:28px;padding:14px 40px;font-size:16px;font-weight:700;font-family:system-ui,sans-serif;background:linear-gradient(135deg,#c47aff,#33d4f5);color:#fff;border:none;border-radius:12px;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;flex-shrink:0}#play-again-btn:active{opacity:.8}#dev-controls{position:fixed;bottom:20px;left:0;right:0;z-index:100;display:flex;justify-content:space-between;align-items:flex-end;padding:0 20px;pointer-events:none}#dpad{display:grid;grid-template-areas:". up ." "left . right" ". down .";grid-template-columns:44px 44px 44px;grid-template-rows:44px 44px 44px;gap:4px;pointer-events:auto}.dpad-btn{font-size:18px;background:#1e3a5f;color:#fff;border:1px solid #3a6090;border-radius:8px;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;touch-action:none;display:flex;align-items:center;justify-content:center}.dpad-btn:active{background:#2a5080}.dpad-up{grid-area:up}.dpad-left{grid-area:left}.dpad-right{grid-area:right}.dpad-down{grid-area:down}#shake-btn{padding:12px 22px;font-size:15px;font-weight:600;font-family:system-ui,sans-serif;background:#1e3a5f;color:#fff;border:1px solid #3a6090;border-radius:10px;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;pointer-events:auto}#shake-btn:active{background:#2a5080}