/* Agent Directory. Minimal: one accent, hairlines, three weights (400/500/600), 4/8px spacing. */
:root {
  color-scheme: light dark;
  --bg: #f7f8f9;        /* L0 canvas */
  --panel: #ffffff;     /* L1 table frame */
  --fg: #16191d;
  --mut: #5f6b76;
  --line: #e3e7ea;
  --accent: #2456c9;
  --ok: #17803d; --warn: #a15c07; --bad: #b42318;
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-6: 24px; --space-8: 32px;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #0f1216; --panel: #161b21; --fg: #e8ecef; --mut: #98a4ae; --line: #262e36;
    --accent: #8db0ff; --ok: #5fd08a; --warn: #e5ab4a; --bad: #f2827a;
  }
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--fg); font: 400 1rem/1.55 system-ui, -apple-system, "Segoe UI", sans-serif; }
a { color: var(--accent); }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
strong, b { font-weight: 600; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* page */
header { border-bottom: 1px solid var(--line); background: var(--panel); }
.wrap { width: 100%; max-width: 1280px; margin: 0 auto; padding-inline: var(--space-4); }
header .wrap { display: flex; justify-content: space-between; align-items: center; min-height: 56px; }
.brand { font-weight: 600; text-decoration: none; color: var(--fg); }
header nav { display: flex; gap: var(--space-1); }
header nav a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 var(--space-2); color: var(--mut); text-decoration: none; }
header nav a:hover { color: var(--fg); }
main { padding-top: var(--space-8); padding-bottom: var(--space-8); }
h1 { margin: 0 0 var(--space-2); font-size: 2rem; font-weight: 600; line-height: 1.2; letter-spacing: -.01em; }
h2 { margin: var(--space-8) 0 var(--space-2); font-size: 1.25rem; font-weight: 600; line-height: 1.25; }
.sub { margin: 0 0 var(--space-6); max-width: 65ch; color: var(--mut); }
.meta { display: block; color: var(--mut); font-size: .75rem; line-height: 1.4; }
p.meta, p.note { max-width: 70ch; }
.note { color: var(--mut); font-size: .875rem; }
.muted { color: var(--mut); }
.count { margin: var(--space-4) 0 var(--space-2); color: var(--mut); font-size: .875rem; }
footer { padding-top: var(--space-4); padding-bottom: var(--space-8); font-size: .75rem; line-height: 1.4; color: var(--mut); text-align: center; }
footer a { color: inherit; }

/* company icon over a letter placeholder */
.who { display: flex; align-items: center; gap: var(--space-3); }
.logo { position: relative; flex: none; display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border: 1px solid var(--line); border-radius: 6px; background: var(--bg); color: var(--mut); font-size: .875rem; font-weight: 600; line-height: 1; overflow: hidden; }
.logo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; padding: 4px; background: #fff; }
h1.who .logo { width: 40px; height: 40px; }
h1.who { gap: var(--space-3); }

/* controls */
input, select, button, textarea { min-height: 44px; padding: var(--space-2) var(--space-3); border: 1px solid var(--line); border-radius: 6px; background: var(--panel); color: var(--fg); font: inherit; font-size: .875rem; }
button { cursor: pointer; font-weight: 500; }
button.primary { background: var(--accent); border-color: var(--accent); color: #fff; }
@media (prefers-color-scheme: dark) { button.primary { color: #0f1216; } }
.toolbar { display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--space-2); }
.toolbar .search { display: flex; flex-direction: column; gap: var(--space-1); flex: 1 1 280px; max-width: 480px; }
.toolbar .search span, .field span { font-size: .75rem; color: var(--mut); }
.toolbar .search input { width: 100%; }
.filters { position: relative; align-self: flex-end; }
.filters summary { display: inline-flex; align-items: center; min-height: 44px; padding: 0 var(--space-3); border: 1px solid var(--line); border-radius: 6px; background: var(--panel); cursor: pointer; font-size: .875rem; font-weight: 500; list-style: none; }
.filters summary::-webkit-details-marker { display: none; }
.panelbody { display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--space-3); margin-top: var(--space-2); padding: var(--space-4); border: 1px solid var(--line); border-radius: 8px; background: var(--panel); }
.field { display: flex; flex-direction: column; gap: var(--space-1); }
.active { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); margin: var(--space-3) 0 0; font-size: .875rem; }
.fchip { display: inline-flex; align-items: center; min-height: 32px; padding: 0 var(--space-2); border: 1px solid var(--line); border-radius: 6px; background: var(--panel); color: var(--fg); text-decoration: none; }

