.widget-hud{position:absolute;top:12px;left:16px;right:16px;display:flex;flex-direction:column;gap:8px;z-index:15;pointer-events:none}.hud-top-row{display:flex;justify-content:space-between;align-items:center;font-weight:700;text-shadow:0 2px 4px rgba(0,0,0,.7)}.hud-status-group{display:flex;align-items:center;gap:8px}.hud-timer{font-size:1rem;color:#38bdf8;background:#0f172ad9;padding:4px 12px;border-radius:9999px;border:1px solid rgba(56,189,248,.4);font-variant-numeric:tabular-nums;letter-spacing:.05em}.hud-stage-title{font-size:1rem;color:#38bdf8;background:#0f172ab3;padding:4px 12px;border-radius:9999px;border:1px solid rgba(56,189,248,.3)}.hud-coins{display:flex;align-items:center;gap:5px;font-size:1rem;color:#facc15;background:#0f172ab3;padding:4px 10px;border-radius:9999px;border:1px solid rgba(250,204,21,.3);font-weight:700}.hud-churu-icon{height:20px;width:auto;image-rendering:pixelated;image-rendering:crisp-edges}.hud-progress-container{display:flex;flex-direction:column;gap:4px;background:#0f172a99;padding:8px 12px;border:2px solid #0e0920;box-shadow:0 3px #0e0920,inset 0 0 0 2px #69418d}.hud-progress-labels{display:flex;justify-content:space-between;font-size:.75rem;color:#94a3b8;font-weight:600}.hud-progress-bar-bg{position:relative;width:100%;height:17px;background:#202a50;border:3px solid #110d24;box-shadow:inset 0 0 0 2px #4b6dba,0 2px #110d24;overflow:visible}.hud-progress-bar-fill{height:100%;background:repeating-linear-gradient(90deg,#5eaff0 0,#5eaff0 10px,#73c5f3 10px,#73c5f3 20px);box-shadow:inset 0 -3px #3565b4;transition:width .1s linear}.hud-progress-cat-icon{position:absolute;top:50%;width:29px;height:29px;object-fit:contain;transform:translate(-50%,-50%);image-rendering:pixelated;transition:left .1s linear}.hud-pause-btn{pointer-events:auto;background:transparent;border:none;padding:0;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;touch-action:manipulation;transition:transform .1s ease,filter .15s ease;filter:drop-shadow(0 2px 4px rgba(0,0,0,.6))}.hud-pause-btn:hover{transform:scale(1.08);filter:drop-shadow(0 0 6px rgba(56,189,248,.8)) brightness(1.1)}.hud-pause-btn:active{transform:scale(.92)}.hud-pause-btn-img{width:32px;height:32px;object-fit:contain;image-rendering:pixelated;image-rendering:crisp-edges;display:block}@media(max-width:768px){.widget-hud{left:8px;right:8px;top:8px}.hud-top-row{flex-wrap:wrap;gap:5px}.hud-stage-title,.hud-timer,.hud-coins{font-size:.78rem;padding:3px 7px}.hud-status-group{gap:5px}.hud-progress-labels{font-size:.65rem}.hud-pause-btn-img{width:28px;height:28px}}.widget-game-canvas{width:100%;height:100%;display:block;image-rendering:crisp-edges;image-rendering:pixelated}.ranking-board-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;z-index:20;display:flex;justify-content:center;align-items:center;background:#020617b3;padding:16px}.ranking-board{width:min(520px,100%);max-height:100%;display:flex;flex-direction:column;background:#1e293b;border:2px solid #334155;border-radius:16px;padding:16px 20px;box-shadow:0 12px 32px #00000080;text-align:center}.ranking-board-header{display:flex;justify-content:space-between;align-items:center}.ranking-board-header h2{font-size:1.5rem;color:#facc15}.ranking-board-close{background:transparent;border:none;color:#94a3b8;font-size:1.3rem;cursor:pointer;padding:4px 8px}.ranking-board-close:hover{color:#f8fafc}.ranking-board-sub{font-size:.8rem;color:#94a3b8;margin:2px 0 10px;text-align:left}.ranking-board-body{overflow-y:auto;min-height:120px}.ranking-board-state{display:flex;flex-direction:column;align-items:center;gap:12px;color:#cbd5e1;padding:32px 0}.ranking-table{width:100%;border-collapse:collapse;font-size:.95rem}.ranking-table th{position:sticky;top:0;background:#1e293b;color:#94a3b8;font-weight:600;padding:6px 4px;border-bottom:1px solid #334155}.ranking-table td{padding:7px 4px;border-bottom:1px solid rgba(51,65,85,.5);color:#e2e8f0}.ranking-table .ranking-nickname{max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ranking-table tr.is-me td{background:#38bdf82e;color:#38bdf8;font-weight:700}.ui-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;justify-content:center;align-items:center;background:#0f172abf;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);z-index:10;padding:24px;text-align:center}.btn{padding:12px 28px;border:none;border-radius:9999px;font-size:1.1rem;font-weight:700;cursor:pointer;transition:transform .1s ease,background-color .2s ease,opacity .2s ease;touch-action:manipulation}.btn:active{transform:scale(.93)}.btn-primary{background-color:#38bdf8;color:#0f172a}.btn-primary:hover{background-color:#0ea5e9}.btn-secondary{background-color:#334155;color:#f8fafc}.btn-secondary:hover{background-color:#475569}.btn-pixel{background:transparent;border:none;padding:0;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;touch-action:manipulation;transition:transform .1s ease,filter .1s ease;filter:drop-shadow(0 4px 6px rgba(0,0,0,.5))}.btn-pixel:hover{filter:drop-shadow(0 4px 10px rgba(255,255,255,.25)) brightness(1.08)}.btn-pixel:active{transform:scale(.9)}.btn-pixel-img{image-rendering:pixelated;image-rendering:crisp-edges;height:72px;width:auto;display:block}.submit-score-form{display:flex;flex-direction:column;align-items:center;gap:6px;margin-bottom:16px}.submit-score-row{display:flex;gap:8px}.submit-score-input{width:180px;padding:10px 14px;border-radius:9999px;border:2px solid #334155;background:#0f172a;color:#f8fafc;font-size:1rem;outline:none;user-select:text;-webkit-user-select:text}.submit-score-input:focus{border-color:#38bdf8}.submit-score-button{padding:10px 18px;font-size:1rem}.submit-score-button:disabled{opacity:.6;cursor:default}.submit-score-message{font-size:.9rem;margin-bottom:0}.submit-score-message--ok{color:#4ade80;font-weight:600;margin-bottom:16px}.submit-score-message--error{color:#f87171}.pause-overlay-content{display:flex;flex-direction:column;align-items:center;justify-content:center;animation:fadeIn .15s ease-out}.pause-title{font-size:2.2rem;color:#38bdf8;margin-bottom:8px;text-shadow:0 4px 12px rgba(0,0,0,.8);font-weight:800;letter-spacing:.05em}.pause-desc{color:#94a3b8;font-size:1rem;margin-bottom:24px}.pause-btn-wrap{display:flex;flex-direction:column;align-items:center;gap:12px}.pause-play-btn{background:transparent;border:none;padding:0;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;touch-action:manipulation;transition:transform .1s ease,filter .15s ease;filter:drop-shadow(0 6px 12px rgba(0,0,0,.6))}.pause-play-btn:hover{transform:scale(1.08);filter:drop-shadow(0 0 16px rgba(56,189,248,.6)) brightness(1.1)}.pause-play-btn:active{transform:scale(.94)}.pause-play-btn-img{width:80px;height:80px;object-fit:contain;image-rendering:pixelated;image-rendering:crisp-edges;display:block}.pause-key-hint{font-size:.85rem;color:#64748b;margin-top:4px}@keyframes fadeIn{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}.mobile-dpad-container{display:none;position:absolute;bottom:44px;left:24px;width:180px;height:180px;z-index:10;pointer-events:auto}@media(max-width:768px),(pointer:coarse){.mobile-dpad-container{display:block}}.dpad-btn{position:absolute;background:transparent;border:none;padding:0;cursor:pointer;touch-action:none;-webkit-tap-highlight-color:transparent;transition:transform .08s ease,filter .08s ease}.dpad-btn:active{transform:scale(.88);filter:brightness(1.3)}.dpad-img{width:56px;height:56px;image-rendering:pixelated;image-rendering:crisp-edges;display:block;filter:drop-shadow(0 2px 4px rgba(0,0,0,.6))}.dpad-up{top:0;left:50%;transform:translate(-50%)}.dpad-up:active{transform:translate(-50%) scale(.88)}.dpad-left{top:50%;left:0;transform:translateY(-50%)}.dpad-left:active{transform:translateY(-50%) scale(.88)}.dpad-right{top:50%;right:0;transform:translateY(-50%)}.dpad-right:active{transform:translateY(-50%) scale(.88)}.dpad-down{bottom:0;left:50%;transform:translate(-50%)}.dpad-down:active{transform:translate(-50%) scale(.88)}.widget-event-banner{position:absolute;top:110px;left:50%;transform:translate(-50%);z-index:16;pointer-events:none;display:flex;align-items:center;gap:8px;max-width:calc(100% - 32px);padding:8px 16px;background:#0f172ae0;border:2px solid #0e0920;box-shadow:0 3px #0e0920,inset 0 0 0 2px #f59e0b;color:#fde68a;font-weight:800;font-size:1.05rem;text-shadow:0 2px 3px rgba(0,0,0,.7);white-space:nowrap;animation:event-banner-pop .35s ease-out}.event-banner-badge{flex-shrink:0;font-size:.7rem;letter-spacing:.08em;color:#0f172a;background:#f59e0b;padding:2px 6px;text-shadow:none}.event-banner-text{overflow:hidden;text-overflow:ellipsis}@keyframes event-banner-pop{0%{transform:translate(-50%) scale(.7);opacity:0}70%{transform:translate(-50%) scale(1.06);opacity:1}to{transform:translate(-50%) scale(1)}}@media(max-width:768px){.widget-event-banner{top:92px;font-size:.8rem;padding:6px 10px;white-space:normal;text-align:center}}.game-page-container{width:100%;height:100%;display:flex;justify-content:center;align-items:center}.game-frame{position:relative;width:100%;max-width:960px;height:100%;max-height:540px;background-color:#1e293b;overflow:hidden;box-shadow:0 10px 25px -5px #00000080;display:flex;flex-direction:column}@media(max-width:768px){.game-frame{max-width:100%;max-height:100dvh;border-radius:0}}.controls-hint-bar{position:absolute;bottom:16px;left:0;right:0;text-align:center;font-size:.85rem;color:#94a3b8;z-index:5;pointer-events:none}*{box-sizing:border-box;margin:0;padding:0;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}html,body{width:100%;height:100%;height:100dvh;overflow:hidden;background-color:#0f172a;color:#f8fafc;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;touch-action:manipulation}#root{width:100%;height:100%;display:flex;justify-content:center;align-items:center}img[class*=pixel],img.dpad-img,img.btn-pixel-img,img.hud-churu-icon,canvas{image-rendering:crisp-edges;image-rendering:pixelated}
