@layer components{.wk{--wk-row: 2.625rem;--wk-thumb: 2rem}.wk__core{display: grid;gap: var(--space-l);padding: var(--space-l) var(--space-m)}@container (min-width: 48rem){.wk__core{padding: var(--space-xl)}}.wk__head{display: grid;gap: var(--space-s)}@container (min-width: 48rem){.wk__head{grid-template-columns: auto minmax(0,1fr);align-items: end;column-gap: var(--space-xl)}}.wk__readout{display: flex;align-items: baseline;gap: 0.75rem;max-inline-size: none}.wk__readout .t-label{color: var(--c-lilac)}.wk__time{font-family: var(--font-display);font-size: var(--step-6);line-height: 0.9;letter-spacing: -0.03em;color: var(--c-bone);font-variant-numeric: tabular-nums lining-nums;display: inline-block;white-space: nowrap}.wk__odo{display: inline-flex;align-items: flex-start;line-height: 1}.wk__reel{display: inline-block;block-size: 1em;overflow: hidden}.wk__reel > span{display: block;will-change: transform}.wk__reel > span > span{display: block;block-size: 1em}.wk__colon{padding-inline: 0.02em}.wk__zone{display: grid;gap: 0.375rem;min-inline-size: 0}.wk__zone-name{font-family: var(--font-ui);font-weight: var(--weight-medium);font-size: var(--step-1);letter-spacing: -0.02em;color: var(--c-bone);max-inline-size: none}.wk__zone-line{color: var(--c-bone-2);font-size: var(--step--1);line-height: 1.45;min-block-size: 2.9em;max-inline-size: calc(52 * var(--ch-body));text-wrap: pretty}.wk__slider{position: relative;block-size: 4.75rem;contain: size layout}.wk__range{position: relative;z-index: 1;display: block;inline-size: 100%;block-size: 3rem;margin: 0;opacity: 0;cursor: grab;touch-action: pan-y;-webkit-appearance: none;appearance: none}.wk__range:active{cursor: grabbing}.wk__range::-webkit-slider-thumb{-webkit-appearance: none;inline-size: var(--wk-thumb);block-size: 3rem}.wk__range::-moz-range-thumb{inline-size: var(--wk-thumb);block-size: 3rem;border: 0}.wk__track{position: absolute;inset-inline: 0;inset-block-start: 0;block-size: 3rem;pointer-events: none}.wk__bands{position: absolute;inset-inline: calc(var(--wk-thumb) / 2);inset-block-start: calc(1.5rem - 0.25rem);block-size: 0.5rem;display: grid;grid-template-columns: repeat(3,1fr);gap: 0.1875rem}.wk__bands span{border-radius: var(--radius-pill);background: var(--c-raised-3);box-shadow: inset 0 0 0 1px var(--edge);transition: background-color var(--dur-state) var(--ease-out-soft)}.wk[data-zone="early"] .wk__bands span:nth-child(1),.wk[data-zone="normal"] .wk__bands span:nth-child(2),.wk[data-zone="late"] .wk__bands span:nth-child(3){background: var(--c-violet);box-shadow: none}.wk__thumb{position: absolute;inset-block-start: calc(1.5rem - var(--wk-thumb) / 2);inset-inline-start: 0;inline-size: var(--wk-thumb);block-size: var(--wk-thumb);border-radius: 50%;background: var(--c-bone);box-shadow: 0 0 0 0.3125rem color-mix(in oklch,var(--c-violet) 60%,transparent),var(--shadow-lift);will-change: transform}.wk:not(.is-ready) .wk__thumb{inset-inline-start: calc(33.33% - var(--wk-thumb) / 3)}.wk__thumb::after{content: "";position: absolute;inset: 0.6875rem;border-radius: 50%;background: var(--c-violet)}.wk__range:focus-visible + .wk__track .wk__thumb{outline: 2px solid var(--c-lilac);outline-offset: 0.5rem}.wk__range:active + .wk__track .wk__thumb{box-shadow: 0 0 0 0.5rem color-mix(in oklch,var(--c-violet) 60%,transparent),var(--shadow-lift)}.wk__ticks{position: absolute;inset-inline: calc(var(--wk-thumb) / 2);inset-block-end: 0;block-size: 1.25rem;margin: 0;padding: 0;list-style: none}.wk__ticks li{position: absolute;inset-inline-start: calc(var(--p) * 100%);translate: -50% 0;font-family: var(--font-mono);font-size: var(--step--2);letter-spacing: 0.04em;color: var(--c-bone-2);font-variant-numeric: tabular-nums}.wk__ticks li:first-child{translate: calc(var(--wk-thumb) / -2) 0}.wk__ticks li:last-child{translate: calc(-100% + var(--wk-thumb) / 2) 0}.wk__list{position: relative;block-size: calc(var(--rows) * var(--wk-row));margin: 0;padding: 0;list-style: none;overflow: hidden;border-radius: var(--radius-m);background: var(--c-sunken);box-shadow: inset 0 0 0 1px var(--edge-faint);contain: layout paint}.wk__row{position: absolute;inset-inline: 0.5rem;inset-block-start: 0.25rem;block-size: calc(var(--wk-row) - 0.25rem);display: grid;grid-template-columns: 3.5rem minmax(0,1fr) 2.75rem;align-items: center;column-gap: 0.625rem;padding-inline: 0.625rem 0.75rem;border-radius: var(--radius-s);background: var(--c-raised-1);opacity: 0;contain: strict}@container (min-width: 40rem){.wk__row{grid-template-columns: 4.25rem minmax(0,12rem) 3.5rem minmax(0,1fr)}}.wk__at{position: relative;font-family: var(--font-mono);font-size: var(--step--1);color: var(--c-lilac);font-variant-numeric: tabular-nums;white-space: nowrap}.wk__row.is-next .wk__at::after{content: "+1";margin-inline-start: 0.1875rem;font-size: 0.625rem;vertical-align: super;color: var(--c-bone-2)}.wk__label{font-family: var(--font-ui);font-weight: var(--weight-medium);font-size: var(--step--1);letter-spacing: -0.01em;color: var(--c-bone);white-space: nowrap;overflow: hidden;text-overflow: ellipsis}.wk__len{display: none;font-family: var(--font-mono);font-size: var(--step--2);color: var(--c-bone-2);font-variant-numeric: tabular-nums;white-space: nowrap}@container (min-width: 40rem){.wk__len{display: block}}.wk__bar{block-size: 0.25rem;border-radius: var(--radius-pill);background: var(--edge-faint);overflow: hidden}.wk__bar span{display: block;block-size: 100%;border-radius: inherit;background: var(--c-violet);transform-origin: 0 50%;transform: scaleX(0)}.wk__row--open{background: transparent;box-shadow: inset 0 0 0 1px var(--edge-faint)}.wk__row--open .wk__label{font-weight: 400;color: var(--c-bone-2)}.wk__row--open .wk__at{color: var(--c-bone-2)}.wk__row--open .wk__bar span{background: var(--c-bone-3)}.wk__row--sleep{background: color-mix(in oklch,var(--c-violet) 16%,var(--c-raised-1))}.wk__row--sleep .wk__bar span{background: var(--c-lilac)}@media (prefers-reduced-motion: no-preference){.wk__row{transition: transform 504ms var(--ease-out),opacity 312ms var(--ease-out-soft)}.wk__bar span{transition: transform 504ms var(--ease-out)}.wk__thumb{transition: box-shadow var(--dur-hover) var(--ease-out-soft)}.wk__reel > span{transition: transform 264ms var(--ease-out)}.wk.is-sweeping .wk__row{transition-duration: 312ms}.wk.is-moving .wk__bar span,.wk.is-moving .wk__reel > span{transition: none}}.wk__foot{display: flex;flex-wrap: wrap;align-items: center;justify-content: space-between;gap: var(--space-s) var(--space-l)}.wk__note{flex: 1 1 18rem;font-size: var(--step--1);line-height: 1.45;color: var(--c-bone-2);max-inline-size: calc(52 * var(--ch-body));text-wrap: pretty}.wk__nojs{font-size: var(--step--1);color: var(--c-bone-2)}.wk-head{margin-block: var(--space-2xl) var(--space-l)}.wk-intro{font-family: var(--font-ui);font-size: var(--step-1);line-height: 1.42;letter-spacing: -0.015em;color: var(--c-bone);max-inline-size: calc(46 * var(--ch-ui));text-wrap: pretty}.wk--compact{--wk-row: 2.375rem;--wk-thumb: 1.75rem;display: grid;gap: var(--space-m);min-inline-size: 0}.wk--compact .wk__head{grid-template-columns: none;gap: var(--space-xs)}.wk--compact .wk__time{font-size: var(--step-5)}.wk--compact .wk__zone-name{font-size: var(--step-0)}.wk--compact .wk__list{-webkit-mask-image: linear-gradient(180deg,#000 68%,transparent);mask-image: linear-gradient(180deg,#000 68%,transparent)}.wk--compact .wk__row{grid-template-columns: 3.5rem minmax(0,1fr) minmax(3.75rem,38%)}.wk--compact .wk__len{display: none}.wk--compact .wk__note{flex-basis: 100%}}