:root{font:14px/1.4 'Outfit',system-ui,sans-serif;color:#f3ecdc;background:#12150f;--bg:#12150f;--surface:#1b1f16;--surface-2:#252a1e;--fg:#f3ecdc;--muted:#a89f8c;--line:#3a4030;--brass:#e2b340;--brass-ink:#1a1506;--ok:#8fbf6a;--ok-ink:#13200c;--warn:#e0a106;--warn-ink:#1c1402;--bad:#e15b45;--bad-ink:#2a0e0a;--calm:#7ea0c4;--calm-ink:#0d1620;--idle:#8d897c;--green:var(--brass)}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer;border:1px solid #3a4030;border-radius:.7rem;background:#1b1f16;padding:7px 12px;min-height:34px}button:hover{background:#252a1e}button.primary{background:var(--green);color:#1a1506;border-color:var(--green)}button:disabled{opacity:.55;cursor:wait}a{color:var(--green)}:focus-visible{outline:3px solid #e2b340;outline-offset:2px}header{height:54px;display:flex;gap:24px;align-items:center;padding:0 18px;background:#1b1f16;border-bottom:1px solid var(--line)}header strong{font-size:20px;white-space:nowrap}nav{display:flex;gap:8px;flex:1}nav button{border:0;background:transparent}nav button[aria-current=page]{color:var(--green);box-shadow:inset 0 -3px var(--green);font-weight:600}h1{font-size:24px;margin:0 0 12px}h2{font-size:20px;margin:0 0 12px}h3{font-size:16px;margin:16px 0 8px}p{margin:8px 0;color:#a89f8c}small,.meta{font-size:12px;color:#a89f8c}label{display:flex;flex-direction:column;gap:4px;font-weight:600}input,select,textarea{padding:7px 9px;border:1px solid #3a4030;border-radius:.7rem;background:#1b1f16;min-width:0;width:100%;font-weight:400}input[type=checkbox]{width:auto}form{display:grid;gap:12px}.auth{max-width:440px;margin:8vh auto;padding:28px;background:#1b1f16;border:1px solid var(--line);border-radius:.9rem}.auth .tabs{display:flex;gap:8px;margin:20px 0}.auth button{min-height:42px}.toolbar{display:flex;gap:10px;align-items:end;flex-wrap:wrap;padding:10px 14px;border-bottom:1px solid var(--line);background:#1b1f16}.toolbar label{font-size:12px}.toolbar input[type=date]{width:156px}.toolbar label select{min-width:95px}.toolbar .meta{margin:auto 0 auto auto}.attention{display:flex;align-items:center;gap:16px;min-height:48px;padding:7px 16px;background:#1b1f16;color:#e2b340;border-bottom:1px solid #3a4030}.attention strong{font-size:16px}.attention button{margin-left:auto;color:#e2b340}.workspace{height:auto;display:grid;grid-template-columns:minmax(0,2.1fr) minmax(320px,1fr);gap:12px;padding:12px}.board-column{display:grid;grid-template-rows:minmax(0,1fr);gap:12px;min-height:0}.board-column.has-list{grid-template-rows:minmax(190px,1.3fr) minmax(180px,1fr)}.panel{background:#1b1f16;border:1px solid var(--line);border-radius:.9rem;padding:14px;min-width:0;min-height:0;overflow:auto}.panel-heading{display:flex;align-items:center;gap:12px;justify-content:space-between}.panel-heading h2{margin:0}.chart-scroll{height:auto;overflow:auto;margin-top:8px}.timeline{width:100%;min-width:650px;display:block}.timeline text{font-size:13px;fill:#a89f8c}.gridline{stroke:#3a4030;stroke-dasharray:3 3}.timeline .trip{stroke:var(--green);stroke-width:6}.timeline .leg{stroke:#986800;stroke-width:4}.timeline circle{fill:var(--green)}.chart-hit{fill:transparent}.timeline g:hover .chart-hit,.timeline g:focus .chart-hit{fill:#252a1e}.timeline g{cursor:pointer}table{width:100%;border-collapse:collapse;font-size:13px}th,td{text-align:left;padding:8px;border-bottom:1px solid var(--line);overflow-wrap:anywhere}th{position:static;top:0;background:#12150f;z-index:1}td button{padding:4px 7px;min-height:30px;text-align:left}.table-scroll{overflow:auto}.badge{display:inline-block;background:#252a1e;color:#e2b340;padding:2px 6px;border-radius:3px;font-size:12px}.status{background:#252a1e;color:#e2b340}.selected{background:#34392c}.inspector dl{display:grid;grid-template-columns:95px 1fr;gap:7px;margin:12px 0}.inspector dt{color:#a89f8c}.inspector dd{margin:0;overflow-wrap:anywhere}.inspector form{border-top:1px solid var(--line);padding-top:12px}.actions{display:flex;gap:8px;flex-wrap:wrap}.full-view{max-width:1180px;margin:20px auto;padding:0 18px}.columns{display:grid;grid-template-columns:1fr 1fr;gap:18px}.full-view .panel{margin-bottom:16px}.driver-view{max-width:720px;margin:18px auto;padding:0 14px}.trip-card{background:#1b1f16;padding:18px;border:1px solid var(--line);border-radius:.9rem;margin-bottom:12px}.trip-card h2{font-size:18px}.trip-card button{min-height:44px}.driver-view .toolbar{padding:10px 0;background:transparent}.availability-row{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:12px 0;border-bottom:1px solid var(--line)}#notice:empty{display:none}#notice{padding:8px 16px;background:#252a1e}#notice.error,#connection{background:#252a1e;color:#e2b340;padding:10px 16px}dialog{width:min(760px,calc(100% - 24px));max-height:90dvh;border:1px solid var(--line);border-radius:8px;padding:24px}dialog::backdrop{background:#f3ecdc80}.close{float:right;margin:0 0 12px 12px}.issue{padding:12px 0;border-bottom:1px solid var(--line)}.issue button{margin-top:5px}.skip{position:absolute;left:12px;top:-100px;z-index:9;background:#1b1f16;padding:10px}.skip:focus{top:6px}footer{padding:4px 16px;font-size:12px;color:#a89f8c}.pagination{display:flex;gap:8px;align-items:center;margin:8px 0}[hidden]{display:none!important}@media(max-width:850px){header{height:auto;min-height:54px;flex-wrap:wrap;gap:10px;padding:10px 14px}header strong{font-size:18px}nav{order:0;flex-basis:100%;overflow:auto}#identity{margin-left:auto;font-size:12px}.attention{position:static;top:0;z-index:3;flex-wrap:wrap;gap:6px}.attention button{min-height:44px}.workspace{height:auto;display:block;padding:10px}.board-column{display:block}.panel{margin-bottom:12px;max-height:none}.chart-panel{display:none}.columns{display:block}.toolbar{gap:8px}.toolbar .meta{width:100%;margin:0}.auth{margin:28px 12px;max-width:none}.inspector{scroll-margin-top:100px}td,th{padding:7px 4px}th:nth-child(3),td:nth-child(3){display:table-cell}.driver-view table th:nth-child(3),.driver-view table td:nth-child(3){display:table-cell}.availability-row{grid-template-columns:1fr}button{min-height:40px}.trip-card{padding:14px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
/* B4 review refinements: four compact rows, visible pagination, no desktop page scroll. */
@media(min-width:851px){.workspace{height:auto}.board-column.has-list{grid-template-rows:minmax(180px,1fr) minmax(245px,1fr)}#list td{padding:4px 7px}#list td small{display:inline}#list td br{display:none}#list .pagination{margin:6px 0}.timeline text{font-size:15px}}
.timeline .flow{stroke:#e2b340;stroke-width:5}

/* Health page inline definition lists — do NOT reuse .inspector (that is the fixed side drawer in grok.css). */
.kv-list{display:grid;grid-template-columns:110px 1fr;gap:7px;margin:12px 0}
.kv-list dt{color:#a89f8c}
.kv-list dd{margin:0;overflow-wrap:anywhere}
/* Live ping form: in-flow grid so the submit button is never covered */
.ping-form{display:grid;grid-template-columns:1fr 1fr auto;gap:12px;align-items:end;margin:0;padding:0;border:0;background:transparent}
.ping-form button{position:relative;z-index:auto;min-height:34px;align-self:end}
@media(max-width:850px){.ping-form{grid-template-columns:1fr}}
.app-version{position:static;padding:3px 8px;border:1px solid var(--line);border-radius:6px;background:var(--surface);color:var(--muted);font:11px/1.3 'IBM Plex Mono',ui-monospace,monospace}
.is-refreshing::before{content:"";display:inline-block;width:.75em;height:.75em;margin-right:.5em;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;vertical-align:-.08em;animation:refresh-spin .7s linear infinite}
@keyframes refresh-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.is-refreshing::before{animation:none}}
.roster-name{display:inline-flex;align-items:center;gap:.55em}
.roster-icon{width:16px;height:20px;color:var(--muted);flex:none}
.roster-actions{white-space:normal}
.roster-actions button{margin:1px 3px 1px 0}
.roster-desk .toolbar{padding:0;border:0;background:transparent}
.badge.excluded{color:var(--warn);border-color:var(--warn)}
.badge.unknown{color:var(--calm);border-color:var(--calm)}
.badge.attending{color:var(--ok);border-color:var(--ok)}
.roster-excluded-row td{background:rgba(224,161,6,.05)}
.cap-check{flex-direction:row;align-items:center;gap:6px;font-weight:400;white-space:nowrap}
.cap-check input{width:auto;min-height:20px;accent-color:var(--brass);cursor:pointer}
.cap-check input:disabled{cursor:default;opacity:.7}
