.moment{border:1px solid var(--line);background:color-mix(in oklab, var(--paper) 70%, transparent);transition:border-color .2s var(--ease-out);border-radius:999px;align-items:center;margin-left:auto;padding:2px;display:inline-flex;position:relative}.moment[hidden]{display:none}.moment:hover,.moment:focus-within,.moment[data-open]{border-color:var(--moss)}.moment-button,.moment-wheel{box-sizing:border-box;transition:width .26s var(--ease-out) .12s, opacity .2s var(--ease-out) .12s, padding .26s var(--ease-out) .12s;background:0 0;border:0;align-items:center;gap:4px;padding:6px;display:inline-flex;overflow:hidden}.moment-button{cursor:pointer;border-radius:999px;width:86px}.moment-wheel{opacity:0;width: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{opacity:1;width:164px;padding-inline:6px}.moment:hover .moment-button,.moment:focus-within .moment-button,.moment[data-open] .moment-button{opacity:0;width:0;padding-inline:0}.moment-wheel button{cursor:pointer;opacity:.7;transition:opacity .16s var(--ease-out), transform .16s var(--ease-out);background:0 0;border:0;border-radius:999px;padding:0}.moment-wheel button:hover,.moment-wheel button:focus-visible{opacity:1;outline:none;transform:scale(1.12)}.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{color:var(--ink-soft);white-space:nowrap;pointer-events:none;font-size:.8125rem;position:absolute;top:50%;right:calc(100% + .6rem);transform:translateY(-50%)}.moment-label:empty{display:none}@media (width<=720px){.moment:hover .moment-button,.moment:focus-within .moment-button,.moment[data-open] .moment-button{opacity:1;width:86px;padding-inline:6px}.moment-wheel{z-index:61;background:var(--card);border-radius:999px;position:absolute;top:calc(100% + 8px);right:-1px}.moment:hover .moment-wheel,.moment:focus-within .moment-wheel,.moment[data-open] .moment-wheel{border:1px solid var(--moss);width:166px;box-shadow:var(--shadow-soft)}.moment-label{z-index:61;background:var(--card);box-shadow:var(--shadow-soft);color:var(--ink);border-radius:999px;padding:3px 10px;top:calc(100% + 50px);right:-1px;transform:none}.moment:hover:after,.moment[data-open]:after{content:"";height:10px;position:absolute;inset:100% 0 auto}}.moment-dot{border-radius:50% 45% 55% 50%;flex:none;place-items:center;width:22px;height:22px;display:grid}.moment-dot svg{fill:none;stroke:currentColor;stroke-width:1.4px;stroke-linecap:round;width:14px;height:14px;display:block;overflow:visible;transform:translate(-.5px,-.5px)}.moment-dot{color:oklch(97% .015 95)}.moment-dot[data-day=morning]{background:linear-gradient(135deg,oklch(74% .17 40),oklch(78% .12 240))}.moment-dot[data-day=noon]{background:linear-gradient(135deg,oklch(88% .05 230),oklch(90% .05 140))}.moment-dot[data-day=golden]{background:linear-gradient(135deg,oklch(80% .11 60),oklch(70% .09 40))}.moment-dot[data-day=twilight]{background:linear-gradient(135deg,oklch(70% .08 300),oklch(50% .08 285))}.moment-dot[data-day=dusk]{background:linear-gradient(135deg,oklch(42% .08 285),oklch(26% .03 270))}.moment-dot[data-day=night]{background:linear-gradient(135deg,oklch(24% .04 265),oklch(13% .012 260))}@media (prefers-reduced-motion:reduce){.moment-button,.moment-wheel,.moment-wheel button{transition:none}}