.stopwatch{display:grid;gap:var(--space-4)}.stopwatch__screen{container:stopwatch / inline-size;position:relative;display:grid;gap:var(--space-4);justify-items:center}.stopwatch__paper{margin:0;color:var(--ink-muted);font-size:var(--step--1)}.stopwatch__screen:focus{outline:none}.stopwatch__clock{--m:4;--f:1.8;--h:clamp(4.75rem,26cqi,11rem);display:grid;grid-auto-flow:column;place-content:center;align-items:baseline;inline-size:100%;block-size:var(--h);margin:0;color:var(--ink);font:var(--display-weight) min(calc(94cqi / ((var(--m) + var(--f)) * 0.62)),calc(var(--h) * 0.9)) / 1 var(--font-mono);font-variant-numeric:tabular-nums;letter-spacing:-0.02em;white-space:nowrap}.stopwatch__clock[data-main="5"]{--m:5}.stopwatch__clock[data-main="7"]{--m:7}.stopwatch__clock[data-main="8"]{--m:8}.stopwatch__clock[data-frac="0"]{--f:0}.stopwatch__clock[data-frac="2"]{--f:1.2}.stopwatch__frac{color:var(--ink-muted);font-size:0.6em}.stopwatch__name{overflow:hidden;inline-size:100%;margin:0 0 calc(var(--space-3) * -1);color:var(--ink-muted);font-size:var(--step--1);font-weight:700;line-height:1.2;text-align:center;text-overflow:ellipsis;white-space:nowrap}.stopwatch__bar,.stopwatch__laps{display:grid;gap:var(--space-3);inline-size:100%;max-inline-size:36rem}.stopwatch__go{inline-size:100%}.stopwatch__row{display:flex;flex-wrap:wrap;gap:var(--space-3);align-items:center;min-block-size:3.5rem}.stopwatch__lap{flex:1 1 0;min-inline-size:min-content;padding-inline:var(--space-3);white-space:nowrap}.stopwatch__full{margin-inline-start:auto}.stopwatch__status{min-block-size:3.2em;max-inline-size:36rem;text-align:center}.stopwatch__keys{display:none}@media (hover:hover) and (pointer:fine){.stopwatch__keys{display:inline}.stopwatch__touch{display:none}}.stopwatch__undo{margin-block:calc(var(--tap) * -0.3);margin-inline-start:var(--space-2);vertical-align:baseline}.stopwatch__table th,.stopwatch__table td{padding-inline:var(--space-2);white-space:nowrap}.stopwatch__table thead th{white-space:normal;vertical-align:bottom}.stopwatch__table tbody th{font-weight:700}.stopwatch__tag{display:block;color:var(--ink-muted);font-size:0.85em;font-weight:700}.stopwatch__tag[data-tag="fastest"]{color:var(--ok)}.stopwatch__tag[data-tag="slowest"]{color:var(--bad)}.stopwatch__after{margin:0}.stopwatch__means{margin:0;color:var(--ink-muted);font-size:var(--step--1);font-variant-numeric:tabular-nums;text-align:center}@container stopwatch (max-width:22rem){.stopwatch__row{gap:var(--space-2)}.stopwatch__lap{font-size:var(--step-0)}}@container stopwatch (min-width:30rem){.stopwatch__status{min-block-size:1.6em}.stopwatch__table th,.stopwatch__table td{padding-inline:var(--space-3)}.stopwatch__tag{display:inline;margin-inline-start:var(--space-2)}}@media (prefers-reduced-motion:no-preference){.stopwatch__row-new > *{animation:stopwatch-new 0.28s var(--ease)}}@keyframes stopwatch-new{from{background:var(--brand-soft)}}.stopwatch .tool-more{border-top:1px solid var(--line)}.stopwatch .tool-more > summary{display:flex;gap:var(--space-2);align-items:center;justify-content:space-between;min-height:var(--tap);border-radius:var(--radius-sm);color:var(--ink-muted);cursor:pointer;list-style:none}.stopwatch .tool-more > summary::-webkit-details-marker{display:none}.stopwatch .tool-more > summary:hover{color:var(--ink)}.stopwatch .tool-more > summary:focus-visible{outline:3px solid var(--ring);outline-offset:2px}.stopwatch .tool-more[open] .stopwatch__chevron{transform:rotate(180deg)}.stopwatch .tool-more__body{grid-template-columns:minmax(0,1fr);padding-block:var(--space-2) var(--space-3)}.stopwatch__hint{max-inline-size:60ch}.stopwatch[data-full] .stopwatch__screen{container-type:normal;position:fixed;inset:0;z-index:1000;box-sizing:border-box;inline-size:100%;block-size:100%;overflow:auto;align-content:start;padding:max(var(--space-4),6vh) var(--space-4) var(--space-4);background:var(--surface)}.stopwatch[data-full] .stopwatch__clock{block-size:auto;font-size:min(calc(94vw / ((var(--m) + var(--f)) * 0.62)),46vh)}.stopwatch[data-full] .stopwatch__status{min-block-size:auto}.stopwatch[data-full] .stopwatch__lap,.stopwatch[data-full] .stopwatch__go{min-block-size:4rem}@media (max-height:30rem){.stopwatch[data-full] .stopwatch__screen{gap:var(--space-2);padding-block:var(--space-2)}.stopwatch[data-full] .stopwatch__clock{font-size:min(calc(94vw / ((var(--m) + var(--f)) * 0.62)),42vh)}.stopwatch[data-full] .stopwatch__lap,.stopwatch[data-full] .stopwatch__go{min-block-size:3.5rem}}@media (max-height:30rem){.stopwatch__clock{--h:clamp(4.75rem,26cqi,7rem)}}@media print{main:has(.stopwatch:not([data-state="idle"])) > :not(.tool):not(:has(.tool)){display:none !important}.stopwatch__clock{block-size:auto;font-size:var(--step-5)}.stopwatch__tag[data-tag="running"]{display:none}}