/* ============================================================================
   AGENT — lane V10's own rules
   ============================================================================
   New Agent UI lives here, not in console.css (MASTER-PLAN §5). Tokens only: no
   literal colour, both themes through console.css's own token blocks.

   WHAT THE AGENT WILL READ (V10 A1, S §7b). The composer carries S's context
   tokens above the field: the screen and its period fixed, everything else
   removable. Where no screen states a period, the period token is itself the
   control that switches the reading length (owner ruling D-2). A token the last
   send was refused over is marked in place, beside the words that name it. */

.v2-agp .agp-ctx { margin: 0 0 8px; }
.v2-agp .agp-ctx:empty { display: none; }
.v2-agp .agp-ctx .sb-tokens { gap: 4px; }

/* THE WORKSPACE (V10 1a). Improve › Agent is this panel at full width: the shell lends
   the node into the Agent view, beside the header Improve draws (agpSet's `full`). In the
   view's flow, not over it; its own head is the rail's job there (New, the list), and the
   conversation keeps a reading width at any screen width. */
.view[data-view="agent"] > #imp-agent { flex: none; }
.v2-agp.full { position: static; flex: 1; min-height: 0; width: auto; max-width: none;
  border-left: 0; box-shadow: none; transition: none; }
.v2-agp.full > .agp-head { display: none; }
.v2-agp.full .agp-body > *, .v2-agp.full .agp-foot > * { width: min(100%, 760px); align-self: center; }
.v2-agp.full .agp-foot { align-items: center; }
/* The demo badge is bottom-right, where the workspace's composer is: it rises above it,
   through the same kind of variable the dock moves it aside with (--agp-gutter). */
body:has(.v2-agp.full) { --agp-lift: 104px; }

/* The palette's Ask rows (V10 1a, S's ruling): an answer's ceiling shows on the row Enter
   would spend, and under the pointer, never three times down the list. It keeps its space. */
.v2-pal .pit.ask .ph { visibility: hidden; }
.v2-pal .pit.ask.on .ph, .v2-pal .pit.ask:hover .ph { visibility: visible; }

/* ── The first screen (V10 1b) ────────────────────────────────────────────────
   What the Agent shows before the first question: needs attention, tasks by Explain ·
   Plan · Create, recent documents, workflows due. Rows are the list's rows (42px, a
   title over a fragment); a tier is a glyph with a word. The dock stacks the task
   columns; the workspace sets them side by side. */
.v2-agp .agp-start { display: flex; flex-direction: column; gap: 20px; padding: 4px 0 12px; }
/* The quiet new-chat card beside the canvas's writing home (REV-P3-17-wr1 S1; the AgentCanvasHome board's card): a surface card with
   a small faint label over one line of body, not the dock's bordered task card. The home already draws the starters. */
.v2-agp .agp-card.agp-card-quiet { gap: 10px; margin-top: 0; padding: 14px 16px; background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--radius-card); box-shadow: var(--shadow-lift); }
.v2-agp .agp-card-quiet .agp-card-t { font: var(--type-meta-weight) var(--type-meta-size)/var(--type-meta-leading) var(--font-sans); color: var(--faint); }
.v2-agp .agp-card-quiet .agp-card-why { display: block; font: var(--type-small-weight) var(--type-small-size)/var(--type-small-leading) var(--font-sans); color: var(--body); overflow: visible; }
.v2-agp .agp-st-g { display: flex; flex-direction: column; }
.v2-agp .agp-st-note { margin: 0; font: 400 var(--text-xs)/1.5 var(--sans); color: var(--muted); }
.v2-agp .agp-st-row, .v2-agp .agp-st-task { display: flex; flex-direction: column; align-items: flex-start; gap: 2px;
  min-height: 42px; padding: 7px 0; text-align: left; cursor: pointer; background: none; border: none;
  border-bottom: 1px solid var(--line); width: 100%; }
.v2-agp .agp-st-row .t, .v2-agp .agp-st-task .t { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font: 500 var(--text-sm)/1.4 var(--sans); color: var(--ink); }
.v2-agp .agp-st-row .d, .v2-agp .agp-st-task .d { font: 400 var(--text-xs)/1.4 var(--sans); color: var(--faint);
  font-variant-numeric: tabular-nums; }
