.timer-page{flex-direction:column;align-items:center;max-width:600px;min-height:calc(100vh - 80px);margin:0 auto;padding:0 1rem 4rem;display:flex}.timer-page:fullscreen{background:var(--color-bg);flex-direction:column;justify-content:center;align-items:center;padding:2rem;display:flex}.timer-page:fullscreen .timer-header,.timer-page:fullscreen .timer-presets{display:none}.timer-page.round .timer-countdown{color:var(--color-primary)}.timer-page.round .timer-progress-fill{background:var(--color-primary)}.timer-page.round .timer-phase-label{color:var(--color-primary)}.timer-page.rest .timer-countdown{color:var(--color-success)}.timer-page.rest .timer-progress-fill{background:var(--color-success)}.timer-page.rest .timer-phase-label{color:var(--color-success)}.timer-page.done .timer-countdown,.timer-page.done .timer-phase-label{color:var(--color-warning)}.timer-page.ready .timer-countdown,.timer-page.ready .timer-phase-label{color:var(--color-text-muted)}.timer-header{text-align:center;padding:3rem 0 1.5rem}.timer-header__label{text-transform:uppercase;letter-spacing:.12em;color:var(--color-primary);align-items:center;gap:.4rem;margin-bottom:.5rem;font-size:.75rem;font-weight:700;display:inline-flex}.timer-header h1{font-family:var(--font-display);font-size:var(--font-size-title)}.timer-presets{flex-wrap:wrap;justify-content:center;gap:6px;margin-bottom:1.5rem;display:flex}.preset-btn{border:1px solid var(--color-border);border-radius:var(--radius-full);color:var(--color-text-muted);transition:all var(--transition-fast);background:0 0;padding:.5rem 1rem;font-size:.82rem;font-weight:600}.preset-btn:hover:not(:disabled){border-color:var(--color-text-muted);color:var(--color-text)}.preset-btn.active{background:var(--color-primary);border-color:var(--color-primary);color:#fff}.preset-btn:disabled{opacity:.5;cursor:not-allowed}.timer-settings{flex-wrap:wrap;justify-content:center;gap:1rem;margin-bottom:2rem;animation:.3s fadeIn;display:flex}.timer-setting{text-align:center}.timer-setting label{text-transform:uppercase;letter-spacing:.08em;color:var(--color-text-muted);margin-bottom:.5rem;font-size:.7rem;font-weight:600;display:block}.setting-control{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);align-items:center;gap:.5rem;padding:.35rem .5rem;display:flex}.setting-control button{border:1px solid var(--color-border);border-radius:var(--radius-sm);width:32px;height:32px;color:var(--color-text);transition:all var(--transition-fast);background:0 0;justify-content:center;align-items:center;font-size:1.1rem;font-weight:700;display:flex}.setting-control button:hover{border-color:var(--color-primary);color:var(--color-primary)}.setting-value{font-family:var(--font-display);text-align:center;min-width:48px;font-size:1.1rem;font-weight:800}.timer-display{text-align:center;width:100%;margin:1rem 0 2rem}.timer-phase-label{font-family:var(--font-display);letter-spacing:.2em;margin-bottom:.5rem;font-size:1.5rem;font-weight:800;transition:color .3s}.timer-countdown{font-family:var(--font-display);letter-spacing:.02em;font-size:clamp(5rem,20vw,10rem);font-weight:800;line-height:1;transition:color .3s}.timer-page:fullscreen .timer-countdown{font-size:clamp(8rem,30vw,16rem)}.timer-round-info{color:var(--color-text-muted);margin-top:.75rem;font-size:1rem;font-weight:500}.timer-progress-bar{background:var(--color-surface);border-radius:var(--radius-full);width:100%;max-width:400px;height:6px;margin:1rem auto 0;overflow:hidden}.timer-progress-fill{border-radius:var(--radius-full);height:100%;transition:width 1s linear,background .3s}.timer-controls{justify-content:center;align-items:center;gap:1rem;display:flex}.timer-btn{border:1px solid var(--color-border);color:var(--color-text-muted);transition:all var(--transition-fast);background:0 0;border-radius:50%;justify-content:center;align-items:center;display:flex}.timer-btn--start,.timer-btn--pause{border-color:var(--color-primary);width:72px;height:72px;color:var(--color-primary)}.timer-btn--start:hover{background:var(--color-primary);color:#fff}.timer-btn--pause:hover{background:#ff333326}.timer-btn--reset,.timer-btn--mute,.timer-btn--fullscreen{width:48px;height:48px}.timer-btn--reset:hover,.timer-btn--mute:hover,.timer-btn--fullscreen:hover{color:var(--color-text);border-color:var(--color-text-muted)}@media (max-width:480px){.timer-settings{flex-direction:column;align-items:center}.timer-btn--start,.timer-btn--pause{width:64px;height:64px}}