/* list: an L1 frame with hairlines */
.frame { overflow-x: auto; border: 1px solid var(--line); border-radius: 8px; background: var(--panel); }
table { width: 100%; border-collapse: collapse; }
th, td { padding: var(--space-3) var(--space-4); border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; font-size: .875rem; }
th { font-size: .75rem; font-weight: 500; color: var(--mut); white-space: nowrap; }
tbody tr:last-child td { border-bottom: 0; }
.frame tbody tr:hover { background: color-mix(in srgb, var(--fg) 3%, transparent); }
td.name a { font-size: 1rem; font-weight: 600; text-decoration: none; }
td.name a:hover { text-decoration: underline; }
td.agents div + div { margin-top: var(--space-1); }
td.empty { padding: var(--space-8) var(--space-4); text-align: center; color: var(--mut); }
.tag { font-weight: 600; }
.tag.allowed { color: var(--ok); }
.tag.conditional, .tag.accidental { color: var(--warn); }
.tag.selective { color: var(--accent); }
.tag.blocked, .tag.conflicting { color: var(--bad); }
.tag.unknown, .tag.none { color: var(--mut); }
.tag.unchecked { color: var(--warn); }
td > .tag + .meta { margin-top: 0; }
.pager { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); margin: var(--space-4) 0; font-size: .875rem; color: var(--mut); }
.pager a, .pager span[aria-disabled] { display: inline-flex; align-items: center; min-height: 44px; padding: 0 var(--space-4); border: 1px solid var(--line); border-radius: 6px; background: var(--panel); text-decoration: none; }
.pager span[aria-disabled] { color: var(--mut); opacity: .6; }

/* detail pages, forms, admin */
dl { display: grid; grid-template-columns: max-content 1fr; gap: var(--space-2) var(--space-4); }
dt { color: var(--mut); } dd { margin: 0; }
.msg { padding: var(--space-2) var(--space-3); border: 1px solid var(--line); border-radius: 6px; margin-bottom: var(--space-3); background: var(--panel); }
.contact label { font-weight: 500; }
.contact input, .contact select, .contact textarea { font-weight: 400; margin-top: var(--space-1); max-width: 560px; width: 100%; }
code { font-size: .875em; }

@media (max-width: 767.98px) {
  h1 { font-size: 1.5rem; }
  .hide-sm { display: none; }
  th, td { padding: var(--space-3); }
  .toolbar .search { flex-basis: 100%; max-width: none; }
}

/* news */
.day h2 { display: flex; align-items: baseline; gap: var(--space-3); margin-top: var(--space-8); }
.day h2 .n { color: var(--mut); font-size: .875rem; font-weight: 400; }
.events, .changes, .changes .agents { margin: 0; padding: 0; list-style: none; }
.events { display: grid; gap: var(--space-4); }
/* one company's change: an L1 card, header row then one row per kind of change */
.event { border: 1px solid var(--line); border-radius: 8px; background: var(--panel); }
.event-head { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); padding: var(--space-3) var(--space-4); border-bottom: 1px solid var(--line); }
.event-head .who a { font-weight: 600; text-decoration: none; }
.event-head .who a:hover { text-decoration: underline; }
.event-head time { font-weight: 600; }
.tally { flex: none; color: var(--mut); font-size: .875rem; }
.change { display: grid; grid-template-columns: 14rem minmax(0, 1fr); gap: var(--space-2) var(--space-6); padding: var(--space-3) var(--space-4); font-size: .875rem; }
.change + .change { border-top: 1px solid var(--line); }
.change.plain { display: block; color: var(--mut); }
.shift { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--space-2); align-self: start; }
.shift > span[aria-hidden] { color: var(--mut); }
.changes .agents { display: flex; flex-wrap: wrap; gap: var(--space-1) var(--space-4); }
.changes .agents .prod { font-weight: 500; }
.changes .agents .tok { color: var(--mut); font-size: .75rem; }
.change .diff { margin: 0; }
@media (max-width: 767.98px) {
  .change { grid-template-columns: minmax(0, 1fr); }
  .event-head { align-items: flex-start; }
}
.empty-note { padding: var(--space-6); border: 1px solid var(--line); border-radius: 8px; background: var(--panel); color: var(--mut); max-width: 65ch; }

