.sudoku-page{background:linear-gradient(145deg,#f0f7ff 0%,#e3f2fd 30%,#fff 60%,#f0f7ff 100%);min-height:100vh;padding:40px 20px 80px;font-family:Inter,sans-serif}.sudoku-header{text-align:center;margin-bottom:32px;animation:.7s ease-out sudFadeDown}.sudoku-header h1{background:linear-gradient(135deg,#4527a0,#7e57c2);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:8px;font-size:3rem;font-weight:800}.sudoku-header p{color:#888;max-width:460px;margin:0 auto;font-size:1.05rem}.sudoku-controls{flex-wrap:wrap;justify-content:center;gap:12px;margin-bottom:24px;animation:.6s ease-out .1s backwards sudFadeUp;display:flex}.sudoku-btn{cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#4527a0;background:#ffffffd9;border:1px solid #4527a01a;border-radius:12px;padding:10px 24px;font-size:.9rem;font-weight:700;transition:all .3s;box-shadow:0 2px 8px #0000000a}.sudoku-btn:hover{transform:translateY(-2px);box-shadow:0 6px 16px #4527a01f}.sudoku-btn.primary{color:#fff;background:linear-gradient(135deg,#4527a0,#7e57c2)}.sudoku-grid-wrapper{max-width:420px;margin:0 auto 24px;animation:.6s ease-out .2s backwards sudFadeUp}.sudoku-grid{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#ffffffd9;border:2px solid #4527a01f;border-radius:16px;grid-template-columns:repeat(9,1fr);display:grid;overflow:hidden;box-shadow:0 8px 32px #0000000f}.sudoku-cell{aspect-ratio:1;cursor:pointer;color:#333;-webkit-user-select:none;user-select:none;background:0 0;border:1px solid #4527a00f;justify-content:center;align-items:center;font-size:1.2rem;font-weight:600;transition:all .2s;display:flex}.sudoku-cell:hover{background:#7e57c20f}.sudoku-cell.selected{background:#7e57c226;box-shadow:inset 0 0 0 2px #7e57c2}.sudoku-cell.given{color:#4527a0;font-weight:800}.sudoku-cell.user-input{color:#7e57c2}.sudoku-cell.error{color:#d32f2f;background:#d32f2f0f}.sudoku-cell.br-right{border-right:2px solid #4527a033}.sudoku-cell.br-bottom{border-bottom:2px solid #4527a033}.sudoku-numpad{flex-wrap:wrap;justify-content:center;gap:8px;max-width:420px;margin:0 auto;animation:.6s ease-out .3s backwards sudFadeUp;display:flex}.sudoku-num-btn{cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#4527a0;background:#ffffffd9;border:1px solid #4527a014;border-radius:12px;width:44px;height:44px;font-size:1.2rem;font-weight:700;transition:all .2s;box-shadow:0 2px 6px #0000000a}.sudoku-num-btn:hover{color:#fff;background:linear-gradient(135deg,#4527a0,#7e57c2);transform:translateY(-2px);box-shadow:0 6px 14px #4527a026}.sudoku-num-btn.erase{color:#d32f2f;background:#d32f2f0f;border-color:#d32f2f1a}.sudoku-msg{text-align:center;color:#4527a0;background:linear-gradient(135deg,#4527a014,#7e57c214);border-radius:14px;margin-top:24px;padding:14px 28px;font-size:1.1rem;font-weight:700;animation:.4s sudFadeUp}@keyframes sudFadeDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes sudFadeUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media (max-width:480px){.sudoku-header h1{font-size:2rem}.sudoku-cell{font-size:.9rem}.sudoku-num-btn{width:36px;height:36px;font-size:1rem}}