*{margin:0;padding:0;box-sizing:border-box}body{min-height:100vh;background:#1a1a2e;font-family:Outfit,sans-serif;display:flex;justify-content:center;align-items:center;padding:20px}#root{display:flex;justify-content:center;width:100%}.sudoku-container{display:flex;flex-direction:column;align-items:center;gap:24px}header{text-align:center}h1{font-size:48px;font-weight:700;color:#f72585;letter-spacing:8px;margin-bottom:16px;text-shadow:0 0 20px rgba(247,37,133,.5)}.controls{display:flex;gap:12px;justify-content:center}.difficulty-select{padding:10px 16px;font-size:14px;font-family:Outfit,sans-serif;background:#16213e;color:#fff;border:2px solid #4a4e69;border-radius:8px;cursor:pointer;transition:all .2s}.difficulty-select:hover{border-color:#f72585}.difficulty-select:focus{outline:none;border-color:#f72585;box-shadow:0 0 10px #f725854d}.btn{padding:12px 24px;font-size:14px;font-family:Outfit,sans-serif;font-weight:600;text-transform:uppercase;letter-spacing:1px;border:none;border-radius:8px;cursor:pointer;transition:all .2s}.btn:hover{transform:translateY(-2px)}.btn:active{transform:translateY(0)}.btn-primary{background:#f72585;color:#fff}.btn-primary:hover{background:#d61f69;box-shadow:0 4px 15px #f7258566}.btn-secondary{background:#7209b7;color:#fff}.btn-secondary:hover{background:#5a0789;box-shadow:0 4px 15px #7209b766}.board-container{background:#16213e;padding:12px;border-radius:12px;box-shadow:0 10px 40px #0006}.board{display:grid;grid-template-columns:repeat(9,1fr);gap:0;background:#4a4e69;border:3px solid #f72585;border-radius:4px;overflow:hidden}.cell{width:54px;height:54px;background:#0f3460;display:flex;justify-content:center;align-items:center;font-family:JetBrains Mono,monospace;font-size:24px;font-weight:700;color:#00d9ff;cursor:pointer;transition:all .15s;-webkit-user-select:none;user-select:none}.cell:hover:not(.selected){background:#1a4a7a}.cell.selected{background:#e94560;color:#fff;box-shadow:inset 0 0 15px #0000004d;transform:scale(1.05);z-index:1}.cell.fixed{color:#fff}.cell.hint{color:#4ecdc4;font-style:italic}.cell.error{animation:shake .4s;background:#ff6b6b}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-4px)}40%{transform:translate(4px)}60%{transform:translate(-4px)}80%{transform:translate(4px)}}.numpad{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;max-width:360px}.num-btn{width:48px;height:48px;font-family:JetBrains Mono,monospace;font-size:20px;font-weight:700;background:#16213e;color:#fff;border:2px solid #4a4e69;border-radius:8px;cursor:pointer;transition:all .15s}.num-btn:hover{background:#1a4a7a;border-color:#f72585;transform:scale(1.1)}.num-btn:active{transform:scale(.95)}.num-btn.erase{color:#ff6b6b}.actions{display:flex;gap:12px}.message{padding:12px 24px;border-radius:8px;font-weight:600;font-size:16px;text-align:center;min-width:250px}.message.success{background:#4ecdc433;color:#4ecdc4;border:2px solid #4ecdc4}.message.error{background:#ff6b6b33;color:#ff6b6b;border:2px solid #ff6b6b}.confetti-container{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;overflow:hidden;z-index:1000}.confetti{position:absolute;width:10px;height:10px;top:-10px;animation:fall linear forwards;border-radius:2px}@keyframes fall{to{top:100vh;transform:rotate(720deg)}}@media(max-width:540px){h1{font-size:32px;letter-spacing:4px}.cell{width:36px;height:36px;font-size:18px}.board-container{padding:8px}.numpad{max-width:300px}.num-btn{width:40px;height:40px;font-size:18px}}