*{box-sizing:border-box;margin:0;padding:0}html,body,#app{touch-action:manipulation;-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%;width:100%;height:100%;font-family:Segoe UI,PingFang SC,Microsoft YaHei,sans-serif;overflow:hidden}#game-canvas{touch-action:none;width:100%;height:100%;display:block}#ui-overlay{pointer-events:none;z-index:10;position:fixed;inset:0}#ui-overlay .screen-panel,#ui-overlay button{pointer-events:auto}#start-screen{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);z-index:20;pointer-events:auto;-webkit-overflow-scrolling:touch;background:#1e3c788c;justify-content:center;align-items:flex-start;padding:20px 16px;display:flex;position:fixed;inset:0;overflow:hidden auto}#start-screen.hidden{display:none}.screen-panel{text-align:center;background:linear-gradient(145deg,#fff9e6,#ffe0b2);border:4px solid #ffb74d;border-radius:28px;flex-shrink:0;max-width:480px;margin:auto;padding:40px 48px;box-shadow:0 12px 40px #00000040}.screen-panel.hidden{display:none}#start-screen .screen-panel:not(.hidden){display:block}.logo{color:#e65100;margin-bottom:12px;font-size:2rem;font-weight:800}.win-title{color:#2e7d32;font-size:2.4rem}.subtitle{color:#5d4037;margin-bottom:20px;font-size:1.15rem;line-height:1.5}.instructions{text-align:left;color:#4e342e;background:#ffffffb3;border-radius:16px;margin-bottom:24px;padding:16px 20px;font-size:1.05rem;line-height:2}.big-btn{color:#fff;cursor:pointer;background:linear-gradient(135deg,#66bb6a,#43a047);border:none;border-radius:999px;padding:16px 48px;font-size:1.4rem;font-weight:700;transition:transform .1s,box-shadow .1s;box-shadow:0 6px #2e7d32,0 8px 20px #0003}.big-btn:hover{transform:translateY(-2px);box-shadow:0 8px #2e7d32,0 10px 24px #00000040}.big-btn:active{transform:translateY(4px);box-shadow:0 2px #2e7d32}.loader{border:5px solid #ffe0b2;border-top-color:#ff9800;border-radius:50%;width:48px;height:48px;margin:20px auto 0;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.stars{letter-spacing:8px;margin:16px 0;font-size:2.5rem}#win-panel{position:relative;overflow:hidden}.fireworks span{border-radius:50%;width:8px;height:8px;animation:1.6s ease-out infinite firework;position:absolute}.fireworks span:first-child{background:#ff5252;animation-delay:0s;top:20%;left:15%}.fireworks span:nth-child(2){background:#ffeb3b;animation-delay:.3s;top:30%;left:80%}.fireworks span:nth-child(3){background:#69f0ae;animation-delay:.6s;top:70%;left:25%}.fireworks span:nth-child(4){background:#40c4ff;animation-delay:.9s;top:60%;left:70%}.fireworks span:nth-child(5){background:#e040fb;animation-delay:1.2s;top:15%;left:50%}@keyframes firework{0%{opacity:1;transform:scale(0);box-shadow:0 0}50%{opacity:1;transform:scale(1);box-shadow:0 0 20px 8px}to{opacity:0;transform:scale(2);box-shadow:0 0 40px 16px #0000}}#hand-debug-panel{color:#a5f3b5;z-index:6;background:#000000bf;border:2px solid #66bb6a;border-radius:12px;width:320px;padding:10px 12px;font-family:monospace;font-size:.75rem;line-height:1.5;position:fixed;bottom:270px;right:16px}#hand-debug-panel.hidden{display:none}.hdb-title{color:#fff;margin-bottom:4px;font-weight:700}#pose-debug{z-index:5;background:#000;border:3px solid #81c784;border-radius:16px;width:320px;height:240px;position:fixed;bottom:16px;right:16px;box-shadow:0 4px 16px #0003}.home-wide{width:100%;max-width:560px}.home-name-row{text-align:center;margin-bottom:4px}.home-name-input{margin-bottom:4px;max-width:240px!important;padding:10px 16px!important;font-size:1.1rem!important}.game-cards{flex-direction:column;gap:12px;display:flex}.game-card{text-align:left;background:#ffffffd1;border:3px solid #ffb74d;border-radius:18px;flex-direction:column;gap:8px;padding:14px 18px;display:flex}.game-card-dance{border-color:#ec407a}.game-card-sandbox{border-color:#43a047}.game-card-header{align-items:center;gap:10px;display:flex}.game-card-icon{font-size:1.6rem;line-height:1}.game-card-title{color:#e65100;font-size:1.05rem;font-weight:800}.game-card-dance .game-card-title{color:#c2185b}.game-card-sandbox .game-card-title{color:#2e7d32}.game-card-desc{color:#5d4037;font-size:.88rem;line-height:1.5}.game-card-rules{color:#6d4c41;background:#ffffffb3;border-radius:10px;padding:7px 12px;font-size:.82rem;line-height:1.75}.game-card-btn{align-self:flex-end;margin-top:2px;padding:10px 28px!important;font-size:1rem!important}.game-card-btn-dance{background:linear-gradient(135deg,#f48fb1,#ec407a)!important;box-shadow:0 6px #c2185b,0 8px 20px #0003!important}.game-card-btn-sandbox{background:linear-gradient(135deg,#81c784,#43a047)!important;box-shadow:0 6px #2e7d32,0 8px 20px #0003!important}.game-card-btn:disabled{opacity:.45;cursor:not-allowed}.game-card-preview-wrap{aspect-ratio:16/7;background:#e8e0d0;border-radius:12px;width:100%;position:relative;overflow:hidden}.game-card-preview{object-fit:cover;width:100%;height:100%;display:block}.game-card-preview-badge{flex-direction:column;align-items:flex-end;gap:4px;display:flex;position:absolute;top:7px;right:8px}.badge-cam{color:#fff;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0000008c;border-radius:999px;padding:3px 8px;font-size:.74rem;font-weight:700;line-height:1.4}body.control-camera .rule-touch,body.control-touch .rule-camera{display:none}.tutorial-steps div{margin-bottom:8px}.dance-touch-hint{color:#c62828;margin-top:4px;font-size:.85rem;font-weight:600}.menu-wide{max-width:520px}.game-picker{flex-direction:column;gap:14px;margin-top:8px;display:flex}.game-btn{text-align:center;flex-direction:column;align-items:center;gap:4px;display:flex;padding:18px 24px!important}.game-btn-icon{font-size:2rem;line-height:1}.game-btn-title{font-size:1.15rem;font-weight:800}.game-btn-desc{opacity:.85;font-size:.85rem;font-weight:500}.game-btn-dance{background:linear-gradient(145deg,#f48fb1,#ec407a)!important}.game-btn-sandbox{background:linear-gradient(145deg,#81c784,#43a047)!important}.game-btn:disabled{opacity:.45;cursor:not-allowed}.secondary-btn{margin-top:10px;background:linear-gradient(145deg,#90caf9,#42a5f5)!important;padding:14px 28px!important;font-size:1rem!important}body.game-dance #game-canvas{position:fixed;top:0;left:0;width:50%!important;height:100%!important}body.game-dance #pose-video{object-fit:cover;z-index:1;width:50%;height:100%;position:fixed;top:0;right:0;transform:scaleX(-1);display:block!important}body.game-dance #pose-debug{z-index:2;border:none;border-left:4px solid #ec407a;border-radius:0;width:50%;height:100%;inset:0 0 auto auto}body.game-dance #leaderboard-panel{display:none}body.game-dance #hud{display:none!important}#dance-hud{z-index:15;pointer-events:none;width:50%;display:none;position:fixed;bottom:0;left:0}.dance-hud-bar{background:#ffffffeb;border-top:4px solid #ec407a;flex-wrap:wrap;justify-content:space-around;align-items:center;gap:8px;padding:12px 16px;display:flex}.dance-hud-label{color:#888;font-size:.75rem;font-weight:600;display:block}.dance-hud-move span:last-child,.dance-hud-progress span:last-child,.dance-hud-score span:last-child,.dance-hud-total span:last-child{color:#e65100;font-size:1.2rem;font-weight:800}.dance-hud-hint{color:#fff;z-index:16;white-space:nowrap;background:#ec407ae6;border-radius:20px;padding:10px 24px;font-size:1.1rem;font-weight:700;position:fixed;top:16px;left:25%;transform:translate(-50%)}.dance-countdown{color:#ec407a;text-shadow:0 4px 20px #0003;z-index:16;pointer-events:none;font-size:6rem;font-weight:900;position:fixed;top:50%;left:25%;transform:translate(-50%,-50%)}.dance-countdown.hidden{display:none}.dance-stars{z-index:16;pointer-events:none;font-size:3rem;position:fixed;top:40%;left:25%;transform:translate(-50%,-50%)}.dance-stars.hidden{display:none}.dance-match-bar{z-index:16;background:#00000026;border-radius:6px;width:40%;height:12px;position:fixed;bottom:72px;left:5%;overflow:hidden}.dance-match-bar.hidden{display:none}.dance-match-fill{border-radius:6px;width:0%;height:100%;transition:width .15s,background .15s}#hud,#sandbox-hud{pointer-events:none;z-index:10;display:none;position:fixed;inset:0}#sandbox-hud .hotbar-wrap{bottom:max(12px, env(safe-area-inset-bottom));pointer-events:auto;-webkit-overflow-scrolling:touch;background:#ffffffeb;border:3px solid #d4c4a8;border-radius:20px;max-width:calc(100vw - 24px);padding:8px 10px;position:fixed;left:50%;overflow-x:auto;transform:translate(-50%);box-shadow:0 4px 16px #0000001f}#sandbox-hud .hotbar{gap:8px;display:flex}.hotbar-btn{cursor:pointer;background:#f5f0e8e6;border:2px solid #0000001a;border-radius:12px;flex-direction:column;flex-shrink:0;align-items:center;gap:2px;width:56px;padding:6px 4px 4px;transition:transform .1s,border-color .1s;display:flex}.hotbar-swatch{border:1px solid #0000001f;border-radius:4px;width:32px;height:20px}.hotbar-emoji{font-size:.85rem;line-height:1}.hotbar-label{color:#5d4037;font-size:.62rem;font-weight:700;line-height:1.1}.hotbar-btn.selected{background:#fff8e6f2;border-color:#c9a050;transform:scale(1.06);box-shadow:0 0 0 2px #c9a05059}.hotbar-btn:active{transform:scale(.96)}#sandbox-hud .hud-hint{bottom:max(100px, calc(90px + env(safe-area-inset-bottom)))}.gesture-mode-badge{top:max(12px, env(safe-area-inset-top));text-align:center;pointer-events:none;background:#ffffffeb;border:3px solid #d4c4a8;border-radius:16px;min-width:200px;padding:10px 20px;position:fixed;left:50%;transform:translate(-50%);box-shadow:0 4px 16px #0000001a}.gesture-mode-badge.mode-place{background:#e8f5e9f2;border-color:#66bb6a}.gesture-mode-badge.mode-break{background:#ffebeef2;border-color:#ef5350}.gesture-mode-badge.mode-neutral{border-color:#d4c4a8}.gesture-mode-label{color:#4e342e;font-size:1.15rem;font-weight:800}.gesture-mode-hint{color:#6d4c41;margin-top:2px;font-size:.82rem}.hand-indicators{justify-content:center;gap:8px;margin-top:8px;display:flex}.hand-tag{color:#9e9e9e;background:#0000000f;border:2px solid #0000;border-radius:999px;padding:4px 10px;font-size:.78rem;font-weight:700}.hand-tag-left.active{color:#2e7d32;background:#66bb6a33;border-color:#66bb6a}.hand-tag-right.active{color:#c62828;background:#ef535033;border-color:#ef5350}body.mode-place #game-canvas{box-shadow:inset 0 0 0 4px #66bb6a8c}body.mode-break #game-canvas{box-shadow:inset 0 0 0 4px #ef53508c}#hud{inset:16px 16px auto auto}.hud-right{justify-content:flex-end;gap:12px;display:flex}.hud-panel{background:#ffffffeb;border:3px solid #ffb74d;border-radius:20px;min-width:90px;padding:12px 20px;box-shadow:0 4px 16px #00000026}.hud-label{color:#8d6e63;font-size:.85rem;font-weight:600}.hud-value{color:#e65100;font-size:2.4rem;font-weight:800;line-height:1.1}.hud-hearts{letter-spacing:4px;margin-top:4px;font-size:1.6rem}.hud-hint{color:#4e342e;z-index:10;background:#ffffffeb;border:3px solid #81c784;border-radius:999px;padding:10px 22px;font-size:1rem;font-weight:600;position:fixed;bottom:20px;left:50%;transform:translate(-50%);box-shadow:0 4px 16px #0000001f}.hud-pause{color:#fff;z-index:12;pointer-events:none;background:#1e3c78e0;border-radius:24px;padding:24px 40px;font-size:1.6rem;font-weight:700;display:none;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 8px 32px #00000040}.gameover-title{color:#c62828;font-size:2.2rem}.gameover-score{color:#1565c0;margin-bottom:24px;font-size:1.5rem;font-weight:700}.name-input{text-align:center;border:3px solid #ffb74d;border-radius:16px;outline:none;width:100%;max-width:280px;margin-bottom:12px;padding:14px 20px;font-size:1.3rem}.name-input:focus{border-color:#ff9800;box-shadow:0 0 0 3px #ff980040}.login-error{color:#c62828;margin-bottom:12px;font-size:.95rem}.login-error.hidden{display:none}#leaderboard-panel{z-index:8;pointer-events:none;background:#ffffffeb;border:3px solid #ffb74d;border-radius:20px;flex-direction:column;width:220px;padding:16px 14px;display:flex;position:fixed;top:16px;bottom:16px;left:16px;box-shadow:0 4px 16px #00000026}#leaderboard-panel.hidden{display:none}.lb-title{color:#e65100;margin-bottom:4px;font-size:1.15rem;font-weight:800}.lb-sub{color:#795548;border-bottom:2px dashed #ffe0b2;margin-bottom:12px;padding-bottom:10px;font-size:.85rem}.lb-list{flex:1;list-style:none;overflow-y:auto}.lb-item{color:#4e342e;border-radius:10px;align-items:center;gap:6px;padding:8px 6px;font-size:.95rem;display:flex}.lb-item-me{background:#c8e6c9b3;font-weight:700}.lb-rank{text-align:center;flex-shrink:0;width:28px}.lb-name{text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.lb-score{color:#1565c0;text-align:right;min-width:28px;font-weight:800}.lb-empty{color:#8d6e63;text-align:center;padding:20px 8px;font-size:.9rem}.lb-empty.hidden{display:none}.game-back-btn{z-index:15;pointer-events:auto;color:#5d4037;cursor:pointer;background:#ffffffeb;border:2px solid #ffb74d;border-radius:999px;padding:10px 22px;font-size:.95rem;font-weight:700;transition:transform .1s,box-shadow .1s;position:fixed;top:16px;left:252px;box-shadow:0 4px 14px #00000026}.game-back-btn:hover{transform:translateY(-2px);box-shadow:0 6px 18px #0003}.game-back-btn:active{transform:translateY(2px);box-shadow:0 2px 6px #00000026}.game-back-btn.hidden{display:none}body.game-dance .game-back-btn{left:16px}#touch-controls{pointer-events:none;z-index:9;position:fixed;inset:0}#touch-controls.hidden{display:none}.touch-drag-zone{pointer-events:auto;touch-action:none;justify-content:center;align-items:center;height:120px;display:flex;position:absolute;bottom:0;left:0;right:88px}#touch-controls.touch-sandbox-mode .touch-drag-zone{right:180px}.touch-drag-zone.hidden{display:none}.touch-drag-hint{color:#5d4037;pointer-events:none;opacity:.85;background:#ffffffbf;border-radius:999px;padding:8px 16px;font-size:.9rem;font-weight:600}.touch-fire-btn{right:16px;bottom:max(16px, env(safe-area-inset-bottom));color:#fff;cursor:pointer;pointer-events:auto;touch-action:manipulation;background:linear-gradient(135deg,#ff7043,#e64a19);border:none;border-radius:50%;width:72px;height:72px;font-size:.85rem;font-weight:800;line-height:1.2;transition:transform 80ms,box-shadow 80ms;position:absolute;box-shadow:0 6px #bf360c,0 8px 20px #00000040}.touch-fire-btn.hidden{display:none}.touch-fire-btn:active{transform:translateY(4px);box-shadow:0 2px #bf360c}.touch-place-btn,.touch-break-btn{bottom:max(16px, env(safe-area-inset-bottom));color:#fff;cursor:pointer;pointer-events:auto;touch-action:manipulation;border:none;border-radius:50%;width:72px;height:72px;font-size:.75rem;font-weight:800;line-height:1.2;transition:transform 80ms,box-shadow 80ms;position:absolute}.touch-place-btn{background:linear-gradient(135deg,#66bb6a,#43a047);right:96px;box-shadow:0 6px #2e7d32,0 8px 20px #00000040}.touch-break-btn{background:linear-gradient(135deg,#ff7043,#e64a19);right:16px;box-shadow:0 6px #bf360c,0 8px 20px #00000040}.touch-place-btn.hidden,.touch-break-btn.hidden{display:none}.touch-place-btn:active{transform:translateY(4px);box-shadow:0 2px #2e7d32}.touch-break-btn:active{transform:translateY(4px);box-shadow:0 2px #bf360c}.control-mode-picker{text-align:left;margin-bottom:20px}.control-mode-label{color:#5d4037;margin-bottom:10px;font-size:.95rem;font-weight:700}.control-mode-options{flex-direction:column;gap:8px;display:flex}.control-mode-option{cursor:pointer;color:#4e342e;background:#ffffffbf;border:2px solid #0000;border-radius:14px;align-items:center;gap:10px;padding:12px 14px;font-size:1rem;font-weight:600;transition:border-color .15s,background .15s;display:flex}.control-mode-option:has(input:checked){background:#fff3e0f2;border-color:#ff9800}.control-mode-option input{accent-color:#43a047;flex-shrink:0;width:18px;height:18px}.camera-status{color:#1565c0;margin-top:10px;font-size:.88rem;line-height:1.4}.camera-status.hidden{display:none}body.control-touch #pose-debug,body.control-touch #hand-debug-panel{display:none!important}@media (width<=768px),(pointer:coarse){#start-screen{padding:12px}.game-back-btn{left:8px;top:max(8px, env(safe-area-inset-top));padding:8px 16px;font-size:.85rem}body.game-dance .game-back-btn{left:8px}.screen-panel{border-width:3px;border-radius:20px;width:100%;max-width:none;padding:24px 20px}.logo{font-size:1.5rem}.subtitle{margin-bottom:16px;font-size:1rem}.instructions{margin-bottom:18px;padding:12px 14px;font-size:.95rem;line-height:1.8}.big-btn{width:100%;max-width:280px;padding:14px 32px;font-size:1.15rem}.control-mode-option{padding:10px 12px;font-size:.92rem}.control-mode-picker{margin-bottom:16px}#leaderboard-panel{top:max(8px, env(safe-area-inset-top));border-width:2px;border-radius:16px;width:auto;max-height:38vh;padding:12px 10px;bottom:auto;left:8px;right:8px}#leaderboard-panel.lb-compact{max-height:32vh}#leaderboard-panel.lb-compact .lb-list{max-height:22vh}.lb-title{font-size:1rem}.lb-sub{margin-bottom:8px;padding-bottom:6px;font-size:.8rem}.lb-item{padding:6px 4px;font-size:.88rem}#hud{top:max(8px, env(safe-area-inset-top));left:8px;right:8px}.hud-right{justify-content:flex-end;gap:8px}.hud-panel{border-width:2px;border-radius:14px;min-width:72px;padding:8px 14px}.hud-label{font-size:.75rem}.hud-value{font-size:1.8rem}.hud-hearts{letter-spacing:2px;font-size:1.2rem}.hud-hint{bottom:max(130px, calc(120px + env(safe-area-inset-bottom)));white-space:nowrap;text-overflow:ellipsis;max-width:calc(100% - 100px);padding:8px 16px;font-size:.85rem;overflow:hidden}.hud-pause{text-align:center;border-radius:18px;max-width:calc(100% - 32px);padding:18px 28px;font-size:1.2rem}.gameover-title{font-size:1.6rem}.gameover-score{font-size:1.2rem}#pose-debug{width:120px;height:90px;bottom:max(8px, env(safe-area-inset-bottom));border-width:2px;border-radius:10px;right:8px}body.game-dance #game-canvas{width:100%!important;height:55%!important}body.game-dance #dance-hud{width:100%}body.game-dance #pose-video,body.game-dance #pose-debug{width:100%;height:45%;top:55%;left:0;right:0}.dance-hud-hint{font-size:.95rem;top:8px;left:50%}.dance-countdown{font-size:4rem;left:50%}.dance-stars{left:50%}.dance-match-bar{width:80%;bottom:64px;left:10%}#hand-debug-panel{display:none}.touch-drag-zone{height:110px;right:80px}.touch-fire-btn{width:68px;height:68px;font-size:.8rem;right:12px}}@media (width<=380px){.screen-panel{padding:20px 16px}.logo{font-size:1.35rem}.hud-value{font-size:1.5rem}.hud-hint{display:none}}