:root{font-family:system-ui,Avenir,Helvetica,Arial,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}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}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%;margin:0;padding:0;text-align:center;min-height:100vh}.app-container{display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:Comic Sans MS,Chalkboard SE,cursive;color:var(--current-level-accent);background-color:var(--current-level-bg, #fffaf0);min-height:100vh;width:100%;transition:all 1s ease;position:relative;overflow-x:hidden;overflow-y:auto;padding:2rem;box-sizing:border-box;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;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,confetti-spin 1s linear infinite,confetti-color 2s linear infinite;animation-delay:var(--delay);border-radius:2px}@keyframes confetti-fall{0%{transform:translateY(0) rotate(0);opacity:1}to{transform:translateY(100vh) rotate(720deg);opacity:0}}@keyframes confetti-spin{0%{transform:rotateX(0) rotateY(0)}to{transform:rotateX(360deg) rotateY(360deg)}}@keyframes confetti-color{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}@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}}.falling-item{position:fixed;top:-50px;font-size:30px;z-index:200;pointer-events:none;animation:fall-rotate linear forwards}@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;cursor:pointer;transition:all .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}.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 28px;border-radius:50px;display:flex;align-items:center;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}.toast-icon{font-size:1.3rem}.toast-message{white-space:nowrap}.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:fixed;top:20px;right:20px;z-index:100}.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);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)}.language-option.active{background:var(--current-level-accent);color:#fff}.language-option .lang-flag{font-size:1.3rem}@media(max-width:800px){.language-switcher{top:10px;right:10px}.language-btn{padding:8px 12px}.lang-name,.lang-arrow{display:none}.language-dropdown .lang-name{display:inline}}
