/* Cabinet additions on top of govorun.css: tokens only (verify-tokens), no new visual language.
 * Login card, HTMX loading and error feedback, form groups, small selects, the player's seek area,
 * and the few states the mockups did not draw (done task row, danger ribbon end). */

/* ── Entry pages: login, no access, errors ─────────────────────────── */
.auth-body { background: var(--surface-page); }
.auth { min-height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--space-4); padding: var(--space-8) var(--space-4); }
.auth__card { width: 100%; max-width: 400px; padding: var(--space-8) var(--space-6); }
.auth__foot { max-width: 400px; text-align: center; }
.form-narrow { max-width: 480px; }

/* ── Forms ──────────────────────────────────────────────────────────── */
.fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
.fieldset[disabled] { opacity: 0.6; }
.input--search { width: 240px; max-width: 100%; }
.select--sm { min-height: var(--control-h-sm); font-size: var(--fs-sm); padding-left: var(--space-2); }
.select-wrap--sm { min-width: 148px; }
.segmented__item:has(input:checked) { background: var(--surface-card); color: var(--text-strong); box-shadow: var(--shadow-1); }
.segmented__item:has(input:focus-visible) { outline: 2px solid var(--focus-ring); outline-offset: 1px; }
.segmented a.segmented__item { text-decoration: none; }
.disclosure > summary { list-style: none; width: fit-content; }
.disclosure > summary::-webkit-details-marker { display: none; }
.disclosure__body { margin-top: var(--space-4); }
.upload-actions { margin-top: var(--space-3); }
.dropzone.has-file { border-style: solid; border-color: var(--accent); background: var(--accent-soft); color: var(--text-body); }
.code { font-family: var(--font-mono); font-size: var(--fs-sm); padding: 1px var(--space-1); border-radius: var(--radius-xs); background: var(--surface-card); color: var(--text-strong); box-shadow: inset 0 0 0 1px var(--line); }
.kv--roles dd { text-align: left; color: var(--text-body); }
.kv--roles { grid-template-columns: 112px minmax(0, 1fr); }

/* ── Small helpers ─────────────────────────────────────────────────── */
.plain-button { all: unset; display: inline-flex; align-items: center; gap: var(--space-3); cursor: pointer; }
.nav__item--form { padding: 0 var(--space-3); }
@media (min-width: 960px) { .rail-sm-only { display: none; } }
.sm-only { display: none; }
@media (max-width: 719px) { .sm-only { display: inline; } }
.t-warn { color: var(--tone-warn-text); }
.flip { display: inline-flex; transform: scaleX(-1); }
.card--link { text-decoration: none; color: inherit; transition: box-shadow var(--dur-fast) var(--ease-out); }
.card--link:hover { box-shadow: var(--shadow-2); color: inherit; }
.table tr.is-done td { color: var(--text-muted); }
.table tr.is-done .who__name { color: var(--text-body); }
.turn--event { grid-template-columns: 56px minmax(0, 1fr); }
.ribbon__end[data-tone="danger"] { background: var(--tone-danger-bg); color: var(--tone-danger-text); box-shadow: inset 0 0 0 1px var(--tone-danger-line); }
.stackbar__seg[data-tone="danger"] { background: var(--tone-danger-text); }
.meter-scale__mark--end { left: 100%; transform: translateX(-100%); }

/* ── Player: the ribbon is the seek bar ────────────────────────────── */
.player__seek { cursor: pointer; border-radius: var(--radius-xs); }
.player__seek:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 4px; }
.player.is-playing .player__btn .icon { transform: none; }
.turn[data-at] { cursor: pointer; }
.turn[data-at]:hover .turn__time { color: var(--accent-text); }

/* ── HTMX: loading and failure feedback ────────────────────────────── */
[aria-live].htmx-request, .htmx-request#convo-results, .htmx-request#task-results { opacity: 0.55; transition: opacity var(--dur) var(--ease-out); pointer-events: none; }
.switch.htmx-request { cursor: progress; opacity: 0.7; }
.toasts { position: fixed; z-index: 30; right: var(--space-4); bottom: var(--space-4); left: var(--space-4); display: flex; flex-direction: column; align-items: flex-end; gap: var(--space-2); pointer-events: none; }
.toast { pointer-events: auto; max-width: 420px; box-shadow: var(--shadow-2); }
@media (min-width: 720px) { .toasts { left: auto; } }

/* Rail: who is logged in, truncated to the rail's width */
.rail__user { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); min-width: 0; }
.rail__who { display: flex; align-items: center; gap: var(--space-2); min-width: 0; }
.rail__who .who { min-width: 0; }
.rail__who .who > * { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.setting-row > .cluster:first-child { flex-wrap: nowrap; min-width: 0; }
.setting-row > .cluster:first-child .who__sub { white-space: normal; }
.select-wrap--sm { min-width: 0; }
.select--sm { width: auto; max-width: 150px; }
/* The cabinet's lists carry one more column than the mockups (manager, action): the summary gives way first */
.table td.is-fill { min-width: 160px; }

/* Review fixes: side columns do not stretch their neighbour, long values get their own column */
.grid--main-side, .grid--2 { align-items: start; }
.kv--split { grid-template-columns: minmax(88px, 38%) minmax(0, 1fr); }
.kv--split dd { overflow-wrap: anywhere; }
.meter-scale__mark--start { transform: none; }
.columns-axis > span:last-child { text-align: right; direction: rtl; }
.select-wrap--sm { display: inline-block; }
.task-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); }
.table td .table__summary + .t-caption { display: block; margin-top: 2px; }
.t-warn .icon { display: inline-block; vertical-align: -2px; margin-right: 2px; }