*,*:before,*:after{box-sizing:border-box}:root{font-family:FZMiaoWuS-GB,方正喵呜体,ZCOOL KuaiLe,PingFang SC,Microsoft YaHei,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}html{overflow-x:hidden;max-width:100vw}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh;max-width:100vw;overflow-x:hidden}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}#root{width:100%;max-width:100vw;margin:0;padding:0;text-align:center;min-height:100vh;overflow-x:hidden}.app-container{display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:FZMiaoWuS-GB,方正喵呜体,ZCOOL KuaiLe,PingFang SC,Microsoft YaHei,sans-serif;color:var(--current-level-accent);background-color:var(--current-level-bg, #fffaf0);min-height:100vh;width:100%;max-width:100vw;transition:all 1s ease;position:relative;overflow-x:hidden;overflow-y:auto;padding:2rem;background-image:radial-gradient(circle at 10% 20%,var(--current-level-secondary) 0%,transparent 20%),radial-gradient(circle at 90% 80%,var(--current-level-secondary) 0%,transparent 20%);background-attachment:fixed}.header{margin-bottom:1.5rem;width:100%;flex-shrink:0}.kitty-logo{font-size:clamp(1.8rem,4vw,2.8rem);font-weight:700;color:var(--current-level-accent);text-shadow:2px 2px var(--current-level-secondary);margin:0;padding:16px 32px;background:#fff9;border-radius:50px;display:inline-block;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:2px solid var(--current-level-secondary);transition:all 1s ease}.game-main{position:relative;width:100%;display:flex;flex-direction:column;align-items:center}.game-layout{display:flex;flex-direction:row;gap:3rem;justify-content:center;align-items:center;padding:2.5rem;flex-wrap:wrap;background:#fff6;border-radius:36px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:2px solid rgba(255,255,255,.6);box-shadow:0 10px 40px #00000014}.grid-section{flex:0 0 auto}.side-panel{display:flex;flex-direction:column;gap:1.25rem;min-width:340px;max-width:340px}.stats-panel{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.stat-card{background:#fff;padding:16px 14px;border-radius:18px;border:none;display:flex;flex-direction:column;align-items:center;gap:6px;box-shadow:0 4px 15px #0000000f;transition:all .3s ease}.stat-card:hover{transform:translateY(-2px);box-shadow:0 6px 20px #0000001a}.stat-label{font-size:.8rem;color:var(--current-level-accent);text-transform:uppercase;letter-spacing:.5px;transition:color 1s ease;opacity:.7}.stat-value{font-size:1.3rem;font-weight:700;font-family:YouYuan,幼圆,PingFang SC,Microsoft YaHei,sans-serif;color:var(--current-level-accent);transition:color 1s ease}.number-pad{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;background:#fff;padding:18px;border-radius:24px;border:none;box-shadow:0 4px 20px #00000014;transition:all .3s ease}.num-btn{position:relative;width:95px;height:95px;border:none;border-radius:16px;cursor:pointer;overflow:hidden;transition:all .3s cubic-bezier(.175,.885,.32,1.275);display:flex;justify-content:center;align-items:center;background:linear-gradient(145deg,#fff,#f5f5f5);box-shadow:4px 4px 10px #00000014,-2px -2px 8px #ffffffe6}.num-value{position:absolute;top:0;left:0;z-index:5;font-size:22px;font-weight:900;font-family:YouYuan,STYuanti-SC-Regular,幼圆,Microsoft YaHei,sans-serif;color:#fff!important;background-color:var(--shadow-color);width:36px;height:36px;display:flex;justify-content:center;align-items:center;border-radius:0 0 16px;box-shadow:1px 1px 3px #0000001a}.num-bg-image{position:absolute;inset:12px;background-image:var(--kitty-url);background-size:contain;background-repeat:no-repeat;background-position:center;opacity:.9;z-index:1;transition:all .3s}.num-btn:hover{transform:translateY(-3px) scale(1.05)}.num-btn:hover .num-bg-image{opacity:1;transform:scale(1.1) rotate(3deg)}.num-btn:hover .num-value{width:40px;height:40px;font-size:24px}.num-btn:active{transform:translateY(0) scale(.95)}.curtain-overlay{position:absolute;top:0;left:0;width:100%;height:100%;z-index:10;pointer-events:none;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center}.curtain-fabric{position:absolute;top:-100%;left:0;width:100%;height:100%;background:linear-gradient(180deg,var(--current-level-accent) 0%,var(--current-level-secondary) 100%);border-bottom:4px solid var(--current-level-accent);transition:top .8s cubic-bezier(.45,0,.55,1);box-shadow:0 2px 10px #0003}.curtain-fabric:after{content:"🎀";position:absolute;bottom:5px;left:50%;transform:translate(-50%);font-size:16px}.sleep-icon{position:relative;z-index:11;font-size:24px;opacity:0;transform:translateY(20px);transition:all .5s ease .6s}.num-btn.completed{cursor:default;filter:grayscale(.2)}.num-btn.completed .curtain-fabric{top:0}.num-btn.completed .sleep-icon{opacity:1;transform:translateY(0);animation:sleep-float 2s infinite ease-in-out}.num-btn.completed .num-bg-image{filter:blur(2px) brightness(.7);opacity:.3}.num-btn.completed .num-value{opacity:.2}@keyframes sleep-float{0%,to{transform:translate(0) scale(1);opacity:.8}50%{transform:translate(5px,-10px) scale(1.2);opacity:1}}.btn-theme-1{--shadow-color: #ff8fab}.btn-theme-2{--shadow-color: #89cff0}.btn-theme-3{--shadow-color: #ffd166}.btn-theme-4{--shadow-color: #b7e4c7}.btn-theme-5{--shadow-color: #ffb5a7}.btn-theme-6{--shadow-color: #cdb4db}.btn-theme-7{--shadow-color: #ffcad4}.btn-theme-8{--shadow-color: #99e1d9}.btn-theme-9{--shadow-color: #a2d2ff}.controls{display:flex;flex-direction:row;gap:10px}.secondary-btn{flex:1;padding:14px 12px;background:#fff;color:var(--current-level-accent);border:none;border-radius:16px;cursor:pointer;font-family:inherit;font-weight:700;transition:all .2s;font-size:.9rem;box-shadow:0 3px 10px #00000014;white-space:nowrap;min-width:0}.secondary-btn:hover{background:var(--current-level-accent);color:#fff;transform:translateY(-2px);box-shadow:0 5px 15px #00000026}.overlay{position:absolute;inset:0;background:#fffffff2;display:flex;flex-direction:column;justify-content:center;align-items:center;border-radius:20px;z-index:300;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);animation:overlay-appear .5s cubic-bezier(.175,.885,.32,1.275)}.overlay-content{text-align:center;animation:content-bounce .6s cubic-bezier(.175,.885,.32,1.275) .2s both}.overlay-icon{font-size:4rem;margin-bottom:10px;animation:icon-bounce 1s ease infinite}.overlay-time{font-size:1.1rem;opacity:.8;margin:5px 0}.bonus-text{font-size:1.1rem;color:#ff69b4;animation:bonus-glow 1s ease infinite alternate}@keyframes overlay-appear{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes content-bounce{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes icon-bounce{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}@keyframes bonus-glow{0%{text-shadow:0 0 5px rgba(255,105,180,.5)}to{text-shadow:0 0 15px rgba(255,105,180,.8)}}.won{color:var(--current-level-accent);border:4px solid var(--current-level-accent)}.won h2{color:var(--current-level-accent);margin:10px 0}.lost{color:#8b0000;border:4px solid #8b0000}.lost h2{color:#8b0000}.action-btn{padding:16px 40px;font-size:1.3rem;background:linear-gradient(135deg,var(--current-level-accent),var(--current-level-secondary));color:#fff;border:none;border-radius:30px;cursor:pointer;margin-top:20px;box-shadow:0 6px 20px #0003;transition:all .3s;font-weight:700}.action-btn:hover{transform:translateY(-3px) scale(1.05);box-shadow:0 10px 30px #00000040}.keyboard-hint{text-align:center;color:var(--current-level-accent);opacity:.5;font-size:.8rem;padding:10px 16px;background:#ffffff80;border-radius:20px}.keyboard-hint small{display:block}.hint-btn:disabled{opacity:.5;cursor:not-allowed}.hearts-display{letter-spacing:2px}.confetti-container{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:500;overflow:hidden}.confetti-piece{position:absolute;top:-20px;width:12px;height:12px;background:linear-gradient(135deg,#ff69b4,gold,#87ceeb,#98fb98,plum);background-size:500% 500%;animation:confetti-fall 3s linear forwards;animation-delay:var(--delay);border-radius:2px;will-change:transform,opacity;contain:strict}@keyframes confetti-fall{0%{transform:translateY(0) rotate(0) scale(1);opacity:1}to{transform:translateY(100vh) rotate(720deg) scale(.5);opacity:0}}@media(max-width:1100px){.game-layout{gap:2rem;padding:2rem}.side-panel{min-width:300px;max-width:300px}.num-btn{width:85px;height:85px}}@media(max-width:800px){.app-container{padding:1.5rem 1rem 1rem;justify-content:flex-start}.header{margin-bottom:1rem}.kitty-logo{font-size:1.4rem;padding:12px 24px}.game-layout{flex-direction:column;align-items:center;gap:1.5rem;padding:1.25rem;border-radius:24px}.side-panel{width:100%;max-width:100%;min-width:auto;gap:12px}.stats-panel{grid-template-columns:repeat(4,1fr);gap:8px}.stat-card{padding:10px 8px}.stat-label{font-size:.65rem}.stat-value{font-size:1rem}.number-pad{gap:8px;padding:12px;max-width:320px;margin:0 auto}.num-btn{width:90px;height:90px}.num-value{width:30px;height:30px;font-size:18px}.controls{flex-direction:row;max-width:320px;margin:0 auto}.secondary-btn{padding:12px 14px;font-size:.85rem}.keyboard-hint{font-size:.75rem;max-width:320px;margin:0 auto}}@media(max-width:400px){.number-pad{max-width:280px;gap:6px;padding:10px}.num-btn{width:78px;height:78px}.controls{max-width:280px}}.top-controls{position:fixed;top:20px;right:20px;z-index:100;display:flex;gap:10px;align-items:center}.sound-toggle,.tutorial-link{display:flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;background:var(--current-level-bg);border:2px solid var(--current-level-secondary);border-radius:50%;cursor:pointer;box-shadow:0 4px 15px #0000001a;transition:all .3s ease;overflow:hidden;box-sizing:border-box;text-decoration:none}.sound-toggle:hover,.tutorial-link:hover{transform:scale(1.1);box-shadow:0 6px 20px #00000026;border-color:var(--current-level-accent)}.sound-toggle.muted{opacity:.85}.sound-toggle .sound-icon{width:75%;height:75%}.tutorial-link{font-size:1.3rem}.difficulty-badge{display:flex;align-items:center;gap:8px;padding:8px 16px 8px 8px;background:#ffffffe6;border:none;border-radius:25px;cursor:pointer;font-family:inherit;font-size:.9rem;font-weight:600;color:var(--current-level-accent);box-shadow:0 4px 15px #0000001a;transition:all .2s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.difficulty-badge:hover{transform:translateY(-2px);box-shadow:0 6px 20px #00000026}.difficulty-badge-icon{width:28px;height:28px;object-fit:contain}@media(max-width:800px){.app-container{padding-top:1rem}.top-controls{position:static;order:2;justify-content:center;margin-bottom:1rem}.header{order:1;margin-bottom:.5rem}.game-main{order:3}}@media(max-width:600px){.top-controls{gap:8px}.difficulty-badge{padding:6px 10px 6px 6px;font-size:.8rem;border-radius:20px}.difficulty-badge-icon{width:22px;height:22px}.sound-toggle,.tutorial-link{width:36px;height:36px}.tutorial-link{font-size:1.2rem}}@media(max-width:400px){.top-controls{gap:6px}.difficulty-badge{padding:5px 8px 5px 5px;font-size:.7rem;gap:4px}.difficulty-badge-icon{width:18px;height:18px}.sound-toggle,.tutorial-link{width:32px;height:32px}.tutorial-link{font-size:1.1rem}}.falling-item{position:fixed;top:-50px;font-size:30px;z-index:200;pointer-events:none;animation:fall-rotate linear forwards;will-change:transform;contain:layout style}@keyframes fall-rotate{0%{transform:translateY(0) rotate(0)}to{transform:translateY(calc(100vh + 100px)) rotate(360deg)}}.sudoku-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);border:3px solid var(--current-level-accent);background-color:#fff;border-radius:20px;overflow:hidden;box-shadow:0 10px 40px #0000001a,inset 0 0 0 1px #ffffff80;transition:border-color 1s ease}.sudoku-grid-loading{display:flex;justify-content:center;align-items:center;width:300px;height:300px;font-size:1.2rem;color:var(--current-level-accent)}.sudoku-block{display:grid;grid-template-columns:repeat(3,68px);grid-template-rows:repeat(3,68px);border:1.5px solid var(--current-level-accent);position:relative;transition:all .5s ease,border-color 1s ease}.sudoku-cell{width:68px;height:68px;border:1px solid rgba(0,0,0,.06);display:flex;justify-content:center;align-items:center;font-size:28px;font-family:YouYuan,幼圆,PingFang SC,Microsoft YaHei,sans-serif;cursor:pointer;transition:transform .2s ease,background-color .2s ease,box-shadow .2s ease;color:var(--current-level-accent);font-weight:600;-webkit-user-select:none;user-select:none;background-color:#ffffffe6;position:relative;z-index:2;contain:layout style}.sudoku-cell.initial{background-color:#00000005;color:var(--current-level-accent);font-weight:800}.sudoku-cell.selected{background-color:var(--current-level-accent)!important;color:#fff!important;transform:scale(1.08);z-index:4;box-shadow:0 4px 20px #00000040;border-radius:8px;border-color:transparent}.sudoku-cell.highlighted{background-color:var(--current-level-secondary);opacity:.85}.sudoku-cell.same-value{background:linear-gradient(135deg,var(--current-level-secondary),rgba(255,255,255,.8));box-shadow:inset 0 0 0 2px var(--current-level-accent);font-weight:800}.sudoku-cell:hover:not(.selected){background-color:#fff;transform:scale(1.02);z-index:3}.sudoku-cell.cell-success{animation:cell-pop-success .5s cubic-bezier(.175,.885,.32,1.275)}.sudoku-cell.cell-error{animation:cell-shake .5s ease;background-color:#ffcccb!important}.sudoku-cell.cell-hint{animation:cell-hint-glow .8s ease}@keyframes cell-pop-success{0%{transform:scale(1)}30%{transform:scale(1.3);background-color:#90ee90}to{transform:scale(1)}}@keyframes cell-shake{0%,to{transform:translate(0)}20%{transform:translate(-5px)}40%{transform:translate(5px)}60%{transform:translate(-5px)}80%{transform:translate(5px)}}@keyframes cell-hint-glow{0%{transform:scale(1);box-shadow:0 0 #ffd700b3}50%{transform:scale(1.15);box-shadow:0 0 20px 10px #ffd70080;background-color:gold}to{transform:scale(1);box-shadow:0 0 #ffd70000}}.sudoku-block.completed{border:2px solid var(--current-level-accent)}.block-kitty-bg{position:absolute;top:0;left:0;width:100%;height:100%;background-image:var(--block-kitty-url);background-size:80%;background-repeat:no-repeat;background-position:center;opacity:.25;z-index:1;animation:block-reveal 1s cubic-bezier(.175,.885,.32,1.275)}.sudoku-block.completed .sudoku-cell{background-color:transparent;border-color:transparent}.sudoku-block.celebrating{animation:block-celebrate .8s ease}.block-celebration{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:10;pointer-events:none}.celebration-star{position:absolute;font-size:24px;animation:star-burst 1s ease forwards;animation-delay:calc(var(--i) * .05s)}@keyframes block-celebrate{0%{transform:scale(1)}30%{transform:scale(1.05)}to{transform:scale(1)}}@keyframes star-burst{0%{opacity:1;transform:translate(0) scale(.5)}to{opacity:0;transform:translate(calc(cos(calc(var(--i) * 45deg))*60px),calc(sin(calc(var(--i) * 45deg))*60px)) scale(1.2)}}@keyframes block-reveal{0%{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:.25}}@media(max-width:800px){.sudoku-block{grid-template-columns:repeat(3,52px);grid-template-rows:repeat(3,52px)}.sudoku-cell{width:52px;height:52px;font-size:22px}}@media(max-width:500px){.sudoku-grid{border-radius:16px;border-width:2px}.sudoku-block{grid-template-columns:repeat(3,38px);grid-template-rows:repeat(3,38px);border-width:1px}.sudoku-cell{width:38px;height:38px;font-size:18px}}.toast{position:fixed;top:20px;left:50%;transform:translate(-50%);padding:14px 20px;border-radius:20px;display:flex;align-items:flex-start;gap:10px;font-size:1rem;font-weight:600;z-index:1000;animation:toast-in .4s cubic-bezier(.175,.885,.32,1.275);box-shadow:0 8px 30px #00000026;max-width:90vw;text-align:left;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease}.toast:hover{transform:translate(-50%) scale(1.02);box-shadow:0 10px 35px #0003}.toast:active{transform:translate(-50%) scale(.98)}.toast-icon{font-size:1.3rem;flex-shrink:0}.toast-message{word-wrap:break-word;line-height:1.4;flex:1}.toast-close{font-size:.9rem;opacity:.5;margin-left:8px;flex-shrink:0;transition:opacity .15s ease}.toast:hover .toast-close{opacity:1}.toast-success{background:linear-gradient(135deg,#d4edda,#c3e6cb);color:#155724;border:2px solid #28a745}.toast-error{background:linear-gradient(135deg,#ffe0e6,#ffccd5);color:#8b0000;border:2px solid #ff6b6b}.toast-warning{background:linear-gradient(135deg,#fff3cd,#ffeeba);color:#856404;border:2px solid #ffc107}.toast-info{background:linear-gradient(135deg,#d1ecf1,#bee5eb);color:#0c5460;border:2px solid #17a2b8}@keyframes toast-in{0%{opacity:0;transform:translate(-50%) translateY(-30px) scale(.8)}to{opacity:1;transform:translate(-50%) translateY(0) scale(1)}}.toast-leaving{animation:toast-out .3s ease forwards}@keyframes toast-out{0%{opacity:1;transform:translate(-50%) translateY(0) scale(1)}to{opacity:0;transform:translate(-50%) translateY(-20px) scale(.8)}}.language-switcher{position:relative}.language-btn{display:flex;align-items:center;gap:8px;padding:10px 16px;background:#ffffffe6;border:none;border-radius:25px;cursor:pointer;font-family:inherit;font-size:.9rem;font-weight:600;color:var(--current-level-accent, #ff69b4);box-shadow:0 4px 15px #0000001a;transition:all .2s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.language-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #00000026}.lang-flag{font-size:1.2rem}.lang-name{font-size:.85rem}.lang-arrow{font-size:.6rem;transition:transform .2s ease}.lang-arrow.open{transform:rotate(180deg)}.language-dropdown{position:absolute;top:calc(100% + 8px);right:0;background:#fffffff2;border-radius:16px;box-shadow:0 8px 30px #00000026;overflow:hidden;animation:dropdown-appear .2s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}@keyframes dropdown-appear{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.language-option{display:flex;align-items:center;gap:10px;width:100%;padding:12px 20px;border:none;background:transparent;cursor:pointer;font-family:inherit;font-size:.9rem;color:#333;transition:all .15s ease;text-align:left}.language-option:hover{background:var(--current-level-secondary, #ffb6c1)}.language-option.active{background:var(--current-level-accent, #ff69b4);color:#fff}.language-option .lang-flag{font-size:1.3rem}@media(max-width:800px){.language-btn{padding:8px 12px}.lang-name,.lang-arrow{display:none}.language-dropdown .lang-name{display:inline}}@media(max-width:600px){.language-btn{padding:6px 10px;border-radius:20px}.lang-flag{font-size:1.1rem}.language-option{padding:10px 16px;font-size:.85rem}}@media(max-width:400px){.language-btn{padding:5px 8px;border-radius:16px}.lang-flag{font-size:1rem}}.difficulty-overlay{position:fixed;inset:0;background:linear-gradient(135deg,#fdf2f8,#fce7f3,#fbcfe8);display:flex;align-items:flex-start;justify-content:center;z-index:1000;padding:20px;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;max-width:100vw}.difficulty-top-controls{position:absolute;top:20px;right:20px;z-index:1100}.difficulty-container{text-align:center;max-width:800px;width:100%;padding:20px 0;margin:auto}.difficulty-title{font-size:2.2rem;color:#be185d;margin-bottom:4px;text-shadow:2px 2px 4px rgba(190,24,93,.2)}.difficulty-subtitle{font-size:1rem;color:#9d174d;margin-bottom:16px;opacity:.8}.tutorial-links{display:flex;justify-content:center;gap:12px;margin-bottom:24px;flex-wrap:wrap}.tutorial-btn{display:inline-flex;align-items:center;gap:6px;padding:8px 20px;background:#fff;color:#be185d;text-decoration:none;border-radius:30px;font-weight:600;font-size:.9rem;box-shadow:0 4px 15px #be185d26;border:2px solid rgba(190,24,93,.2);transition:all .2s ease}.tutorial-btn:hover{background:#be185d;color:#fff;transform:translateY(-2px);box-shadow:0 6px 20px #be185d40}.tutorial-btn.secondary{background:#ffffffb3;border-color:#be185d26}.tutorial-btn.secondary:hover{background:#9d174d}.tutorial-btn.battle{background:linear-gradient(135deg,#ff69b4,#ff8dc7);color:#fff;border-color:transparent;box-shadow:0 4px 15px #ff69b466}.tutorial-btn.battle:hover{background:linear-gradient(135deg,#ff4d9e,#ff69b4);transform:translateY(-2px) scale(1.02);box-shadow:0 6px 25px #ff69b480}.difficulty-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}.difficulty-card{background:#ffffffe6;border:none;border-radius:24px;padding:20px 16px;cursor:pointer;transition:all .3s ease;display:flex;flex-direction:column;align-items:center;gap:8px;box-shadow:0 8px 30px #0000001a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);text-align:center}.difficulty-card:hover{transform:translateY(-6px);box-shadow:0 16px 40px #00000026}.difficulty-card:active{transform:translateY(-2px)}.difficulty-easy{border:3px solid #f9a8d4}.difficulty-easy:hover{background:linear-gradient(135deg,#fdf2f8,#fce7f3)}.difficulty-easy .difficulty-icon{background:linear-gradient(135deg,#f9a8d4,#f472b6)}.difficulty-easy .progress-fill{background:linear-gradient(90deg,#f9a8d4,#f472b6)}.difficulty-normal{border:3px solid #c4b5fd}.difficulty-normal:hover{background:linear-gradient(135deg,#f5f3ff,#ede9fe)}.difficulty-normal .difficulty-icon{background:linear-gradient(135deg,#c4b5fd,#a78bfa)}.difficulty-normal .progress-fill{background:linear-gradient(90deg,#c4b5fd,#a78bfa)}.difficulty-hard{border:3px solid #fda4af}.difficulty-hard:hover{background:linear-gradient(135deg,#fff1f2,#ffe4e6)}.difficulty-hard .difficulty-icon{background:linear-gradient(135deg,#fda4af,#fb7185)}.difficulty-hard .progress-fill{background:linear-gradient(90deg,#fda4af,#fb7185)}.difficulty-expert{border:3px solid #a1a1aa}.difficulty-expert:hover{background:linear-gradient(135deg,#fafafa,#f4f4f5)}.difficulty-expert .difficulty-icon{background:linear-gradient(135deg,#71717a,#3f3f46)}.difficulty-expert .progress-fill{background:linear-gradient(90deg,#71717a,#3f3f46)}.difficulty-icon{width:72px;height:72px;display:flex;align-items:center;justify-content:center;border-radius:50%;margin-bottom:4px;padding:8px;box-sizing:border-box}.difficulty-icon img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(2px 2px 4px rgba(0,0,0,.1))}.difficulty-name{font-size:1.4rem;font-weight:700;color:#1f2937}.difficulty-desc{font-size:.9rem;color:#6b7280;margin-bottom:8px}.difficulty-stats{display:flex;flex-direction:column;gap:4px;font-size:.85rem;color:#6b7280}.stat-hearts{letter-spacing:-2px}.difficulty-progress{width:100%;margin-top:12px}.progress-bar{width:100%;height:8px;background:#0000001a;border-radius:4px;overflow:hidden}.progress-fill{height:100%;border-radius:4px;transition:width .5s ease}.progress-text{font-size:.8rem;color:#9ca3af;margin-top:6px;display:block}@media(max-width:700px){.difficulty-grid{grid-template-columns:repeat(2,1fr);gap:12px}.difficulty-card{padding:16px 12px;gap:6px}.difficulty-icon{width:60px;height:60px;padding:8px;margin-bottom:4px}.difficulty-name{font-size:1.1rem}.difficulty-desc{font-size:.8rem;margin-bottom:4px}.difficulty-stats{font-size:.75rem}.difficulty-progress{margin-top:8px}.progress-text{font-size:.7rem}}@media(max-width:480px){.difficulty-overlay{padding:12px}.difficulty-container{padding:8px 0}.difficulty-title{font-size:1.5rem;margin-bottom:2px}.difficulty-subtitle{font-size:.8rem;margin-bottom:12px}.tutorial-links{margin-bottom:16px;gap:8px}.tutorial-btn{padding:6px 16px;font-size:.8rem}.difficulty-grid{grid-template-columns:repeat(2,1fr);gap:10px}.difficulty-card{padding:12px 8px;gap:4px;border-radius:16px}.difficulty-icon{width:48px;height:48px;padding:4px;margin-bottom:2px}.difficulty-name{font-size:.9rem}.difficulty-desc{display:none}.difficulty-stats{font-size:.65rem;gap:2px}.stat-hearts{letter-spacing:-3px}.difficulty-progress{margin-top:4px}.progress-bar{height:4px}.progress-text{font-size:.6rem;margin-top:2px}}@media(max-width:360px){.difficulty-title{font-size:1.3rem}.difficulty-subtitle{font-size:.7rem;margin-bottom:10px}.tutorial-links{margin-bottom:12px}.difficulty-grid{gap:8px}.difficulty-card{padding:10px 6px}.difficulty-icon{width:40px;height:40px}.difficulty-name{font-size:.8rem}}.page-layout{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;background:linear-gradient(135deg,#fff5f8,#ffeef2,#fff0f5);overflow-x:hidden;width:100%;max-width:100vw}.page-header{background:#fffffff2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 2px 20px #ff69b426;position:sticky;top:0;z-index:100}.page-header-content{max-width:1200px;margin:0 auto;padding:16px 24px;display:flex;align-items:center;justify-content:space-between;gap:24px;box-sizing:border-box;width:100%}.page-logo{font-size:1.5rem;font-weight:700;color:#ff69b4;text-decoration:none;transition:transform .2s ease}.page-logo:hover{transform:scale(1.05)}.page-nav{display:flex;gap:24px}.page-nav a{color:#666;text-decoration:none;font-weight:500;padding:8px 16px;border-radius:20px;transition:all .2s ease}.page-nav a:hover{color:#ff69b4;background:#ff69b41a}.page-main{flex:1;max-width:900px;width:100%;margin:0 auto;padding:40px 24px;box-sizing:border-box}.page-title{font-size:2.5rem;color:#ff69b4;text-align:center;margin-bottom:32px;font-weight:700;word-wrap:break-word}.page-content{background:#ffffffe6;border-radius:24px;padding:40px;box-shadow:0 10px 40px #ff69b41a;line-height:1.8;color:#444;box-sizing:border-box;max-width:100%;overflow-wrap:break-word;word-wrap:break-word}.page-content h2{color:#ff69b4;font-size:1.5rem;margin-top:32px;margin-bottom:16px;padding-bottom:8px;border-bottom:2px solid rgba(255,105,180,.2)}.page-content h2:first-child{margin-top:0}.page-content h3{color:#e91e8c;font-size:1.2rem;margin-top:24px;margin-bottom:12px}.page-content p{margin-bottom:16px}.page-content ul,.page-content ol{margin-bottom:16px;padding-left:24px}.page-content li{margin-bottom:8px}.page-content a{color:#ff69b4;text-decoration:none;border-bottom:1px solid transparent;transition:border-color .2s ease}.page-content a:hover{border-bottom-color:#ff69b4}.page-content .highlight-box{background:linear-gradient(135deg,#fff5f8,#ffeef2);border-left:4px solid #ff69b4;padding:16px 20px;margin:20px 0;border-radius:0 12px 12px 0}.page-content .tip-box{background:linear-gradient(135deg,#f0fff4,#e8f5e9);border-left:4px solid #4caf50;padding:16px 20px;margin:20px 0;border-radius:0 12px 12px 0}.page-footer{background:#fffffff2;border-top:1px solid rgba(255,105,180,.2);margin-top:auto}.page-footer-content{max-width:1200px;margin:0 auto;padding:24px;text-align:center}.footer-links{display:flex;justify-content:center;gap:24px;margin-bottom:16px;flex-wrap:wrap}.footer-links a{color:#888;text-decoration:none;font-size:.9rem;transition:color .2s ease}.footer-links a:hover{color:#ff69b4}.footer-copyright{color:#aaa;font-size:.85rem;margin:0}@media(max-width:768px){.page-header-content{flex-wrap:wrap;gap:12px}.page-nav{order:3;width:100%;justify-content:center;gap:8px}.page-nav a{padding:6px 12px;font-size:.9rem}.page-title{font-size:1.8rem}.page-content{padding:24px}.footer-links{gap:16px}}@media(max-width:480px){.page-header-content{padding:12px 16px;gap:8px}.page-logo{font-size:1.1rem;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.page-nav{gap:4px}.page-nav a{padding:6px 10px;font-size:.8rem}.page-main{padding:20px 12px}.page-title{font-size:1.5rem;margin-bottom:20px}.page-content{padding:16px;border-radius:16px}.page-content h2{font-size:1.25rem;margin-top:24px;margin-bottom:12px}.page-content h3{font-size:1.1rem;margin-top:20px;margin-bottom:8px}.page-content p{font-size:.95rem;margin-bottom:12px}.page-content .highlight-box,.page-content .tip-box{padding:12px 14px;margin:16px 0;font-size:.9rem}.page-footer-content{padding:16px}.footer-links{gap:12px}.footer-links a{font-size:.8rem}.footer-copyright{font-size:.75rem}}.tutorial-article{font-size:1rem;max-width:100%;overflow-wrap:break-word;word-wrap:break-word}.tutorial-article section{margin-bottom:40px}.intro-text{font-size:1.1rem;color:#666;line-height:1.9;margin-bottom:32px;padding:20px;background:linear-gradient(135deg,#fff5f8,#ffeef2);border-radius:16px}.rules-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(200px,100%),1fr));gap:20px;margin:24px 0;max-width:100%}.rule-card{background:#fff;border-radius:16px;padding:24px;text-align:center;box-shadow:0 4px 20px #ff69b41a;border:2px solid rgba(255,105,180,.1);transition:transform .2s ease,box-shadow .2s ease;box-sizing:border-box;max-width:100%}.rule-card:hover{transform:translateY(-4px);box-shadow:0 8px 30px #ff69b426}.rule-icon{font-size:2.5rem;margin-bottom:12px}.rule-card h3{color:#ff69b4;margin:0 0 8px;font-size:1.1rem}.rule-card p{margin:0;color:#666;font-size:.95rem}.example-box{background:linear-gradient(135deg,#e3f2fd,#bbdefb);border-left:4px solid #2196f3;padding:16px 20px;margin:20px 0;border-radius:0 12px 12px 0}.technique-detail{background:#ffffffb3;border-radius:16px;padding:24px;margin:16px 0;border:1px solid rgba(255,105,180,.15)}.technique-detail h4{color:#e91e8c;margin:0 0 12px;font-size:1rem}.technique-detail h4:not(:first-child){margin-top:20px}.steps-list{counter-reset:step;list-style:none;padding:0}.steps-list li{position:relative;padding-left:60px;margin-bottom:24px}.steps-list li:before{counter-increment:step;content:counter(step);position:absolute;left:0;top:0;width:40px;height:40px;background:linear-gradient(135deg,#ff69b4,#ff8dc7);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.1rem}.steps-list li strong{display:block;color:#333;margin-bottom:4px}.steps-list li p{margin:0;color:#666}.page-nav-links{display:flex;justify-content:space-between;align-items:center;margin-top:48px;padding-top:24px;border-top:2px solid rgba(255,105,180,.1);flex-wrap:wrap;gap:16px}.nav-link{display:inline-flex;align-items:center;padding:12px 24px;background:#fff;color:#ff69b4;text-decoration:none;border-radius:30px;font-weight:600;box-shadow:0 4px 15px #ff69b426;transition:all .2s ease;border:2px solid rgba(255,105,180,.2)}.nav-link:hover{background:#ff69b4;color:#fff;transform:translateY(-2px);box-shadow:0 6px 20px #ff69b440}.nav-link.play{background:linear-gradient(135deg,#ff69b4,#ff8dc7);color:#fff;border:none}.nav-link.play:hover{background:linear-gradient(135deg,#ff5ba3,#ff69b4)}.difficulty-cards{display:flex;flex-direction:column;gap:32px;max-width:100%}.difficulty-card{background:#fff;border-radius:24px;overflow:hidden;box-shadow:0 8px 30px #00000014;box-sizing:border-box;max-width:100%}.difficulty-header{display:flex;align-items:center;gap:16px;padding:24px;color:#fff}.difficulty-card.easy .difficulty-header{background:linear-gradient(135deg,#ffb6c1,pink)}.difficulty-card.normal .difficulty-header{background:linear-gradient(135deg,#ff69b4,#ff8dc7)}.difficulty-card.hard .difficulty-header{background:linear-gradient(135deg,#e91e8c,#ff69b4)}.difficulty-card.expert .difficulty-header{background:linear-gradient(135deg,#9c27b0,#e91e8c)}.difficulty-icon{font-size:2.5rem}.difficulty-header h2{margin:0;flex:1;font-size:1.5rem}.difficulty-tag{background:#ffffff40;padding:6px 14px;border-radius:20px;font-size:.85rem;font-weight:500}.difficulty-stats{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid rgba(0,0,0,.05)}.difficulty-stats .stat{padding:16px;text-align:center;border-right:1px solid rgba(0,0,0,.05)}.difficulty-stats .stat:last-child{border-right:none}.stat-label{display:block;font-size:.8rem;color:#888;margin-bottom:4px}.stat-value{display:block;font-size:1.1rem;font-weight:700;color:#333}.difficulty-desc{padding:24px}.difficulty-desc h4{color:#e91e8c;margin:0 0 8px;font-size:.95rem}.difficulty-desc h4:not(:first-child){margin-top:20px}.difficulty-desc p{margin:0 0 8px;color:#666}.difficulty-desc ul{margin:0;padding-left:20px;color:#666}.difficulty-desc li{margin-bottom:4px}.recommendation-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr));gap:20px;margin-top:20px;max-width:100%}.rec-card{background:#fff;border-radius:16px;padding:20px;box-shadow:0 4px 20px #ff69b41a;border:2px solid rgba(255,105,180,.1);box-sizing:border-box;max-width:100%}.rec-card h4{margin:0 0 8px;color:#333;font-size:1rem}.rec-card p{margin:0;color:#666;font-size:.9rem}@media(max-width:768px){.difficulty-stats{grid-template-columns:repeat(2,1fr)}.difficulty-stats .stat:nth-child(2){border-right:none}.difficulty-stats .stat:nth-child(3),.difficulty-stats .stat:nth-child(4){border-top:1px solid rgba(0,0,0,.05)}.difficulty-header{flex-wrap:wrap}.difficulty-tag{order:3;width:100%;text-align:center;margin-top:8px}.page-nav-links{justify-content:center}.steps-list li{padding-left:50px}.steps-list li:before{width:36px;height:36px;font-size:1rem}}@media(max-width:480px){.tutorial-article section{margin-bottom:28px}.rules-grid{grid-template-columns:1fr;gap:12px;margin:16px 0}.rule-card{padding:16px;border-radius:12px;display:flex;align-items:center;text-align:left;gap:12px}.rule-icon{font-size:2rem;margin-bottom:0;flex-shrink:0}.rule-card h3{font-size:1rem;margin-bottom:4px}.rule-card p{font-size:.85rem;line-height:1.4}.steps-list li{padding-left:44px;margin-bottom:20px}.steps-list li:before{width:32px;height:32px;font-size:.9rem}.steps-list li strong{font-size:.95rem}.steps-list li p{font-size:.85rem}.page-nav-links{flex-direction:column;align-items:stretch;gap:12px;margin-top:32px;padding-top:20px}.nav-link{justify-content:center;padding:14px 20px;font-size:.95rem}.difficulty-header{padding:16px;gap:12px}.difficulty-icon{font-size:2rem}.difficulty-header h2{font-size:1.2rem}.difficulty-stats .stat{padding:12px 8px}.stat-label{font-size:.7rem}.stat-value{font-size:.95rem}.difficulty-desc{padding:16px}.difficulty-desc h4{font-size:.9rem}.difficulty-desc p,.difficulty-desc li{font-size:.85rem}.recommendation-grid{grid-template-columns:1fr;gap:12px}.rec-card{padding:16px}.rec-card h4{font-size:.95rem}.rec-card p{font-size:.85rem}.example-box{padding:12px 14px;margin:16px 0;font-size:.9rem}.technique-detail{padding:16px;margin:12px 0}.technique-detail h4{font-size:.9rem}}.avatar-selector{width:100%}.avatar-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;max-width:320px;margin:0 auto}.avatar-item{width:60px;height:60px;padding:8px;border:3px solid transparent;border-radius:50%;background:#fff;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.avatar-item:hover{transform:scale(1.1);border-color:#ffb6c1}.avatar-item.selected{border-color:#ff69b4;box-shadow:0 0 12px #ff69b480;transform:scale(1.1)}.avatar-item img{width:100%;height:100%;object-fit:contain}@media(max-width:480px){.avatar-grid{grid-template-columns:repeat(4,1fr);gap:8px}.avatar-item{width:50px;height:50px;padding:6px}}.profile-setup{max-width:400px;margin:0 auto;padding:24px;background:#fff;border-radius:20px;box-shadow:0 4px 20px #ff69b426}.profile-title{font-size:1.5rem;color:#ff69b4;text-align:center;margin-bottom:8px}.profile-subtitle{font-size:.9rem;color:#888;text-align:center;margin-bottom:24px}.profile-form{display:flex;flex-direction:column;gap:24px}.form-section{display:flex;flex-direction:column;gap:8px}.form-label{font-weight:600;color:#555;font-size:.9rem}.nickname-input{padding:12px 16px;font-size:1rem;border:2px solid #ffb6c1;border-radius:12px;outline:none;transition:border-color .2s,box-shadow .2s}.nickname-input:focus{border-color:#ff69b4;box-shadow:0 0 8px #ff69b44d}.nickname-input::placeholder{color:#ccc}.form-error{color:#e74c3c;font-size:.85rem}.save-profile-btn{padding:14px 24px;font-size:1.1rem;font-weight:600;color:#fff;background:linear-gradient(135deg,#ff69b4,#ff8dc7);border:none;border-radius:12px;cursor:pointer;transition:transform .2s,box-shadow .2s}.save-profile-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #ff69b466}.save-profile-btn:disabled{opacity:.6;cursor:not-allowed}@media(max-width:480px){.profile-setup{padding:16px;margin:0 12px}.profile-title{font-size:1.3rem}}.room-code-form{display:flex;flex-direction:column;align-items:center;gap:16px;width:100%}.room-code-label{font-size:1rem;color:#666;font-weight:500;text-align:center}.room-code-inputs{display:flex;gap:8px;justify-content:center;width:100%;max-width:100%}.room-code-input{width:48px;height:56px;font-size:1.5rem;font-weight:700;text-align:center;text-transform:uppercase;border:3px solid #ffb6c1;border-radius:12px;background:#fff;color:#333;outline:none;transition:border-color .2s,box-shadow .2s,transform .2s;flex-shrink:0}.room-code-input:focus{border-color:#ff69b4;box-shadow:0 0 12px #ff69b466;transform:scale(1.05)}.room-code-input:disabled{background:#f5f5f5;opacity:.7}.join-room-btn{padding:12px 32px;font-size:1rem;font-weight:600;color:#fff;background:linear-gradient(135deg,#ff69b4,#ff8dc7);border:none;border-radius:12px;cursor:pointer;transition:transform .2s,box-shadow .2s;width:100%;max-width:200px}.join-room-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #ff69b466}.join-room-btn:disabled{opacity:.5;cursor:not-allowed}@media(max-width:600px){.room-code-form{gap:14px}.room-code-inputs{gap:6px}.room-code-input{width:42px;height:50px;font-size:1.3rem;border-radius:10px;border-width:2px}.room-code-label{font-size:.95rem}.join-room-btn{padding:10px 24px;font-size:.95rem}}@media(max-width:400px){.room-code-form{gap:12px}.room-code-inputs{gap:4px}.room-code-input{width:36px;height:44px;font-size:1.15rem;border-radius:8px}.room-code-label{font-size:.9rem}.join-room-btn{padding:10px 20px;font-size:.9rem;border-radius:10px}}@media(max-width:350px){.room-code-inputs{gap:3px}.room-code-input{width:32px;height:40px;font-size:1rem;border-radius:6px}.room-code-label{font-size:.85rem}}.battle-lobby{min-height:100vh;min-height:100dvh;background:linear-gradient(135deg,#fff0f5,#ffe4ec,#fff0f5);padding:24px 32px;display:flex;flex-direction:column;max-width:100vw;overflow-x:hidden;position:relative}.lobby-header{display:flex;justify-content:space-between;align-items:center;max-width:800px;width:100%;margin:0 auto 40px;gap:16px}.back-link{color:#ff69b4;text-decoration:none;font-weight:600;padding:8px 16px;border-radius:8px;transition:background .2s}.back-link:hover{background:#ff69b41a}.edit-profile-btn{background:#fff;border:2px solid #ffb6c1;border-radius:20px;padding:8px 16px;font-weight:600;color:#ff69b4;cursor:pointer;transition:all .2s}.edit-profile-btn:hover{background:#fff0f5;border-color:#ff69b4}.lobby-content{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;max-width:700px;width:100%;margin:0 auto;padding:0 16px}.lobby-title{text-align:center;font-size:2.5rem;font-weight:800;color:#ff69b4;margin-bottom:48px;text-shadow:0 4px 12px rgba(255,105,180,.2)}.menu-buttons{display:flex;flex-direction:column;gap:24px;width:100%;max-width:480px}.menu-btn{display:flex;align-items:center;gap:24px;padding:28px 36px;background:#fff;border:3px solid #ffb6c1;border-radius:24px;font-size:1.4rem;font-weight:700;color:#333;cursor:pointer;transition:all .25s cubic-bezier(.175,.885,.32,1.275);box-shadow:0 4px 16px #ff69b41a}.menu-btn:hover{transform:translateY(-4px) scale(1.02);border-color:#ff69b4;box-shadow:0 12px 32px #ff69b440}.menu-btn:active{transform:translateY(-2px) scale(1.01)}.menu-btn .btn-icon{width:64px;height:64px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#ff69b4,#ff8dc7);color:#fff;border-radius:18px;font-size:2rem;font-weight:800;box-shadow:0 4px 12px #ff69b44d}.create-room-panel{background:#fff;padding:40px;border-radius:28px;box-shadow:0 8px 40px #ff69b426;width:100%;max-width:560px}.create-room-panel h2{text-align:center;color:#333;margin-bottom:32px;font-size:1.4rem;font-weight:700}.difficulty-options{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-bottom:36px}.difficulty-option{display:flex;flex-direction:column;align-items:center;gap:12px;padding:24px 16px;background:#fafafa;border:3px solid transparent;border-radius:20px;cursor:pointer;transition:all .25s cubic-bezier(.175,.885,.32,1.275)}.difficulty-option:hover{background:#fff0f5;border-color:#ffb6c1;transform:translateY(-2px)}.difficulty-option.selected{background:#fff0f5;border-color:#ff69b4;box-shadow:0 4px 16px #ff69b433}.difficulty-option .diff-icon{width:64px;height:64px;object-fit:contain}.difficulty-option .diff-name{font-weight:700;color:#333;font-size:1.05rem}.action-buttons{display:flex;flex-direction:column;gap:16px}.primary-btn{padding:18px 32px;font-size:1.2rem;font-weight:700;color:#fff;background:linear-gradient(135deg,#ff69b4,#ff8dc7);border:none;border-radius:16px;cursor:pointer;transition:all .25s cubic-bezier(.175,.885,.32,1.275);box-shadow:0 4px 16px #ff69b44d}.primary-btn:hover:not(:disabled){transform:translateY(-3px);box-shadow:0 8px 24px #ff69b466}.primary-btn:active:not(:disabled){transform:translateY(-1px)}.primary-btn:disabled{opacity:.6;cursor:not-allowed}.secondary-btn{padding:16px 28px;font-size:1.1rem;font-weight:600;color:#ff69b4;background:#fff;border:2px solid #ffb6c1;border-radius:14px;cursor:pointer;transition:all .2s}.secondary-btn:hover{background:#fff0f5;border-color:#ff69b4;transform:translateY(-1px)}.join-room-panel{background:#fff;padding:40px;border-radius:28px;box-shadow:0 8px 40px #ff69b426;width:100%;max-width:480px}.join-room-panel .back-btn{margin-top:24px;width:100%}.error-message{margin-top:20px;padding:16px;background:#fff0f0;color:#e74c3c;border-radius:12px;text-align:center;font-size:1rem;font-weight:500}.not-configured{text-align:center;padding:60px 40px;background:#fff;border-radius:28px;box-shadow:0 8px 40px #ff69b426;max-width:500px}.not-configured h2{color:#ff69b4;margin-bottom:20px;font-size:1.5rem}.not-configured p{color:#666;font-size:1.1rem;line-height:1.6}.loading-spinner{text-align:center;padding:60px;color:#ff69b4;font-size:1.4rem}@media(max-width:600px){.battle-lobby{padding:16px 12px}.lobby-header{flex-wrap:wrap;gap:12px;margin-bottom:24px}.back-link{padding:6px 12px;font-size:.9rem}.edit-profile-btn{padding:6px 12px;font-size:.85rem;order:2}.lobby-content{padding:0 8px}.lobby-title{font-size:1.8rem;margin-bottom:28px}.menu-buttons{gap:16px}.menu-btn{padding:20px;font-size:1.1rem;border-radius:18px;gap:16px}.menu-btn .btn-icon{width:48px;height:48px;font-size:1.4rem;border-radius:12px;flex-shrink:0}.create-room-panel,.join-room-panel{padding:24px 16px;border-radius:20px}.create-room-panel h2{font-size:1.2rem;margin-bottom:20px}.difficulty-options{gap:10px;margin-bottom:24px}.difficulty-option{padding:16px 10px;gap:8px;border-radius:14px}.difficulty-option .diff-icon{width:44px;height:44px}.difficulty-option .diff-name{font-size:.9rem}.primary-btn{padding:14px 24px;font-size:1rem;border-radius:12px}.secondary-btn{padding:12px 20px;font-size:.95rem;border-radius:12px}.action-buttons{gap:12px}.not-configured{padding:40px 24px;border-radius:20px}.not-configured h2{font-size:1.3rem}.not-configured p{font-size:1rem}}@media(max-width:400px){.battle-lobby{padding:12px 8px}.lobby-header{gap:8px;margin-bottom:20px}.back-link{padding:5px 10px;font-size:.85rem}.edit-profile-btn{padding:5px 10px;font-size:.8rem}.lobby-content{padding:0 4px}.lobby-title{font-size:1.5rem;margin-bottom:20px}.menu-buttons{gap:12px}.menu-btn{padding:16px;font-size:1rem;gap:12px;border-radius:14px}.menu-btn .btn-icon{width:40px;height:40px;font-size:1.2rem;border-radius:10px}.create-room-panel,.join-room-panel{padding:20px 12px;border-radius:16px}.create-room-panel h2{font-size:1.1rem;margin-bottom:16px}.difficulty-options{gap:8px;margin-bottom:20px}.difficulty-option{padding:12px 6px;gap:6px;border-radius:12px;border-width:2px}.difficulty-option .diff-icon{width:36px;height:36px}.difficulty-option .diff-name{font-size:.8rem}.primary-btn{padding:12px 20px;font-size:.95rem}.secondary-btn{padding:10px 16px;font-size:.9rem}.not-configured{padding:32px 16px}.not-configured h2{font-size:1.1rem}.not-configured p{font-size:.9rem}.error-message{padding:12px;font-size:.9rem;margin-top:16px}}@media(max-width:350px){.lobby-title{font-size:1.3rem}.menu-btn{padding:14px 12px;font-size:.9rem;gap:10px}.menu-btn .btn-icon{width:36px;height:36px;font-size:1rem}.difficulty-option .diff-icon{width:32px;height:32px}.difficulty-option .diff-name{font-size:.75rem}}.player-card{display:flex;align-items:center;gap:16px;padding:18px 24px;background:#fff;border-radius:20px;box-shadow:0 4px 16px #00000014;transition:all .3s ease}.player-card.me{border:3px solid #ff69b4}.player-card.opponent{border:3px solid #87ceeb}.player-card.winner{background:linear-gradient(135deg,#fff9e6,#fff0c8);border-color:gold;box-shadow:0 6px 28px #ffd70059}.player-card.loser{opacity:.7;filter:grayscale(30%)}.player-card.empty{border:3px dashed #ddd;background:#fafafa}.player-avatar{position:relative;width:60px;height:60px;border-radius:50%;overflow:visible;display:flex;align-items:center;justify-content:center;flex-shrink:0}.player-avatar img{width:100%;height:100%;object-fit:contain}.player-avatar.placeholder{background:#eee;color:#999;font-size:1.8rem;font-weight:700}.player-avatar .crown{position:absolute;top:-14px;left:50%;transform:translate(-50%);font-size:1.4rem}.player-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}.player-name{font-weight:700;font-size:1.1rem;color:#333;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.me-badge{color:#ff69b4;font-size:.8em;margin-left:6px}.player-stats{font-size:.85rem;color:#888}.player-progress{display:flex;align-items:center;gap:10px;min-width:120px}.progress-bar-container{flex:1;height:10px;background:#eee;border-radius:5px;overflow:hidden}.progress-bar-fill{height:100%;background:linear-gradient(90deg,#ff69b4,#ff8dc7);border-radius:5px;transition:width .3s ease}.player-card.opponent .progress-bar-fill{background:linear-gradient(90deg,#87ceeb,#add8e6)}.progress-text{font-size:.95rem;font-weight:700;color:#555;min-width:48px;text-align:right}.player-mistakes{font-size:.8rem;font-weight:600;color:#e74c3c;padding:4px 10px;background:#fff0f0;border-radius:12px}@media(max-width:500px){.player-card{padding:16px 20px;gap:14px;border-radius:18px}.player-avatar{width:52px;height:52px}.player-name{font-size:1rem}.player-progress{min-width:100px}.progress-bar-container{height:8px}}@media(max-width:380px){.player-card{padding:14px 16px;gap:12px;border-radius:16px}.player-avatar{width:46px;height:46px}.player-name{font-size:.95rem}}.battle-progress-bar{display:flex;align-items:stretch;justify-content:center;gap:12px;padding:16px 24px;background:#fff9;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:22px;box-shadow:0 10px 30px #0000000d,inset 0 1px #fffc;width:100%;max-width:100%;box-sizing:border-box;border:2px solid rgba(255,255,255,.8)}.player-progress-card{display:flex;flex-direction:column;gap:8px;flex:1;padding:14px 18px;border-radius:16px;background:#fafafa;transition:all .3s ease;position:relative;overflow:hidden}.player-progress-card.theme-pink{background:linear-gradient(135deg,#ff69b41f,#ffffffe6);border:3px solid rgba(255,105,180,.4);box-shadow:0 8px 20px #ff69b426,inset 0 0 15px #ff69b40d}.player-progress-card.theme-blue{background:linear-gradient(135deg,#87ceeb1f,#ffffffe6);border:3px solid rgba(135,206,235,.4);box-shadow:0 8px 20px #87ceeb26,inset 0 0 15px #87ceeb0d}.player-progress-card.leading{box-shadow:0 0 0 4px #ffd70099,0 12px 30px #ffd7004d}.player-progress-card.theme-pink.leading{background:linear-gradient(135deg,#ffd70026,#ff69b414);border-color:gold}.player-progress-card.theme-blue.leading{background:linear-gradient(135deg,#ffd70026,#87ceeb14);border-color:gold}.me-badge{position:absolute;top:0;left:0;color:#fff;font-size:.6rem;font-weight:900;padding:2px 8px;border-bottom-right-radius:10px;letter-spacing:.5px;z-index:10}.theme-pink .me-badge{background:#ff69b4;box-shadow:2px 2px 5px #ff69b433}.theme-blue .me-badge{background:#4a9fd9;box-shadow:2px 2px 5px #4a9fd933}.leading-crown{position:absolute;top:-15px;right:-8px;font-size:1.4rem;filter:drop-shadow(0 2px 4px rgba(0,0,0,.2));z-index:20;animation:crown-float 2s ease-in-out infinite}@keyframes crown-float{0%,to{transform:translateY(0) rotate(15deg)}50%{transform:translateY(-5px) rotate(25deg)}}.player-header{display:flex;align-items:center;gap:14px}.player-avatar-container{position:relative;flex-shrink:0}.player-avatar-wrapper{width:clamp(40px,5vh,56px);height:clamp(40px,5vh,56px);border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 14px #0000001f;flex-shrink:0;overflow:hidden;border:2.5px solid}.player-avatar-wrapper.theme-pink{border-color:#ff69b4}.player-avatar-wrapper.theme-blue{border-color:#87ceeb}.player-avatar-wrapper img{width:85%;height:85%;object-fit:contain}.waiting-icon{font-size:1.6rem;color:#ccc;font-weight:700}.battle-progress-bar .player-info{display:flex;flex-direction:column;gap:6px;min-width:0;flex:1}.battle-progress-bar .player-name{font-size:1rem;font-weight:700;color:#555;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.player-percent{font-size:clamp(1.1rem,2.2vh,1.6rem);font-weight:900;letter-spacing:-.5px}.player-percent.theme-pink{color:#ff69b4}.player-percent.theme-blue{color:#4a9fd9}.health-bar-container{position:relative}.health-bar-bg{height:clamp(16px,2vh,24px);background:linear-gradient(180deg,#e8e8e8,#d0d0d0);border-radius:12px;overflow:hidden;box-shadow:inset 0 2px 4px #00000026,0 1px #fffc}.health-bar-fill{height:100%;border-radius:12px;position:relative;transition:width .3s cubic-bezier(.1,.7,.1,1);overflow:hidden}.health-bar-fill.theme-pink{background:linear-gradient(180deg,#ff8dc7,#ff69b4,#e84393);box-shadow:0 0 10px #ff69b480,inset 0 1px #fff6}.health-bar-fill.theme-blue{background:linear-gradient(180deg,#a8d8ea,#87ceeb,#5dade2);box-shadow:0 0 10px #87ceeb80,inset 0 1px #fff6}.health-bar-shine{position:absolute;top:0;left:-100%;width:50%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.4),transparent);animation:shine-sweep 2s ease-in-out infinite}@keyframes shine-sweep{0%{left:-100%}50%,to{left:200%}}.lead-indicator{position:absolute;right:4px;top:50%;transform:translateY(-50%);font-size:.65rem;font-weight:800;padding:2px 6px;border-radius:8px;animation:pulse-badge 1.5s ease-in-out infinite}.lead-indicator.theme-pink{background:linear-gradient(135deg,#ff69b4,#ff8dc7);color:#fff;box-shadow:0 2px 8px #ff69b466}.lead-indicator.theme-blue{background:linear-gradient(135deg,#87ceeb,#5dade2);color:#fff;box-shadow:0 2px 8px #87ceeb66}@keyframes pulse-badge{0%,to{transform:translateY(-50%) scale(1)}50%{transform:translateY(-50%) scale(1.1)}}.vs-container{display:flex;align-items:center;justify-content:center;flex-shrink:0;padding:0 6px}.vs-badge-progress{position:relative;font-size:clamp(1.2rem,2.5vh,1.8rem);font-weight:900;color:#fff;padding:clamp(14px,2vh,22px) clamp(14px,2vh,24px);background:linear-gradient(135deg,#ff69b4,#ff8dc7 40%,#87ceeb);border-radius:14px;box-shadow:0 6px 20px #ff69b459,0 6px 20px #87ceeb59,inset 0 -3px #0000001a;text-shadow:0 2px 4px rgba(0,0,0,.2);letter-spacing:1px;overflow:hidden}.vs-text{position:relative;z-index:2}.vs-spark{position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle,rgba(255,255,255,.3) 0%,transparent 60%);animation:vs-rotate 3s linear infinite}@keyframes vs-rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.player-progress-card.theme-pink.leading .health-bar-fill.theme-pink{animation:bar-glow-pink 1.5s ease-in-out infinite}.player-progress-card.theme-blue.leading .health-bar-fill.theme-blue{animation:bar-glow-blue 1.5s ease-in-out infinite}@keyframes bar-glow-pink{0%,to{box-shadow:0 0 10px #ff69b480}50%{box-shadow:0 0 20px #ff69b4cc,0 0 30px #ff69b466}}@keyframes bar-glow-blue{0%,to{box-shadow:0 0 10px #87ceeb80}50%{box-shadow:0 0 20px #87ceebcc,0 0 30px #87ceeb66}}@media(max-width:500px){.battle-progress-bar{padding:10px 12px;gap:10px;border-radius:18px}.player-progress-card{padding:10px;gap:8px;border-radius:14px}.player-header{gap:10px}.player-avatar-wrapper{width:40px;height:40px;border-width:2.5px}.battle-progress-bar .player-name{font-size:.8rem}.player-percent{font-size:1.2rem}.health-bar-bg{height:16px;border-radius:8px}.health-bar-fill{border-radius:8px}.lead-indicator{font-size:.6rem;padding:2px 5px}.leading-crown{font-size:1.1rem;top:-10px;right:-4px}.vs-badge-progress{font-size:1.1rem;padding:10px 12px;border-radius:14px}}@media(max-width:380px){.battle-progress-bar{padding:8px 10px;gap:8px;border-radius:16px}.player-progress-card{padding:8px;gap:6px;border-radius:12px}.player-avatar-wrapper{width:36px;height:36px}.battle-progress-bar .player-name{font-size:.75rem}.player-percent{font-size:1.1rem}.health-bar-bg{height:14px;border-radius:7px}.vs-badge-progress{font-size:1rem;padding:8px 10px;border-radius:12px}.leading-crown{font-size:1rem;top:-8px;right:-3px}.lead-indicator{font-size:.55rem;padding:2px 4px;border-radius:6px}}@media(max-width:340px){.battle-progress-bar{padding:6px 8px;gap:6px}.player-progress-card{padding:6px;gap:5px;border-radius:10px}.player-avatar-wrapper{width:32px;height:32px}.battle-progress-bar .player-name{font-size:.7rem}.player-percent{font-size:.95rem}.health-bar-bg{height:12px;border-radius:6px}.vs-badge-progress{font-size:.9rem;padding:6px 8px;border-radius:10px}}.confirm-dialog-overlay{position:fixed;inset:0;background:#00000080;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;padding:24px;z-index:200;animation:confirmFadeIn .2s ease}@keyframes confirmFadeIn{0%{opacity:0}to{opacity:1}}.confirm-dialog{background:#fff;padding:32px 28px 24px;border-radius:24px;text-align:center;max-width:320px;width:100%;animation:confirmSlideUp .3s cubic-bezier(.175,.885,.32,1.275);box-shadow:0 20px 60px #00000040,0 0 0 1px #ffffff1a}@keyframes confirmSlideUp{0%{opacity:0;transform:translateY(20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.confirm-dialog-icon{font-size:3.5rem;margin-bottom:16px;animation:iconBounce .5s ease}@keyframes iconBounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.confirm-dialog-title{font-size:1.3rem;font-weight:700;color:#333;margin-bottom:8px}.confirm-dialog-message{font-size:1.05rem;color:#666;line-height:1.5;margin-bottom:24px}.confirm-dialog-buttons{display:flex;gap:12px}.confirm-dialog-btn{flex:1;padding:14px 20px;font-size:1rem;font-weight:600;border-radius:14px;cursor:pointer;transition:all .2s ease;border:none}.confirm-dialog-btn.cancel{color:#666;background:#f5f5f5;border:2px solid #e8e8e8}.confirm-dialog-btn.cancel:hover{background:#eee;border-color:#ddd;transform:translateY(-1px)}.confirm-dialog-btn.cancel:active{transform:translateY(0)}.confirm-dialog-btn.confirm{color:#fff;border:none}.confirm-dialog-btn.confirm.danger{background:linear-gradient(135deg,#ff6b6b,#ee5a5a);box-shadow:0 4px 16px #ee5a5a59}.confirm-dialog-btn.confirm.danger:hover{background:linear-gradient(135deg,#ff5252,#e04848);box-shadow:0 6px 20px #ee5a5a73;transform:translateY(-2px)}.confirm-dialog-btn.confirm.primary{background:linear-gradient(135deg,#ff69b4,#ff8dc7);box-shadow:0 4px 16px #ff69b459}.confirm-dialog-btn.confirm.primary:hover{background:linear-gradient(135deg,#ff5aa8,#ff7dbb);box-shadow:0 6px 20px #ff69b473;transform:translateY(-2px)}.confirm-dialog-btn.confirm:active{transform:translateY(0)}@media(max-width:400px){.confirm-dialog{padding:28px 24px 20px;border-radius:20px;max-width:290px}.confirm-dialog-icon{font-size:3rem;margin-bottom:12px}.confirm-dialog-title{font-size:1.2rem}.confirm-dialog-message{font-size:1rem;margin-bottom:20px}.confirm-dialog-buttons{gap:10px}.confirm-dialog-btn{padding:12px 16px;font-size:.95rem;border-radius:12px}}.battle-room{min-height:100vh;min-height:100dvh;background:linear-gradient(135deg,#fff0f5,#ffe4ec,#ffd6e7);position:relative;display:flex;flex-direction:column;overflow-x:hidden;max-width:100vw}.battle-room.playing{padding:32px 12px 12px;padding-bottom:env(safe-area-inset-bottom,12px);background:linear-gradient(135deg,var(--current-level-bg) 0%,#ffffff 100%);display:flex;flex-direction:column;height:100vh;height:100dvh;overflow:hidden}.loading-state,.waiting-state,.ready-state,.countdown-state{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px;gap:20px;max-width:600px;margin:0 auto;width:100%;overflow-y:auto}.loading-spinner{color:#ff69b4;font-size:1.4rem;font-weight:600;animation:pulse 1.5s ease-in-out infinite}.waiting-state h2,.ready-state h2{color:#ff69b4;font-size:2rem;font-weight:800;margin-bottom:12px;text-shadow:0 4px 12px rgba(255,105,180,.2)}.room-code-display{display:flex;flex-direction:column;align-items:center;gap:12px;margin-bottom:24px}.room-code-label{color:#888;font-size:1rem;font-weight:600}.room-code-value{font-size:3.2rem;font-weight:900;letter-spacing:.2em;font-family:SF Mono,Monaco,Consolas,Courier New,monospace;color:#ff69b4;background:#fff;padding:28px 56px;border-radius:24px;box-shadow:0 12px 48px #ff69b440,inset 0 -4px #ff69b426;cursor:pointer;transition:all .25s ease;position:relative;border:4px solid rgba(255,105,180,.3)}.room-code-value:hover{transform:translateY(-4px);box-shadow:0 16px 56px #ff69b459;border-color:#ff69b480}.room-code-value:active{transform:translateY(-2px)}.copy-hint{position:absolute;bottom:-32px;left:50%;transform:translate(-50%);font-size:.85rem;color:#aaa;white-space:nowrap;font-weight:500}.waiting-hint{color:#666;font-size:1.1rem;text-align:center;max-width:400px;line-height:1.6;margin-bottom:28px}.waiting-state .player-card,.ready-state .player-card{width:100%;max-width:400px}.cancel-btn,.leave-btn{margin-top:32px;padding:18px 56px;font-size:1.1rem;font-weight:600;color:#999;background:#fff;border:2px solid #e0e0e0;border-radius:16px;cursor:pointer;transition:all .25s ease}.cancel-btn:hover,.leave-btn:hover{border-color:#ff69b4;color:#ff69b4;background:#fff5f8;transform:translateY(-2px)}.players-ready{display:flex;flex-direction:column;align-items:center;gap:24px;width:100%;max-width:420px}.vs-badge{font-size:2.2rem;font-weight:900;color:#fff;padding:14px 48px;background:linear-gradient(135deg,#ff69b4,#ff8dc7);border-radius:30px;box-shadow:0 8px 28px #ff69b466;text-shadow:0 2px 4px rgba(0,0,0,.15)}.start-btn{margin-top:36px;padding:22px 72px;font-size:1.5rem;font-weight:800;color:#fff;background:linear-gradient(135deg,#ff69b4,#ff8dc7);border:none;border-radius:20px;cursor:pointer;transition:all .25s cubic-bezier(.175,.885,.32,1.275);box-shadow:0 8px 32px #ff69b466}.start-btn:hover{transform:translateY(-4px) scale(1.02);box-shadow:0 14px 44px #ff69b480}.start-btn:active{transform:translateY(-2px) scale(1.01)}.waiting-host{color:#777;font-style:italic;font-size:1.15rem;padding:16px 32px;background:#ff69b414;border-radius:12px}.countdown-state{text-align:center;background:radial-gradient(circle at center,rgba(255,105,180,.1) 0%,transparent 70%)}.countdown-number{font-size:10rem;font-weight:900;color:#ff69b4;text-shadow:0 8px 32px rgba(255,105,180,.4),0 0 80px rgba(255,105,180,.2);animation:countdown-pulse 1s ease-in-out infinite;line-height:1}@keyframes countdown-pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.08);opacity:.9}}.countdown-state p{color:#777;font-size:1.3rem;margin-top:20px;font-weight:500}.battle-room{--battle-cell-size: clamp(38px, 7vh, 64px);--battle-font-size: calc(var(--battle-cell-size) * .45)}.battle-header{max-width:1200px;width:100%;margin:20px auto 24px;position:relative;z-index:10;flex-shrink:0}.battle-content{flex:1;display:flex;flex-direction:column;width:100%;max-width:1200px;margin:0 auto;align-items:center;justify-content:center;position:relative;z-index:10;min-height:0;overflow-y:auto}.battle-board-panel{display:flex;flex-direction:row;justify-content:center;align-items:center;padding:1.5rem;background:#fff6;border-radius:36px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:2px solid rgba(255,255,255,.6);box-shadow:0 10px 40px #00000014;width:100%;max-width:1150px;margin:0 auto}.panel-side{flex:0 1 auto;display:flex;min-width:0}.panel-side.left,.panel-side.right{justify-content:center}.panel-center-gap{width:50px;flex-shrink:0}.grid-container{display:flex;align-items:center;justify-content:center;padding:0;background:transparent;flex-shrink:0;transition:all .4s cubic-bezier(.175,.885,.32,1.275)}.grid-container:hover{transform:translateY(-4px) scale(1.01)}.battle-room .sudoku-grid{border-radius:16px;box-shadow:0 8px 32px #0000000d}.battle-room .sudoku-block{grid-template-columns:repeat(3,var(--battle-cell-size));grid-template-rows:repeat(3,var(--battle-cell-size))}.battle-room .sudoku-cell{width:var(--battle-cell-size);height:var(--battle-cell-size);font-size:var(--battle-font-size)}.battle-controls{display:flex;flex-direction:column;gap:1rem;padding:0;background:transparent;border-radius:0;box-shadow:none;width:clamp(240px,25vw,340px);flex-shrink:0;border:none;transition:all .4s cubic-bezier(.175,.885,.32,1.275)}.battle-controls:hover{transform:translateY(-4px)}.number-pad-battle{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;background:#fff;padding:16px;border-radius:22px;box-shadow:0 4px 20px #00000014}.num-btn-battle{position:relative;aspect-ratio:1;width:100%;border:none;border-radius:16px;cursor:pointer;overflow:hidden;transition:all .3s cubic-bezier(.175,.885,.32,1.275);display:flex;justify-content:center;align-items:center;background:linear-gradient(145deg,#fff,#f5f5f5);box-shadow:4px 4px 10px #00000014,-2px -2px 8px #ffffffe6}.num-value-battle{position:absolute;top:0;left:0;z-index:5;font-size:22px;font-weight:900;font-family:YouYuan,STYuanti-SC-Regular,幼圆,Microsoft YaHei,sans-serif;color:#fff!important;background-color:var(--shadow-color);width:36px;height:36px;display:flex;justify-content:center;align-items:center;border-radius:0 0 16px;box-shadow:1px 1px 3px #0000001a;transition:all .2s ease}.num-bg-image-battle{position:absolute;inset:12px;background-image:var(--kitty-url);background-size:contain;background-repeat:no-repeat;background-position:center;opacity:.9;z-index:1;transition:all .3s}.num-btn-battle:hover{transform:translateY(-3px) scale(1.05)}.num-btn-battle:hover .num-bg-image-battle{opacity:1;transform:scale(1.1) rotate(3deg)}.num-btn-battle:hover .num-value-battle{width:40px;height:40px;font-size:24px}.num-btn-battle:active{transform:translateY(0) scale(.95)}.num-btn-battle.btn-theme-1{--shadow-color: #ff8fab}.num-btn-battle.btn-theme-2{--shadow-color: #89cff0}.num-btn-battle.btn-theme-3{--shadow-color: #ffd166}.num-btn-battle.btn-theme-4{--shadow-color: #b7e4c7}.num-btn-battle.btn-theme-5{--shadow-color: #ffb5a7}.num-btn-battle.btn-theme-6{--shadow-color: #cdb4db}.num-btn-battle.btn-theme-7{--shadow-color: #ffcad4}.num-btn-battle.btn-theme-8{--shadow-color: #99e1d9}.num-btn-battle.btn-theme-9{--shadow-color: #a2d2ff}.curtain-overlay-battle{position:absolute;top:0;left:0;width:100%;height:100%;z-index:10;pointer-events:none;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center}.curtain-fabric-battle{position:absolute;top:-100%;left:0;width:100%;height:100%;background:linear-gradient(180deg,var(--current-level-accent) 0%,var(--current-level-secondary) 100%);border-bottom:4px solid var(--current-level-accent);transition:top .8s cubic-bezier(.45,0,.55,1);box-shadow:0 2px 10px #0003}.curtain-fabric-battle:after{content:"🎀";position:absolute;bottom:5px;left:50%;transform:translate(-50%);font-size:16px}.sleep-icon-battle{position:relative;z-index:11;font-size:24px;opacity:0;transform:translateY(20px);transition:all .5s ease .6s}.num-btn-battle.completed{cursor:default;filter:grayscale(.2)}.num-btn-battle.completed .curtain-fabric-battle{top:0}.num-btn-battle.completed .sleep-icon-battle{opacity:1;transform:translateY(0);animation:sleep-float-battle 2s infinite ease-in-out}.num-btn-battle.completed .num-bg-image-battle{filter:blur(2px) brightness(.7);opacity:.3}.num-btn-battle.completed .num-value-battle{opacity:.2}.num-btn-battle.completed:hover{transform:none}@keyframes sleep-float-battle{0%,to{transform:translate(0) scale(1);opacity:.8}50%{transform:translate(5px,-10px) scale(1.2);opacity:1}}.surrender-btn{padding:14px 32px;font-size:.95rem;font-weight:700;color:#e74c3c;background:#fff;border:none;border-radius:16px;cursor:pointer;align-self:center;transition:all .25s ease;box-shadow:0 3px 10px #00000014}.surrender-btn:hover{background:#fff5f5;transform:translateY(-2px);box-shadow:0 5px 15px #e74c3c26}.result-overlay{position:fixed;inset:0;background:#0009;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;padding:24px;z-index:100;animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.result-content{background:#fff;padding:48px 40px;border-radius:40px;text-align:center;max-width:420px;width:100%;animation:slideUp .4s cubic-bezier(.175,.885,.32,1.275);box-shadow:0 30px 100px #0006;border:10px solid rgba(255,255,255,.5)}@keyframes slideUp{0%{opacity:0;transform:translateY(40px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.result-icon{font-size:5rem;margin-bottom:16px;animation:bounce .6s ease}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-20px)}}.result-title{font-size:2rem;font-weight:700;color:#333;margin-bottom:20px}.result-players{display:flex;flex-direction:row;justify-content:center;gap:12px;margin-bottom:32px;width:100%}.player-result{flex:1;display:flex;flex-direction:column;align-items:center;gap:8px;padding:12px 8px;border-radius:20px;background:#f9f9f9;border:2px solid transparent;transition:all .3s ease;min-width:0}@media(max-width:380px){.result-players{flex-direction:column}}.player-result.winner{background:linear-gradient(135deg,#fff9e6,#fff3cc);border-color:gold;box-shadow:0 4px 15px #ffd70033}.player-result.loser{background:linear-gradient(135deg,#f5f5f5,#ececec);border-color:#d0d0d0;opacity:.9}.player-badge{font-size:.85rem;font-weight:800;padding:4px 12px;border-radius:12px;text-transform:uppercase;letter-spacing:.05em}.winner .player-badge{color:#b8860b;background:#ffd70033}.loser .player-badge{color:#666;background:#0000000d}.player-info{display:flex;align-items:center;gap:12px}.result-avatar{width:48px;height:48px;object-fit:contain}.result-nickname{font-weight:700;font-size:1.1rem;color:#333}.winner .result-nickname{color:#b8860b}.result-stats{display:flex;justify-content:center;gap:50px;margin-bottom:36px;padding:24px 0;border-top:2px dashed #f0f0f0;border-bottom:2px dashed #f0f0f0}.result-stats .stat{display:flex;flex-direction:column;gap:6px}.result-stats .stat-label{font-size:.8rem;color:#999;font-weight:500}.result-stats .stat-value{font-size:1.8rem;font-weight:800;color:#ff69b4}.result-buttons{display:flex;flex-direction:column;gap:12px}.result-buttons .primary-btn{padding:16px 28px;font-size:1.15rem;font-weight:700;color:#fff;background:linear-gradient(135deg,#ff69b4,#ff8dc7);border:none;border-radius:14px;cursor:pointer;transition:all .2s ease;box-shadow:0 4px 16px #ff69b466}.result-buttons .primary-btn:hover{transform:translateY(-2px);box-shadow:0 6px 24px #ff69b480}.result-buttons .secondary-btn{padding:14px 24px;font-size:1rem;font-weight:600;color:#888;background:transparent;border:2px solid #e0e0e0;border-radius:12px;cursor:pointer;transition:all .2s ease}.result-buttons .secondary-btn:hover{border-color:#ccc;color:#666;background:#fafafa}.result-buttons .primary-btn.waiting{background:linear-gradient(135deg,#ccc,#ddd);box-shadow:none;cursor:wait;animation:pulse 1.5s ease-in-out infinite}.result-buttons .primary-btn.declined{background:linear-gradient(135deg,#999,#aaa);box-shadow:none}.rematch-received{display:flex;flex-direction:column;gap:12px;width:100%}.rematch-message{font-size:1.1rem;font-weight:600;color:#ff69b4;animation:pulse 1.5s ease-in-out infinite}.rematch-actions{display:flex;gap:12px;justify-content:center}.rematch-actions .primary-btn,.rematch-actions .secondary-btn{flex:1;padding:14px 20px}@media(max-width:500px){.result-overlay{padding:16px}.result-content{padding:32px 24px;border-radius:28px;border-width:6px;max-width:360px}.result-icon{font-size:4rem;margin-bottom:12px}.result-title{font-size:1.6rem;margin-bottom:16px}.result-players{gap:10px;margin-bottom:24px}.player-result{padding:10px 6px;border-radius:16px;gap:6px}.player-badge{font-size:.75rem;padding:3px 10px}.player-info{gap:8px}.result-avatar{width:40px;height:40px}.result-nickname{font-size:.95rem}.result-stats{gap:36px;margin-bottom:24px;padding:16px 0}.result-stats .stat-label{font-size:.75rem}.result-stats .stat-value{font-size:1.5rem}.result-buttons{gap:10px}.result-buttons .primary-btn{padding:14px 24px;font-size:1.05rem;border-radius:12px}.result-buttons .secondary-btn{padding:12px 20px;font-size:.9rem}.rematch-message{font-size:1rem}.rematch-actions{gap:10px}.rematch-actions .primary-btn,.rematch-actions .secondary-btn{padding:12px 16px;font-size:.95rem}}@media(max-width:390px){.result-overlay{padding:12px}.result-content{padding:24px 18px;border-radius:24px;border-width:5px;max-width:320px}.result-icon{font-size:3.2rem;margin-bottom:10px}.result-title{font-size:1.4rem;margin-bottom:14px}.result-players{gap:8px;margin-bottom:18px}.player-result{padding:8px 5px;border-radius:14px;gap:5px}.player-badge{font-size:.7rem;padding:2px 8px;border-radius:10px}.player-info{gap:6px;flex-direction:column}.result-avatar{width:36px;height:36px}.result-nickname{font-size:.85rem}.result-stats{gap:28px;margin-bottom:18px;padding:14px 0}.result-stats .stat-label{font-size:.7rem}.result-stats .stat-value{font-size:1.3rem}.result-buttons{gap:8px}.result-buttons .primary-btn{padding:12px 20px;font-size:.95rem;border-radius:10px}.result-buttons .secondary-btn{padding:10px 16px;font-size:.85rem;border-radius:10px}.rematch-message{font-size:.9rem}.rematch-actions{gap:8px}.rematch-actions .primary-btn,.rematch-actions .secondary-btn{padding:10px 12px;font-size:.85rem}}@media(max-height:700px){.result-overlay{padding:10px;align-items:flex-start;padding-top:5vh}.result-content{padding:20px 18px;border-radius:20px;border-width:4px;max-height:90vh;overflow-y:auto}.result-icon{font-size:2.8rem;margin-bottom:8px}.result-title{font-size:1.3rem;margin-bottom:12px}.result-players{margin-bottom:14px}.result-stats{margin-bottom:14px;padding:12px 0}.result-stats .stat-value{font-size:1.2rem}}@media(max-width:390px)and (max-height:700px){.result-content{padding:16px 14px}.result-icon{font-size:2.4rem;margin-bottom:6px}.result-title{font-size:1.2rem;margin-bottom:10px}.player-result{padding:6px 4px}.result-avatar{width:32px;height:32px}}@media(max-width:1100px){.battle-board-panel{gap:1.25rem;padding:1.25rem}.battle-room{--battle-cell-size: clamp(34px, 6vh, 54px)}.battle-controls{width:280px}}@media(max-width:850px){.battle-header{max-width:100%;margin-bottom:10px;padding:0 8px}.battle-content{overflow-y:auto;padding-bottom:12px;justify-content:center}.battle-board-panel{display:flex;flex-direction:column;align-items:center;gap:0;padding:1rem;border-radius:24px;width:100%;max-width:100%}.panel-side{flex:none;width:100%;justify-content:center!important}.panel-center-gap{width:100%;height:.75rem}.battle-room{--battle-cell-size: clamp(32px, 4.8vh, 48px)}.battle-controls{width:100%;max-width:340px;gap:.75rem}.number-pad-battle{gap:8px;padding:12px}}@media(max-width:500px){.battle-room.playing{padding:8px}.battle-header{margin-top:0;margin-bottom:8px}.battle-room{--battle-cell-size: clamp(28px, 4.2vh, 42px)}.battle-board-panel{padding:.75rem;gap:0}.panel-center-gap{height:.5rem}.battle-controls{max-width:320px;gap:.6rem}.num-btn-battle{border-radius:12px}.num-value-battle{width:30px;height:30px;font-size:18px;border-radius:0 0 10px}}@media(max-width:380px),(max-height:600px){.battle-room{--battle-cell-size: clamp(24px, 4.5vw, 34px)}.battle-room.playing{padding:6px}.battle-header{margin-top:0;margin-bottom:6px}.battle-board-panel{padding:.5rem;gap:0}.panel-center-gap{height:.4rem}.battle-controls{max-width:280px;gap:.5rem}.number-pad-battle{gap:6px;padding:10px}.num-btn-battle{border-radius:8px}.num-value-battle{width:28px;height:28px;font-size:16px;border-radius:0 0 10px}.surrender-btn{padding:10px 28px;font-size:.9rem}}@media(max-width:340px){.battle-room{--battle-cell-size: clamp(22px, 4.2vw, 30px)}.battle-controls{max-width:240px;padding:6px}}.lead-notification{position:fixed;top:120px;left:50%;transform:translate(-50%);z-index:200;padding:12px 32px;border-radius:40px;font-size:1.5rem;font-weight:900;color:#fff;pointer-events:none;animation:lead-pop 2.5s cubic-bezier(.175,.885,.32,1.275) forwards;white-space:nowrap;box-shadow:0 8px 32px #0003;text-shadow:0 2px 4px rgba(0,0,0,.2)}@media(max-width:500px){.lead-notification{top:140px;font-size:1.2rem;padding:8px 24px}}.lead-notification.leading{background:linear-gradient(135deg,#ff69b4,#ffb6c1);border:4px solid white}.lead-notification.behind{background:linear-gradient(135deg,#777,#bbb);border:4px solid white}.lead-notification.tied{background:linear-gradient(135deg,#4a9fd9,#87ceeb);border:4px solid white}.disconnect-warning{position:fixed;top:80px;left:50%;transform:translate(-50%);z-index:150;background:#e74c3ce6;color:#fff;padding:8px 20px;border-radius:12px;font-weight:700;font-size:.9rem;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);box-shadow:0 4px 12px #0003;animation:shake .5s ease-in-out infinite}@keyframes shake{0%,to{transform:translate(-50%) rotate(0)}25%{transform:translate(-52%) rotate(-1deg)}75%{transform:translate(-48%) rotate(1deg)}}@keyframes lead-pop{0%{transform:translate(-50%) translateY(20px) scale(.5);opacity:0}15%{transform:translate(-50%) translateY(0) scale(1.1);opacity:1}25%{transform:translate(-50%) translateY(0) scale(1);opacity:1}80%{transform:translate(-50%) translateY(0) scale(1);opacity:1}to{transform:translate(-50%) translateY(-40px) scale(.8);opacity:0}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.6}}
