/* The team, owner and admin pages. Tokens, reset, pills, figures, tables, buttons and fields are in base.css. */
:root { --side:264px; }
body { font-feature-settings:"cv11"; }
.i { flex:none; vertical-align:-3px; }
a { text-decoration:none; }
@media (hover:hover) { a:hover { color:var(--accent-ink); text-decoration:underline; text-underline-offset:3px; } }
h1 { font-size:var(--text-3xl); line-height:var(--lh-tight); letter-spacing:var(--track-tight); font-weight:650; margin:var(--s1) 0 6px; text-wrap:balance; }
h2 { font-size:var(--text-xl); line-height:var(--lh-head); letter-spacing:var(--track-head); font-weight:650; margin:36px 0 10px; }
h3 { font-size:var(--text-base); line-height:var(--lh-snug); font-weight:650; margin:22px 0 6px; }
h4 { font-size:var(--text-md); line-height:var(--lh-snug); font-weight:650; margin:0 0 var(--s1); }
p { margin:var(--s2) 0; } p, li { max-width:74ch; }
ul, ol { padding-left:22px; } li { margin:3px 0; }
strong { font-weight:650; }
.muted { color:var(--muted); font-size:var(--text-sm); }
.lede { font-size:var(--text-lg); color:var(--ink-2); }
code { font:var(--text-sm)/1.5 var(--mono); }
hr { border:0; border-top:1px solid var(--line); margin:var(--s5) 0; }

/* ---- Shell: sidebar, page, footer ---- */
.shell { min-height:100vh; }
.side { position:fixed; inset:0 auto 0 0; width:var(--side); display:flex; flex-direction:column; gap:var(--s1); padding:14px 10px var(--s3);
  background:var(--bg); border-right:1px solid var(--line); overflow-y:auto; z-index:10; scrollbar-width:thin; }
.brand { display:inline-flex; align-items:center; gap:10px; padding:6px var(--s2) 14px; font-weight:700; font-size:var(--text-base); color:var(--ink); letter-spacing:var(--track-head); }
@media (hover:hover) { .brand:hover { color:var(--ink); text-decoration:none; } }
.mark { display:grid; place-items:center; width:26px; height:26px; border-radius:7px; background:var(--accent); color:var(--on-accent); font-size:var(--text-md); font-weight:700;
  box-shadow:var(--shadow-mark); }