/* narrow screens: the list becomes stacked cards, and the header wraps */
@media (max-width: 767.98px) {
  .frame { border: 0; background: transparent; overflow: visible; }
  .frame table, .frame tbody, .frame tr, .frame td { display: block; width: 100%; }
  .frame thead { display: none; }
  .frame tr { margin-bottom: var(--space-3); padding: var(--space-3) var(--space-4); border: 1px solid var(--line); border-radius: 8px; background: var(--panel); }
  .frame td { padding: var(--space-1) 0; border: 0; }
  .frame td.agents { margin-top: var(--space-1); }
  .frame td.empty { padding: var(--space-6) 0; }
  .frame tr:hover { background: var(--panel); }
}
@media (max-width: 520px) {
  header .wrap { flex-wrap: wrap; padding-top: var(--space-2); padding-bottom: var(--space-1); }
  header nav { width: 100%; justify-content: space-between; }
  .brand { white-space: nowrap; }
}
@media (max-width: 767.98px) { .frame td.hide-sm { display: none; } }
.nowrap { white-space: nowrap; }

/* empty states: what is missing, why, and one action */
a.button { display: inline-flex; align-items: center; min-height: 44px; padding: 0 var(--space-4); border: 1px solid var(--accent); border-radius: 6px; background: var(--accent); color: #fff; font-size: .875rem; font-weight: 500; text-decoration: none; }
@media (prefers-color-scheme: dark) { a.button { color: #0f1216; } }
td.empty strong { display: block; font-weight: 600; color: var(--fg); }
td.empty p { margin: var(--space-1) 0 var(--space-4); }
.empty-note h2 { margin: 0 0 var(--space-1); font-size: 1.25rem; }
.empty-note p { margin: 0 0 var(--space-4); }
.contact .meta { margin-top: var(--space-1); }
.filters[open] { flex-basis: 100%; order: 3; }
.filters[open] summary { margin-bottom: 0; }

/* toolbar: search and every filter always visible; no panel to open */
.wrap { padding-inline: var(--space-6); }
main { padding-top: var(--space-12); padding-bottom: var(--space-8); }
h1 { margin-bottom: var(--space-3); }
.toolbar { display: grid; grid-template-columns: minmax(0, 480px) auto; grid-template-areas: "search btn" "selects selects"; align-items: end; gap: var(--space-4) var(--space-2); margin-bottom: var(--space-2); }
.toolbar .search { grid-area: search; max-width: none; flex: none; }
.toolbar > button { grid-area: btn; }
.toolbar .selects { grid-area: selects; display: flex; flex-wrap: wrap; gap: var(--space-3); }
.toolbar .selects .field select { min-width: 140px; }
.sortlink { color: inherit; font-weight: 500; text-decoration: none; }
.sortlink:hover { text-decoration: underline; }
th[aria-sort="ascending"], th[aria-sort="descending"] { color: var(--fg); }
@media (max-width: 767.98px) {
  .wrap { padding-inline: var(--space-4); }
  main { padding-top: var(--space-8); }
  .toolbar { grid-template-columns: minmax(0, 1fr) auto; }
  .toolbar .selects { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-3); }
  .toolbar .selects .field select { min-width: 0; width: 100%; }
}
:root { --space-12: 48px; }
.toolbar > button { justify-self: start; }

/* quick verdict filters with counts */
.quick { display: flex; flex-wrap: wrap; gap: var(--space-2); margin: var(--space-4) 0 var(--space-2); }
.quick a { display: inline-flex; align-items: center; gap: var(--space-2); min-height: 36px; padding: 0 var(--space-3); border: 1px solid var(--line); border-radius: 6px; background: var(--panel); color: var(--fg); font-size: .875rem; text-decoration: none; }
.quick a:hover { border-color: var(--mut); }
.quick a[aria-current="true"] { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 14%, var(--panel)); font-weight: 600; }
.quick .n { color: var(--mut); font-variant-numeric: tabular-nums; }
.quick a[aria-current="true"] .n { color: var(--fg); }

/* flags, last checked, copy link */
.flag { width: 20px; height: 15px; margin-left: var(--space-2); vertical-align: -2px; border: 1px solid var(--line); border-radius: 2px; object-fit: cover; }
td.checked { white-space: nowrap; color: var(--mut); }
td.checked .stale { display: block; margin-top: var(--space-1); font-size: .75rem; }
.count { display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-4); }
button.linkbtn { min-height: 36px; padding: 0 var(--space-2); border: 0; background: none; color: var(--accent); font-size: .875rem; font-weight: 400; text-decoration: underline; }
button.linkbtn[hidden] { display: none; }

