.pomodoro-page{min-height:calc(100vh - 140px);padding:38px 18px 80px}.pomodoro-hero{max-width:640px;margin:auto;text-align:center}.pomodoro-hero h1{margin:0 0 20px;font-size:clamp(30px,4vw,42px);letter-spacing:-1.6px}.session-presets{display:grid;gap:8px;justify-content:center}.session-presets>div{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap}.session-presets span{width:44px;color:var(--muted);font-size:12px;text-align:right}.session-presets button{padding:7px 13px;border:1px solid var(--line);border-radius:7px;background:var(--surface-2);color:var(--muted);font-size:12px;cursor:pointer}.session-presets button:hover,.session-presets button.selected{border-color:var(--accent);background:var(--accent);color:var(--accent-ink)}.pomodoro-status{margin:25px 0 0;color:var(--accent-text);font-size:13px;font-weight:800;letter-spacing:1px;text-transform:uppercase}.pomodoro-display{display:block;margin:22px 0 44px;font:500 clamp(84px,15vw,138px) 'DM Mono',monospace;letter-spacing:-.08em;font-variant-numeric:tabular-nums}.pomodoro-controls{display:flex;justify-content:center;gap:12px}.pomodoro-button{min-width:125px;padding:14px 20px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--text);font-size:14px;font-weight:800;letter-spacing:.5px;cursor:pointer}.pomodoro-button.primary{border-color:var(--accent);background:var(--accent);color:var(--accent-ink);box-shadow:0 8px 22px color-mix(in srgb,var(--accent) 18%,transparent)}.pomodoro-note{max-width:480px;margin:14px auto 52px;color:var(--muted);font-size:12px;line-height:1.6}.pomodoro-task{display:flex;max-width:410px;margin:auto;gap:8px}.pomodoro-task input{flex:1;min-width:0;padding:13px 15px;border:1px solid var(--line);border-radius:9px;background:var(--surface);color:var(--text);font:14px Manrope,Arial,sans-serif}.pomodoro-task button{padding:0 20px;border:1px solid var(--line);border-radius:9px;background:var(--surface-2);color:var(--text);font-size:12px;font-weight:800;text-transform:uppercase;cursor:pointer}.pomodoro-task-list{max-width:410px;margin:12px auto;padding:0;list-style:none;text-align:left}.pomodoro-task-list li{display:flex;justify-content:space-between;padding:10px 13px;border:1px solid var(--line);border-radius:8px;background:var(--surface);font-size:12px}.pomodoro-task-list button{border:0;background:transparent;color:var(--muted);cursor:pointer}@media(max-width:620px){.pomodoro-page{padding-top:30px}.pomodoro-hero h1{font-size:29px}.pomodoro-display{margin:28px 0 35px;font-size:23vw}.session-presets>div{gap:6px}.session-presets button{padding:7px 10px}.pomodoro-note{margin-bottom:38px}.pomodoro-button{min-width:108px;padding:12px 16px}}
.pomodoro-clock-card{max-width:760px;margin:24px auto 0;padding:18px 22px 25px;border:1px solid var(--line);border-radius:24px;background:var(--card);box-shadow:var(--shadow)}.pomodoro-clock-card .pomodoro-status{margin:0;text-align:left}.pomodoro-clock-card .pomodoro-display{margin:36px 0 34px;padding:0}.pomodoro-clock-card+.pomodoro-note{margin-top:14px}@media(max-width:620px){.pomodoro-clock-card{padding:16px 12px 18px;border-radius:19px}.pomodoro-clock-card .pomodoro-display{margin:30px 0 28px}}
.pomodoro-clock-card .pomodoro-display{font-size:clamp(72px,12vw,116px);letter-spacing:-.07em}@media(max-width:620px){.pomodoro-clock-card .pomodoro-display{font-size:16vw;letter-spacing:-.06em}}
.pomodoro-hero{max-width:760px}.pomodoro-hero h1{width:100%;line-height:1.15;text-align:center}
.pomodoro-hero h1{margin-bottom:28px}
.pomodoro-controls .pomodoro-button{min-width:145px;padding:15px 18px;border-radius:12px}.pomodoro-controls .pomodoro-button.primary{border-color:var(--accent);background:var(--accent);color:var(--accent-ink);box-shadow:0 8px 22px color-mix(in srgb,var(--accent) 16%,transparent)}
@media(max-width:620px){.pomodoro-controls .pomodoro-button{min-width:0;flex:1;padding:12px 16px}}
.pomodoro-controls{flex-direction:row-reverse}.pomodoro-controls .pomodoro-button:not(.primary){background:var(--surface-2);transition:transform .18s,border-color .18s}.pomodoro-controls .pomodoro-button:not(.primary):hover{transform:translateY(-2px);border-color:var(--accent)}