.pomo__stage{min-inline-size:0}.pomo__body{align-content:center;justify-items:center;gap:var(--space-5);text-align:center;flex:1}.pomo__dial{aspect-ratio:1;inline-size:min(100%,19rem);position:relative;container-type:inline-size}@media (min-width:64rem){.pomo__dial{inline-size:min(100%,26rem)}}.pomo__dial:before{content:"";background:var(--paper);transition:background-color var(--duration-slow) var(--ease-out);border-radius:50%;position:absolute;inset:5%}.pomo__ring{block-size:100%;inline-size:100%;position:absolute;inset:0;overflow:visible}.pomo__ring-track,.pomo__ring-fill{fill:none;stroke-width:6px}.pomo__ring-track{stroke:var(--sheet-rule)}.pomo__ring-fill{stroke:var(--accent);stroke-dasharray:339.29 339.29;stroke-linecap:round;transition:opacity var(--duration) var(--ease-out)}.pomo__knob{transform-box:view-box;transform-origin:50%}.pomo__knob circle{fill:var(--accent);stroke:var(--sheet);stroke-width:2.5px}.pomo__center{align-content:center;justify-items:center;gap:var(--space-1);padding:16%;display:grid;position:absolute;inset:0}.pomo__phase{max-inline-size:100%;color:var(--ink-2);font-family:var(--font-display);font-size:clamp(var(--text-base), 7cqi, var(--text-xl));overflow-wrap:anywhere;font-weight:500;line-height:1.15}.pomo__face{font-family:"Literata Variable", var(--font-display);font-variant-numeric:tabular-nums lining-nums;letter-spacing:-.03em;white-space:nowrap;transition:opacity var(--duration) var(--ease-out);unicode-bidi:isolate;font-size:clamp(2.5rem,21cqi,5rem);font-weight:500;line-height:1}.pomo[data-long=true] .pomo__face{font-size:clamp(2rem,16cqi,3.75rem)}.pomo__round{color:var(--ink-2);font-size:clamp(var(--text-sm), 4.6cqi, var(--text-md));line-height:1.3}.pomo[data-phase=short] .pomo__dial:before,.pomo[data-phase=long] .pomo__dial:before{background:var(--accent-soft)}.pomo[data-phase=short] .pomo__ring-track,.pomo[data-phase=long] .pomo__ring-track{stroke:color-mix(in srgb, var(--accent) 18%, var(--sheet))}.pomo[data-phase=short] .pomo__face,.pomo[data-phase=long] .pomo__face{color:var(--accent)}.pomo[data-phase=short] .pomo__phase,.pomo[data-phase=long] .pomo__phase,.pomo[data-phase=short] .pomo__round,.pomo[data-phase=long] .pomo__round{color:var(--ink)}.pomo[data-status=paused] .pomo__face,.pomo[data-status=paused] .pomo__ring-fill{opacity:.45}.pomo__dots{justify-content:center;gap:var(--space-2);flex-wrap:wrap;margin:0;padding:0;list-style:none;display:flex}.pomo__dot{border:1.5px solid var(--line-strong);block-size:.75rem;inline-size:.75rem;transition:background-color var(--duration) var(--ease-out), border-color var(--duration) var(--ease-out);border-radius:50%}.pomo__dot--done{border-color:var(--accent);background:var(--accent)}.pomo__dot--current{border-color:var(--accent);background:var(--accent-soft)}.pomo[data-status=running] .pomo__dot--current{animation:2.4s ease-in-out infinite pomo-breathe}.pomo__task{inline-size:min(100%,26rem)}.pomo__task-input{border-color:transparent transparent var(--line-strong);font-size:var(--text-md);text-align:center;background:0 0;border-style:solid solid dashed;border-radius:0}.pomo__task-input:hover{border-block-end-color:var(--ink-3)}.pomo__task-input:focus{border-block-end-style:solid}.pomo__keys{justify-content:center;gap:var(--space-2) var(--space-5);color:var(--ink-3);font-size:var(--text-sm);flex-wrap:wrap;display:flex}@media (hover:none) and (pointer:coarse){.pomo__keys{display:none}}.pomo__key{min-inline-size:1.5rem;padding:0 var(--space-2);border:1px solid var(--line-strong);border-radius:var(--radius-sm);background:var(--paper);box-shadow:inset 0 -1px 0 var(--line-strong);color:var(--ink-2);font-family:inherit;font-size:var(--text-xs);text-align:center;margin-inline-end:var(--space-1);font-weight:600;line-height:1.6;display:inline-block}.pomo__fullscreen{margin-inline-end:auto}.pomo__primary{min-inline-size:8.5rem}.pomo__settings-body{flex:1;align-content:start}.pomo__presets{gap:var(--space-2);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.pomo__presets-title{color:var(--ink-2);font-size:var(--text-sm);grid-column:1/-1;font-weight:600}.pomo__preset{padding-inline:var(--space-2);font-family:"Literata Variable", var(--font-sans);font-weight:600}.pomo__preset[aria-pressed=true]{border-color:var(--accent);background:var(--accent-soft);color:var(--ink)}.pomo__fields,.pomo__options{border:0;min-inline-size:0;margin:0;padding:0;display:grid}.pomo__row{justify-content:space-between;align-items:center;gap:var(--space-3);padding-block:var(--space-2);border-block-end:1px dotted var(--line-strong);display:flex}.pomo__row:first-of-type{padding-block-start:0}.pomo__row-label{min-inline-size:0;font-size:.875rem;font-weight:600}.pomo__stepper{align-items:center;gap:var(--space-1);flex:none;display:flex}.pomo__step{min-block-size:2.25rem;inline-size:2.25rem}.pomo__step .icon{block-size:1rem;inline-size:1rem}.pomo__value-box{display:flex;position:relative}.pomo__value{min-block-size:2.25rem;inline-size:4.75rem;padding-inline:var(--space-1);font-family:"Literata Variable", var(--font-sans);text-align:center;font-weight:600}.pomo__value:has(+.pomo__unit){text-align:end;inline-size:5.5rem;padding-inline-end:2.5rem}.pomo__unit{color:var(--ink-3);font-size:var(--text-sm);pointer-events:none;align-items:center;display:flex;position:absolute;inset-block:0;inset-inline-end:var(--space-2)}.pomo__error,.pomo__fields .field__hint{margin-block-start:var(--space-2)}.pomo__options{gap:var(--space-3)}.pomo__options legend{margin-block-end:var(--space-3);padding:0}.pomo__today-head{justify-content:space-between;align-items:center;gap:var(--space-3);margin-block-end:var(--space-1);display:flex}.pomo__clear{color:var(--ink-3)}.pomo__clear .icon{block-size:1rem;inline-size:1rem}.pomo__figures.figures{padding:0}.pomo__stage:fullscreen{padding:var(--space-6);background:var(--paper);box-shadow:none;border:0;border-radius:0;justify-content:center}:is(.pomo__stage:fullscreen .pomo__label,.pomo__stage:fullscreen .pomo__keys){display:none}.pomo__stage:fullscreen .pomo__body{flex:auto}.pomo__stage:fullscreen .pomo__dial{inline-size:min(100%,68vh,40rem)}.pomo__stage:fullscreen .sheet__bar{border:0;justify-content:center}.pomo__stage:fullscreen .pomo__fullscreen{margin-inline-end:0}@keyframes pomo-breathe{50%{transform:scale(1.3)}}
