/* Only what this page has. Everything else — the tokens, the type scale, the
   shell, the rail, the info card, the stamps, the segmented control, the step
   footer, `.acts`, the re-auth modal and the draft notice — comes from
   `capture.css`, and no token is re-declared here (criterion 9). */

/* The five sections are the rail's content on this surface (criterion 39) AND
   they are the founder's own jump list, which they already were. A thing you
   click is a <button>; the shared `.rail-step` supplies the shape, and the two
   lines below only turn OFF the base button fill so it reads as a rail row.
   `.rail-step[aria-current="step"]` (two classes) still wins the ink block. */
.rail-steps button { display:block; width:100%; text-align:left; background:none;
                     color:var(--ink); font-weight:400; }
.rail-steps button:hover { background:rgba(26,26,26,.055); }
.rail-steps .name { display:block; }
/* The state is a word AND a mark (criterion 82): `.rail-step[data-done]` draws
   the check, this line keeps the word beside it legible — including reversed
   out of the ink block, where the shared muted grey would not be. */
.rail-steps .state { display:block; margin:.1rem 0 0; }
.rail-step[aria-current="step"] .state { color:rgba(255,255,255,.82); }
/* FC-1: a Review topic is ONE row — its name, then "n open" at the row's end — so a
   1280×720 window shows the whole sidebar (two-line rows showed four). */
a.review-topic { display:flex; align-items:baseline; gap:.5rem; padding-top:.45rem; padding-bottom:.45rem; }
a.review-topic .name { flex:1 1 auto; min-width:0; }
a.review-topic .state { flex:none; margin:0; font-size:var(--fs-hint); white-space:nowrap; }
/* FR-2.3's number, in the sketch's own place for it: under the rail's title,
   where `aisce_strategy_flow.png` puts "Framework v2.4". */
#progress { font-family:var(--mono); font-size:var(--fs-cap); color:var(--muted);
            letter-spacing:.06em; text-transform:uppercase;
            margin:0 0 .9rem; padding:0 .75rem; }

/* FR-2.6 keeps its own id and its own byte-exact sentence; inside the info card
   it must not ALSO carry the accent left rule it wears on `/start`, so the id's
   own rule is turned off here and the card's border is the only edge. */
.infocard p#banner { border-left:0; padding:0; margin:0; font-size:var(--fs-body); }

/* One step. The card grammar is capture.css's; what is added here is the item
   block, because a plural section is edited item by item (criterion 29) and each
   item needs an edge of its own to read as one thing. */
#step { border-top:0; padding-top:0; }
/* The sketch's stamp row: a filled mono `STEP 01` beside a muted `/ 05`, above
   a title at the full type scale. Criterion 45: the one-section entry gets no
   stamp row at all — that founder is not in a five-step run. */
.steprow { display:flex; align-items:center; gap:.55rem; margin:0 0 .9rem; }
.steprow .hint { margin:0; }
/* The last step has no "resume later" to offer, so its footer holds one button;
   `space-between` would push a lone primary to the left, where the sketch's
   footer never puts it. */
.formbar > :only-child { margin-left:auto; }
#step h1 { margin:0 0 .45rem; }
#step .lead { color:var(--muted); margin:0 0 2.25rem; }
.item-block { border-left:2px solid var(--line); padding:0 0 .2rem 1rem;
              margin:1.25rem 0 0; }
.item-block + .item-block { margin-top:1.5rem; }
.item-block .count { margin:0 0 .5rem; }
.item-block .drop-remove { margin-top:.9rem; }
/* A fieldset does not shrink below its content by default, which is a silent
   horizontal scrollbar at 375 (criterion 85). Scoped to the one control that is
   a fieldset rather than added to the shared class. */
.seg { min-width:0; }
#add-item { background:none; color:var(--ink); border:1px dashed var(--line);
            margin-top:1.25rem; }
#add-item:hover { border-color:var(--ink); border-style:solid; }
#step-acts { margin-top:2rem; }
#step-note { margin-top:.9rem; }
/* Story 5.4 AC-3 #17-#18: an answer box grows to its content (`form.js` sets the
   height on input), so it never scrolls inside itself and never needs a drag
   handle; the words wrap at 375 rather than clipping. */
.item-block textarea { resize:none; overflow:hidden; overflow-wrap:anywhere; }

/* Was a style="" attribute; moved here so style-src needs no 'unsafe-inline' (zap:pages:10055-6). */
#nav { margin-top: 3rem; }

/* ── Story 3.11 (slice 1): Review Inputs ────────────────────────────────────
   Only what the five topic pages and the summary add. The card, pill, stamp,
   band and field grammar are capture.css's; the words on every chip come from
   web/js/shared/workflow-labels.js, and colour is always the second carrier. */
