/* ===========================================================================
   reset.css · Room reset (#/reset, #/reset/:bookingId, #/reset/board, Today)
   Rides walk.css (cards, buttons, relay, sheet, pin). Backline tokens only.
   Signature: the 30-minute clock, session end to +30 with the 5/10/30 marks.
   =========================================================================== */

/* --- pinned block at the very top of Today (rides the walk pin in walk.css) --- */
.rs-pin.s-handed { border-color: var(--amberStroke); border-left-color: var(--warn); background: linear-gradient(90deg, var(--warnSoft), var(--surf) 70%); }
.rs-pin.s-handed .wk-pin-kicker { color: var(--warn); }
.rs-pin-name { text-decoration: none; align-self: flex-start; }
.rs-pin-name:hover { text-decoration: underline; text-underline-offset: 4px; }
.rs-pin-name:focus-visible, .rs-pin .wk-btn:focus-visible { outline: 2px solid var(--teal); outline-offset: 2px; }

/* --- the 30-minute clock (signature) ------------------------------------------ */
.rs-clock { --rs: var(--teal); display: flex; flex-direction: column; gap: 6px; margin-top: 8px; }
.rs-clock.tone-ok { --rs: var(--ok); }
.rs-clock.tone-warn { --rs: var(--warn); }
.rs-clock.tone-bad { --rs: var(--bad); }
.rs-clock-track { position: relative; height: 10px; border-radius: 5px; background: var(--surf3); margin: 0 0 18px; }
.rs-clock.compact .rs-clock-track { height: 6px; margin: 2px 0 0; }
.rs-clock-fill { position: absolute; inset: 0; border-radius: inherit; background: var(--rs); transform-origin: left center; transition: transform .4s ease; }
.rs-clock-mark { position: absolute; top: -3px; bottom: -3px; width: 2px; margin-left: -1px; background: var(--line2); }
.rs-clock-mark.m30 { margin-left: -2px; }
.rs-clock-mark.passed { background: var(--ink2); }
.rs-clock-word { position: absolute; top: calc(100% + 4px); transform: translateX(-50%); font: 600 10.5px/1 var(--mono); color: var(--mut); white-space: nowrap; }
.rs-clock-mark.m30 .rs-clock-word { transform: translateX(-100%); }
.rs-clock-pin { position: absolute; top: 50%; width: 14px; height: 14px; margin: -7px 0 0 -7px; border-radius: 50%; border: 2px solid var(--bg); }
.rs-clock.compact .rs-clock-pin { width: 10px; height: 10px; margin: -5px 0 0 -5px; }
.rs-clock-pin.now { background: var(--ink); box-shadow: 0 0 0 2px var(--rs); }
.rs-clock-pin.assign { background: var(--teal); }
.rs-clock-pin.sign { background: var(--ok); }
.rs-clock-text { margin: 0; font-size: 12px; color: var(--ink2); font-variant-numeric: tabular-nums; }
.rs-clock.tone-bad .rs-clock-text { color: #FF6B5E; }
.rs-clock-legend { margin: -2px 0 0; font-size: 11.5px; color: var(--mut); }
.rs-card .rs-clock { margin-top: 6px; }

/* --- checklist extras ----------------------------------------------------------- */
.rs-photo-tag {
  display: inline-block; margin-left: 8px; padding: 2px 8px; border-radius: 999px; vertical-align: 1px;
  font-size: 11px; font-weight: 700; color: var(--warn); border: 1px solid var(--amberStroke); background: var(--warnSoft);
}
.rs-photo-item:not(.is-clear):not(.is-found) { border-color: var(--amberStroke); }
.rs-today-when { font-size: 11px; color: var(--mut); font-weight: 500; }

/* --- board ---------------------------------------------------------------------- */
.rs-sum { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.rs-sum-cell { margin: 0; padding: 10px 12px; border-radius: 12px; background: var(--surf); border: 1px solid var(--line); font-size: 12.5px; color: var(--ink2); }
.rs-sum-cell span { display: block; font-size: 24px; font-weight: 700; color: var(--ink); font-variant-numeric: tabular-nums; }
.rs-sum-cell.ok span { color: var(--ok); }
.rs-sum-cell.bad span { color: #FF6B5E; }
.rs-sum-cell.warn span { color: var(--warn); }
.rs-bday { display: flex; flex-direction: column; gap: 6px; }
.rs-bday-title { margin: 10px 0 0; font-size: 12px; font-weight: 800; letter-spacing: 1.2px; text-transform: uppercase; color: var(--mut); }
.rs-brows { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.rs-brow { --tone: var(--line2); position: relative; background: var(--surf); border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.rs-brow::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--tone); }
.rs-brow.open { border-color: var(--line2); }
.rs-brow-btn {
  width: 100%; display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; align-items: center; gap: 10px;
  min-height: 52px; padding: 8px 12px 8px 16px; background: none; border: 0; color: inherit; text-align: left; cursor: pointer; font: inherit;
}
.rs-brow-btn:focus-visible { outline: 2px solid var(--teal); outline-offset: -2px; border-radius: 12px; }
.rs-brow-when { font-size: 12px; color: var(--mut); font-variant-numeric: tabular-nums; white-space: nowrap; }
.rs-brow-mid { display: flex; flex-direction: column; min-width: 0; }
.rs-brow-room { font-size: 14.5px; font-weight: 700; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rs-brow-mins { font-size: 11.5px; color: var(--mut); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rs-brow-who { font-size: 13px; color: var(--ink2); white-space: nowrap; }
.rs-chip { font-size: 11.5px; font-weight: 700; padding: 4px 9px; border-radius: 999px; border: 1px solid var(--line2); color: var(--ink2); white-space: nowrap; }
.rs-chip.ok { color: var(--ok); border-color: var(--okStroke); background: var(--okSoft); }
.rs-chip.bad { color: #FF6B5E; border-color: var(--redStroke); background: var(--badSoft); }
.rs-chip.warn { color: var(--warn); border-color: var(--amberStroke); background: var(--warnSoft); }
.rs-brow-detail { padding: 4px 14px 10px 16px; border-top: 1px solid var(--line); display: flex; flex-direction: column; }
.rs-table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 12px; background: var(--surf); }
.rs-table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.rs-table th, .rs-table td { padding: 10px 12px; text-align: left; border-bottom: 1px solid var(--line); white-space: nowrap; }
.rs-table thead th { font-size: 11px; font-weight: 800; letter-spacing: 1px; text-transform: uppercase; color: var(--mut); }
.rs-table tbody th { color: var(--ink); font-weight: 600; }
.rs-table td { color: var(--ink2); font-variant-numeric: tabular-nums; }
.rs-table td.bad { color: #FF6B5E; font-weight: 700; }
.rs-table tr:last-child th, .rs-table tr:last-child td { border-bottom: 0; }

@media (max-width: 420px) {
  .rs-brow-btn { grid-template-columns: auto minmax(0, 1fr) auto; }
  .rs-brow-who { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .rs-clock-fill { transition: none; }
}