*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg: #1a1a2e;--surface: #16213e;--surface-light: #1e2f50;--accent: #e94560;--accent-glow: #ff6b81;--text: #eee;--text-dim: #8899aa;--stage-bg: linear-gradient(180deg, #0f3460 0%, #16213e 60%, #1a1a2e 100%);--radius: 10px}html,body{height:100%;font-family:Segoe UI,system-ui,-apple-system,sans-serif;background:var(--bg);color:var(--text);overflow:hidden;-webkit-text-size-adjust:100%}#app{display:flex;flex-direction:column;height:100vh;height:-webkit-fill-available;height:calc(var(--vh, 1vh) * 100);height:100dvh;max-height:100vh;max-height:-webkit-fill-available;max-height:calc(var(--vh, 1vh) * 100);max-height:100dvh;overflow:hidden}.athlete-svg .arm-left-group,.athlete-svg .arm-right-group,.athlete-svg .leg-left-group,.athlete-svg .leg-right-group,.athlete-svg .athlete-body,.athlete-svg .athlete-head,.athlete-svg .athlete-shadow{transform-box:fill-box}.top-bar{display:flex;align-items:center;justify-content:space-between;padding:8px 16px;background:var(--surface);border-bottom:2px solid rgba(233,69,96,.3);flex-shrink:0;gap:12px}.top-bar h1{font-size:1.1rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex-shrink:1;min-width:0;font-weight:700;background:linear-gradient(135deg,#e94560,#ff6b81);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.top-bar-right{display:flex;align-items:center;gap:16px}.coin-display{font-size:1rem;font-weight:700;color:gold}.help-btn{background:linear-gradient(135deg,#00b894,#55efc4);color:#fff;font-size:.8rem}.help-btn:hover{transform:translateY(-1px);box-shadow:0 4px 15px #00b89466}.shop-btn{background:linear-gradient(135deg,#6c5ce7,#a29bfe);color:#fff;font-size:.8rem}.shop-btn:hover{transform:translateY(-1px);box-shadow:0 4px 15px #6c5ce766}.crowd-meter{display:flex;align-items:center;gap:10px}.crowd-label{font-size:.8rem;color:var(--text-dim);text-transform:uppercase;letter-spacing:1px}.crowd-bar{width:200px;height:16px;background:var(--surface-light);border-radius:8px;overflow:hidden;border:1px solid rgba(255,255,255,.1)}.crowd-fill{height:100%;width:0%;background:linear-gradient(90deg,#e17055,#d63031);border-radius:8px;transition:width .8s ease,background .5s ease}.main-layout{display:flex;flex:1 1 0;min-height:120px;overflow:hidden}.palette{width:160px;background:var(--surface);padding:10px;border-right:1px solid rgba(255,255,255,.05);overflow-y:auto;flex-shrink:0}.palette h2{font-size:.85rem;text-transform:uppercase;letter-spacing:2px;color:var(--text-dim);margin-bottom:12px}.move-list{display:flex;flex-direction:column;gap:8px}.move-card{display:flex;align-items:center;gap:8px;padding:10px 12px;background:var(--surface-light);border-radius:var(--radius);cursor:grab;border:2px solid transparent;transition:all .2s;-webkit-user-select:none;user-select:none}.move-card:hover{border-color:var(--move-color);background:#ffffff0d;transform:translate(4px)}.move-card.dragging{opacity:.5;transform:scale(.95)}.move-icon{font-size:1.3rem}.move-name{font-size:.82rem;font-weight:600}.stage{flex:1;position:relative;background:linear-gradient(180deg,#87ceeb,#b0e0e6 25%,khaki 55%,#f4d78c 60%,#e8c872 75%,#deb860);overflow:hidden}.stage:before{content:"";position:absolute;top:12%;right:15%;width:50px;height:50px;border-radius:50%;background:radial-gradient(circle,#fff9c4,#ffe082 40%,#ffe08200 70%);box-shadow:0 0 40px 15px #ffecb366}.stage:after{content:"";position:absolute;top:8%;left:10%;width:80px;height:25px;border-radius:25px;background:#fff9;box-shadow:120px 15px 0 10px #fff6,250px -5px 0 5px #ffffff80,-50px 30px 0 8px #ffffff4d}.stage-floor{position:absolute;bottom:0;left:0;right:0;height:30%;background:linear-gradient(180deg,#f4d78c00,#e8c8724d 30%,#deb86080);border-top:1px solid rgba(210,170,80,.3)}.stage-floor:before{content:"";position:absolute;top:-8px;left:0;right:0;height:8px;background:linear-gradient(90deg,#64c8e626,#64c8e64d,#64c8e626);border-radius:0 0 50% 50%}.stage-floor:after{content:"🌴";position:absolute;top:-60px;left:5%;font-size:2.5rem;opacity:.5}.beach-decorations{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:1}.beach-item{position:absolute;-webkit-user-select:none;user-select:none}.shell-1{left:15%;bottom:8%;font-size:1.4rem;transform:rotate(-15deg);opacity:.85}.shell-2{right:22%;bottom:5%;font-size:1.1rem;transform:rotate(25deg);opacity:.8}.starfish{right:8%;bottom:12%;font-size:1.5rem;transform:rotate(-20deg);animation:starfish-wiggle 3s ease-in-out infinite}@keyframes starfish-wiggle{0%,to{transform:rotate(-20deg)}50%{transform:rotate(-10deg)}}.crab{left:25%;bottom:4%;font-size:1.8rem;animation:crab-walk 12s linear infinite}@keyframes crab-walk{0%{left:25%;transform:scaleX(1)}24%{left:70%;transform:scaleX(1)}25%{left:70%;transform:scaleX(-1)}49%{left:10%;transform:scaleX(-1)}50%{left:10%;transform:scaleX(1)}74%{left:55%;transform:scaleX(1)}75%{left:55%;transform:scaleX(-1)}99%{left:25%;transform:scaleX(-1)}to{left:25%;transform:scaleX(1)}}.seagull{top:18%;left:35%;font-size:1.3rem;animation:seagull-fly 18s linear infinite;opacity:.85}@keyframes seagull-fly{0%{left:-10%;top:18%}50%{left:55%;top:12%}to{left:110%;top:18%}}.palm-2{right:3%;bottom:18%;font-size:2rem;opacity:.45}.athletes{position:absolute;top:0;right:0;bottom:0;left:0;transform:scale(1.35);transform-origin:center 70%}.athlete-wrapper{position:absolute;width:80px;text-align:center;transform-origin:bottom center}.athlete-name{font-size:.65rem;font-weight:700;color:var(--text-dim);margin-top:2px;text-transform:uppercase;letter-spacing:1px}@keyframes idle-bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}.athlete-wrapper.running .leg-left-group{animation:run-leg-left .28s ease-in-out infinite}.athlete-wrapper.running .leg-right-group{animation:run-leg-right .28s ease-in-out infinite}.athlete-wrapper.running .arm-left-group{animation:run-arm-left-forward .4s ease-in-out infinite}.athlete-wrapper.running .arm-right-group{animation:run-arm-right-forward .4s ease-in-out infinite}.athlete-wrapper.running .athlete-body{animation:run-body .28s ease-in-out infinite}@keyframes run-leg-left{0%,to{transform:rotate(15deg) scaleY(.7)}50%{transform:rotate(-5deg) scaleY(1)}}@keyframes run-leg-right{0%,to{transform:rotate(-5deg) scaleY(1)}50%{transform:rotate(15deg) scaleY(.7)}}@keyframes run-arm-left-forward{0%,to{transform:rotate(-95deg)}50%{transform:rotate(-115deg)}}@keyframes run-arm-right-forward{0%,to{transform:rotate(115deg)}50%{transform:rotate(95deg)}}@keyframes run-body{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}.reaction-bubble{position:absolute;top:20px;left:50%;transform:translate(-50%) translateY(-20px);background:#000c;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:12px 24px;border-radius:20px;font-size:1.2rem;font-weight:700;opacity:0;transition:all .4s cubic-bezier(.34,1.56,.64,1);pointer-events:none;white-space:nowrap}.reaction-bubble.show{opacity:1;transform:translate(-50%) translateY(0)}.reaction-great{border:2px solid #00b894;color:#55efc4}.reaction-good{border:2px solid #0984e3;color:#74b9ff}.reaction-ok{border:2px solid #fdcb6e;color:#ffeaa7}.reaction-low{border:2px solid #e17055;color:#fab1a0}.reaction-empty{border:2px solid #636e72;color:#b2bec3}.timeline-section{background:var(--surface);border-top:2px solid rgba(233,69,96,.2);padding:8px 12px 10px;flex-shrink:0}.controls{flex-wrap:wrap}.controls{display:flex;align-items:center;gap:12px;margin-bottom:10px}.btn{padding:8px 18px;border:none;border-radius:var(--radius);font-size:.85rem;font-weight:700;cursor:pointer;transition:all .2s;text-transform:uppercase;letter-spacing:1px}.btn:disabled{opacity:.4;cursor:not-allowed}.play-btn{background:linear-gradient(135deg,#00b894,#00cec9);color:#fff}.play-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 15px #00b89466}.stop-btn{background:linear-gradient(135deg,#e94560,#d63031);color:#fff}.stop-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 15px #e9456066}.clear-btn{background:var(--surface-light);color:var(--text-dim);border:1px solid rgba(255,255,255,.1)}.clear-btn:hover{background:#ffffff1a;color:var(--text)}.tempo-control{display:flex;align-items:center;gap:8px;margin-left:auto;font-size:.8rem;color:var(--text-dim)}.tempo-control input[type=range]{width:100px;accent-color:var(--accent)}.zoom-controls{display:flex;align-items:center;gap:6px;margin-bottom:6px}.zoom-btn{padding:4px 10px;font-size:1rem;background:var(--surface-light);color:var(--text-dim);border:1px solid rgba(255,255,255,.1);line-height:1}.zoom-controls input[type=range]{width:80px;accent-color:var(--accent)}.zoom-label{font-size:.7rem;color:var(--text-dim);text-transform:uppercase;letter-spacing:1px}.timeline-wrapper{display:flex;border-radius:var(--radius);overflow:hidden}.track-labels{display:flex;flex-direction:column;gap:3px;flex-shrink:0;padding-right:6px}.track-label{font-size:.6rem;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--text-dim);display:flex;align-items:center;white-space:nowrap}.formation-label{height:36px;color:#a29bfe}.moves-label{height:70px;color:var(--accent)}.tracks-scroll{flex:1;overflow-x:auto;display:flex;flex-direction:column;gap:3px}.timeline,.formation-timeline{display:flex;gap:3px;min-width:100%;position:relative;padding:2px 0}.playhead{position:absolute;top:0;left:0;width:3px;height:100%;background:var(--accent);box-shadow:0 0 10px var(--accent-glow);border-radius:2px;z-index:10;transition:left .08s linear;pointer-events:none}.form-playhead{background:#a29bfe;box-shadow:0 0 10px #a29bfe80}.formation-slot{flex:1;min-width:60px;height:36px;background:#6c5ce714;border-radius:6px;border:1px dashed rgba(162,155,254,.2);display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;position:relative;gap:1px}.formation-slot:hover{border-color:#a29bfe80;background:#6c5ce726}.formation-slot.formation-filled{border-style:solid;border-color:#a29bfe66;background:#6c5ce733}.formation-slot.active-beat{border-color:#a29bfe;background:#a29bfe4d;box-shadow:0 0 8px #a29bfe4d}.formation-slot.measure-start{border-left:2px solid rgba(162,155,254,.25)}.form-slot-icon{font-size:.8rem;font-weight:700}.form-slot-name{font-size:.45rem;color:#a29bfe;text-transform:uppercase;letter-spacing:.5px}.form-slot-empty{font-size:.8rem;color:#a29bfe4d}.formation-picker{position:fixed;z-index:200;background:var(--surface);border:1px solid rgba(162,155,254,.3);border-radius:8px;padding:6px;display:flex;flex-direction:column;gap:3px;box-shadow:0 8px 24px #00000080;min-width:120px}.form-pick-option{display:flex;align-items:center;gap:6px;padding:6px 10px;border:none;border-radius:6px;background:transparent;color:var(--text);cursor:pointer;font-size:.75rem;transition:background .15s;white-space:nowrap}.form-pick-option:hover{background:#a29bfe33}.form-pick-option.selected{background:#a29bfe4d;color:#a29bfe}.timeline-slot{flex:1;min-width:60px;height:70px;background:var(--surface-light);border-radius:8px;border:2px dashed rgba(255,255,255,.1);display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;transition:all .2s;cursor:default}.timeline-slot.measure-start{border-left:3px solid rgba(233,69,96,.3)}.timeline-slot.drag-over{border-color:var(--accent);background:#e9456026;transform:scale(1.05)}.timeline-slot.filled{border-style:solid;border-color:var(--move-color);background:var(--surface-light);background-image:linear-gradient(#ffffff0f,#ffffff0f)}.timeline-slot.active-beat{background:#e9456040;border-color:var(--accent);box-shadow:0 0 15px #e945604d;transform:scale(1.05)}.beat-number{position:absolute;top:3px;left:6px;font-size:.6rem;color:var(--text-dim);opacity:.6}.slot-move{display:flex;flex-direction:column;align-items:center;gap:2px}.slot-move span:first-child,.slot-move-icon{font-size:1.6rem}.slot-move-name{font-size:.6rem;font-weight:600;color:var(--text);opacity:.8}.slot-remove{position:absolute;top:2px;right:4px;background:none;border:none;color:var(--text-dim);font-size:.9rem;cursor:pointer;opacity:0;transition:opacity .2s;line-height:1}.timeline-slot:hover .slot-remove{opacity:1}.slot-remove:hover{color:var(--accent)}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#ffffff26;border-radius:3px}::-webkit-scrollbar-thumb:hover{background:#ffffff40}.formation-bar{position:absolute;top:10px;left:50%;transform:translate(-50%);display:flex;gap:6px;z-index:10}.formation-btn{display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 12px;background:#0006;border:2px solid rgba(255,255,255,.1);border-radius:8px;color:var(--text-dim);cursor:pointer;transition:all .2s;font-size:.65rem}.formation-btn:hover{background:#ffffff1a;color:var(--text)}.formation-btn.active{border-color:var(--accent);color:var(--accent);background:#e9456026}.formation-icon{font-size:1rem;font-weight:700}.formation-name{font-size:.55rem;text-transform:uppercase;letter-spacing:1px}.song-selector{display:flex;align-items:center;gap:8px;font-size:.8rem;color:var(--text-dim)}.song-selector select{background:var(--surface-light);color:var(--text);border:1px solid rgba(255,255,255,.15);border-radius:var(--radius);padding:6px 10px;font-size:.8rem;cursor:pointer}.compete-btn{background:linear-gradient(135deg,#f39c12,#e67e22);color:#fff}.compete-btn:hover{transform:translateY(-1px);box-shadow:0 4px 15px #f39c1266}.competition-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000d9;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:100;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .3s;pointer-events:none}.competition-overlay.show{opacity:1;pointer-events:all}.competition-content{background:var(--surface);border-radius:16px;padding:20px 24px;max-width:600px;width:90%;text-align:center}.comp-fullscreen{max-width:900px;width:95%}.comp-title{font-size:1.4rem;margin-bottom:12px;background:linear-gradient(135deg,#f39c12,#e67e22);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.comp-arena{display:flex;align-items:stretch;gap:0;margin-bottom:16px}.comp-team-side{flex:1;display:flex;flex-direction:column;align-items:center;gap:8px}.comp-team-name{font-size:.85rem;font-weight:700;color:#00cec9;text-transform:uppercase;letter-spacing:1px}.rival-name{color:#e17055}.comp-team-stage{position:relative;width:100%;height:200px;background:linear-gradient(180deg,#0f346080,#16213ecc);border-radius:12px;border:1px solid rgba(255,255,255,.05);overflow:hidden}.comp-team-stage:after{content:"";position:absolute;bottom:0;left:0;right:0;height:30%;background:linear-gradient(180deg,transparent,rgba(233,69,96,.05));border-top:1px solid rgba(233,69,96,.1)}.comp-athlete-wrapper{position:absolute}.comp-center{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0 12px;min-width:60px}.comp-vs{font-size:1.5rem;font-weight:900;color:var(--accent);margin-bottom:8px}.comp-beat-counter{font-size:.7rem;color:var(--text-dim);margin-bottom:6px}.comp-progress-bar{width:4px;height:120px;background:var(--surface-light);border-radius:2px;overflow:hidden}.comp-progress-fill{width:100%;height:0%;background:linear-gradient(180deg,var(--accent),var(--accent-glow));border-radius:2px;transition:height .2s ease}.comp-score-display{display:flex;align-items:center;gap:8px;width:100%;padding:0 8px}.comp-score-bar{flex:1;height:14px;background:var(--surface-light);border-radius:7px;overflow:hidden}.comp-score-fill{height:100%;width:0%;border-radius:7px;transition:width .3s ease}.player-fill{background:linear-gradient(90deg,#00b894,#00cec9)}.ai-fill{background:linear-gradient(90deg,#e17055,#d63031)}.comp-score-num{font-weight:700;font-size:1rem;min-width:30px}.judges-panel{margin-top:16px;padding:12px 16px;background:linear-gradient(135deg,#6c5ce726,#a29bfe14);border-radius:12px;border:1px solid rgba(162,155,254,.2)}.judges-label{font-size:.65rem;color:var(--text-dim);text-transform:uppercase;letter-spacing:2px;text-align:center;margin-bottom:8px}.judges-row{display:flex;justify-content:center;gap:20px}.judge-card{display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 12px;background:#00000040;border-radius:10px;border:1px solid rgba(255,255,255,.08);min-width:80px;position:relative}.judge-face{font-size:1.8rem;line-height:1}.judge-name{font-size:.6rem;color:var(--text-dim);font-weight:600;text-transform:uppercase;letter-spacing:.5px}.judge-score{font-size:1rem;font-weight:700;color:gold}.judge-reaction{position:absolute;top:-10px;right:-4px;font-size:1.2rem;opacity:0}.judge-reaction.pop{animation:judge-pop 1.2s ease-out}@keyframes judge-pop{0%{opacity:0;transform:scale(.3) translateY(0)}20%{opacity:1;transform:scale(1.3) translateY(-4px)}70%{opacity:1;transform:scale(1) translateY(-8px)}to{opacity:0;transform:scale(.8) translateY(-14px)}}.comp-result{opacity:0;transition:opacity .5s;margin-bottom:16px}.comp-result.show{opacity:1}.result-medal{font-size:1.3rem;font-weight:700;margin-bottom:8px}.medal-emoji{font-size:2.5rem;display:block;margin-bottom:8px}.result-medal.gold .medal-text{color:gold}.result-medal.silver .medal-text{color:silver}.result-medal.bronze .medal-text{color:#cd7f32}.result-coins{color:gold;font-size:1.1rem;font-weight:700;margin-bottom:8px}.result-scores{color:var(--text-dim);font-size:.85rem}.result-win,.result-lose{font-size:1.2rem;font-weight:700;margin-bottom:8px}.result-win{color:#00b894}.result-lose{color:#e17055}.result-hint{color:var(--text-dim);font-size:.85rem;margin-bottom:8px}.comp-close-btn{background:linear-gradient(135deg,#6c5ce7,#a29bfe);color:#fff;padding:10px 30px;font-size:1rem}.shop-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000d9;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:100;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .3s;pointer-events:none}.shop-overlay.show{opacity:1;pointer-events:all}.shop-content{background:var(--surface);border-radius:16px;padding:24px;max-width:550px;width:90%;max-height:80vh;overflow-y:auto}.shop-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.shop-header h2{font-size:1.3rem;background:linear-gradient(135deg,#6c5ce7,#a29bfe);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.shop-coins{font-size:1rem;font-weight:700;color:gold}.shop-close-btn{background:var(--surface-light);color:var(--text-dim);border:1px solid rgba(255,255,255,.1);padding:6px 12px;font-size:1rem}.shop-tabs{display:flex;gap:4px;margin-bottom:16px}.shop-tab{flex:1;padding:8px;background:var(--surface-light);border:none;border-radius:8px;color:var(--text-dim);cursor:pointer;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:1px;transition:all .2s}.shop-tab:hover{background:#ffffff1a;color:var(--text)}.shop-tab.active{background:#6c5ce74d;color:#a29bfe;border-bottom:2px solid #6c5ce7}.shop-items{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:12px}.shop-item{background:var(--surface-light);border-radius:var(--radius);padding:12px;text-align:center;border:2px solid transparent;transition:all .2s}.shop-item.owned{border-color:#00b8944d}.shop-item:hover{border-color:#fff3}.item-preview{margin:0 auto 8px;display:flex;align-items:center;justify-content:center}.item-song,.item-move,.item-hair{font-size:2rem}.item-name{font-size:.8rem;font-weight:600;margin-bottom:4px}.item-detail{font-size:.65rem;color:var(--text-dim);margin-bottom:4px}.item-price{font-size:.75rem;color:gold;margin-bottom:8px}.shop-item.owned .item-price{color:#00b894}.buy-btn{padding:4px 12px;font-size:.7rem;background:linear-gradient(135deg,#6c5ce7,#a29bfe);color:#fff}.buy-btn.error{background:linear-gradient(135deg,#e17055,#d63031)}.customize-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000b3;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:100;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .3s;pointer-events:none}.customize-overlay.show{opacity:1;pointer-events:all}.customize-content{background:var(--surface);border-radius:16px;padding:24px;max-width:400px;width:90%;max-height:70vh;overflow-y:auto}.customize-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.customize-header h3{font-size:1.1rem;background:linear-gradient(135deg,#e94560,#ff6b81);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.customize-close{background:var(--surface-light);color:var(--text-dim);border:1px solid rgba(255,255,255,.1);padding:4px 10px}.customize-section{margin-bottom:16px}.customize-section h4{font-size:.8rem;text-transform:uppercase;letter-spacing:1px;color:var(--text-dim);margin-bottom:8px}.customize-options{display:flex;flex-wrap:wrap;gap:8px}.customize-option{display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 12px;background:var(--surface-light);border:2px solid transparent;border-radius:8px;color:var(--text);cursor:pointer;font-size:.7rem;transition:all .2s}.customize-option:hover{border-color:#fff3;background:#ffffff0d}.customize-option.selected{border-color:var(--accent);background:#e9456026}.option-swatch{width:30px;height:30px;border-radius:50%;border:2px solid rgba(255,255,255,.2)}.option-icon{font-size:1.5rem}.athlete-wrapper{cursor:pointer}.athlete-wrapper:hover{filter:brightness(1.15)}.help-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000d9;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:150;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .3s;pointer-events:none;padding:20px}.help-overlay.show{opacity:1;pointer-events:all}.help-content{background:var(--surface);border-radius:16px;max-width:600px;width:100%;max-height:90vh;display:flex;flex-direction:column;border:2px solid rgba(0,184,148,.3);box-shadow:0 20px 60px #0009}.help-header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border-bottom:1px solid rgba(255,255,255,.08)}.help-header h2{font-size:1.5rem;background:linear-gradient(135deg,#00b894,#55efc4);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.help-close-btn{background:var(--surface-light);color:var(--text-dim);border:1px solid rgba(255,255,255,.1);padding:4px 10px}.help-body{padding:20px 24px;overflow-y:auto;flex:1}.help-section{margin-bottom:20px}.help-section h3{font-size:1rem;margin-bottom:8px;color:#55efc4}.help-section p{color:var(--text);font-size:.85rem;line-height:1.5;margin-bottom:6px}.help-section p strong{color:#55efc4}.help-section ul{margin:6px 0 6px 20px;font-size:.85rem}.help-section ul li{margin-bottom:4px;line-height:1.5}.help-section ul strong{color:#a29bfe}.medal-list{background:var(--surface-light);border-radius:8px;padding:12px;margin:10px 0}.medal-row{display:flex;align-items:center;gap:10px;font-size:.85rem;margin-bottom:6px}.medal-row:last-child{margin-bottom:0}.medal-big{font-size:1.5rem}.medal-row strong{color:var(--text)}.help-tip{background:#6c5ce726;border-left:3px solid #6c5ce7;padding:10px 12px;border-radius:4px;font-size:.8rem!important;margin-top:8px}.help-moves-list .moves-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:6px;background:var(--surface-light);padding:12px;border-radius:8px}.moves-grid div{font-size:.8rem}.help-footer{padding:16px 24px;border-top:1px solid rgba(255,255,255,.08);text-align:center}.help-got-it{background:linear-gradient(135deg,#00b894,#55efc4);color:#fff;padding:10px 24px;font-size:.9rem}.help-got-it:hover{transform:translateY(-1px);box-shadow:0 4px 15px #00b89466}@media (max-width: 1100px),(max-height: 900px){.top-bar{padding:6px 12px}.top-bar h1{font-size:.95rem}.top-bar-right{gap:10px}.crowd-bar{width:140px;height:12px}.crowd-label{font-size:.65rem}.btn{padding:6px 12px;font-size:.75rem}.palette{width:130px;padding:8px}.palette h2{font-size:.7rem;margin-bottom:6px}.move-card{padding:6px 8px}.move-name{font-size:.72rem}.move-icon{font-size:1rem}.move-list{gap:5px}.formation-btn{padding:4px 8px}.formation-icon{font-size:.9rem}.formation-name{font-size:.5rem}.timeline-section{padding:6px 10px 8px}.controls{gap:8px;margin-bottom:6px}.zoom-controls{margin-bottom:4px}.timeline-slot{height:56px;min-width:50px!important}.formation-slot{height:30px;min-width:50px!important}.slot-move span:first-child{font-size:1rem}.slot-move-name,.track-label{font-size:.55rem}.formation-label{height:30px}.moves-label{height:56px}.athlete-name{font-size:.55rem}}@media (max-width: 820px),(max-height: 700px){.palette{width:110px}.top-bar h1{font-size:.85rem}.timeline-slot{height:48px}.formation-slot{height:26px}.moves-label{height:48px}.formation-label{height:26px}}@media (max-height: 750px){.top-bar{padding:4px 10px}.top-bar h1{font-size:.9rem}.btn{padding:5px 10px;font-size:.7rem}.coin-display{font-size:.85rem}.crowd-bar{width:100px;height:10px}.formation-bar{top:4px;gap:4px}.formation-btn{padding:3px 6px}.formation-icon{font-size:.75rem}.formation-name{font-size:.45rem}.main-layout{min-height:100px}.palette{width:105px;padding:6px}.move-card{padding:5px 6px}.move-name{font-size:.65rem}.move-icon{font-size:.85rem}.move-list{gap:4px}.timeline-section{padding:4px 8px 6px}.controls{gap:6px;margin-bottom:4px}.zoom-controls{margin-bottom:3px}.zoom-btn{padding:2px 8px;font-size:.85rem}.tempo-control input[type=range]{width:70px}.tempo-control span,.song-selector label{font-size:.7rem}.song-selector select{padding:3px 6px;font-size:.7rem}.timeline-slot{height:42px;min-width:44px!important}.formation-slot{height:22px;min-width:44px!important}.slot-move span:first-child{font-size:.85rem}.slot-move-name,.beat-number,.track-label{font-size:.5rem}.formation-label{height:22px}.moves-label{height:42px}.athlete-name{font-size:.5rem;margin-top:0}.athletes{transform:scale(1.15);transform-origin:center 70%}}
