:root{--bg-primary: #0f0f0f;--bg-secondary: #1a1a1a;--text-primary: #e0e0e0;--accent-color: #4a8fe7;--button-hover: #2d6bc2;--active-color: #3a7bd5}[data-theme=dark]{background-color:var(--bg-primary);color:var(--text-primary)}body{font-family:Arial,sans-serif;margin:0;padding:0;min-height:100vh;display:flex;justify-content:center;align-items:center;background:linear-gradient(135deg,var(--bg-primary),var(--bg-secondary))}.container{text-align:center;padding:2rem;background-color:#1a1a1acc;border-radius:1rem;box-shadow:0 4px 20px #0000004d}.timer-controls{margin:1.5rem 0}.timer-option{background-color:var(--bg-secondary);color:var(--text-primary);border:2px solid #444;padding:.75rem 1.5rem;margin:.5rem;border-radius:.5rem;cursor:pointer;transition:all .3s;font-size:1rem}.timer-option:hover{border-color:var(--accent-color);background-color:#4a8fe71a}.timer-option.active{background-color:var(--active-color);border-color:var(--active-color);color:#fff}button{background-color:var(--accent-color);color:#fff;border:none;padding:.75rem 1.5rem;margin:.5rem;border-radius:.5rem;cursor:pointer;transition:background-color .3s;font-size:1rem}button:hover:not(:disabled){background-color:var(--button-hover)}button:disabled{background-color:#555;cursor:not-allowed}.timer-display{font-size:3rem;margin:2rem 0;font-weight:700;font-variant-numeric:tabular-nums}