.boss-timer { display: grid; min-width: 0; gap: 1rem; padding: 1.25rem; border: 1px solid var(--border); border-radius: var(--radius-md); background: transparent; font-size: 1rem; line-height: 1.75; }
.boss-timer [hidden] { display: none !important; }
.boss-timer__heading { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem; }
.boss-timer__heading h3 { margin: 0; font-size: inherit; }
.boss-timer__eyebrow, .boss-timer__state { color: var(--text-secondary); font-size: .875rem; }
.boss-timer[data-phase="window"] .boss-timer__state { color: var(--link); }
.boss-timer__main { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem 1.5rem; }
.boss-timer__summary { display: flex; flex-wrap: wrap; align-items: baseline; gap: .25rem .75rem; }
.boss-timer__caption { color: var(--text-secondary); }
.boss-timer__countdown { display: inline-flex; align-items: baseline; gap: .25rem; font-size: 1.375rem; line-height: 1.5; font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
.boss-timer__countdown b { font-weight: inherit; }
.boss-timer__countdown small { font-size: .875rem; color: var(--text-secondary); font-weight: 400; }
.boss-timer__countdown:empty { display: none; }
.boss-timer__schedule { display: grid; gap: .5rem; font-variant-numeric: tabular-nums; }
.boss-timer__track { position: relative; height: 6px; margin-block: .375rem; background: var(--control-hover-bg); border-radius: 1rem; }
.boss-timer__window { position: absolute; inset: 0 0 0 var(--timer-window-start); min-width: 2px; border-radius: inherit; background: color-mix(in srgb, var(--lu4-accent) 65%, var(--border)); }
.boss-timer__track::before, .boss-timer__track::after { content: ""; position: absolute; top: -2px; width: 1px; height: 7px; background: var(--text-muted); }
.boss-timer__track::before { left: 0; }
.boss-timer__track::after { right: 0; }
.boss-timer__track i { position: absolute; left: clamp(0px, var(--timer-progress), calc(100% - 2px)); top: -4px; width: 2px; height: 11px; background: var(--text); }
.boss-timer[data-phase="future"] .boss-timer__track i { display: none; }
.boss-timer__range { display: grid; grid-template-columns: auto minmax(0,1fr) minmax(0,1fr); align-items: start; gap: .25rem .75rem; font-size: .875rem; color: var(--text-secondary); }
.boss-timer__range > span { min-width: 0; white-space: nowrap; }
.boss-timer__earliest { text-align: end; }
.boss-timer__latest { text-align: right; }
.boss-timer:not([data-phase="waiting"]) .boss-timer__range, .boss-timer__range:has(> .boss-timer__earliest[hidden]) { grid-template-columns:repeat(2,minmax(0,1fr)); }
.boss-timer__range.boss-timer__range--compact { grid-template-columns:repeat(2,minmax(0,1fr)); }
.boss-timer__range--compact .boss-timer__now { grid-column:1/-1; }
.boss-timer__range--compact .boss-timer__earliest, .boss-timer:not([data-phase="waiting"]) .boss-timer__earliest { text-align:start; }
.boss-timer__range--stacked :is(.boss-timer__earliest,.boss-timer__latest) > :is(span,time) { display:block; }
.boss-timer__range--stacked time { white-space:normal; }
.boss-timer__history { display: flex; flex-wrap: wrap; align-items: center; gap: .125rem .5rem; color: var(--text-secondary); font-size: .875rem; }
.boss-timer__history:empty { display: none; }
.boss-timer__record { font-variant-numeric: tabular-nums; }
.boss-timer__editor-actions { display: flex; flex-wrap: wrap; gap: .5rem; }
.boss-timer button, .boss-timer input:not([type="checkbox"]) { min-height: 2.5rem; max-width: 100%; box-sizing: border-box; padding: .375rem .75rem; border: 1px solid var(--control-border); border-radius: var(--radius-sm); background: var(--control-bg); color: var(--text); font: inherit; }
.boss-timer button { cursor: pointer; }
.boss-timer button:hover { background: var(--control-hover-bg); }
.boss-timer button.boss-timer__primary { color: var(--link); border-color: color-mix(in srgb, var(--lu4-accent) 50%, var(--border)); }
.boss-timer__history button { border-color: transparent; background: transparent; padding-inline: .5rem; color: var(--text-secondary); }
.boss-timer__history button[data-timer-action="edit"] { color: var(--link); }
.boss-timer__history button:only-child { padding-inline: 0; }
.boss-timer__editor-actions button[data-timer-action="clear"] { margin-left: auto; color: var(--text-secondary); }
.boss-timer__editor { display: grid; min-width: 0; gap: .75rem; padding-top: 1rem; border-top: 1px solid var(--border); }
.boss-timer__datetime { display: grid; min-width: 0; gap: .25rem; color: var(--text-secondary); font-size: .875rem; }
.boss-timer__editor input:not([type="checkbox"]) { width: 100%; min-width: 0; font-size: 1rem; }
.boss-timer__datetime input { font-variant-numeric: tabular-nums; }
.boss-timer[data-phase="empty"] .boss-timer__editor { grid-template-columns: minmax(0, 1fr) auto; align-items: end; padding: 0; border: 0; }
.boss-timer[data-phase="empty"] .boss-timer__editor-actions { padding-bottom: 0; }
.boss-timer[data-phase="empty"] { background:var(--control-hover-bg); }
.boss-timer[data-phase="empty"] .boss-timer__datetime { color:var(--text); font-weight:500; }
.boss-timer[data-phase="empty"] .boss-timer__datetime input { font-weight:400; }
.boss-timer[data-phase="empty"] .boss-timer__primary { background:var(--selection-bg); }
.boss-timer .boss-timer__error { margin: 0; color: var(--text); }
.boss-timer button:focus-visible, .boss-timer input:focus-visible { outline: 2px solid var(--lu4-accent); outline-offset: 2px; }
.boss-timer--compact { gap: .5rem; margin-block: .375rem; padding: .625rem; font-size: var(--type-label-size); line-height: var(--type-label-line); background: transparent; }
.boss-timer--compact .boss-timer__heading h3 { font-size: inherit; font-weight: 500; }
.boss-timer--compact .boss-timer__main { display: grid; gap: .5rem; }
.boss-timer--compact .boss-timer__summary { gap: .25rem .5rem; }
.boss-timer--compact .boss-timer__countdown { font-size: var(--type-body-size); }
.boss-timer--compact .boss-timer__history { gap: .125rem .375rem; }
@media (pointer: coarse) { .boss-timer button, .boss-timer input:not([type="checkbox"]), .boss-timer .wb-select__option, .boss-timer__editor label.boss-timer__clear { min-height: 2.75rem; } }
.boss-timer--compact :is(button, input:not([type="checkbox"]), .wb-select__trigger) { min-height: var(--lu4-control-small); font-size: inherit; padding: .25rem .5rem; }
.boss-timer--compact .boss-timer__history button:only-child { padding-inline: 0; }
.boss-timer--compact :is(.boss-timer__editor label, .boss-timer__state, .boss-timer__range, .boss-timer__history) { font-size: inherit; }
.boss-timer--compact .boss-timer__editor { gap: .5rem; padding-top: .625rem; }
.boss-timer__input { position:relative; display:flex; min-width:0; }
.boss-timer__input > input { padding-right:2.5rem !important; }
.boss-timer .boss-timer__input > button { position:absolute; inset:0 0 0 auto; width:2.25rem; height:100%; min-height:0; padding:0; border:0; background:transparent; }
.boss-timer__input svg { display:block; width:1rem; height:1rem; fill:none; stroke:currentColor; stroke-width:1.5; }
.boss-timer__picker { grid-column:1/-1; min-width:0; padding:.75rem; border:1px solid var(--border); border-radius:var(--radius-md); background:var(--lu4-bg-elevated); color:var(--text); }
.boss-timer__calendar-head { display:grid; grid-template-columns:2rem minmax(0,1fr) 2rem; align-items:center; gap:.5rem; text-align:center; }
.boss-timer__month { font-size:inherit; font-weight:600; }
.boss-timer .boss-timer__calendar-head > button { padding:0; min-height:2rem; height:2rem; font-size:1.25rem; }
.boss-timer__weekdays,.boss-timer__days { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:2px; }
.boss-timer__weekdays { margin:.5rem 0 .25rem; color:var(--text-muted); text-align:center; font-size:var(--type-label-size); }
.boss-timer .boss-timer__days > button { padding:0; height:2rem; min-height:2rem; border-color:transparent; background:transparent; font:inherit; font-variant-numeric:tabular-nums; }
.boss-timer .boss-timer__days > button:hover:not(:disabled) { background:var(--control-hover-bg); }
.boss-timer .boss-timer__days > button.is-outside { color:var(--text-muted); }
.boss-timer .boss-timer__days > button[aria-current="date"] { border-color:var(--border); }
.boss-timer .boss-timer__days > button[aria-pressed="true"] { background:var(--selection-bg); border-color:var(--selection-border); color:var(--link); }
.boss-timer .boss-timer__picker button:disabled { opacity:var(--lu4-disabled-opacity); cursor:default; }
.boss-timer__picker-footer { display:flex; align-items:center; justify-content:space-between; gap:.75rem; padding-top:.625rem; margin-top:.5rem; border-top:1px solid var(--border); }
.boss-timer__clock-fields { display:flex; align-items:center; gap:.375rem; min-width:0; }
.boss-timer__clock-fields > label { display:block; width:3rem; min-width:0; }
.boss-timer__clock-fields input { text-align:center; font-variant-numeric:tabular-nums; }
.boss-timer__picker-actions { display:flex; flex:none; gap:.5rem; }
.boss-timer__picker-actions > :last-child { margin-left:auto; }
@media (max-width: 359px) { .boss-timer[data-phase="empty"] .boss-timer__editor { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 639px) { .boss-timer:not(.boss-timer--compact) { padding: .875rem; } }