.v2-agp .agp-st-row:hover .t, .v2-agp .agp-st-row:focus-visible .t,
.v2-agp .agp-st-task:hover .t, .v2-agp .agp-st-task:focus-visible .t { text-decoration: underline; text-underline-offset: 3px; }
.v2-agp .agp-st-tier { display: inline-flex; align-items: center; gap: 5px; font: 600 var(--text-2xs)/1.4 var(--sans); color: var(--muted); }
.v2-agp .agp-st-tier.decision { color: var(--accent-text); }
.v2-agp .agp-st-tier.blocked { color: var(--danger); }
.v2-agp .agp-st-tier.running { color: var(--warn); }
.v2-agp .agp-st-tier.finished { color: var(--ok); }
.v2-agp .agp-st-cols { display: flex; flex-direction: column; gap: 14px; }
/* A column of tasks: its header over its starters, never wider than its track. */
.v2-agp .agp-st-col { display: flex; flex-direction: column; min-width: 0; }
.v2-agp .agp-st-ch { margin: 0 0 2px; font: 600 var(--text-xs)/1.4 var(--sans); color: var(--muted); }
/* Side by side, the columns share their rows (a header, then three starters): a starter sits level with its
   neighbours and shares their height, and a column with fewer rows is as tall as the others (the owner's even
   cards, 09-15). */
.v2-agp.full .agp-st-cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: repeat(4, auto); column-gap: 20px; row-gap: 0; }
.v2-agp.full .agp-st-col { display: grid; grid-row: span 4; grid-template-rows: subgrid; }
.v2-agp .agp-st-task .t { white-space: normal; overflow: visible; }
/* D8 (owner, 2026-09-19): a task is a starter prompt, and a starter is a control. Its
   outline and shared shadow read at rest, before any hover; the rows around it stay rows. */
.v2-agp .agp-st-task { min-height: 0; padding: 8px 10px; margin-bottom: 6px; background: var(--surface);
  border: 1px solid var(--line); border-radius: var(--r-sm); box-shadow: var(--shadow-1); }
.v2-agp .agp-st-task:hover, .v2-agp .agp-st-task:focus-visible { border-color: var(--line-hover); }
/* Figures inside an answer (V10 Amendment 1, E): the document's figure, between paragraphs, its base under it. */
.v2-agp .agp-if { margin: 10px 0; }
.v2-agp .agp-if-base { margin-top: 6px; font: 400 var(--text-2xs)/1.4 var(--sans); color: var(--muted); font-variant-numeric: tabular-nums; }
/* Follow-ups (V10 Amendment 1, A): the same control as a starter, under the newest answer. */
.v2-agp .agp-fus { display: flex; flex-direction: column; margin-top: 10px; }
.v2-agp .agp-fus .agp-fu { margin-bottom: 6px; }
/* The mode button (AGT 2g; owner 09-26, #37 option A): quiet, under the field, its menu opening upward.
   Send stays the one primary action; the mode reads as a setting of the next send, not a second action. */
.v2-agp .agp-modes { position: relative; display: flex; margin: 4px 0 0; }
.v2-agp .agp-modes[hidden] { display: none; }
.v2-agp .agp-mode { display: inline-flex; align-items: center; gap: 4px; height: 22px; padding: 0 6px; border: 0;
  border-radius: var(--r-sm); background: none; color: var(--muted); font: 400 var(--text-xs)/22px var(--sans); cursor: pointer; }
.v2-agp .agp-mode:hover, .v2-agp .agp-mode[aria-expanded="true"] { color: var(--ink); }
.v2-agp .agp-mode:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.v2-agp .agp-mode-menu { position: absolute; left: 0; bottom: calc(100% + 4px); z-index: 8; width: min(300px, calc(100vw - 32px));
  padding: 4px; background: var(--pop); border: 1px solid var(--line-hover); border-radius: var(--r-md); box-shadow: var(--shadow-2); }
.v2-agp .agp-mode-menu[hidden] { display: none; }
.v2-agp .agp-mode-row { display: grid; grid-template-columns: 1fr auto; column-gap: 12px; row-gap: 2px; width: 100%; padding: 6px 10px;
  border: 0; border-radius: var(--r-sm); background: none; text-align: left; cursor: pointer; }
/* The shell's resting surfaces are clear (owner 09-19: --sunk is the surface): hover is the house's --wash-hover, and
   the pick carries the coral inset bar the active nav item keeps in both themes, with its label a weight heavier. */
