:root{--color-bg: #0f172a;--color-text: #f8fafc;--color-primary: #3b82f6;--color-secondary: #64748b;--color-accent: #ef4444;--color-surface: #1e293b;--font-family: "Inter", system-ui, sans-serif;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 2rem;--radius-md: 8px;--radius-lg: 16px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}button{cursor:pointer;border:none;background:none;font-family:inherit}input{font-family:inherit}body{background-color:var(--color-bg);color:var(--color-text);font-family:var(--font-family);min-height:100vh;display:flex;flex-direction:column}#app{width:100%;height:100%;flex:1;display:flex;flex-direction:column}.app-container{max-width:1200px;margin:0 auto;padding:var(--spacing-md);width:100%;flex:1;display:flex;flex-direction:column}.page{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;text-align:center;flex:1}.timer-display{font-size:15vw;font-weight:700;font-variant-numeric:tabular-nums;margin-bottom:var(--spacing-lg);color:var(--color-text);text-shadow:0 0 20px rgba(59,130,246,.3);line-height:1}@media (min-width: 768px){.timer-display{font-size:8rem}}.controls{display:flex;gap:var(--spacing-md);margin-bottom:var(--spacing-lg);flex-wrap:wrap;justify-content:center}.btn{padding:.75rem 1.5rem;border-radius:var(--radius-md);font-size:1.1rem;font-weight:600;transition:all .2s;min-width:100px}.btn-primary{background-color:var(--color-primary);color:#fff}.btn-primary:hover{background-color:#2563eb;transform:translateY(-2px)}.btn-secondary{background-color:var(--color-surface);color:var(--color-text);border:1px solid var(--color-secondary)}.btn-secondary:hover:not(:disabled){background-color:#334155}.btn:disabled{opacity:.5;cursor:not-allowed}.laps-container{width:100%;max-width:400px;max-height:300px;overflow-y:auto;border-top:1px solid var(--color-surface);padding-top:var(--spacing-md)}#laps-list{list-style:none;width:100%}#laps-list li{display:flex;justify-content:space-between;padding:.5rem;border-bottom:1px solid rgba(255,255,255,.05);font-family:monospace;font-size:1.1rem}nav{display:flex;gap:var(--spacing-md);justify-content:center;margin-bottom:var(--spacing-lg);flex-wrap:wrap}nav a{color:var(--color-secondary);text-decoration:none;font-weight:500;padding:.5rem;border-radius:var(--radius-md);transition:color .2s}nav a:hover,nav a.active{color:var(--color-primary);background-color:#3b82f61a}