:root{--bg-primary:#111827;--bg-secondary:#1f2937;--bg-tertiary:#374151;--text-primary:#f9fafb;--text-secondary:#cbd5e1;--text-tertiary:#9ca3af;--border-color:#4b5563;--btn-primary-bg:#22c55e;--btn-primary-hover:#16a34a;--btn-danger-bg:#ef4444;--btn-danger-hover:#dc2626;--btn-shadow:#0f172a66;--ball-shadow:#0000004d;--modal-shadow:#00000080;--modal-overlay-bg:#00000080;--ball-number-color:#0056b3;--drawn-bg:#2563eb;--drawn-latest-bg:#f59e0b;--drawn-latest-text:#111827;--error-color:#ef4444}body.light-mode{--bg-primary:#f9fafb;--bg-secondary:#f3f4f6;--bg-tertiary:#e5e7eb;--text-primary:#111827;--text-secondary:#4b5563;--text-tertiary:#6b7280;--border-color:#d1d5db;--btn-primary-bg:#22c55e;--btn-primary-hover:#16a34a;--btn-danger-bg:#ef4444;--btn-danger-hover:#dc2626;--btn-shadow:#0000001a;--ball-shadow:#00000026;--modal-shadow:#0003;--modal-overlay-bg:#0000004d;--ball-number-color:#0056b3;--drawn-bg:#2563eb;--drawn-latest-bg:#f59e0b;--drawn-latest-text:#111827;--error-color:#ef4444}*,:before,:after{box-sizing:border-box}.hidden{display:none!important}body{background-color:var(--bg-primary);color:var(--text-primary);color-scheme:dark;margin:0;font-family:Roboto,sans-serif;transition:background-color .3s,color .3s}body.light-mode{color-scheme:light}.container{text-align:center;flex-direction:column;gap:2rem;max-width:1140px;margin:0 auto;display:flex}h1{margin:1rem 0 0}.controls{justify-content:center;display:flex}.btn{cursor:pointer;border:none;border-radius:.75rem;padding:.75rem 1.25rem;font-size:1.125rem;font-weight:700;display:inline-block}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-draw{min-width:220px;padding:1rem 1.75rem;font-size:1.25rem}.btn-primary{background-color:var(--btn-primary-bg);box-shadow:3px 3px 5px var(--btn-shadow);color:#fff}.btn-primary:hover:not(:disabled){background-color:var(--btn-primary-hover)}.btn-danger{background-color:var(--btn-danger-bg);box-shadow:3px 3px 5px var(--btn-shadow);color:#fff}.btn-danger:hover:not(:disabled){background-color:var(--btn-danger-hover)}.grid-numbers{background:var(--bg-secondary);width:min(100%,100% - 2rem);max-width:768px;box-shadow:0 10px 30px var(--btn-shadow);border-radius:1rem;flex-direction:column;align-items:stretch;gap:.75rem;margin:0 auto;padding:.75rem 1rem;display:flex}.grid-numbers h4{margin:1rem}@media (width<=768px){.grid-numbers{width:calc(100% - 2rem)}}.bingo-ball{width:200px;height:200px;color:var(--ball-number-color);box-shadow:0 0 15px var(--ball-shadow);background:radial-gradient(circle at 30% 30%,#f9fafb,#9ca3af);border-radius:50%;justify-content:center;align-items:center;margin:0 auto 1rem;font-size:5rem;font-weight:700;display:flex}.spin{animation:.4s cubic-bezier(.4,0,.2,1) reveal}@media (prefers-reduced-motion:reduce){.spin{animation:none}}@keyframes reveal{0%{box-shadow:0 0 15px var(--ball-shadow);transform:scale(1)}30%{box-shadow:0 8px 30px var(--ball-shadow);transform:scale(1.05)}60%{transform:scale(.96)}to{box-shadow:0 0 15px var(--ball-shadow);transform:scale(1)}}.number{text-align:center;background-color:var(--bg-tertiary);width:40px;height:40px;color:var(--text-primary);border-radius:50%;justify-content:center;align-items:center;font-size:1.1rem;font-weight:700;line-height:40px;display:inline-flex;box-shadow:3px 4px 5px #00000059}.number-grid{grid-template-columns:repeat(6,minmax(0,1fr));justify-items:center;gap:.6rem;width:100%;display:grid}.drawn{background-color:var(--drawn-bg);color:#fff;box-shadow:3px 4px 5px #00000059}.drawn.latest{background-color:var(--drawn-latest-bg);color:var(--drawn-latest-text)}.reset-container{justify-content:center;margin:2rem 0 3rem;display:flex}.modal-overlay{background:var(--modal-overlay-bg);z-index:100;justify-content:center;align-items:center;transition:background-color .3s;display:flex;position:fixed;inset:0}.modal-overlay.hidden{display:none}.modal{background:var(--bg-secondary);text-align:center;width:90%;max-width:400px;box-shadow:0 20px 60px var(--modal-shadow);border-radius:1rem;padding:2rem;transition:background-color .3s,color .3s}.modal h3{margin:0 0 .5rem}.modal p{color:var(--text-secondary);margin:0 0 1rem}.equation{color:var(--text-primary);margin:1rem 0;font-size:2rem;font-weight:700}.modal-input{text-align:center;border:2px solid var(--border-color);background:var(--bg-primary);width:120px;color:var(--text-primary);border-radius:.5rem;outline:none;padding:.5rem;font-size:1.25rem;transition:background-color .3s,color .3s,border-color .3s}.modal-input.error,.modal-input.error:focus{border-color:var(--error-color)}.equation-error{color:var(--error-color);margin:.5rem 0;font-weight:700}.equation-error.hidden{display:none}.modal-actions{justify-content:center;gap:.75rem;margin-top:1rem;display:flex}.modal-actions .btn{min-width:100px}.game-over-message{color:var(--error-color);margin:1rem 0;font-size:1.5rem;font-weight:700}.btn-icon{cursor:pointer;color:var(--text-secondary);background:0 0;border:none;border-radius:.25rem;padding:.25rem;font-size:1.25rem;transition:color .3s,background-color .3s}.btn-icon:hover{color:var(--text-primary);background:var(--bg-tertiary)}.btn-icon:focus-visible{outline:2px solid var(--btn-primary-bg);outline-offset:2px}.modal-header{justify-content:center;align-items:center;gap:.5rem;margin-bottom:.5rem;display:flex}.modal-header h3{margin:0}.theme-toggle-container{z-index:1000;position:fixed;top:1rem;right:1rem}.theme-toggle{background:var(--bg-secondary);width:50px;height:50px;color:var(--text-primary);cursor:pointer;border:none;border-radius:50%;justify-content:center;align-items:center;padding:0;transition:all .3s;display:flex;position:relative;box-shadow:0 4px 12px #00000026}.theme-toggle:hover{transform:scale(1.05);box-shadow:0 6px 16px #0003}.theme-toggle:focus-visible{outline:2px solid var(--btn-primary-bg);outline-offset:2px}.sun-icon,.moon-icon{width:24px;height:24px;transition:all .3s;position:absolute}.sun-icon{opacity:1;transform:rotate(0)scale(1)}.moon-icon{opacity:0;transform:rotate(-180deg)scale(0)}body.light-mode .sun-icon{opacity:0;transform:rotate(180deg)scale(0)}body.light-mode .moon-icon{opacity:1;transform:rotate(0)scale(1)}@media (width<=768px){.theme-toggle-container{top:.75rem;right:.75rem}.theme-toggle{width:45px;height:45px}.sun-icon,.moon-icon{width:20px;height:20px}}