.v2-agp .agp-mode-row:hover, .v2-agp .agp-mode-row:focus-visible { background: var(--wash-hover); }
.v2-agp .agp-mode-row.on { box-shadow: inset 2px 0 0 var(--accent); }
.v2-agp .agp-mode-row.on .l { font-weight: 600; }
.v2-agp .agp-mode-row .l { font: 500 var(--text-sm)/1.4 var(--sans); color: var(--ink); }
.v2-agp .agp-mode-row .c { font: 400 var(--text-xs)/1.6 var(--sans); color: var(--muted); font-variant-numeric: tabular-nums; }
.v2-agp .agp-mode-row .w { grid-column: 1 / -1; font: 400 var(--text-xs)/1.5 var(--sans); color: var(--muted); }
/* Settings, Agent: the model provider (AGT 2g-iii). One pressed provider; one with no key here says so in view. */
.v2-set-prov .opts { display: flex; flex-wrap: wrap; gap: 6px; margin: 2px 0 8px; }
.v2-set-prov .v2-btn[aria-pressed="true"] { background: var(--wash-accent); border-color: var(--line-hover); color: var(--ink); }
.v2-set-prov .v2-btn .k { margin-left: 6px; font: 400 var(--text-xs)/1 var(--sans); color: var(--muted); }
/* Corrections (AGT 5a): TRK's door on an answer WHY resolves as another company; what the company is, on hover. */
.v2-agp .agp-fixes { display: flex; flex-direction: column; margin-top: 10px; }
.v2-agp .agp-fixes .agp-fix { position: relative; margin-bottom: 6px; text-decoration: none; }
/* Moves (AGT 5c): the moves WHY's reasons open, the same control, above the follow-ups; the reason on hover. */
.v2-agp .agp-pgfixes { display: flex; flex-direction: column; margin-top: 10px; }
.v2-agp .agp-pgfixes .agp-pgfix { position: relative; margin-bottom: 6px; }
.v2-agp .agp-pgfixes .agp-pgfix-err { display: block; margin: -2px 0 8px; font: 400 var(--text-2xs)/1.4 var(--sans); color: var(--muted); }
.v2-agp .agp-mvs { display: flex; flex-direction: column; margin-top: 10px; }
.v2-agp .agp-mvs .agp-mv { position: relative; margin-bottom: 6px; }
.v2-agp .agp-work[data-row] { cursor: help; }

/* ── A choice that changes what is measured (V10 2a-iii) ─────────────────────────
   Under the option, before it is chosen: the tracked count it leaves against the plan,
   that it is asked every reading, and that the trend restarts. An answered question is a
   two-line record, the question over what was chosen, one line each. */
.v2-agp .agp-opt .c { grid-column: 2; font: 400 var(--text-2xs)/1.4 var(--sans); color: var(--muted);
  font-variant-numeric: tabular-nums; }

/* ── The inbox (V10 2b-i) ─────────────────────────────────────────────────────────
   Everything waiting on a person, one card each, drawn as the conversation's own cards
   are. Inside a card, in order: what and why, the evidence lines, the effect (warn ink when
   it lands outside Praised), the recommendation and a question's options, what happens
   after, then the verbs. */