/* flag column: its own narrow column left of the company */
th.flagcol, td.flagcol { width: 44px; padding-right: 0; text-align: center; }
td.flagcol .flag { margin: 0; vertical-align: middle; }
@media (max-width: 767.98px) { .frame tr { position: relative; } .frame td.flagcol { position: absolute; top: var(--space-3); right: var(--space-4); width: auto; padding: 0; } }

/* keyboard: skip link, visible on focus */
.skip { position: absolute; left: var(--space-4); top: -100px; z-index: 10; padding: var(--space-3) var(--space-4); border-radius: 6px; background: var(--accent); color: #fff; font-weight: 500; }
.skip:focus { top: var(--space-2); }
@media (prefers-color-scheme: dark) { .skip { color: #0f1216; } }
main:focus { outline: none; }

/* hit targets: 44px minimum */
.quick a { min-height: 44px; }
.fchip { min-height: 44px; padding: 0 var(--space-3); }
button.linkbtn { min-height: 44px; }
.sortlink { display: inline-block; padding: var(--space-3) 0; }
th:has(> .sortlink) { padding-top: 0; padding-bottom: 0; }
td.name a { display: inline-block; padding: var(--space-2) 0; margin: calc(var(--space-2) * -1) 0; }

.scroll { overflow-x: auto; }

/* evidence rows: agents listed once per decision, rules shown as a code block */
.agentgroups { display: grid; gap: var(--space-3); }
.agentgroup .gname { display: block; margin-bottom: var(--space-1); color: var(--mut); font-size: .75rem; line-height: 1.4; }
.agentlist { display: flex; flex-wrap: wrap; gap: var(--space-1) var(--space-4); margin: 0; padding: 0; list-style: none; }
.agentlist .adv { font-style: italic; }
td > .agentgroups + .meta { margin-top: var(--space-3); }
pre.rules { max-width: 52ch; margin: var(--space-2) 0 0; padding: var(--space-2) var(--space-3); overflow: visible; white-space: pre-wrap; overflow-wrap: anywhere; font: .75rem/1.55 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; color: var(--mut); background: var(--bg); }
.rulebox { margin-top: var(--space-2); }
.rulebox > summary { display: inline-block; cursor: pointer; color: var(--mut); font-size: .75rem; }
.rulebox[open] > summary { margin-bottom: 0; }

/* filters: always open on wide screens; a disclosure on narrow ones so results start on the first screen */
.toolbar .filterbox { grid-area: selects; }
.filterbox > summary { display: none; }
@media (max-width: 767.98px) {
  .filterbox > summary { display: flex; align-items: center; min-height: 44px; padding: 0 var(--space-3); border: 1px solid var(--line); border-radius: 6px; background: var(--panel); font-size: .875rem; font-weight: 500; cursor: pointer; list-style: none; }
  .filterbox > summary::-webkit-details-marker { display: none; }
  .filterbox > summary::after { content: "+"; margin-left: auto; color: var(--mut); }
  .filterbox[open] > summary::after { content: "–"; }
  .filterbox[open] > summary { margin-bottom: var(--space-3); }
}

/* list: keep the company column readable, cap notes */
td.name { min-width: 14rem; }
td.notes { max-width: 24ch; }

/* brand link meets the 44px target; verdict explanation sits under the verdict */
.brand { display: inline-flex; align-items: center; min-height: 44px; }
dd .why { display: block; margin-top: var(--space-2); max-width: 65ch; }

/* header: nav text aligns to the content edges (link padding is hit area, not layout); 8pt-grid height */
header .wrap { min-height: 64px; }
header nav { margin-right: calc(var(--space-2) * -1); }
@media (max-width: 520px) {
  header .wrap { min-height: 0; padding-top: var(--space-2); padding-bottom: var(--space-2); }
  header nav { margin-inline: calc(var(--space-2) * -1); width: calc(100% + var(--space-4)); }
}

/* icon buttons: square 44px hit area, real tooltip on hover and keyboard focus */
.toolbar .search label { font-size: .75rem; color: var(--mut); }
.sfield { position: relative; }
.sfield input { padding-right: 52px; }
.sfield input::-webkit-search-cancel-button { display: none; }
.iconbtn { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; min-height: 44px; padding: 0; border: 0; border-radius: 6px; background: none; color: var(--mut); cursor: pointer; text-decoration: none; }
.iconbtn:hover { color: var(--fg); background: color-mix(in srgb, var(--fg) 6%, transparent); }
.iconbtn[hidden] { display: none; }
.sfield .tipwrap { position: absolute; top: 0; right: 0; }
.sfield .tipwrap:has(> [hidden]) { display: none; }
.hint { position: absolute; top: 50%; right: var(--space-3); transform: translateY(-50%); pointer-events: none; }
kbd { display: inline-block; min-width: 20px; padding: 0 var(--space-1); border: 1px solid var(--line); border-radius: 4px; background: var(--bg); color: var(--mut); font: 500 .75rem/18px system-ui, -apple-system, "Segoe UI", sans-serif; text-align: center; }
.sfield:has(input:not(:placeholder-shown)) .hint, .sfield:focus-within .hint { display: none; }
@media (hover: none) { .hint { display: none; } }

.tipwrap { position: relative; display: inline-flex; }
.tip { position: absolute; z-index: 5; right: 0; bottom: calc(100% + var(--space-1)); display: inline-flex; align-items: center; gap: var(--space-2); padding: var(--space-1) var(--space-2); border: 1px solid var(--line); border-radius: 6px; background: var(--panel); color: var(--fg); font-size: .75rem; line-height: 1.4; white-space: nowrap; pointer-events: none; visibility: hidden; }
.tipwrap:hover .tip, .tipwrap:has(:focus-visible) .tip { visibility: visible; }
.tip kbd { background: var(--bg); }

/* "i" button beside No Policy Found. The tip opens below and wraps; display (not visibility) so a hidden tip never adds scroll to the table's overflow container. */
.whywrap { margin-left: var(--space-2); vertical-align: middle; }
.infobtn { width: 18px; height: 18px; min-height: 0; padding: 0; border: 1px solid var(--line); border-radius: 50%; background: none; color: var(--mut); font: italic 600 .6875rem/1 Georgia, serif; cursor: help; }
.infobtn:hover, .infobtn:focus-visible { color: var(--fg); border-color: var(--mut); }
.tip.why { display: none; top: calc(100% + var(--space-1)); bottom: auto; left: 0; right: auto; width: max-content; max-width: 16rem; white-space: normal; visibility: visible; }
.whywrap:hover .tip.why, .whywrap:focus-within .tip.why { display: block; }

/* active filter chip: label plus a square remove button */
.fchip { padding: 0 0 0 var(--space-3); gap: var(--space-1); }
.fchip .tip { right: auto; left: 50%; transform: translateX(-50%); }

/* page diffs in the news log */
.diff { margin-top: var(--space-2); font-size: .8125rem; }
.diff summary { cursor: pointer; color: var(--mut); }
.diff pre { margin: var(--space-2) 0 0; padding: var(--space-3); overflow-x: auto; border: 1px solid var(--line); border-radius: 6px; background: var(--panel); white-space: pre-wrap; word-break: break-word; }
.diff .da { color: var(--ok); }
.diff .dr { color: var(--bad); }
.diff .dc { color: var(--mut); }

/* code blocks (API page): framed like other L1 surfaces, scroll inside instead of widening the page */
pre { max-width: 100%; margin: var(--space-3) 0; padding: var(--space-3) var(--space-4); overflow-x: auto; border: 1px solid var(--line); border-radius: 8px; background: var(--panel); font-size: .875rem; line-height: 1.5; }
pre code { font-size: inherit; }
.change.summary { color: var(--fg); }
.ai-mark { display: inline-block; margin-right: var(--space-2); vertical-align: -.2em; color: var(--mut); cursor: help; }
.ai-mark svg { width: 1.15em; height: 1.15em; fill: currentColor; }

/* admin: overview tiles, decision forms, inbox items. Lists reuse .toolbar, .quick, .frame and .pager above. */
header nav a[aria-current="page"] { color: var(--fg); font-weight: 600; box-shadow: inset 0 -2px 0 var(--accent); }
.signed { margin-top: var(--space-8); }
.who > span:not(.logo) { display: block; min-width: 0; }
.toolbar:not(:has(.selects)) { grid-template-areas: "search btn"; }

.tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: var(--space-4); margin: 0 0 var(--space-4); padding: 0; list-style: none; }
.tile { display: flex; flex-direction: column; gap: var(--space-1); height: 100%; padding: var(--space-4); border: 1px solid var(--line); border-radius: 8px; background: var(--panel); color: var(--fg); text-decoration: none; }
.tile:hover { border-color: var(--mut); }
.tile .big { font-size: 2rem; font-weight: 600; line-height: 1.1; font-variant-numeric: tabular-nums; }
.tile .big.zero { color: var(--mut); }
.tile .t { font-weight: 500; }

/* decision forms: labelled fields, then actions, in a fixed rhythm */
.decide { display: grid; gap: var(--space-3); margin: 0; }
.decide .fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3); }
.decide .fields.three > :nth-child(3) { grid-column: 1 / -1; }
.decide .field input, .decide .field select { width: 100%; }
.decide .actions { display: flex; flex-wrap: wrap; gap: var(--space-2); }
td:has(> .decide) { min-width: 300px; }

