.word-panel{position:absolute;top:52%;left:56%;right:auto;transform:translate(-20%,-50%) translate(20px);width:min(56vw,780px);max-width:820px;z-index:50;opacity:0;transition:opacity .35s ease,transform .35s cubic-bezier(.22,1,.36,1)}.word-panel.show{opacity:1;transform:translate(-20%,-50%) translate(0)}.word-panel.success .word-card{animation:celebrate .45s ease-in-out;box-shadow:0 22px 68px #2dd4ff3d,0 0 0 1px #ffffff5c,inset 0 0 28px #ffffff14}.word-panel.shatter{animation:shatterOut .8s ease-in forwards}@keyframes shatterOut{0%{transform:translate(-20%,-50%) translate(0) scale(1);opacity:1;filter:blur(0)}30%{transform:translate(-20%,-50%) translate(0) scale(1.1);filter:blur(0)}to{transform:translate(-20%,-50%) translate(50px) scale(.5);opacity:0;filter:blur(10px)}}@keyframes celebrate{0%,to{transform:scale(1) rotate(0)}25%{transform:scale(1.05) rotate(-2deg)}75%{transform:scale(1.05) rotate(2deg)}}.progress-bar-container{position:relative;width:100%;height:14px;background:#0c12266b;border-radius:7px;margin-bottom:12px;overflow:hidden;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:inset 0 1px 3px #00000047;border:1px solid rgba(255,255,255,.14)}.progress-bar{position:relative;height:100%;background:linear-gradient(90deg,#35d6b4,#2dd4ff,#8b5cf6);border-radius:7px;transition:width .5s ease}.progress-glow{position:absolute;top:0;right:0;width:30px;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.8));animation:progressGlow 1.5s ease-in-out infinite}@keyframes progressGlow{0%,to{opacity:.5}50%{opacity:1}}.progress-text{position:absolute;right:8px;top:50%;transform:translateY(-50%);font-size:11px;font-weight:800;color:#f8fbff;text-shadow:0 1px 3px rgba(0,0,0,.45)}.score-section{display:flex;gap:12px;margin-bottom:12px}.score,.streak{display:flex;align-items:center;gap:5px;padding:7px 12px;background:#0c122694;border-radius:7px;border:1px solid rgba(255,255,255,.16);box-shadow:0 10px 26px #0000002e;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.score-icon,.streak-icon{font-size:18px}.score-value,.streak-value{font-size:16px;font-weight:700;color:#f8fbff}.streak{background:linear-gradient(135deg,#ff6faec7,#8b5cf6c7);animation:pulse-glow 1s infinite}.streak-value{color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.2)}.word-card{background:linear-gradient(180deg,#ffffffeb,#e0f2fedb),#ffffffe6;border-radius:8px;padding:clamp(26px,4vw,44px);box-shadow:0 24px 78px #00000052,0 0 0 1px #ffffff85,inset 0 1px #ffffffb8;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);position:relative;overflow:hidden;min-height:min(58vh,470px);display:flex;flex-direction:column;justify-content:center}.word-card:before{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:linear-gradient(45deg,transparent,rgba(45,212,255,.12),transparent);animation:shimmer 4.5s infinite;pointer-events:none}@keyframes shimmer{0%{transform:translate(-100%) rotate(45deg)}to{transform:translate(100%) rotate(45deg)}}.word-number{position:absolute;top:12px;right:14px;font-size:12px;color:#64748b;font-weight:800}.word-main{text-align:center;margin-bottom:clamp(20px,3vw,30px)}.word-text{font-size:clamp(58px,9vw,112px);font-weight:900;color:#0f172a;margin:0;text-shadow:0 8px 26px rgba(45,212,255,.18);letter-spacing:0;line-height:1.1;overflow-wrap:anywhere}.word-pronunciation{font-size:clamp(18px,2.4vw,30px);color:#2563eb;margin:12px 0 0;font-family:Quicksand,sans-serif}.word-meaning{text-align:center;padding:clamp(15px,2vw,25px);background:#0f172a0f;border-radius:8px;margin-bottom:clamp(20px,3vw,30px);border:1px solid rgba(15,23,42,.08)}.meaning-label{font-size:11px;color:#64748b;text-transform:uppercase;letter-spacing:1px}.meaning-text{font-size:clamp(34px,4.8vw,64px);color:#0f172a;margin:12px 0 0;font-weight:600}.word-divider{display:flex;align-items:center;justify-content:center;margin:15px 0}.divider-star{font-size:18px;animation:sparkle 1.5s infinite;color:#00ced1}.action-instruction{display:flex;align-items:flex-start;gap:clamp(15px,2vw,20px);padding:clamp(15px,2vw,25px);background:linear-gradient(135deg,#2dd4ff1c,#8b5cf617);border-radius:8px;border:1px solid rgba(37,99,235,.18)}.action-icon{font-size:clamp(36px,4vw,48px);animation:float 2s ease-in-out infinite}.action-text{flex:1}.action-label{font-size:11px;color:#64748b;text-transform:uppercase;letter-spacing:1px}.action-description{font-size:clamp(18px,2.1vw,28px);color:#172033;margin:8px 0 0;line-height:1.6;font-weight:500}.success-feedback{margin-top:15px;padding:15px;background:#35d6b421;border-radius:8px;text-align:center;animation:fadeInUp .5s ease}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.success-stars{display:flex;justify-content:center;gap:8px;margin-bottom:8px}.success-stars span{font-size:20px;animation:starBounce .5s ease infinite}.success-stars span:nth-child(1){animation-delay:0s}.success-stars span:nth-child(2){animation-delay:.1s}.success-stars span:nth-child(3){animation-delay:.2s}.success-stars span:nth-child(4){animation-delay:.3s}.success-stars span:nth-child(5){animation-delay:.4s}@keyframes starBounce{0%,to{transform:translateY(0) scale(1)}50%{transform:translateY(-8px) scale(1.2)}}.success-message{font-size:16px;color:#0f172a;margin:0;font-weight:600}.hint-section{margin-top:12px;padding:10px 16px;background:#0c12268a;border-radius:8px;text-align:center;border:1px solid rgba(255,255,255,.14);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.hint-text{font-size:13px;color:#f8fbffdb;margin:0}@media(max-width:768px){.word-panel{left:50%;right:auto;width:92%;max-width:500px;top:50%;transform:translate(-50%,-50%)}.word-panel.show{transform:translate(-50%,-50%)}.word-text{font-size:56px}.meaning-text{font-size:36px}.word-card{padding:25px;min-height:350px}.action-instruction{padding:15px}.action-description{font-size:18px}}@media(min-width:1920px){.word-panel{width:900px}.word-text{font-size:140px}.meaning-text{font-size:80px}}.game-ui{position:absolute;z-index:180}.game-ui.in-game{top:0;left:0;right:0;padding:max(16px,env(safe-area-inset-top)) max(22px,env(safe-area-inset-right)) 16px max(22px,env(safe-area-inset-left))}.top-bar{display:flex;justify-content:space-between;align-items:center;gap:16px}.account-only{top:max(16px,env(safe-area-inset-top));right:max(22px,env(safe-area-inset-right))}.account-actions{display:flex;align-items:center;gap:8px;margin-left:auto;padding:7px;border-radius:8px;background:#0c12269e;border:1px solid rgba(255,255,255,.16);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);color:#f8fbff;box-shadow:0 12px 34px #00000038}.completion-screen>.account-actions{position:absolute;top:max(16px,env(safe-area-inset-top));right:max(22px,env(safe-area-inset-right));z-index:2}.account-actions span{max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0 4px;font-size:13px;font-weight:800;color:#e2e8f0e6}.account-actions button{min-height:30px;padding:0 10px;border-radius:7px;border:1px solid rgba(255,255,255,.16);background:#ffffff1a;color:#f8fbff;font-family:inherit;font-size:12px;font-weight:800;cursor:pointer}.game-title{display:flex;align-items:center;gap:9px;padding:10px 14px;border-radius:8px;background:#0c12269e;border:1px solid rgba(255,255,255,.18);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);font-size:clamp(17px,2.2vw,24px);font-weight:850;color:#fff;text-shadow:0 2px 10px rgba(0,0,0,.28);box-shadow:0 12px 34px #00000038}.title-icon{font-size:28px;animation:sparkle 1.5s infinite}.exit-btn{padding:10px 16px;background:#ffffff1f;border:1px solid rgba(255,255,255,.2);border-radius:8px;font-size:14px;font-weight:800;color:#f8fbff;cursor:pointer;transition:transform .2s ease,background .2s ease,box-shadow .2s ease;font-family:inherit;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.exit-btn:hover{background:#fff3;transform:translateY(-1px);box-shadow:0 12px 34px #00000038}.game-ui.completion-screen{top:0;left:0;right:0;bottom:0;display:flex;justify-content:center;align-items:center;background:radial-gradient(circle at 50% 20%,rgba(45,212,255,.18),transparent 35%),#050812ad;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);animation:fadeIn .5s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.completion-card{background:linear-gradient(180deg,#fffffff5,#e8f4ffeb);border-radius:8px;padding:clamp(26px,4vw,40px);max-width:540px;width:90%;text-align:center;box-shadow:0 28px 90px #00000061,0 0 0 1px #ffffffa6;animation:slideUp .45s cubic-bezier(.22,1,.36,1);color:var(--text-dark)}@keyframes slideUp{0%{opacity:0;transform:translateY(50px) scale(.9)}to{opacity:1;transform:translateY(0) scale(1)}}.completion-stars{display:flex;justify-content:center;gap:10px;margin-bottom:20px}.completion-stars .star{font-size:40px;animation:starFall .5s ease forwards;opacity:0}@keyframes starFall{0%{opacity:0;transform:translateY(-30px) rotate(-180deg)}to{opacity:1;transform:translateY(0) rotate(0)}}.completion-title{font-size:clamp(28px,4vw,38px);color:var(--text-dark);margin:0 0 30px;text-shadow:none}.completion-stats{display:flex;justify-content:center;gap:30px;margin-bottom:30px}.stat-item{display:flex;flex-direction:column;align-items:center;padding:14px 20px;background:#0f172a0f;border-radius:8px;border:1px solid rgba(15,23,42,.08);min-width:112px}.stat-icon{font-size:28px;margin-bottom:5px}.stat-value{font-size:32px;font-weight:700;color:var(--text-dark)}.stat-label{font-size:12px;color:var(--text-muted-dark);margin-top:5px}.completion-words{margin-bottom:30px}.completion-words h3{font-size:16px;color:var(--text-muted-dark);margin:0 0 15px}.words-grid{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}.word-badge{display:flex;flex-direction:column;padding:8px 16px;background:linear-gradient(135deg,#2364ff,#8b5cf6);border-radius:7px;color:#fff;box-shadow:0 8px 20px #2364ff2e}.word-badge .word-en{font-size:14px;font-weight:600}.word-badge .word-cn{font-size:12px;opacity:.9}.word-badge .word-score{margin-top:5px;padding-top:5px;border-top:1px solid rgba(255,255,255,.22);font-size:11px;font-weight:850;opacity:.95}.play-again-btn{display:inline-flex;align-items:center;gap:10px;padding:14px 34px;background:linear-gradient(135deg,#ff6fae,#2364ff);border:none;border-radius:8px;font-size:17px;font-weight:700;color:#fff;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease;font-family:inherit;box-shadow:0 14px 34px #2364ff42}.play-again-btn:hover{transform:translateY(-2px);box-shadow:0 18px 44px #2364ff57}.play-again-btn span{font-size:22px}.encouragement{margin:25px 0 0;font-size:16px;color:var(--text-muted-dark);line-height:1.6}@media(max-width:768px){.completion-card{padding:30px 20px}.completion-title{font-size:28px}.completion-stats{flex-direction:column;gap:15px}.stat-item{flex-direction:row;gap:15px}}.completion-card.arcade-complete{max-width:560px}.arcade-complete-sub{margin:-12px 0 20px;font-size:15px;color:var(--text-muted-dark)}.completion-stats.arcade-stats-row{flex-wrap:wrap;gap:14px 18px}.stat-item.highlight{background:linear-gradient(135deg,#ffd1664d,#2dd4ff38);border:1px solid rgba(35,100,255,.16)}.versus-final{display:flex;justify-content:center;align-items:center;gap:16px;margin:16px 0 8px;font-size:18px;font-weight:700;color:var(--text-dark)}@media(max-width:640px){.game-ui.in-game{padding:max(12px,env(safe-area-inset-top)) 12px 12px}.game-title{max-width:calc(100vw - 128px);font-size:15px}.exit-btn{padding:9px 11px;font-size:13px}}.versus-final .vs-dot{opacity:.6;font-weight:500}.rope-final-board{display:grid;gap:8px;width:min(100%,360px);margin:8px auto 18px}.rope-final-board h3{margin:0 0 4px}.rope-final-board p{margin:0;color:var(--text-muted-dark)}.rope-final-rank{display:grid;grid-template-columns:32px 1fr auto;gap:10px;align-items:center;padding:9px 12px;border-radius:8px;background:#ffffffb8;border:1px solid rgba(35,100,255,.12)}.rope-final-rank span{display:grid;place-items:center;width:26px;height:26px;border-radius:7px;background:#2364ff1f;color:#2364ff;font-weight:900}.rope-final-rank strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rope-final-rank em{color:#d97706;font-style:normal;font-weight:950}@media(max-width:768px){.completion-stats.arcade-stats-row{flex-direction:row;flex-wrap:wrap;justify-content:center}}.loading-screen{position:absolute;top:0;left:0;right:0;bottom:0;display:flex;justify-content:center;align-items:flex-start;z-index:200;padding:max(16px,env(safe-area-inset-top)) 0 max(16px,env(safe-area-inset-bottom));background:linear-gradient(180deg,#080d1c5c,#080d1cd6),radial-gradient(circle at 22% 18%,rgba(255,111,174,.32),transparent 28%),radial-gradient(circle at 76% 22%,rgba(45,212,255,.26),transparent 30%),linear-gradient(135deg,#111827,#1e1b4b 48%,#063447);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);opacity:0;transition:opacity .5s ease;overflow-y:auto;overscroll-behavior:contain}.loading-screen.show{opacity:1}.loading-content{text-align:center;padding:clamp(22px,3.5vw,44px);max-width:600px;position:relative;z-index:1;margin:auto 0}.logo-section{position:relative;margin-bottom:20px}.logo-stars{display:flex;justify-content:center;gap:15px;margin-bottom:10px;opacity:.82}.logo-stars .star{font-size:30px;animation:starFloat 2s ease-in-out infinite}.star-1{animation-delay:0s}.star-2{animation-delay:.2s}.star-3{animation-delay:.4s;font-size:40px!important}.star-4{animation-delay:.6s}.star-5{animation-delay:.8s}@keyframes starFloat{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-10px) rotate(10deg)}}.logo-sprite{width:88px;height:88px;margin:0 auto;position:relative;animation:bounce 2s ease-in-out infinite}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-15px)}}.sprite-body{width:72px;height:72px;background:linear-gradient(135deg,#ff6fae,#2dd4ff);border-radius:50%;position:absolute;top:10px;left:10px;box-shadow:0 10px 30px #ffb6c180,inset 0 -10px 20px #0000001a,inset 0 10px 20px #ffffff80}.sprite-face{position:absolute;top:25px;left:20px;width:60px;height:50px}.sprite-eyes{display:flex;justify-content:space-between;padding:0 10px}.sprite-eyes .eye{width:12px;height:12px;background:#5d4e6d;border-radius:50%;position:relative}.sprite-eyes .eye:after{content:"";position:absolute;width:4px;height:4px;background:#fff;border-radius:50%;top:2px;right:2px}.sprite-blush{width:15px;height:10px;background:#ff969699;border-radius:50%;position:absolute;top:18px}.sprite-blush.left{left:0}.sprite-blush.right{right:0}.sprite-smile{width:20px;height:10px;border:3px solid #5D4E6D;border-top:none;border-radius:0 0 20px 20px;position:absolute;bottom:5px;left:50%;transform:translate(-50%)}.sprite-wings{position:absolute;top:25px;width:100%}.sprite-wings .wing{width:30px;height:25px;background:linear-gradient(135deg,#e6e6fae6,#dda0ddb3);border-radius:50%;position:absolute;animation:wingFlap .3s ease-in-out infinite alternate}.sprite-wings .wing.left{left:-15px;transform-origin:right center}.sprite-wings .wing.right{right:-15px;transform-origin:left center}@keyframes wingFlap{0%{transform:rotate(-10deg)}to{transform:rotate(10deg)}}.main-title{font-size:clamp(38px,5.5vw,72px);color:#f8fbff;margin:12px 0 8px;text-shadow:0 8px 30px rgba(0,0,0,.32),0 0 28px rgba(45,212,255,.28);display:flex;align-items:center;justify-content:center;gap:15px}.title-icon{animation:sparkle 1.5s infinite}.welcome-text{font-size:clamp(16px,1.8vw,20px);color:#e2e8f0d1;margin:0 0 18px;height:30px}.cursor{animation:blink .7s infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}.camera-notice{display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:18px;padding:10px 16px;background:#ffffff1f;border-radius:8px;display:inline-flex;border:1px solid rgba(255,255,255,.18);box-shadow:0 12px 36px #0000002e}.camera-icon{font-size:24px}.camera-text{font-size:14px;color:#f8fbff;font-weight:700}.loading-content-wide{max-width:980px;width:100%}.mode-section{width:100%;margin:22px auto 18px;text-align:center}.mode-heading{font-size:16px;font-weight:800;color:#e2e8f0e0;margin:0 0 16px;letter-spacing:.12em;text-transform:uppercase}.mode-cards{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;text-align:left}.mode-card{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:18px;border-radius:8px;border:1px solid rgba(255,255,255,.16);background:linear-gradient(180deg,#ffffff24,#ffffff12),#0c1226ad;color:#f8fbff;cursor:not-allowed;box-shadow:inset 0 1px #ffffff1f,0 16px 40px #00000038;font-family:inherit;opacity:.78;transition:opacity .25s ease,transform .25s ease,box-shadow .25s ease;min-height:176px;overflow:hidden}.mode-card:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(135deg,rgba(45,212,255,.18),transparent 42%,rgba(255,111,174,.16));opacity:.55;pointer-events:none}.mode-card:after{content:"等待摄像头";position:absolute;top:12px;right:12px;z-index:2;padding:4px 7px;border-radius:5px;background:#0f172a94;color:#e2e8f0b8;font-size:11px;font-weight:800;letter-spacing:.04em;border:1px solid rgba(255,255,255,.12)}.mode-card.ready:after{content:"READY";background:#35d6b42e;color:#a7f3d0;border-color:#35d6b457}.mode-card>*{position:relative;z-index:1}.mode-card.ready{opacity:1;cursor:pointer;background:linear-gradient(180deg,#ffffff2e,#ffffff14),#0c1226b8;border-color:#35d6b43d}.mode-card.ready:hover{transform:translateY(-5px);box-shadow:inset 0 1px #ffffff2e,0 22px 54px #00000057,0 0 28px #2dd4ff2e;border-color:#2dd4ff61}.mode-card.ready:active{transform:translateY(-1px)}.mode-card .mode-icon{font-size:32px;line-height:1}.mode-card .mode-title{font-size:17px;font-weight:850;margin-bottom:2px}.mode-card .mode-desc{font-size:13px;color:#e2e8f0bd;line-height:1.45}.arcade-versus-slot.mode-card .versus-actions{display:flex;gap:10px;margin-top:12px;width:100%}.mode-sub-btn{flex:1;padding:11px 10px;border-radius:7px;border:1px solid rgba(255,255,255,.16);font-family:inherit;font-weight:700;font-size:14px;color:#fff;background:#2dd4ff38;cursor:not-allowed;opacity:.85}.arcade-versus-slot.mode-card.ready .mode-sub-btn{cursor:pointer;opacity:1}.arcade-versus-slot.mode-card.ready .mode-sub-btn.accent{background:linear-gradient(135deg,#ff6fae,#8b5cf6)}.mode-sub-btn.spelling-start{background:linear-gradient(135deg,#35d6b4,#2364ff)}.mode-sub-btn.rope-start{background:linear-gradient(135deg,#facc15,#f97316)}.mode-sub-btn.platformer-start{background:linear-gradient(135deg,#22d3ee,#35d6b4)}@media(max-width:1180px){.mode-cards{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:820px){.mode-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}.mode-wait-muted{font-size:13px;color:#e2e8f0ad;margin:-6px auto 22px}.menu-footer{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:14px;color:#e2e8f0b3;font-size:13px}.menu-footer span{padding:7px 10px;border-radius:6px;background:#ffffff14;border:1px solid rgba(255,255,255,.12)}.bg-decorations{position:absolute;top:0;left:0;right:0;bottom:0;overflow:hidden;pointer-events:none}.floating-star{position:absolute;animation:floatAround 12s ease-in-out infinite;opacity:.36;color:#fffc;text-shadow:0 0 18px rgba(45,212,255,.55)}@keyframes floatAround{0%,to{transform:translateY(0) translate(0) rotate(0)}25%{transform:translateY(-30px) translate(20px) rotate(90deg)}50%{transform:translateY(-10px) translate(-20px) rotate(180deg)}75%{transform:translateY(-40px) translate(10px) rotate(270deg)}}@media(max-width:768px){.loading-content{padding:20px}.main-title{font-size:32px;flex-wrap:wrap}.mode-cards{grid-template-columns:1fr}}@media(max-height:760px){.loading-content{padding-top:16px;padding-bottom:16px}.logo-section{margin-bottom:10px}.logo-sprite{width:68px;height:68px}.sprite-body{width:56px;height:56px}.mode-section{margin-top:14px}.mode-card{min-height:150px}}.music-player{position:absolute;bottom:20px;left:50%;transform:translate(-50%);z-index:150}.music-controls{display:flex;align-items:center;gap:12px;background:linear-gradient(135deg,#b0e0e6f2,#87ceebf2);padding:10px 20px;border-radius:30px;box-shadow:0 8px 32px #00ced14d,0 0 0 2px #ffffff80;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.music-btn{background:#ffffffe6;border:none;border-radius:50%;width:40px;height:40px;font-size:18px;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 10px #0000001a}.music-btn:hover{transform:scale(1.1);box-shadow:0 4px 15px #00ced166}.music-btn.small{width:30px;height:30px;font-size:14px}.play-btn{background:linear-gradient(135deg,#00ced1,#87ceeb)}.track-info{display:flex;align-items:center;gap:8px;padding:0 10px;min-width:150px}.music-icon{font-size:18px;animation:musicNote 1s ease-in-out infinite}@keyframes musicNote{0%,to{transform:rotate(-10deg)}50%{transform:rotate(10deg)}}.track-name{font-size:13px;font-weight:600;color:#1a5276;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:120px}.track-controls{display:flex;gap:5px}.volume-control{display:flex;align-items:center;gap:8px}.volume-icon{font-size:16px}.volume-slider{width:60px;height:4px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#ffffff80;border-radius:2px;outline:none;cursor:pointer}.volume-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:14px;height:14px;background:linear-gradient(135deg,#00ced1,#4169e1);border-radius:50%;cursor:pointer;box-shadow:0 2px 6px #0003;transition:transform .2s}.volume-slider::-webkit-slider-thumb:hover{transform:scale(1.2)}.volume-slider::-moz-range-thumb{width:14px;height:14px;background:linear-gradient(135deg,#00ced1,#4169e1);border-radius:50%;cursor:pointer;border:none}@media(max-width:768px){.music-player{bottom:250px}.music-controls{padding:8px 15px;gap:8px}.track-info,.volume-control{display:none}}.login-screen{min-height:100vh;min-height:100svh;display:grid;place-items:center;padding:24px;background:linear-gradient(180deg,#080d1c33,#080d1ccc),radial-gradient(circle at 22% 18%,rgba(255,111,174,.34),transparent 28%),radial-gradient(circle at 78% 16%,rgba(45,212,255,.32),transparent 32%),linear-gradient(135deg,#101828,#1e1b4b 52%,#063447)}.login-panel{width:min(92vw,430px);padding:28px;border-radius:8px;background:#0c1226c7;border:1px solid rgba(255,255,255,.18);box-shadow:0 28px 90px #00000061;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.login-brand{display:flex;align-items:center;gap:14px;margin-bottom:22px}.login-mark{display:grid;place-items:center;width:52px;height:52px;border-radius:8px;background:linear-gradient(135deg,#ff6fae,#2dd4ff);font-size:26px}.login-brand h1{margin:0 0 4px;font-size:26px;color:#f8fbff}.login-brand p,.wechat-login p{margin:0;color:#e2e8f0b8;line-height:1.55}.login-tabs{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:18px}.login-tabs button,.login-primary{border:1px solid rgba(255,255,255,.16);border-radius:8px;font-family:inherit;font-weight:800;color:#f8fbff;cursor:pointer}.login-tabs button{padding:10px 12px;background:#ffffff14}.login-tabs button.active{background:#2dd4ff3d;border-color:#2dd4ff6b}.login-form{display:grid;gap:14px}.login-form label{display:grid;gap:7px;color:#e2e8f0d1;font-size:13px;font-weight:800}.login-form input{width:100%;min-height:44px;padding:0 12px;border-radius:8px;border:1px solid rgba(255,255,255,.16);background:#ffffff1a;color:#f8fbff;font:inherit}.login-form input:focus{outline:2px solid rgba(45,212,255,.42);outline-offset:2px}.login-error{padding:10px 12px;border-radius:8px;background:#f8717129;border:1px solid rgba(248,113,113,.32);color:#fecaca;font-size:13px}.login-primary{width:100%;min-height:46px;background:linear-gradient(135deg,#ff6fae,#2364ff);box-shadow:0 14px 34px #2364ff3d}.wechat-login{display:grid;gap:16px;justify-items:center;text-align:center}.qr-box{width:180px;height:180px;padding:14px;border-radius:8px;background:#f8fbff;box-shadow:0 18px 44px #00000038}.qr-grid{width:100%;height:100%;background:linear-gradient(90deg,#111827 10px,transparent 10px) 0 0 / 26px 26px,linear-gradient(#111827 10px,transparent 10px) 0 0 / 26px 26px,linear-gradient(135deg,transparent 42%,#111827 42% 58%,transparent 58%)}.login-hints{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px;color:#e2e8f0ad;font-size:12px}.login-hints span{padding:7px 9px;border-radius:7px;background:#ffffff14}.admin-dashboard{min-height:100vh;min-height:100svh;display:grid;grid-template-columns:240px minmax(0,1fr);background:radial-gradient(circle at 16% 18%,rgba(45,212,255,.2),transparent 30%),radial-gradient(circle at 88% 12%,rgba(255,111,174,.24),transparent 32%),#0f172a;color:#f8fbff}.admin-sidebar{display:flex;flex-direction:column;gap:12px;padding:24px;background:#080d1cd1;border-right:1px solid rgba(255,255,255,.12)}.admin-logo{display:grid;place-items:center;width:44px;height:44px;border-radius:8px;background:linear-gradient(135deg,#35d6b4,#2364ff);margin-bottom:16px}.admin-sidebar h1,.admin-section h2{margin:0}.admin-sidebar p,.admin-section-head p{margin:7px 0 0;color:#e2e8f0a8;line-height:1.5}.admin-sidebar button,.admin-section-head button,.admin-user-form button,.admin-table button{min-height:38px;border:1px solid rgba(255,255,255,.14);border-radius:8px;background:#ffffff14;color:#f8fbff;font:inherit;font-weight:800;cursor:pointer}.admin-sidebar button:first-of-type{margin-top:auto}.admin-main{height:100vh;overflow:auto;padding:24px;display:grid;gap:18px;align-content:start}.admin-section{padding:20px;border-radius:8px;background:#0f172ac2;border:1px solid rgba(255,255,255,.12);box-shadow:0 18px 54px #00000038}.admin-section-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:16px}.admin-user-form{display:grid;grid-template-columns:minmax(120px,1fr) minmax(120px,1fr) 140px 120px;gap:10px;margin-bottom:12px}.admin-user-form input,.admin-user-form select{min-height:40px;border-radius:8px;border:1px solid rgba(255,255,255,.14);background:#ffffff14;color:#f8fbff;font:inherit;padding:0 10px}.admin-user-form select option{color:#172033}.admin-message{color:#a7f3d0;margin-bottom:10px}.admin-table{display:grid;border:1px solid rgba(255,255,255,.1);border-radius:8px;overflow:hidden}.admin-table-row{display:grid;grid-template-columns:1fr 120px 140px 88px;gap:12px;align-items:center;padding:10px 12px;border-top:1px solid rgba(255,255,255,.08)}.admin-table-row:first-child{border-top:0}.admin-table-head{color:#e2e8f0bd;font-weight:800;background:#ffffff0f}.records-layout{display:grid;grid-template-columns:320px minmax(0,1fr);gap:16px}.records-list{display:grid;align-content:start;gap:8px;max-height:560px;overflow:auto}.records-list button{display:grid;gap:4px;text-align:left;padding:12px;border-radius:8px;border:1px solid rgba(255,255,255,.1);background:#ffffff12;color:#f8fbff;font:inherit;cursor:pointer}.records-list button.selected{border-color:#2dd4ff75;background:#2dd4ff29}.records-list span{color:#e2e8f0ad;font-size:13px}.record-detail{min-height:320px;display:grid;gap:14px;align-content:start}.record-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.record-summary.record-summary-wide{grid-template-columns:repeat(5,minmax(0,1fr))}.record-summary div{padding:12px;border-radius:8px;background:#ffffff12}.record-summary span{display:block;margin-bottom:6px;color:#e2e8f0a3;font-size:12px}.admin-word-list{display:grid;gap:8px}.admin-word-list h4{margin:0;color:#e2e8f0db}.admin-word-list div{display:flex;flex-wrap:wrap;gap:7px}.admin-word-list span,.admin-word-list em,.empty-records{padding:7px 9px;border-radius:7px;background:#ffffff14;color:#e2e8f0c7;font-size:13px}.admin-word-list span{display:inline-flex;flex-wrap:wrap;align-items:center;gap:5px}.admin-word-list span strong{color:#f8fbff}.admin-word-list span em{padding:3px 6px;background:#facc1524;color:#fef3c7;font-style:normal;font-weight:850}.admin-spelling-list{display:grid;gap:8px}.admin-spelling-list h4{margin:0;color:#e2e8f0db}.admin-spelling-items{display:grid;gap:9px}.admin-spelling-item{display:grid;gap:9px;padding:11px;border-radius:8px;background:#ffffff12;border:1px solid rgba(255,255,255,.09)}.admin-spelling-item>div:first-child{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}.admin-spelling-item span{color:#e2e8f0b8}.admin-letter-attempts{display:flex;flex-wrap:wrap;gap:7px}.admin-letter-attempts span{display:inline-flex;gap:5px;align-items:center;padding:6px 8px;border-radius:7px;background:#2dd4ff1f;color:#e0fbff;font-size:12px;font-weight:800}.admin-letter-attempts em{color:#e2e8f0a3;font-style:normal;font-weight:700}@media(max-width:900px){.admin-dashboard{grid-template-columns:1fr}.admin-sidebar{position:sticky;top:0;z-index:2}.admin-main{height:auto}.admin-user-form,.records-layout,.record-summary,.record-summary.record-summary-wide,.admin-table-row{grid-template-columns:1fr}}.app-container{position:relative;width:100vw;height:100vh;overflow:hidden;background:radial-gradient(circle at 18% 20%,rgba(255,111,174,.34),transparent 26%),radial-gradient(circle at 82% 10%,rgba(45,212,255,.28),transparent 30%),linear-gradient(160deg,#101828,#1d1b3f 48%,#062c3d)}.canvas-container{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1}.canvas-container--hidden{visibility:hidden;pointer-events:none}.pose-detector-container{position:absolute;bottom:max(18px,env(safe-area-inset-bottom));left:max(18px,env(safe-area-inset-left));width:clamp(190px,19vw,280px);height:clamp(142px,14.25vw,210px);border-radius:8px;overflow:hidden;z-index:100;border:1px solid rgba(255,255,255,.24);box-shadow:0 18px 52px #00000057,0 0 32px #2dd4ff33;background:#0c1226b8;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.pose-detector-container:before{content:"LIVE CAMERA";position:absolute;top:8px;left:8px;transform:none;background:#0f172a9e;padding:4px 9px;border-radius:6px;font-size:12px;font-weight:800;letter-spacing:.08em;color:#e0fbff;z-index:10;white-space:nowrap;border:1px solid rgba(255,255,255,.2)}.pose-detector-container video{width:100%;height:100%;object-fit:cover;transform:scaleX(-1)}.pose-detector-container canvas{position:absolute;top:0;left:0;width:100%;height:100%;transform:scaleX(-1)}.pose-arcade-fullscreen{position:fixed!important;top:0!important;left:0!important;right:0!important;bottom:0!important;width:100vw!important;height:100vh!important;min-height:100svh!important;max-width:none!important;margin:0!important;border-radius:0!important;z-index:41!important;overflow:hidden;pointer-events:none;isolation:isolate;box-shadow:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;background:#0f172a}.pose-arcade-fullscreen video{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;min-width:100%;min-height:100%;margin:0;padding:0;object-fit:cover;object-position:center center;transform:scaleX(-1);transform-origin:center center;display:block;z-index:0}.pose-arcade-fullscreen canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%!important;height:100%!important;margin:0!important;padding:0!important;display:block;transform:scaleX(-1);transform-origin:center center;pointer-events:none;z-index:2}.pose-arcade-fullscreen .camera-loading{z-index:10}.pose-arcade-fullscreen .camera-status,.pose-arcade-fullscreen .pose-status{z-index:12}.pose-arcade-fullscreen .camera-status{top:max(12px,env(safe-area-inset-top));left:max(12px,env(safe-area-inset-left))}.pose-arcade-fullscreen .pose-status{bottom:max(96px,env(safe-area-inset-bottom,96px));white-space:normal;max-width:min(92vw,480px);line-height:1.35}.camera-loading{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:#fffffff2;pointer-events:none;background:#0f172aad}.loading-spinner{width:44px;height:44px;border:3px solid rgba(0,206,209,.25);border-top:3px solid #22d3ee;border-radius:50%;animation:camera-spin .95s linear infinite}@keyframes camera-spin{to{transform:rotate(360deg)}}.camera-status{position:absolute;top:36px;left:8px;display:flex;align-items:center;gap:6px;padding:5px 9px;background:#0f172a99;border-radius:6px;font-size:12px;color:#f8fbff;border:1px solid rgba(255,255,255,.18)}.camera-status-dot{width:8px;height:8px;border-radius:50%;background:#4caf50;animation:pulse 1.5s infinite}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(1.2)}}.pose-status{position:absolute;bottom:9px;left:50%;transform:translate(-50%);padding:7px 12px;background:#0c1226ad;border-radius:7px;font-size:12px;font-weight:600;color:#f8fbff;white-space:nowrap;max-width:90%;text-align:center;border:1px solid rgba(255,255,255,.2)}.avatar-label{position:absolute;top:92px;left:max(22px,env(safe-area-inset-left));background:#0c1226a3;padding:9px 14px;border-radius:8px;font-size:14px;font-weight:700;color:#e0fbff;z-index:50;box-shadow:0 10px 32px #00000038;display:flex;align-items:center;gap:8px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.18)}.mapping-hint{display:none}.mapping-hint-arrow{font-size:20px;animation:arrowPulse 1s ease-in-out infinite}@keyframes arrowPulse{0%,to{transform:translate(0);opacity:1}50%{transform:translate(5px);opacity:.7}}*{margin:0;padding:0;box-sizing:border-box}:root{--macaron-pink: #ff6fae;--macaron-lavender: #8b5cf6;--macaron-mint: #35d6b4;--macaron-peach: #ffb45c;--macaron-sky: #2dd4ff;--macaron-lilac: #a78bfa;--macaron-cream: #fff7d6;--macaron-coral: #ff6b6b;--surface-dark: rgba(12, 18, 38, .74);--surface-glass: rgba(255, 255, 255, .12);--surface-bright: rgba(255, 255, 255, .88);--line-soft: rgba(255, 255, 255, .2);--text-primary: #f8fbff;--text-secondary: rgba(226, 232, 240, .78);--text-dark: #172033;--text-muted-dark: #64748b;--gold-sparkle: #ffd166;--gold-light: #fff0b8}html,body,#root{width:100%;height:100%;overflow:hidden;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Microsoft YaHei,sans-serif;background:radial-gradient(circle at 20% 15%,rgba(255,111,174,.42),transparent 28%),radial-gradient(circle at 82% 22%,rgba(45,212,255,.34),transparent 30%),radial-gradient(circle at 50% 82%,rgba(53,214,180,.22),transparent 32%),linear-gradient(135deg,#111827,#20203f 44%,#0f2542);background-size:400% 400%;color:var(--text-primary);animation:gradientShift 18s ease infinite;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}@keyframes gradientShift{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes sparkle{0%,to{opacity:1;transform:scale(1)}50%{opacity:.7;transform:scale(1.1)}}@keyframes pulse-glow{0%,to{box-shadow:0 0 20px #ffb6c180,0 0 40px #dda0dd4d}50%{box-shadow:0 0 30px #ffb6c1cc,0 0 60px #dda0dd80}}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--macaron-cream);border-radius:4px}::-webkit-scrollbar-thumb{background:linear-gradient(var(--macaron-pink),var(--macaron-lilac));border-radius:4px}::-webkit-scrollbar-thumb:hover{background:linear-gradient(var(--macaron-coral),var(--macaron-pink))}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}