.v2-agp .agp-inbox-h { display: flex; align-items: center; justify-content: space-between; margin: 0 0 10px; }
.v2-agp .agp-inbox-h .t { font: 600 var(--text-sm)/1.4 var(--sans); color: var(--ink); font-variant-numeric: tabular-nums; }
.v2-agp .agp-inbox { display: flex; flex-direction: column; gap: 10px; }
.v2-agp .agp-inbox-empty { font: 400 var(--text-xs)/1.5 var(--sans); color: var(--muted); }
.v2-agp .agp-inbox-ev { list-style: none; margin: 6px 0 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.v2-agp .agp-inbox-ev li { font: 400 var(--text-xs)/1.5 var(--sans); color: var(--ink); }
.v2-agp .agp-inbox-ev .r, .v2-agp .agp-inbox-rec .r { margin-left: 6px; color: var(--faint); font-size: var(--text-2xs); }
.v2-agp .agp-inbox-effect { margin-top: 6px; font: 400 var(--text-xs)/1.5 var(--sans); color: var(--muted); }
.v2-agp .agp-inbox-effect.out { color: var(--warn); }
.v2-agp .agp-inbox-rec { margin-top: 6px; font: 500 var(--text-xs)/1.5 var(--sans); color: var(--ink); }
.v2-agp .agp-inbox-alts { margin: 6px 0 0; padding-left: 18px; font: 400 var(--text-xs)/1.5 var(--sans); color: var(--ink); }
.v2-agp .agp-inbox-alts .d { margin-left: 6px; color: var(--muted); }
.v2-agp .agp-inbox-after { margin-top: 6px; font: 400 var(--text-2xs)/1.5 var(--sans); color: var(--faint); }

/* ── The work centre (V10 2b) ─────────────────────────────────────────────────────
   W's rows by W's own states, as the first screen draws its rows: a title over a fragment.
   A state's count sits beside its name; closed states read quieter than open ones. */
.v2-agp .agp-work-g .agp-st-ch .n { margin-left: 6px; color: var(--faint); font-variant-numeric: tabular-nums; }
.v2-agp .agp-work-g.closed .agp-st-row .t { color: var(--muted); }
/* Above the list, the lane and origin strips and the programme's "N shipped": fragments; a count above
   zero is a door to its rows, pressed while it holds the list. A zero reads quieter and opens nothing. */
.v2-agp .agp-prog { display: flex; flex-wrap: wrap; gap: 4px 12px; margin: 0 0 8px; }
.v2-agp .agp-prog-n { padding: 0; border: 0; background: none; font: 400 var(--text-2xs)/1.5 var(--sans);
  color: var(--muted); font-variant-numeric: tabular-nums; }
.v2-agp button.agp-prog-n { cursor: pointer; }
.v2-agp button.agp-prog-n:hover, .v2-agp button.agp-prog-n:focus-visible { color: var(--ink); text-decoration: underline; }
.v2-agp .agp-prog-n.on { color: var(--ink); font-weight: 600; }
.v2-agp .agp-prog-n.zero { color: var(--faint); }
/* The programme's one bar (work-bar.js) over the work centre's rows: "N shipped", the bar, its legend. */
.v2-agp .agp-progbar { display: flex; flex-direction: column; align-items: stretch; gap: 6px; margin: 0 0 10px; }
.v2-agp .agp-progbar > .agp-prog-n { align-self: flex-start; }
/* The lane and origin facets, one block of filters over the groups. */
.v2-agp .agp-facets { display: flex; flex-direction: column; gap: 4px; }
.v2-agp .agp-facets .agp-prog { margin: 0; }

/* ── A document's figure, to foundation §5 (V10 2c-iv) ────────────────────────────
   S's Chart / Table segment sits at the end of the figure's head. The table view is headed,
   and a row's name holds its hover, as the table cells did before. A point is a focus stop:
   the console's tip shows on focus as on hover, and the ring marks where the reader is. */
.v2-agp .agp-mfig-h .sb-viewseg { margin-left: auto; }
.v2-agp .agp-mtable thead th { padding: 4px 6px; text-align: left; font-weight: 500; color: var(--muted); border-bottom: 1px solid var(--line); }
.v2-agp .agp-mtable thead th:nth-child(n+2) { text-align: right; }
.v2-agp .agp-mtable tbody th { padding: 4px 6px; border-top: 1px solid var(--line); text-align: left; font-weight: 400; cursor: help; }
.v2-agp .agp-mtable tbody tr:first-child th { border-top: none; }
.v2-agp .agp-mp[data-row] { cursor: help; }
/* The figure's sentence is for a screen reader: in flow at S's 1px, as a block, never a line box
   of its own and with none of a paragraph's margins. */
.v2-agp .agp-mfig [data-agp-fig-text] { display: block; margin: 0; }
/* A point's hover, line by line, as a reply figure's is. */
.v2-agp .agp-mfig .agp-el { display: block; }
.v2-agp .agp-mfig .agp-el + .agp-el { margin-top: 4px; color: var(--faint); }


/* ── The workflow catalogue (V10 phase 3) ─────────────────────────────────────────
   A card per workflow, as the inbox draws its cards: the name over what it is for, then its
   fragments (what it leaves, where it ends, the outside line, its history), then Start and
   Details. The run form sits in the card it starts; a field is a label over its control. */
.v2-agp .agp-wf-g { gap: 8px; }
.v2-agp .agp-wf-g .agp-st-ch .n { margin-left: 6px; color: var(--faint); font-variant-numeric: tabular-nums; }
.v2-agp .agp-wf { gap: 4px; }
.v2-agp .agp-wf-t { font: 600 var(--text-sm)/1.4 var(--sans); color: var(--ink); }
.v2-agp .agp-wf-p { font: 400 var(--text-xs)/1.5 var(--sans); color: var(--ink); }
.v2-agp .agp-wf-m { font: 400 var(--text-2xs)/1.5 var(--sans); color: var(--muted); font-variant-numeric: tabular-nums; }
.v2-agp .agp-wf-m.out { color: var(--warn); }
.v2-agp .agp-wf-m.h { color: var(--faint); }
.v2-agp .agp-wf-a { display: flex; gap: 8px; margin-top: 6px; }
.v2-agp .agp-wf-d { margin-top: 6px; }
.v2-agp .agp-wf-d .r { display: block; font-variant-numeric: tabular-nums; }
.v2-agp .agp-wf-form { display: flex; flex-direction: column; gap: 8px; margin-top: 6px; }
.v2-agp .agp-wf-f { display: flex; flex-direction: column; gap: 3px; }
.v2-agp .agp-wf-f .l { font: 500 var(--text-xs)/1.4 var(--sans); color: var(--ink); }
.v2-agp .agp-wf-f .o { margin-left: 6px; font: 400 var(--text-2xs)/1.4 var(--sans); color: var(--faint); }
.v2-agp .agp-wf-f input, .v2-agp .agp-wf-f select { height: 28px; padding: 0 8px; min-width: 0; width: 100%;
  font: 400 var(--text-xs)/1.4 var(--sans); color: var(--ink); background: var(--canvas); border: 1px solid var(--line); border-radius: var(--r-sm); }
.v2-agp .agp-wf-f input:focus-visible, .v2-agp .agp-wf-f select:focus-visible { outline: 2px solid var(--focus, var(--ink)); outline-offset: 1px; }
.v2-agp .agp-st-wf { align-self: flex-start; }
/* The cap's door under its refusal line, left as the panel's other doors are (RD, the cap's review): flush in the
   panel, and at the line's left edge in full width, where the foot centres each child at 760px. */
.v2-agp .agp-capdoor { align-self: flex-start; text-align: left; }
.v2-agp .agp-wf-empty { display: flex; flex-direction: column; gap: 4px; }
.v2-agp .agp-act-note { font: 500 var(--text-2xs)/1.4 var(--sans); color: var(--ok); }

/* A History row's newest piece (V10 D item 15): its title, a door into the canvas. */
.v2-agp .agp-lpiece { max-width: 40%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* THE STANDING APPROVALS LIST (AGT Phase 4, agent-permissions.js): the rule's words, then where, who
   and when; a rule that covers nothing now, or was removed, is muted. Tokens only. */
.v2-agp .agp-perms { display: flex; flex-direction: column; }
.v2-agp .agp-perm { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--line-light); }
.v2-agp .agp-perm-w { grid-column: 1; font: 500 var(--text-sm)/1.45 var(--sans); color: var(--ink); overflow-wrap: anywhere; }
.v2-agp .agp-perm-m { grid-column: 1; font: 400 var(--text-xs)/1.5 var(--sans); color: var(--muted); overflow-wrap: anywhere; }
.v2-agp .agp-perm-rm { grid-column: 2; grid-row: 1 / span 3; align-self: center; }
.v2-agp .agp-perm.is-idle .agp-perm-w { color: var(--muted); }
.v2-agp .agp-perm-g { margin: 14px 0 4px; font: 600 var(--text-xs)/1.4 var(--sans); color: var(--muted); }
.v2-agp .agp-perm-auto { position: relative; display: flex; align-items: center; justify-content: flex-start; gap: 8px; margin: 0 0 12px; font: 500 var(--text-sm)/1.4 var(--sans); color: var(--ink); cursor: pointer; }
.v2-agp .agp-perm-auto input { flex: none; width: auto; margin: 0; }

/* The approval card's door to the standing approvals (AGT Phase 4): under the controls, at their edge. */
.v2-agp .agp-card-perm { display: block; margin: 8px 0 0 auto; }

/* Send's price (AGT 2e): the mode or skill the send goes under, and its ceiling last. The composer sits
   at the panel's foot with Send at its right edge, so the tip opens up and to the left. Stop spends
   nothing and shows none. */
.v2-agp .agp-submit .v2-tip { left: auto; right: -1px; top: auto; bottom: calc(100% + 8px); }
.v2-agp .agp-submit[data-state="stop"] .v2-tip, .v2-agp .agp-submit .v2-tip:empty { display: none !important; }