.moment{position:relative;margin-left:auto;display:inline-flex;align-items:center;padding:2px;border:1px solid var(--line);border-radius:999px;background:color-mix(in oklab,var(--paper) 70%,transparent);transition:border-color .2s var(--ease-out)}.moment[hidden]{display:none}.moment:hover,.moment:focus-within,.moment[data-open]{border-color:var(--moss)}.moment-button,.moment-wheel{display:inline-flex;align-items:center;gap:4px;box-sizing:border-box;padding:6px;border:0;background:transparent;overflow:hidden;transition:width .26s var(--ease-out) .12s,opacity .2s var(--ease-out) .12s,padding .26s var(--ease-out) .12s}.moment-button{border-radius:999px;cursor:pointer;width:86px}.moment-wheel{width:0;opacity:0;padding-inline:0}.moment:hover .moment-button,.moment:hover .moment-wheel,.moment:focus-within .moment-button,.moment:focus-within .moment-wheel,.moment[data-open] .moment-button,.moment[data-open] .moment-wheel{transition-delay:0s}.moment:hover .moment-wheel,.moment:focus-within .moment-wheel,.moment[data-open] .moment-wheel{width:164px;opacity:1;padding-inline:6px}.moment:hover .moment-button,.moment:focus-within .moment-button,.moment[data-open] .moment-button{width:0;opacity:0;padding-inline:0}.moment-wheel button{padding:0;border:0;border-radius:999px;background:transparent;cursor:pointer;opacity:.7;transition:opacity .16s var(--ease-out),transform .16s var(--ease-out)}.moment-wheel button:hover,.moment-wheel button:focus-visible{opacity:1;transform:scale(1.12);outline:none}.moment-wheel button[aria-checked=true]{opacity:1;transform:none}.moment-wheel button[aria-checked=true] .moment-dot{box-shadow:0 0 0 2px var(--paper),0 0 0 4px var(--amber)}.moment[data-auto] .moment-wheel button[aria-checked=true] .moment-dot{box-shadow:0 0 0 2px var(--paper),0 0 0 3.5px var(--ink-faint)}.moment-label{position:absolute;top:50%;right:calc(100% + .6rem);transform:translateY(-50%);font-size:.8125rem;color:var(--ink-soft);white-space:nowrap;pointer-events:none}.moment-label:empty{display:none}.moment-dot{display:grid;place-items:center;flex:none;width:22px;height:22px;border-radius:50% 45% 55% 50%}.moment-dot svg{display:block;width:14px;height:14px;overflow:visible;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;transform:translate(-.5px,-.5px)}.moment-dot{color:#f8f5ea}.moment-dot[data-day=morning]{background:linear-gradient(135deg,#fac092,#d8d2c7,#b0e0f8)}.moment-dot[data-day=noon]{background:linear-gradient(135deg,#b7def3,#cde7c7)}.moment-dot[data-day=golden]{background:linear-gradient(135deg,#f2ad73,#cf8b74)}.moment-dot[data-day=twilight]{background:linear-gradient(135deg,#a693c9,#5f5c8f)}.moment-dot[data-day=dusk]{background:linear-gradient(135deg,#494677,#1e2333)}.moment-dot[data-day=night]{background:linear-gradient(135deg,#161f32,#05070c)}@media(prefers-reduced-motion:reduce){.moment-button,.moment-wheel,.moment-wheel button{transition:none}}