.timer__stage{min-inline-size:0}.timer__body{align-content:space-between;gap:var(--space-6);flex:1}.timer__dial{justify-items:center;gap:var(--space-3);padding-block:var(--space-6) var(--space-2);display:grid;container-type:inline-size}.timer__face{color:var(--ink);font-family:"Literata Variable", var(--font-display);font-variant-numeric:tabular-nums lining-nums;letter-spacing:-.03em;white-space:nowrap;transition:color var(--duration) var(--ease-out);unicode-bidi:isolate;font-size:clamp(3.5rem,25cqi,10rem);font-weight:500;line-height:1}.timer[data-long=true] .timer__face{font-size:clamp(2.75rem,18cqi,7.5rem)}.timer[data-status=running] .timer__face,.timer[data-status=done] .timer__face{color:var(--accent)}.timer[data-status=paused] .timer__face{color:var(--ink-3)}.timer[data-status=done] .timer__face{animation:timer-done 1.4s var(--ease-in-out) infinite}.timer__track{background:var(--sheet-rule);border-radius:3px;block-size:6px;inline-size:min(100%,24rem);position:relative;overflow:hidden}.timer__track:after{content:"";background:repeating-linear-gradient(90deg, transparent 0 calc(8.33333% - 2px), var(--sheet) calc(8.33333% - 2px) 8.33333%);position:absolute;inset:0}.timer__fill{background:var(--accent);transform-origin:0;block-size:100%;display:block}.timer[data-status=paused] .timer__fill{background:var(--ink-3)}.timer__meta{min-block-size:1.55em;color:var(--ink-2);font-size:var(--text-sm)}.timer__presets{gap:var(--space-2);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}@media (min-width:40rem){.timer__presets{grid-template-columns:repeat(6,minmax(0,1fr))}}.timer__presets-title{color:var(--ink-2);font-size:var(--text-sm);grid-column:1/-1;font-weight:600}.timer__preset{padding-inline:var(--space-2);font-family:"Literata Variable", var(--font-sans);font-weight:600}.timer__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){.timer__keys{display:none}}.timer__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}.timer__fullscreen{margin-inline-end:auto}.timer__primary{min-inline-size:8.5rem}.timer__fields{gap:var(--space-2);border:0;min-inline-size:0;margin:0;padding:0;display:grid}.timer__inputs{gap:var(--space-2);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.timer__field{gap:var(--space-1);justify-items:center}.timer__number{min-block-size:3rem;font-family:"Literata Variable", var(--font-sans);font-size:var(--text-lg);text-align:center;font-weight:600}.timer__unit{color:var(--ink-2);font-size:var(--text-sm)}.timer__options{gap:var(--space-3);display:grid}.timer__settings .sheet__body{flex:1;align-content:start}.timer__stage:fullscreen{padding:var(--space-8);background:var(--paper);box-shadow:none;border:0;border-radius:0;justify-content:center}:is(.timer__stage:fullscreen .timer__label,.timer__stage:fullscreen .timer__presets,.timer__stage:fullscreen .timer__keys){display:none}.timer__stage:fullscreen .timer__body{flex:0 auto}.timer__stage:fullscreen .timer__face{font-size:min(26cqi,52vh)}.timer__stage:fullscreen .sheet__bar{border:0;justify-content:center}.timer__stage:fullscreen .timer__fullscreen{margin-inline-end:0}.timer[data-long=true] .timer__stage:fullscreen .timer__face{font-size:min(18cqi,44vh)}.timer__stage:fullscreen .timer__track{block-size:8px;inline-size:min(80%,40rem)}.timer__stage:fullscreen .timer__meta{font-size:var(--text-lg)}[dir=rtl] .timer__fill{transform-origin:100%}@keyframes timer-done{50%{opacity:.35}}
