.timer-page{flex-direction:column;min-height:100dvh;display:flex}.timer-header{align-items:center;gap:var(--space-md);padding:var(--space-md) var(--space-lg);display:flex}.timer-back-link{color:var(--color-text-2);font-size:.875rem;text-decoration:none}.timer-back-link:hover{color:var(--color-text)}.timer-h1{color:var(--color-text);margin:0;font-size:1.125rem;font-weight:600}.timer-screen{view-transition-name:timer-hero;min-height:100dvh;padding:var(--space-lg);background-color:var(--color-background);transition:background-color var(--transition-phase);flex-direction:column;justify-content:center;align-items:center;display:flex}.timer-page>.timer-screen{flex:1}.timer-footer{padding:var(--space-md) var(--space-lg);text-align:center;color:var(--color-text-3);font-size:.875rem}.timer-footer a{color:var(--color-accent)}.timer-screen[data-phase=ready]{background-color:var(--color-background)}.timer-screen[data-phase=work]{background-color:var(--color-work-surface)}.timer-screen[data-phase=rest]{background-color:var(--color-rest-surface)}.timer-screen[data-phase=paused]{background-color:var(--color-background)}.timer-ring-wrapper{justify-content:center;align-items:center;display:flex;position:relative}.phase-label{font-family:var(--font-heading);text-transform:uppercase;letter-spacing:.15em;color:var(--color-text-muted);transition:color var(--transition-phase);font-size:1.25rem;font-weight:400}.phase-label[data-phase=ready]{color:var(--color-text-muted)}.phase-label[data-phase=work]{color:var(--color-work)}.phase-label[data-phase=rest]{color:var(--color-rest)}.countdown{font-family:var(--font-mono);font-size:var(--countdown-size);font-variant-numeric:tabular-nums;color:var(--color-text);margin:var(--space-sm) 0;z-index:1;font-weight:700;line-height:1;position:relative}.round-indicator{font-family:var(--font-body);color:var(--color-text-muted);font-size:1rem}.progress-ring{position:absolute}.progress-ring__circle-bg{fill:none;stroke:var(--color-border);stroke-width:4px}.progress-ring__circle{fill:none;stroke-width:4px;stroke-linecap:round;transform-origin:50%;transition:stroke var(--transition-phase);transform:rotate(-90deg)}.progress-ring__circle[data-phase=ready]{stroke:var(--color-text-muted)}.progress-ring__circle[data-phase=work]{stroke:var(--color-work)}.progress-ring__circle[data-phase=rest]{stroke:var(--color-rest)}.controls{align-items:center;gap:var(--space-lg);margin-top:var(--space-2xl);display:flex}.btn{cursor:pointer;font-family:var(--font-body);transition:opacity var(--transition-normal), transform var(--transition-normal), color var(--transition-normal), background-color var(--transition-normal), border-color var(--transition-normal);-webkit-tap-highlight-color:transparent;border:none;justify-content:center;align-items:center;font-weight:600;display:inline-flex}.btn:focus-visible{outline:2px solid var(--color-ring);outline-offset:2px}.btn-primary{background-color:var(--color-cta);color:#fff;padding:var(--space-md) var(--space-2xl);border-radius:9999px;min-width:200px;min-height:56px;font-size:1.25rem}.btn-primary:hover{opacity:.9;transform:translateY(-1px)}.btn-primary:active{transform:scale(.97)}.btn-secondary{color:var(--color-text-muted);padding:var(--space-sm) var(--space-md);background:0 0;border-radius:8px;min-width:44px;min-height:44px;font-size:.875rem}.btn-secondary:hover{color:var(--color-text);background-color:#0000000d}.btn-icon{color:var(--color-text);border:2px solid var(--color-border);background:0 0;border-radius:50%;width:64px;height:64px;font-size:1.5rem}.btn-icon:hover{border-color:var(--color-text-muted)}.btn-icon:active{transform:scale(.95)}.idle-screen{min-height:100dvh;padding:var(--space-lg);justify-content:center;align-items:center;gap:var(--space-lg);flex-direction:column;display:flex}.idle-title{font-family:var(--font-heading);color:var(--color-text);font-size:2.5rem}.idle-subtitle{font-family:var(--font-body);color:var(--color-text-muted);font-size:1rem}.complete-screen{min-height:100dvh;padding:var(--space-lg);justify-content:center;align-items:center;gap:var(--space-lg);flex-direction:column;display:flex}.complete-title{font-family:var(--font-heading);color:var(--color-text);font-size:3rem}.complete-stat{font-family:var(--font-body);color:var(--color-text-muted);font-size:1.125rem}.paused-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:10;cursor:pointer;-webkit-tap-highlight-color:transparent;background:#f8f6f3cc;border:none;border-radius:0;justify-content:center;align-items:center;font-family:inherit;display:flex;position:fixed;inset:0}.paused-overlay:focus-visible{outline:3px solid var(--color-ring);outline-offset:-3px}.paused-text{font-family:var(--font-heading);color:var(--color-text-muted);font-size:2rem}