a.rail-step { text-decoration:none; }
a.rail-step:hover { background:rgba(26,26,26,.055); }
a.rail-step[aria-current="step"]:hover { background:var(--ink); }
.review-band { margin-top:3rem; }
.review-band > .band-title { margin-bottom:1rem; }
/* Your materials (2026-09-30): one row per link or document, its name wrapping, Remove beside it. */
.materials-list { list-style:none; margin:1rem 0; padding:0; }
.materials-list li { display:flex; flex-wrap:wrap; align-items:center; gap:.5rem; padding:.5rem 0; border-top:1px solid var(--line); }
.materials-list .what { flex:1 1 16rem; word-break:break-all; }
.materials-unread { margin-top:1.5rem; }
.review-item { margin:0 0 1rem; }
.review-item:focus, .issue:focus { outline:2px solid var(--accent); outline-offset:2px; }
.review-q { margin:0 0 .8rem; font-weight:500; }
.review-choices { border:0; margin:0 0 1rem; padding:0; min-width:0; }
/* A4 (docs/16 §14): Review's choices are Capture's option tile (`.seg-card`,
   capture.css), one per row, left-aligned and in the body face — the global
   `label` rule would otherwise make each tile's words small and muted. */
.review-choices .seg-row, .issue-options .seg-row { flex-direction:column; gap:.3rem; }
/* FC-15: more than three options sit in two columns once each can be 14rem wide, so an
   open card fits one laptop screen (V1) without hiding a word. */
.review-choices .seg-row:has(> :nth-child(4)), .issue-options .seg-row:has(> :nth-child(4)) {
  display:grid; grid-template-columns:repeat(auto-fill, minmax(max(14rem, calc(50% - .3rem)), 1fr)); }
.review-choices .seg-card, .issue-options .seg-card { flex:none; margin:0; font-size:var(--fs-body);
                 color:var(--ink); letter-spacing:normal; text-transform:none; }
.review-choices .seg-body, .issue-options .seg-body { text-align:left; padding:.3rem .75rem; }
.review-choices .seg-label, .issue-options .seg-label { font-weight:400; }
.seg-input:disabled, .seg-input:disabled + .seg-body { cursor:not-allowed; }
.seg-input:disabled + .seg-body { color:var(--muted); }
.review-item textarea, .issue textarea { width:100%; box-sizing:border-box; resize:vertical;
                 overflow-wrap:anywhere; }
.review-item .field, .issue .field { margin-bottom:.8rem; }
/* FC-15: the answer box starts at two lines and grows as it is typed into (review-inputs.js). */
.review-item textarea, .issue textarea { min-height:3.6em; field-sizing:content; }
.review-acts { margin-top:.4rem; align-items:center; }
.review-note { margin:.6rem 0 0; }
.review-note .error { margin-top:0; }

/* An issue: the one card every page and the summary draw from the one array.
   FC-15 (Anthony 2026-09-29: an open card should "comfortably fit in the page at 100%
   zoom"): a tighter rhythm — .4rem between blocks, 1.45 leading — not less content. */
