*{margin:0;padding:0;box-sizing:border-box}:root{--bg-primary:#1a1a1a;--bg-secondary:#2d2d2d;--bg-timer:#242424;--text-primary:#ffffff;--text-secondary:#c0c0c0;--accent-primary:#4a9eff;--accent-hover:#3a8eef;--success:#4caf50;--danger:#f44336;--warning:#ff9800;--border:#404040;--spacing-xs:0.5rem;--spacing-sm:1rem;--spacing-md:1.5rem;--spacing-lg:2rem;--spacing-xl:3rem;--font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;--font-size-base:16px;--font-size-lg:1.25rem;--font-size-xl:1.5rem;--font-size-2xl:2rem;--font-size-3xl:3rem;--sidebar-width:300px;--max-content-width:1400px}body{font-family:var(--font-family);font-size:var(--font-size-base);line-height:1.6;color:var(--text-primary);background-color:var(--bg-primary);min-height:100vh;display:flex;flex-direction:column}header{background:linear-gradient(135deg,#1a1a1a 0,#2d2d2d 50%,#1a1a1a 100%);padding:var(--spacing-lg) var(--spacing-lg);border-bottom:3px solid var(--accent-primary);box-shadow:0 4px 20px rgba(74,158,255,.2)}.header-content{max-width:var(--max-content-width);margin:0 auto;text-align:center}header h1{font-size:var(--font-size-3xl);font-weight:800;margin-bottom:var(--spacing-xs);background:linear-gradient(90deg,#4a9eff 0,#6eb5ff 50%,#4a9eff 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:.05em;text-transform:uppercase;text-shadow:0 0 30px rgba(74,158,255,.3)}.tagline{font-size:var(--font-size-lg);color:var(--text-secondary);margin-bottom:var(--spacing-md);font-weight:300;letter-spacing:.1em}.ad-banner{margin-top:var(--spacing-md);min-height:90px}.container{display:flex;max-width:var(--max-content-width);margin:0 auto;flex:1;width:100%;gap:var(--spacing-lg);padding:var(--spacing-lg)}.timers-section{flex:1;min-width:0}.timers-container{display:flex;flex-direction:column;gap:var(--spacing-lg)}.timer-card{background-color:var(--bg-timer);border:2px solid var(--border);border-radius:8px;padding:var(--spacing-lg);box-shadow:0 4px 12px rgba(0,0,0,.4)}.timer-header{display:flex;gap:var(--spacing-sm);margin-bottom:var(--spacing-md);flex-wrap:wrap}.timer-name-input{flex:1;min-width:200px;padding:var(--spacing-sm);font-size:var(--font-size-lg);font-weight:600;background-color:var(--bg-secondary);color:var(--text-primary);border:2px solid var(--border);border-radius:4px;outline:0;transition:border-color .2s}.timer-name-input:focus{border-color:var(--accent-primary)}.btn-remove{padding:var(--spacing-sm) var(--spacing-md);min-width:44px;min-height:44px}.timer-main{display:flex;gap:var(--spacing-lg);margin-bottom:var(--spacing-md);align-items:center;flex-wrap:wrap}.time-display{flex:1;min-width:280px}.time-inputs{display:flex;gap:var(--spacing-sm);justify-content:center;align-items:center}.time-field{display:flex;flex-direction:column;align-items:center;justify-content:center}.time-field label{font-size:.75rem;color:var(--text-secondary);margin-bottom:var(--spacing-xs);text-transform:uppercase;letter-spacing:.5px;font-weight:600}.time-input-group{display:flex;flex-direction:column;gap:4px;align-items:center}.time-btn{width:100%;min-height:44px;min-width:44px;background-color:var(--bg-secondary);color:var(--text-primary);border:2px solid var(--border);border-radius:4px;cursor:pointer;font-size:1rem;font-weight:700;transition:all .2s;padding:var(--spacing-xs);display:flex;align-items:center;justify-content:center}.time-btn:hover{background-color:var(--accent-primary);color:#fff;border-color:var(--accent-primary)}.time-btn:active{transform:scale(.95)}.time-btn:focus{outline:2px solid var(--accent-primary);outline-offset:1px}.time-btn:disabled{opacity:.3;cursor:not-allowed;background-color:var(--bg-timer)}.timer-card.running .time-btn{opacity:.3;cursor:not-allowed;pointer-events:none}.time-input{width:120px;padding:var(--spacing-md);font-size:var(--font-size-3xl);font-weight:700;text-align:center;background-color:var(--bg-secondary);color:var(--text-primary);border:2px solid var(--border);border-radius:4px;outline:0;font-family:monospace;-moz-appearance:textfield;letter-spacing:.1em;overflow:visible}.time-input::-webkit-inner-spin-button,.time-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.time-input:focus{border-color:var(--accent-primary)}.time-input[readonly]{background-color:var(--bg-timer);cursor:default;opacity:1}.time-separator{font-size:var(--font-size-3xl);font-weight:700;color:var(--text-secondary);padding:0 var(--spacing-xs);align-self:center;line-height:1;margin-top:20px}.timer-card.running .time-display{animation:pulse 1s ease-in-out infinite}@keyframes pulse{0%,100%{opacity:1}50%{opacity:.8}}.timer-card.complete{animation:flash-background 1s ease-in-out infinite;border-color:var(--danger);border-width:3px}@keyframes flash-background{0%,100%{background-color:var(--bg-timer);box-shadow:0 4px 12px rgba(0,0,0,.4)}50%{background-color:rgba(244,67,54,.3);box-shadow:0 4px 20px rgba(244,67,54,.6)}}.timer-controls{display:flex;flex-direction:column;gap:var(--spacing-sm);min-width:120px}.btn{padding:var(--spacing-sm) var(--spacing-md);font-size:var(--font-size-base);font-weight:600;border:none;border-radius:4px;cursor:pointer;transition:all .2s;min-width:44px;min-height:44px;text-transform:uppercase;letter-spacing:.5px;font-family:var(--font-family)}.btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,.4)}.btn:active{transform:translateY(0)}.btn:focus{outline:3px solid var(--accent-primary);outline-offset:2px}.btn-start{background-color:var(--success);color:#fff}.btn-start:hover{background-color:#45a049}.btn-pause{background-color:#d68000;color:#fff}.btn-pause:hover{background-color:#c07000}.btn-reset{background-color:#505050;color:#fff;border:2px solid #606060}.btn-reset:hover{background-color:#606060}.btn-remove{background-color:var(--danger);color:#fff}.btn-remove:hover{background-color:#d32f2f}.btn-alarm-toggle{background-color:var(--warning);color:#fff;border:2px solid var(--warning);padding:var(--spacing-sm);min-width:44px;min-height:44px;align-items:center;justify-content:center;display:inline-flex}.timer-card.complete .btn-alarm-toggle:not(.muted){animation:pulse-alarm 1s ease-in-out infinite}.btn-alarm-toggle[style*="display: none"]{display:none!important}.btn-alarm-toggle[style*="display: inline-block"]{display:inline-flex!important}.btn-alarm-toggle:hover{background-color:#e68900}.btn-alarm-toggle.muted{background-color:var(--bg-secondary);border-color:var(--text-secondary);color:var(--text-secondary);animation:none}.btn-alarm-toggle.muted:hover{background-color:var(--border)}.bell-icon{width:24px;height:24px;stroke:currentColor;fill:none;display:block;flex-shrink:0}@keyframes pulse-alarm{0%,100%{transform:scale(1)}50%{transform:scale(1.1)}}.timer-notes{margin-top:var(--spacing-md)}.timer-notes label{display:block;font-weight:600;margin-bottom:var(--spacing-xs);color:var(--text-secondary)}.notes-input{width:100%;min-height:80px;padding:var(--spacing-sm);font-size:var(--font-size-base);font-family:var(--font-family);background-color:var(--bg-secondary);color:var(--text-primary);border:2px solid var(--border);border-radius:4px;resize:vertical;outline:0}.notes-input:focus{border-color:var(--accent-primary)}.notes-input::placeholder{color:grey;opacity:1}.btn-add-timer{width:100%;margin-top:var(--spacing-lg);padding:var(--spacing-md);background-color:var(--accent-primary);color:#fff;font-size:var(--font-size-lg)}.btn-add-timer:hover{background-color:var(--accent-hover)}.btn-icon{font-size:var(--font-size-xl);margin-right:var(--spacing-xs)}.ad-sidebar{width:var(--sidebar-width);flex-shrink:0}.ad-sidebar-content{position:sticky;top:var(--spacing-lg);min-height:600px}.ad-zone{background-color:var(--bg-secondary);border:2px dashed var(--border);border-radius:4px;display:flex;align-items:center;justify-content:center}.ad-placeholder{color:var(--text-secondary);font-size:.9rem;font-style:italic}footer{background-color:var(--bg-secondary);border-top:2px solid var(--border);margin-top:var(--spacing-xl);padding:var(--spacing-xl) var(--spacing-lg)}.footer-content{max-width:var(--max-content-width);margin:0 auto}.accessibility-statement{margin-bottom:var(--spacing-md);font-size:.75rem;color:var(--text-secondary);opacity:.6}.accessibility-statement h2{font-size:.85rem;margin-bottom:var(--spacing-xs);color:var(--text-secondary);font-weight:600;text-transform:uppercase;letter-spacing:.5px}.accessibility-statement p{margin-bottom:var(--spacing-xs);color:var(--text-secondary);line-height:1.4}.accessibility-statement a{color:var(--accent-primary);text-decoration:none}.accessibility-statement a:hover{text-decoration:underline}.accessibility-statement a:focus{outline:2px solid var(--accent-primary);outline-offset:2px}.copyright{text-align:center;color:var(--text-secondary);font-size:.9rem}@media (max-width:1024px){.container{flex-direction:column}.ad-sidebar{width:100%;order:-1}.ad-sidebar-content{position:static;min-height:250px}:root{--sidebar-width:100%}}@media (max-width:768px){header h1{font-size:var(--font-size-2xl)}.timer-main{flex-direction:column}.timer-controls{flex-direction:row;flex-wrap:wrap;width:100%}.timer-controls .btn{flex:1;min-width:100px}.time-input{width:100px;font-size:var(--font-size-2xl);padding:var(--spacing-sm) var(--spacing-md)}}@media (max-width:480px){.container{padding:var(--spacing-sm)}.timer-card{padding:var(--spacing-md)}.time-input{width:85px;font-size:var(--font-size-xl);padding:var(--spacing-sm)}.time-separator{font-size:var(--font-size-xl)}.timer-header{flex-direction:column}.btn-remove{width:100%}}:focus-visible{outline:3px solid var(--accent-primary);outline-offset:2px}@media (prefers-reduced-motion:reduce){*,::after,::before{animation-duration:0s!important;animation-iteration-count:1!important;transition-duration:0s!important}}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}