.time-picker{padding:16px;border-radius:18px;isolation:isolate;overscroll-behavior:contain;scrollbar-width:thin;background:#fff;color:#111;-webkit-tap-highlight-color:transparent}
.time-picker-head{min-height:32px;font-size:14px;letter-spacing:-.1px}
.time-picker-head button{display:grid;place-items:center;border-radius:50%;width:32px;height:32px;min-width:32px;line-height:1;color:#444}
.time-picker-head button:hover{background:#f0f0f0}
.control-time-trigger{font-variant-numeric:tabular-nums;min-height:44px}
.control-time-icon{color:#777;font-size:21px;line-height:1}
.time-preview{display:block;text-align:center;font-size:30px;font-weight:600;font-variant-numeric:tabular-nums;line-height:1.4;margin:6px 0 12px}
.time-picker .time-period{padding:4px;gap:4px;background:#f1f1f1;border-radius:12px;margin:0 0 16px;position:relative;top:auto}
.time-picker .time-period button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border:0;border-radius:9px;background:transparent;min-height:50px;padding:7px 5px;touch-action:manipulation;color:#555}
.time-period strong{font-size:15px;font-weight:700;line-height:1.2}.time-period span{font-size:11px;line-height:1.3;font-weight:400}
.time-picker .time-period button[aria-pressed=true]{background:#111;color:#fff;box-shadow:0 1px 3px #0002}
.time-picker button:focus-visible,.time-wheel:focus-visible{outline:2px solid #111;outline-offset:2px}
.time-wheels{display:grid;grid-template-columns:minmax(0,1fr) 20px minmax(0,1fr);gap:8px;align-items:end;margin:0 14px}
.time-wheel-label{display:block;text-align:center;font-size:12px;color:#777;margin-bottom:7px;line-height:18px}
.time-wheel-frame{position:relative;height:144px;border-radius:12px;overflow:hidden;background:#fff}
.time-wheel-frame:before{content:"";position:absolute;inset:48px 0 auto;height:48px;background:#f3f3f3;border-radius:9px;pointer-events:none}
.time-wheel-frame:after{content:"";position:absolute;inset:0;background:linear-gradient(#fff 0%,#fff0 33%,#fff0 67%,#fff 100%);pointer-events:none}
.time-wheel{position:relative;height:144px;padding-block:48px;overflow-y:auto;overscroll-behavior-y:contain;scroll-snap-type:y mandatory;scrollbar-width:none;touch-action:pan-y;outline-offset:-3px!important;font-variant-numeric:tabular-nums}
.time-wheel::-webkit-scrollbar{display:none}
.time-wheel button{display:block;width:100%;height:48px;min-height:48px;border:0;border-radius:0;padding:0;margin:0;scroll-snap-align:center;scroll-snap-stop:normal;background:transparent;color:#888;font-family:inherit;font-size:27px;line-height:48px;font-weight:400;touch-action:pan-y}
.time-wheel button.is-selected{color:#111;font-weight:650}.time-wheel button:hover{color:#111}
.time-wheel-colon{display:grid;place-items:center;height:144px;font-size:27px;color:#444;line-height:1}
.time-minute-shortcuts{display:flex;justify-content:center;gap:8px;margin-top:12px}
.time-minute-shortcuts button{min-width:64px;min-height:36px;padding:5px 14px;border:1px solid #e4e4e4;background:#fff;color:#555;border-radius:999px;font-size:13px;font-variant-numeric:tabular-nums;touch-action:manipulation}
.time-minute-shortcuts button[aria-pressed=true]{background:#f1f1f1;color:#111;border-color:#aaa}
.time-picker .control-footer{align-items:center;gap:10px;padding-top:12px;margin-top:12px}
.time-picker .control-footer button{min-height:44px;border:0;border-radius:10px;padding:9px 12px;font-size:13px;touch-action:manipulation}
.time-picker .control-footer [data-clock-clear]{color:#666;font-weight:400;background:transparent}
.time-picker .control-footer [data-clock-set]{background:#111;color:#fff;flex:1;font-weight:600;min-width:110px}
.time-picker .control-footer [data-clock-set]:disabled{opacity:.4;cursor:default}
.time-range-error{text-align:center;font-size:12px;margin:9px 0 0}
@media(max-width:600px){.control-popover.time-picker{padding:16px;max-width:420px;margin-inline:auto;right:12px}.time-picker .time-period{top:auto}.time-wheel button{font-size:29px}.time-period span{font-size:12px}}
@media(prefers-reduced-motion:no-preference){.time-picker:not([hidden]){animation:time-picker-enter .14s ease-out}@keyframes time-picker-enter{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}}