/* inbox: items you decide on, not table rows. Unread = accent bar and heavier weight, never colour alone. */
.queue { display: grid; gap: var(--space-3); margin: 0; padding: 0; list-style: none; }
.item { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, 360px); gap: var(--space-4) var(--space-6); padding: var(--space-4); border: 1px solid var(--line); border-radius: 8px; background: var(--panel); }
.item.unread { padding-left: calc(var(--space-4) - 2px); border-left: 3px solid var(--accent); }
.item .who a { font-weight: 600; }
.item .decided { margin: 0; color: var(--mut); align-self: start; }
.item-title { margin: 0 0 var(--space-2); }
.item-title strong { font-weight: 600; }
.quote { max-width: 75ch; margin: var(--space-3) 0 0; padding-left: var(--space-3); border-left: 2px solid var(--line); }
.msgtext { max-width: 70ch; margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; }
@media (max-width: 767.98px) { .item { grid-template-columns: minmax(0, 1fr); } td:has(> .decide) { min-width: 0; } }
.decide { align-content: start; }
.item > .decide { align-self: start; }
.adm header nav { flex-wrap: wrap; }

/* admin hit targets: 44px floor for standalone links (the padded area grows without moving the text) */
header nav a { min-width: 44px; justify-content: center; }
.active > a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 var(--space-2); }
.adm .who a, .adm td.name a, .adm td .meta a, .adm .item .meta a, .adm p.meta > a { display: inline-flex; align-items: center; min-width: 44px; min-height: 44px; padding: 0; margin-block: calc((1lh - 44px) / 2); }