.issue { margin:0 0 1.25rem; line-height:1.45; }
.issue-chips { display:flex; flex-wrap:wrap; gap:.4rem; align-items:center; margin:0 0 .45rem; }
.issue-title { margin:0 0 .3rem; font-size:var(--fs-head); }
.issue-question { margin:.4rem 0 0; }
.issue-why { margin:.4rem 0 0; }
.issue-decision { margin:.5rem 0 0; }
.issue .notecard { margin:.4rem 0 0; }
/* Stage-2 increment: what is unclear, the supplied context quoted, options, the assessment. */
.issue-uncertainty { margin:0; }
.issue-quote { margin:.35rem 0 0; padding:.2rem 0 .2rem .8rem; border-left:3px solid var(--line, #e4e1da); overflow-wrap:anywhere; }
/* FC-15: the two quoted items sit side by side where the card is wide enough. */
.issue-quotes { display:grid; grid-template-columns:repeat(auto-fit, minmax(16rem, 1fr)); gap:0 1rem; }
.issue-options { margin:.5rem 0 0; padding:0; border:0; }
.issue-options legend { margin:0 0 .3rem; padding:0; }
.issue-assessment { margin:.35rem 0 0; }
.issue .acts { margin-top:.5rem; }
.issue .hint { margin-top:.35rem; }
/* FC-15: an open card that is wide enough splits in two — context left, answer right —
   so it fits one laptop screen (V1) without dropping a word. Narrower, it stacks. */
.issue { container-type:inline-size; }
@container (min-width:40rem) {
  .issue-body { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); gap:0 1.5rem; }
  .issue-answer > :first-child { margin-top:0; }
}

.review-stamp { display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; margin:0 0 1.5rem; }
.review-primary { margin:0 0 1rem; }
.review-primary .hint { margin-top:.6rem; }
.review-count { margin:0 0 1rem; }
.review-count p { margin:0 0 .3rem; }
.review-count ul, .review-pages { margin:0; padding-left:1.2rem; }
.review-pages li { margin:0 0 .35rem; }
.review-details { margin:2rem 0 0; border-top:1px solid var(--line); padding-top:1rem; }
.review-details > summary { cursor:pointer; font-weight:600; margin:0 0 1rem; }
.review-details > p { margin:0 0 .6rem; }
.leave-dialog { max-width:32rem; }
.leave-dialog h2 { margin-top:0; font-size:var(--fs-head); }

/* docs/16 §11's note, the one that heads a Review inputs page (R4 CHANGED; note 7's NEXT):
   a lifted paper strip, a mono kind-stamp, one sentence, one action. The stamp's colour is
   carried by its glyph (■, --sev-med per §11) so the words stay ink at full contrast. */
.review-note-top { display:flex; flex-wrap:wrap; align-items:center; gap:.6rem 1rem;
                   padding:1rem 1.25rem; margin:0 0 1.75rem; }
.review-note-top .note-kind { margin:0; font-family:var(--mono); font-size:var(--fs-cap);
                   letter-spacing:.08em; text-transform:uppercase; color:var(--ink); }
.review-note-top .note-kind::before { content:"■ "; color:#e65100; }
.review-note-top .note-line { margin:0; flex:1 1 20rem; }

/* C1 (docs/16 §14): a settled card is one line — status, the question, the answer — and a
   quiet Show; it drops flat (B2) so only the cards that still need the founder stand out. */
.issue-settled { display:flex; flex-wrap:wrap; align-items:center; gap:.3rem .8rem;
                 padding:.6rem 1rem; box-shadow:none; }
.issue-settled .issue-chips { margin:0; }
.issue-settled-line { margin:0; flex:1 1 24rem; overflow:hidden; text-overflow:ellipsis;
                 white-space:nowrap; }
.issue-settled button { padding:.3rem .8rem; font-size:var(--fs-hint); }

/* Density (Anthony, 2026-09-29) inside a card that still needs the founder: C1's quotes
   show two lines until clicked; the stages line is one line. */
.issue-quote { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
               overflow:hidden; cursor:pointer; }
.issue-quote.is-open { display:block; -webkit-line-clamp:unset; }
.issue-affects { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin:.4rem 0 0; }

/* Anthony, 2026-09-29: every question card collapses — by its corner icon, by a save, or by
   Previous / Next, which collapse it and open the neighbour. The icon sits at the card's
   top-right; Previous / Next sit at the far end of the Save row. */
.review-item:not(.issue-settled) { position:relative; }
.fold-btn { display:inline-flex; align-items:center; justify-content:center; padding:0; width:1.75rem; height:1.75rem;
            border-radius:var(--radius); background:none; color:var(--muted); border:1px solid var(--line); }
.fold-btn:hover { color:var(--ink); border-color:var(--ink); }
.review-item > .fold-btn { position:absolute; top:.7rem; right:.7rem; }
.review-item > .fold-btn + .review-q, .review-item > .fold-btn + .microcap { padding-right:2.25rem; }
.issue-chips > .fold-btn { margin-left:auto; }
.item-navs { display:flex; gap:.4rem; margin-left:auto; }
.item-nav { padding:.4rem .8rem; font-size:var(--fs-hint); border-color:var(--line); }
.card[id] { scroll-margin-top:5rem; }
.issue-settled-line { cursor:pointer; }

/* Analysis progress (Anthony, 2026-09-29): the run's real phases as steps, and a bar. One
   element in three sizes: the summary's hero, the right panel, a topic page's note. */
.progress { margin:.6rem 0 .2rem; }
.progress-steps { list-style:none; display:flex; flex-wrap:wrap; gap:.2rem .9rem; margin:0 0 .45rem; padding:0;
                  font-family:var(--mono); font-size:var(--fs-cap); letter-spacing:.04em; color:var(--muted); }
.progress-steps li::before { content:"○ "; }
.progress-steps li.done { color:var(--ink); }
.progress-steps li.done::before { content:"✓ "; color:var(--sev-ok); }
.progress-steps li.now { color:var(--ink); font-weight:700; }
.progress-steps li.now::before { content:"● "; }
.progress-track { height:.4rem; border-radius:999px; background:var(--fill); box-shadow:var(--press); overflow:hidden; }
.progress-fill { height:100%; width:0; border-radius:999px; background:var(--ink); transition:width .9s linear; }
.progress-label { margin:.4rem 0 0; font-size:var(--fs-hint); color:var(--muted); }
.progress--hero .progress-track { height:.75rem; }
.progress--hero .progress-steps { font-size:var(--fs-hint); }
.progress--compact .progress-steps { display:none; }
.progress--compact { margin:0 0 .6rem; }
.progress-hero { margin:0 0 1.5rem; }
.progress-hero h2 { margin:0 0 .3rem; font-size:var(--fs-head); }
.review-note-top .progress--slim { flex:1 1 100%; margin:0; }
@media (prefers-reduced-motion:reduce) { .progress-fill { transition:none; } }