.side-nav { display:flex; flex-direction:column; gap:1px; flex:1; }
.side-nav a { display:flex; align-items:center; gap:10px; min-height:var(--control); padding:6px 10px; border-radius:var(--r-sm); color:var(--ink-2); font-size:var(--text-md); font-weight:500; }
.side-nav a span:not(.n) { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.side-group a span:not(.n) { white-space:normal; line-height:1.3; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; line-clamp:2; }
.side-nav a .i { color:var(--faint); }
@media (hover:hover) { .side-nav a:hover { background:var(--hover); color:var(--ink); text-decoration:none; } }
.side-nav a[aria-current="page"] { background:var(--surface); color:var(--accent-ink); font-weight:600; box-shadow:var(--shadow); }
.side-nav a[aria-current="page"] .i { color:var(--accent); }
.side-nav .n { font-size:var(--text-xs); color:var(--faint); font-variant-numeric:tabular-nums; }
.side-group { margin-top:18px; display:flex; flex-direction:column; gap:1px; }
.side-title { margin:0 0 6px; padding:0 10px; display:grid; gap:1px; max-width:none; }
.side-title .t { font-size:var(--text-xs); font-weight:650; color:var(--ink); overflow-wrap:anywhere; }
.side-title .s { font-size:var(--text-xs); color:var(--muted); }
.who { border-top:1px solid var(--line); margin-top:var(--s3); padding:10px 6px 0; display:grid; gap:2px; font-size:var(--text-sm); }
.who-name { color:var(--muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; padding:0 var(--s1); }
.who form { margin:0; }
.who button.link { gap:var(--s2); min-height:var(--control); padding:0 var(--s1); color:var(--ink-2); text-decoration:none; font-size:var(--text-sm); justify-content:flex-start; }
@media (hover:hover) { .who button.link:not(:disabled):hover { color:var(--ink); background:transparent; } }
.page { min-height:100vh; display:flex; flex-direction:column; background:var(--surface); }
.has-side .page { margin-left:var(--side); background:var(--bg); }  /* cards and tables are white surfaces on a cool grey ground */
.bar-out { height:60px; display:flex; align-items:center; padding:0 var(--s5); border-bottom:1px solid var(--line); }
.bar-out .brand { padding:0; }
.main { flex:1; width:100%; max-width:1120px; padding:28px 40px 96px; }
.no-side .main { margin:0 auto; max-width:880px; }
.foot { border-top:1px solid var(--line); padding:14px 40px 20px; color:var(--faint); font-size:var(--text-sm); }
.foot p { margin:0; }

/* Breadcrumb links at the top of a page: the old "back" paragraph, kept as a quiet trail. */
.main > p:first-child:has(> a:only-child), .main > .draft + p:has(> a:first-child):not(:has(> :not(a))) { font-size:var(--text-sm); margin:calc(-1 * var(--s3)) 0 0; }
.main > p:first-child:has(> a:only-child) > a, .main > .draft + p:has(> a:first-child):not(:has(> :not(a))) > a { display:inline-flex; align-items:center; min-height:var(--control); }

/* ---- Tabs (Pack sections) ---- */
.subnav { border-bottom:1px solid var(--line); background:var(--surface); position:sticky; top:0; z-index:5; }
.subnav .wrap { display:flex; gap:var(--s1); overflow-x:auto; scrollbar-width:none; padding:0 var(--s6); max-width:1120px; }
.subnav a { flex:none; display:inline-flex; align-items:center; gap:6px; min-height:46px; padding:0 10px; font-size:var(--text-md); color:var(--muted); font-weight:500;
  border-bottom:2px solid transparent; margin-bottom:-1px; white-space:nowrap; }
@media (hover:hover) { .subnav a:hover { color:var(--ink); text-decoration:none; } }
.subnav a[aria-current="page"] { color:var(--accent-ink); font-weight:600; border-bottom-color:var(--accent); }

/* ---- Notices ---- */
.draft, .error, .attn, .msg, .note { display:flex; gap:10px; align-items:flex-start; border:1px solid; border-radius:var(--r); padding:10px 14px; max-width:none; font-size:var(--text-md); margin:var(--s3) 0; }
.draft { background:var(--warn-bg); border-color:var(--warn-line); color:var(--warn-ink); margin-top:0; }
.draft .i { margin-top:2px; }
.error { background:var(--bad-bg); border-color:var(--bad-line); color:var(--bad-ink); }
.attn { background:var(--warn-bg); border-color:var(--warn-line); color:var(--warn-ink); }
.msg { background:var(--ok-bg); border-color:var(--ok-line); color:var(--ok-ink); }
.note { background:var(--sunken); border-color:var(--line); color:var(--ink-2); }
.error a, .attn a, .msg a, .draft a { color:inherit; text-decoration:underline; }
p.error, p.attn, p.msg, p.note, p.draft { display:block; }
/* A summary of the problems on a form: what went wrong, then a link to each field. */
div.error { display:block; } div.error p { margin:0; } div.error ul { margin:var(--s1) 0 0; padding-left:20px; }
p.draft:has(.i) { display:flex; }

/* ---- Buttons ---- */
.row { display:flex; flex-wrap:wrap; gap:var(--s2); align-items:center; }
.row.between { justify-content:space-between; } .row.spaced { margin-top:var(--s5); }
.below { margin-top:var(--s2); } select.narrow { max-width:220px; }
.after { margin-top:var(--s4); display:flex; gap:var(--s4); align-items:center; flex-wrap:wrap; }

/* ---- Forms ---- */
form.stack, .stack { display:grid; gap:var(--s2); max-width:560px; }
table.stack { display:table; max-width:none; }  /* a table that stacks on a phone is a table here */
form.stack > div:has(> button) { margin-top:var(--s2); }
label { font-weight:600; font-size:var(--text-md); color:var(--ink); }
.help { color:var(--muted); font-size:var(--text-sm); font-weight:400; margin:0; }
textarea { min-height:88px; resize:vertical; line-height:1.5; }
textarea.yaml { font:var(--text-sm)/1.55 var(--mono); white-space:pre; overflow-wrap:normal; overflow-x:auto; max-width:none; }
input.code { font-size:var(--text-3xl); letter-spacing:.35em; max-width:220px; font-variant-numeric:tabular-nums; text-align:center; }
input.short { max-width:200px; }
fieldset { border:0; padding:0; margin:0; min-width:0; }
legend { font-weight:600; padding:0; font-size:var(--text-base); }
.choice { display:flex; align-items:flex-start; gap:10px; min-height:var(--control); padding:10px var(--s3); border:1px solid var(--line-2); border-radius:var(--r); font-weight:400; font-size:var(--text-base);
  cursor:pointer; max-width:560px; background:var(--surface); transition:border-color .15s var(--ease), background-color .15s var(--ease); }
@media (hover:hover) { .choice:hover { border-color:var(--field); background:var(--sunken); } }
.choice input { width:17px; height:17px; margin:2px 0 0; flex:none; }
.choice:has(input:checked) { border-color:var(--accent); background:var(--accent-soft); box-shadow:0 0 0 1px var(--accent) inset; }
.choice:has(input:focus-visible) { outline:2px solid var(--accent); outline-offset:2px; }
.choices { display:grid; gap:6px; margin-top:6px; }
.choices.inline { display:flex; flex-wrap:wrap; } .choices.inline .choice { min-width:110px; }
input[type=file] { font:inherit; font-size:var(--text-md); max-width:100%; color:var(--muted); }
input[type=file]::file-selector-button { font:inherit; font-size:var(--text-md); min-height:var(--control); padding:0 14px; margin-right:10px; border:1px solid var(--line-2); background:var(--surface);
  color:var(--ink); border-radius:var(--r-sm); font-weight:600; cursor:pointer; box-shadow:var(--shadow); }
@media (hover:hover) { input[type=file]::file-selector-button:hover { background:var(--sunken); } }

.q { padding:20px 0; border-bottom:1px solid var(--line); display:grid; gap:6px; }
.q:last-of-type { border-bottom:0; }
.q[hidden] { display:none; }

/* Onboarding steps */
.steps { display:flex; gap:6px; flex-wrap:wrap; list-style:none; padding:0; margin:14px 0 10px; }
.steps li { margin:0; }
.steps a { display:inline-flex; align-items:center; gap:var(--s2); min-height:var(--control); padding:0 var(--s3); border:1px solid var(--line-2); border-radius:999px; font-size:var(--text-sm); color:var(--ink-2); background:var(--surface); }
@media (hover:hover) { .steps a:hover { text-decoration:none; border-color:var(--field); color:var(--ink); } }
.steps a[aria-current="step"] { border-color:var(--accent); background:var(--accent-soft); font-weight:600; color:var(--accent-ink); }
.steps .n { font-variant-numeric:tabular-nums; color:var(--faint); font-weight:600; }
.steps .done .n { color:var(--ok); }

/* ---- Pills ---- */
/* ---- Figures ---- */
.meter { background:var(--neutral-bg); height:6px; border-radius:3px; overflow:hidden; min-width:90px; }
.meter div { background:var(--accent); height:100%; border-radius:3px; }

/* ---- Tables ---- */
table { font-size:var(--text-md); }
@media (hover:hover) { tbody tr:hover td { background:var(--row-hover); } }
.kv { font-size:var(--text-md); }

/* ---- Lists of things you open ---- */
.list { list-style:none; padding:0; margin:10px 0; border:1px solid var(--line); border-radius:var(--r); background:var(--surface); box-shadow:var(--shadow); overflow:hidden; }
.list > li { max-width:none; margin:0; border-bottom:1px solid var(--line); }
.list > li:last-child { border-bottom:0; }
.item { display:grid; grid-template-columns:1fr auto; gap:3px var(--s4); align-items:center; padding:var(--s3) var(--s4); min-height:56px; color:var(--ink); }
a.item { transition:background-color .12s var(--ease); }
@media (hover:hover) { a.item:hover { background:var(--sunken); text-decoration:none; color:var(--ink); } }
@media (hover:hover) { a.item:hover .t { color:var(--accent-ink); } }
.item .t { font-weight:600; font-size:var(--text-base); }
.item .s { grid-column:1; color:var(--muted); font-size:var(--text-sm); }
.item .p { grid-row:1 / span 2; grid-column:2; display:flex; gap:6px; flex-wrap:wrap; justify-content:flex-end; align-items:center; }
.item .p .muted { font-size:var(--text-sm); font-variant-numeric:tabular-nums; }

/* ---- Cards and Requests ---- */
.card { border:1px solid var(--line); border-radius:var(--r); padding:6px 20px var(--s4); margin:var(--s4) 0; background:var(--surface); box-shadow:var(--shadow); }
.card.soft { background:var(--sunken); box-shadow:none; }
.card > h3:first-child, .card > h2:first-child { margin-top:14px; }
.card > p:first-child { margin-top:var(--s3); }
.req { border:1px solid var(--line); border-radius:var(--r); padding:var(--s4) 18px; margin:var(--s3) 0; display:grid; gap:var(--s2); scroll-margin-top:72px; background:var(--surface); box-shadow:var(--shadow); }
.req.done { background:var(--sunken); box-shadow:none; }
.req .head { display:flex; flex-wrap:wrap; gap:6px 10px; align-items:baseline; justify-content:space-between; }
.req h3 { margin:0; font-size:var(--text-base); }
.req details { border-top:1px solid var(--line); margin-top:var(--s1); }
details > summary { list-style:none; }
details > summary::-webkit-details-marker { display:none; }
summary { cursor:pointer; padding:10px 0; min-height:var(--control); font-weight:600; font-size:var(--text-md); color:var(--accent); display:flex; align-items:center; gap:6px; }
summary::before { content:""; width:6px; height:6px; border-right:1.6px solid currentColor; border-bottom:1.6px solid currentColor; transform:rotate(-45deg); transition:transform .15s var(--ease); margin:0 var(--s1) 0 2px; }
details[open] > summary::before { transform:rotate(45deg); }
@media (hover:hover) { summary:hover { color:var(--accent-ink); } }
.another { margin-top:var(--s5); }
.files { list-style:none; padding:0; margin:var(--s1) 0; font-size:var(--text-md); }
.files li { padding:6px 0; display:flex; gap:var(--s2); flex-wrap:wrap; align-items:center; border-bottom:1px solid var(--line); max-width:none; }
.files li:last-child { border-bottom:0; }

/* ---- Two columns: work and its context ---- */
.two { display:grid; grid-template-columns:minmax(0, 1fr) 340px; gap:var(--s6); align-items:start; }
/* Sticky beside the work, but never taller than the window: a long aside scrolls on its own, so every card in it can be reached.
   The small padding keeps the cards' shadows and focus rings inside the scroll box. */
.aside { position:sticky; top:20px; max-height:calc(100vh - 40px); overflow-y:auto; scrollbar-width:thin; padding:3px; margin:-3px; }
blockquote { margin:var(--s2) 0; padding:10px 14px; background:var(--sunken); border:1px solid var(--line); border-radius:var(--r-sm); font-size:var(--text-md); max-width:none; color:var(--ink-2); }
blockquote.kept-lines { white-space:pre-wrap; }  /* a message as it was written, line by line */
blockquote cite { display:block; color:var(--muted); font-size:var(--text-sm); font-style:normal; margin-top:6px; }
.sub { border-top:1px solid var(--line); padding:14px 0; }
.sub h4 { margin:0 0 var(--s1); font-size:var(--text-base); font-weight:600; }
pre.mail { white-space:pre-wrap; font:inherit; font-size:var(--text-md); background:var(--sunken); border:1px solid var(--line); border-radius:var(--r); padding:var(--s3) 14px; margin:var(--s2) 0; }
div.narrow { max-width:400px; margin:var(--s7) auto; padding:28px 28px var(--s5); border:1px solid var(--line); border-radius:var(--r-lg); background:var(--surface); box-shadow:var(--shadow-up); }
.narrow h1 { font-size:var(--text-2xl); }
.narrow form.stack { max-width:none; }
.narrow input { max-width:none; }
.narrow button.primary { width:100%; }
.no-side .page { background:var(--bg); }
.no-side .bar-out { background:var(--surface); }

/* ---- Page header: breadcrumb, title with its state, the next action ---- */
.crumbs { display:flex; flex-wrap:wrap; align-items:center; gap:0 6px; font-size:var(--text-sm); color:var(--muted); margin:calc(-1 * var(--s3)) 0 0; }
.crumbs a { display:inline-flex; align-items:center; min-height:var(--control); color:var(--muted); } @media (hover:hover) { .crumbs a:hover { color:var(--accent-ink); } }
.crumbs > span:not(.sep):last-of-type { color:var(--ink-2); }
.crumbs .sep { margin:0 var(--s1); color:var(--faint); }
.ph { display:flex; flex-wrap:wrap; align-items:flex-start; justify-content:space-between; gap:var(--s3) var(--s5); padding-bottom:var(--s4); margin-bottom:var(--s4); border-bottom:1px solid var(--line); }
.ph-text { min-width:0; flex:1 1 420px; }
.ph h1 { margin:0; }
.ph h1 .muted { font-size:var(--text-sm); font-weight:500; letter-spacing:0; margin-left:6px; font-variant-numeric:tabular-nums; }
.ph-meta { display:flex; flex-wrap:wrap; align-items:center; gap:6px var(--s2); margin:10px 0 0; max-width:none; }
.ph-actions { display:flex; gap:var(--s2); align-items:center; flex-wrap:wrap; }
.ph-actions form { margin:0; }

/* ---- Review Packet ---- */
.packet { grid-template-columns:minmax(0,1fr) 320px; margin-top:var(--s2); }
.packet-main > h2:first-child, .packet-main > .card:first-child { margin-top:0; }
.summary { padding:14px 20px; }
.summary > p:first-child { font-size:var(--text-lg); color:var(--ink); margin-top:var(--s1); }
.review > p:first-child { margin-top:14px; }
.confirm-card { border-color:var(--accent-line); background:var(--accent-soft); }
form.confirm { margin:var(--s1) 0 var(--s1); max-width:none; }
form.confirm textarea { max-width:none; font-size:var(--text-md); }
form.confirm button { width:100%; }
form.confirm p { margin:0; }
/* Auto layout: the id, state and files columns take what they need, "What it checks" takes the rest.
   When the packet's main column is narrow, each Sub-check stacks: id, then the text, its state and its files. */
.packet-main { container-type:inline-size; }
.sc-table { font-variant-numeric:normal; }
.sc-table th:nth-child(1), .sc-table th:nth-child(3) { width:1%; } .sc-table th:nth-child(4) { width:10rem; }
.sc-table .sc-row td:nth-child(3) { white-space:nowrap; }
.sc-table .sc-files { max-width:10rem; }
.sc-table tbody { border-bottom:1px solid var(--line); } .sc-table tbody:last-child { border-bottom:0; }
@media (hover:hover) { .sc-table tbody tr:hover td { background:none; } }
.sc-table .sc-row td { border-bottom:0; padding-bottom:var(--s1); }
.sc-table .sc-row td:nth-child(2) { color:var(--ink-2); }
.sc-table .sc-files .chip { max-width:100%; }
.sc-table .sc-id strong { display:inline-grid; place-items:center; min-width:22px; height:22px; border-radius:6px; background:var(--neutral-bg); font-size:var(--text-sm); color:var(--ink-2); }
.sc-table .sc-more td { padding-top:0; }
.sc-table .sc-more p { margin:var(--s1) 0; }
.sc-table .sc-more details > summary { padding:6px 0; min-height:var(--control); }
.sc-table td .chip { margin:0 var(--s1) var(--s1) 0; }
@container (max-width:640px) {
  .sc-table, .sc-table tbody, .sc-table tr, .sc-table td { display:block; }
  .sc-table thead { display:none; }
  .sc-table .sc-row { display:grid; grid-template-columns:auto minmax(0,1fr); gap:var(--s2) var(--s3); padding:var(--s3) var(--s4) 0; }
  .sc-table .sc-row td { padding:0; }
  .sc-table .sc-row td:nth-child(1) { grid-row:span 3; }
  .sc-table .sc-row td.sc-files { display:flex; flex-wrap:wrap; align-items:center; gap:var(--s1) var(--s2); max-width:none; }
  .sc-table .sc-files::before { content:"Files"; color:var(--muted); font-size:var(--text-sm); }
  .sc-table td.sc-files .chip { margin:0; }
  .sc-table .sc-more td { padding:var(--s1) var(--s4) var(--s2); }
}
.chip { display:inline-flex; align-items:center; gap:6px; max-width:220px; padding:2px var(--s2) 2px 3px; border:1px solid var(--line-2); border-radius:999px; background:var(--surface);
  font-size:var(--text-sm); font-weight:500; color:var(--ink-2); white-space:nowrap; }
.chip .t { min-width:0; overflow:hidden; text-overflow:ellipsis; }
/* A file chip stays small to look at; its hit area is 44px tall. So is each row of Evidence cited, which opens as a whole. */
a.chip { position:relative; }
a.chip::after { content:""; position:absolute; left:0; right:0; top:calc((100% - var(--control)) / 2); bottom:calc((100% - var(--control)) / 2); }
.chip .ref { flex:none; font:600 var(--text-xs)/1 var(--mono); padding:3px 5px; border-radius:999px; background:var(--accent-soft); color:var(--accent-ink); }
@media (hover:hover) { a.chip:hover { border-color:var(--accent-line); background:var(--accent-soft); color:var(--accent-ink); text-decoration:none; } }
.packet-side { display:grid; gap:14px; top:20px; }
.side-card { border:1px solid var(--line); border-radius:var(--r); padding:var(--s1) var(--s4) var(--s3); background:var(--surface); box-shadow:var(--shadow); font-size:var(--text-sm); }
.side-card h2 { font-size:var(--text-xs); text-transform:uppercase; letter-spacing:var(--track-caps); color:var(--muted); margin:var(--s3) 0 var(--s2); font-weight:650; }
.side-card ul, .side-card ol { padding-left:18px; margin:6px 0; } .side-card li { margin:var(--s1) 0; }
.side-card p { font-size:var(--text-sm); }
.files.ev li { flex-wrap:nowrap; align-items:flex-start; gap:10px; position:relative; min-height:var(--control); }
.files.ev a.t::after { content:""; position:absolute; inset:0; }
.files.ev .ref { flex:none; font:600 var(--text-xs)/1 var(--mono); padding:5px 6px; border-radius:5px; background:var(--accent-soft); color:var(--accent-ink); }
.files.ev .src { display:grid; min-width:0; } .files.ev .t { font-weight:550; color:var(--ink); overflow-wrap:anywhere; }
@media (hover:hover) { .files.ev a.t:hover { color:var(--accent-ink); } }
@media (max-width:1100px) { .packet { grid-template-columns:minmax(0,1fr) 280px; } }
@media (max-width:900px) { .packet { grid-template-columns:1fr; } }

@media (max-width:1100px) { .main { padding:var(--s5) 28px 96px; } .two { grid-template-columns:minmax(0,1fr) 300px; gap:var(--s5); } }
@media (max-width:900px) {
  .side { position:sticky; top:0; inset:auto; width:auto; height:auto; flex-direction:row; align-items:center; gap:var(--s2); padding:var(--s2) var(--s3); overflow-x:auto; border-right:0; border-bottom:1px solid var(--line); }
  .brand { padding:0 6px 0 0; } .brand { font-size:0; gap:0; } .brand .mark { font-size:var(--text-md); }
  .side-nav { flex-direction:row; align-items:center; gap:2px; flex:none; }
  .side-group { flex-direction:row; margin:0; padding-left:var(--s2); border-left:1px solid var(--line); gap:2px; }
  .side-title { display:none; }
  .side-nav a { white-space:nowrap; min-height:var(--control); padding:6px var(--s2); }
  .side-nav a span:not(.n) { overflow:visible; display:inline; white-space:nowrap; }
  .who { border:0; margin:0; padding:0; display:flex; } .who-name { display:none; }
  .has-side .page { margin-left:0; }
  .two { grid-template-columns:1fr; } .aside { position:static; max-height:none; overflow:visible; }
  .main { padding:20px var(--s4) 88px; } .foot { padding:14px var(--s4) 20px; }
  .subnav .wrap { padding:0 var(--s2); }
}
@media (max-width:700px) {
  h1 { font-size:var(--text-2xl); } .kv { grid-template-columns:1fr; gap:0; } .kv dd { margin-bottom:10px; }
  .item { grid-template-columns:1fr; } .item .p { grid-row:auto; grid-column:1; justify-content:flex-start; }
  table.stack, table.stack tbody { display:block; } table.stack tr:first-child { display:none; }
  table.stack tr { display:block; border-bottom:1px solid var(--line); padding:10px var(--s3); }
  table.stack td { display:block; border:0; padding:2px 0; text-align:left; }
  table.stack td:first-child { font-weight:600; }
  table.stack td[data-label]::before { content:attr(data-label) ": "; color:var(--muted); font-size:var(--text-sm); font-weight:400; }
}

/* ---- Overview tiles and review progress ---- */
.tiles { display:grid; grid-template-columns:repeat(auto-fill, minmax(200px, 1fr)); gap:10px; margin:var(--s4) 0 var(--s2); }
.tiles a { display:grid; grid-template-columns:auto 1fr; gap:2px 10px; padding:var(--s3) 14px; border:1px solid var(--line); border-radius:var(--r); background:var(--surface); box-shadow:var(--shadow);
  color:var(--ink); transition:border-color .15s var(--ease), box-shadow .15s var(--ease), transform .15s var(--ease); }
.tiles a .i { grid-row:span 2; color:var(--accent); margin-top:2px; }
.tiles a .t { font-weight:600; font-size:var(--text-md); } .tiles a .s { font-size:var(--text-sm); color:var(--muted); }
@media (hover:hover) { .tiles a:hover { text-decoration:none; border-color:var(--accent-line); box-shadow:var(--shadow-up); transform:translateY(-1px); } }
.progress2 { display:grid; grid-template-columns:1fr 1fr; gap:6px var(--s4); margin:calc(-1 * var(--s1)) 0 18px; max-width:560px; }
.progress2 .meter.two-tone div { background:var(--ok); }
.progress2 .muted { font-size:var(--text-sm); }

/* ---- Intake overview ---- */
.progress-card { display:grid; gap:10px; padding:var(--s4) 18px; margin:var(--s4) 0; border:1px solid var(--line); border-radius:var(--r); background:var(--surface); box-shadow:var(--shadow); max-width:560px; }
.pc-figure { display:flex; align-items:baseline; gap:10px; }
.pc-figure .big { font-size:var(--text-4xl); line-height:var(--lh-tight); font-weight:650; letter-spacing:var(--track-tight); font-variant-numeric:tabular-nums; }
.big-meter { height:8px; }
.meter.mini { display:block; width:120px; height:4px; min-width:0; }
.meter.mini span { display:block; height:100%; background:var(--ok); border-radius:2px; }
.sec-p { flex-direction:column; align-items:flex-end; gap:6px; }
.item .tick { display:inline-grid; place-items:center; width:18px; height:18px; border-radius:50%; background:var(--ok-bg); color:var(--ok); margin-right:var(--s2); vertical-align:-3px; }
.dropzone { padding:var(--s4); border:1.5px dashed var(--line-2); border-radius:var(--r); background:var(--sunken); justify-content:space-between; }
@media (max-width:700px) { .sec-p { align-items:flex-start; } }

/* ---- Evidence ---- */
.ev-item:target { border-color:var(--accent); box-shadow:var(--ring); }
.ev-item blockquote cite { max-height:7.5em; overflow:auto; scrollbar-width:thin; }
.passages { border-top:1px solid var(--line); }
.passages[open] > summary { margin-bottom:var(--s1); }