/* one-row decisions: the note takes the free width, the buttons sit beside it. Wraps to note-then-buttons when the cell is narrow. */
.decide.inline { display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--space-3); }
.decide.inline .field { flex: 1 1 160px; }
.decide.inline .actions { flex: none; }
td:has(> .decide.inline) { width: 34rem; }
@media (max-width: 767.98px) { td:has(> .decide.inline) { width: auto; } }

/* icon actions inside a decision row: bordered like the text buttons, tooltip centred above, flag in red */
.decide .actions .iconbtn { border: 1px solid var(--line); background: var(--panel); }
.decide .actions .iconbtn:hover { border-color: var(--mut); }
.decide .actions .tip { right: auto; left: 50%; transform: translateX(-50%); }
.iconbtn.flagbtn { color: var(--bad); }
.iconbtn.flagbtn:hover { color: var(--bad); }
/* the last icon in a row keeps its tooltip inside the cell, so the hidden tooltip never widens the table frame */
.decide .actions .tipwrap:last-child .tip { left: auto; right: 0; transform: none; }

/* folded claims: the related statements sit under the leading quote, collapsed */
.related { margin-top: var(--space-3); font-size: .875rem; }
.related summary { display: inline-flex; align-items: center; min-height: 44px; cursor: pointer; color: var(--accent); }
.related ul { margin: 0; padding: 0; list-style: none; }
.related li + li { margin-top: var(--space-3); }
.related .quote { margin-top: var(--space-1); }
.conflict { margin-top: var(--space-3); color: var(--warn); font-weight: 500; }

/* "Only for": a collapsed agent picker with a checkbox per agent */
input[type="checkbox"] { flex: none; width: 20px; height: 20px; min-height: 0; padding: 0; accent-color: var(--accent); }
.pick { display: flex; flex-direction: column; gap: var(--space-1); min-width: 0; }
.pick > .label { font-size: .75rem; color: var(--mut); }
.picker > summary { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); min-height: 44px; padding: 0 var(--space-3); border: 1px solid var(--line); border-radius: 6px; background: var(--panel); font-size: .875rem; cursor: pointer; list-style: none; }
.picker > summary::-webkit-details-marker { display: none; }
.picker > summary::after { content: ""; flex: none; width: 8px; height: 8px; margin-right: 2px; border-right: 1.5px solid var(--mut); border-bottom: 1.5px solid var(--mut); transform: translateY(-2px) rotate(45deg); }
.picker[open] > summary::after { transform: translateY(2px) rotate(-135deg); }
.picker > summary span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.picker fieldset { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); margin: var(--space-1) 0 0; padding: var(--space-1) var(--space-3); border: 1px solid var(--line); border-radius: 6px; background: var(--panel); }
.check { display: flex; align-items: center; gap: var(--space-2); min-height: 44px; font-size: .875rem; cursor: pointer; }

/* the AI note: icon beside a text column, so a second line aligns under the first and the width matches the quote above it */
p.ai-note { display: flex; align-items: flex-start; gap: var(--space-2); max-width: 100ch; } /* 100ch at the note size is the quote's 75ch at body size */
p.ai-note .ai-mark { flex: none; margin: 0; vertical-align: baseline; }

/* "more actions" menu: a square button that opens a small panel of actions */
.menu { position: relative; display: inline-block; }
.menu > summary { position: relative; border: 1px solid var(--line); background: var(--panel); list-style: none; }
.menu > summary::-webkit-details-marker { display: none; }
.menu[open] > summary { border-color: var(--mut); color: var(--fg); }
.menu > summary .tip { right: 0; }
.menu[open] > summary .tip { display: none; }
.menu:not([open]) > summary:hover .tip, .menu:not([open]) > summary:focus-visible .tip { visibility: visible; }
.menu-list { position: absolute; z-index: 6; right: 0; top: calc(100% + var(--space-1)); min-width: 15rem; padding: var(--space-1); border: 1px solid var(--line); border-radius: 8px; background: var(--panel); }
.menu-list form { margin: 0; }
.menu-list button { display: flex; align-items: center; width: 100%; min-height: 44px; padding: 0 var(--space-3); border: 0; background: none; text-align: left; }
.menu-list button:hover { background: color-mix(in srgb, var(--fg) 6%, transparent); }
.menu-frame { overflow: visible; }
/* status and action sit at the right edge of the controls table */
.controls th:nth-child(n+2), .controls td:nth-child(n+2) { text-align: right; }
.controls td.act { width: 1%; white-space: nowrap; }
@media (max-width: 767.98px) {
  .controls th:nth-child(n+2), .controls td:nth-child(n+2) { text-align: left; }
  .menu-list { right: auto; left: 0; }
  .menu > summary .tip { right: auto; left: 0; }
}

/* in-place decision message: stays in view while the reviewer works down a long list */
.toast { position: fixed; z-index: 10; left: var(--space-4); right: var(--space-4); bottom: var(--space-4); max-width: 480px; margin: 0 auto; box-shadow: 0 2px 8px color-mix(in srgb, var(--fg) 15%, transparent); }
.toast.bad { border-color: var(--bad); }
.toast[hidden] { display: none; }
[aria-busy="true"] { opacity: .6; }

/* a card with several statements: the quote is the option; the chosen one is the evidence the claim cites */
.cite-help { margin: var(--space-3) 0 0; }
.cite { display: grid; grid-template-columns: 16px minmax(0, 1fr); gap: var(--space-3); align-items: start; margin-top: var(--space-2); }
.cite input { width: 16px; height: 16px; min-height: 0; margin: var(--space-1) 0 0; padding: 0; accent-color: var(--accent); cursor: pointer; }
.cite label { display: block; cursor: pointer; }
.cite .quote { display: block; margin-top: var(--space-1); max-width: 75ch; padding-left: var(--space-3); border-left: 2px solid var(--line); }
.cite:has(input:checked) .quote { border-left-color: var(--accent); }
.related .meta.source { margin: var(--space-1) 0 0 calc(16px + var(--space-3)); }