/* Same look as CFOP Finder (CFOPFinder/index.html): public-records tools are blue on cool neutral greys, in Archivo.
   Soft layout: hairlines and small radii instead of 2px boxes; a white zone (header + search) over a grey zone
   (results). Keep the color tokens in sync with CFOP Finder's. */
:root {
  --bg: #f3f4f6;
  --surface: #ffffff;
  --surface-2: #eceef1;
  --ink: #1b1f24;
  --ink-2: #4a5059;
  --muted: #6f7680;
  --line: #dde1e6;
  --accent: #1d4f91;
  --accent-strong: #2f6fd6;
  --accent-soft: #e6effb;
  --accent-ink: #ffffff;
  --hl: #ffe39a;
  --hl-ink: #1b1f24;
  --hl-strong: #f5b700;        /* the current match */
  /* Each source's color: its tab, section bands, stripes, chips and count columns. */
  --t-stat: #1d4f91;
  --t-rules: #b5476b;
  --t-fac: #2e9a82;
  --t-cfops: #c4881c;
  --t-forms: #6a7f1e;
  --t-fed: #4b5f8a;
  --t-cases: #2f6fd6;
  --t-changes: #7a4fc4;        /* Law Changes, and every "pending change" marker elsewhere */
  /* Status: ok (checked, granted), attention (waiting, changed, a past-day preview), problem (failed, struck, challenged). */
  --ok: var(--ok);
  --warn: var(--warn);
  --bad: var(--bad);
  --font-ui: "Archivo", "Segoe UI", system-ui, -apple-system, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "Cascadia Mono", Consolas, monospace;
  --r: 5px;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #15181c; --surface: #1c2026; --surface-2: #252a31; --ink: #eceff3; --ink-2: #c1c7cf; --muted: #8f97a1; --line: #323840;
    --accent: #8db8f5; --accent-strong: #6aa3f0; --accent-soft: #1a2a40; --accent-ink: #0b1a2e; --hl: #6b5410; --hl-ink: #fff4cc;
    --t-stat: #8db8f5; --t-rules: #e48aa8; --t-fac: #5fc9ae; --t-cfops: #e2b25a; --t-forms: #a9c25a; --t-fed: #9fb0d6; --t-cases: #7fb0f5; --t-changes: #b597ef;
    --ok: #4cc27f; --warn: #f0a23b; --bad: #e46b5d; --hl-strong: #c99a14;
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --bg: #15181c; --surface: #1c2026; --surface-2: #252a31; --ink: #eceff3; --ink-2: #c1c7cf; --muted: #8f97a1; --line: #323840;
  --accent: #8db8f5; --accent-strong: #6aa3f0; --accent-soft: #1a2a40; --accent-ink: #0b1a2e; --hl: #6b5410; --hl-ink: #fff4cc;
  --t-stat: #8db8f5; --t-rules: #e48aa8; --t-fac: #5fc9ae; --t-cfops: #e2b25a; --t-forms: #a9c25a; --t-fed: #9fb0d6; --t-cases: #7fb0f5; --t-changes: #b597ef;
  --ok: #4cc27f; --warn: #f0a23b; --bad: #e46b5d; --hl-strong: #c99a14;
  color-scheme: dark;
}

*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--ink); font-family: var(--font-ui); font-size: 15px; line-height: 1.5; }
a { color: var(--accent); text-underline-offset: 2px; }
button, input { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--accent-strong); outline-offset: 2px; }
h1, h2, h3 { text-wrap: balance; margin: 0; }
mark { background: var(--hl); color: var(--hl-ink); border-radius: 3px; padding: 0 1px; }
.wrap { max-width: 1180px; margin: 0 auto; padding-inline: 16px; }
.mono { font-family: var(--font-mono); font-variant-numeric: tabular-nums; }

/* Header */
.top { position: sticky; top: 0; z-index: 20; background: var(--surface); box-shadow: 0 1px 0 var(--line); }
.top .wrap { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 24px; padding-block: 12px 10px; }
.brand { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.brand h1 { font-size: 20px; font-weight: 800; letter-spacing: -.01em; }
.brand h1 a { color: inherit; text-decoration: none; }
.brand h1 span { color: var(--accent); }
.brand p { margin: 0; color: var(--muted); font-size: 13px; }
.sitelink { margin-left: auto; align-self: center; font-size: 13px; color: var(--muted); text-decoration: none; white-space: nowrap; }
.sitelink:hover { color: var(--accent); }
.sitelink .lockup { font-weight: 800; letter-spacing: -0.02em; color: var(--ink); }
.sitelink .lockup .m { color: var(--muted); }
.sitelink .lockup .esq { background: #ec3013; color: #fff;  /* brand mark stays red */ padding: 0 0.16em; margin: 0 0.05em; }
@media (max-width: 640px) { .sitelink { margin-left: 0; } }

/* Search zone (white) */
.searchbar { background: var(--surface); box-shadow: 0 0 0 100vmax var(--surface); clip-path: inset(0 -100vmax); padding: 20px 0 22px; border-bottom: 1px solid var(--line); display: grid; gap: 12px; }
.intro { margin: 0; max-width: 92ch; color: var(--ink-2); font-size: 14px; text-wrap: pretty; }
.qbox { position: relative; display: flex; gap: 8px; }
.qbox svg { position: absolute; left: 14px; top: 28px; transform: translateY(-50%); color: var(--accent); pointer-events: none; }
#q, #lawq { flex: 1; min-width: 0; height: 56px; padding: 0 16px 0 46px; font-size: 18px; border: 1.5px solid color-mix(in srgb, var(--accent) 45%, var(--line)); border-radius: var(--r); background: var(--surface); box-shadow: 0 1px 3px rgba(16, 24, 40, .08), 0 2px 8px rgba(16, 24, 40, .05); }
#q:focus, #lawq:focus { background: var(--surface); border-color: var(--accent); outline: none; box-shadow: 0 0 0 3px var(--accent-soft); }
.qbox button { height: 56px; padding: 0 22px; border: 0; border-radius: var(--r); background: var(--accent); color: var(--accent-ink); font-weight: 700; cursor: pointer; }
.qbox button:hover { background: var(--accent-strong); }
.hint { margin: 0; font-size: 12.5px; color: var(--muted); max-width: 92ch; text-wrap: pretty; }
.hint code { font-family: var(--font-mono); background: var(--surface-2); padding: 1px 5px; border-radius: 3px; color: var(--ink-2); }
@media (max-width: 520px) {
  .qbox { flex-direction: column; }
  #q, #lawq { flex: none; height: 50px; font-size: 16px; }  /* stacked, flex: 1 would squash the box to its text */
  .qbox svg { top: 25px; }
  .qbox button { height: 44px; }
}

/* Results zone (grey): hanging gutter, appeal number left, snippet aligned on one edge */
main { padding-bottom: 48px; }
#status { margin: 28px 0 4px; font-size: 13px; color: var(--muted); font-weight: 500; display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
#status strong { color: var(--ink); }
.hit { display: grid; grid-template-columns: 128px minmax(0, 1fr) auto; column-gap: 20px; border-top: 1px solid var(--line); padding: 12px 0 14px; }
#results > .hit:first-child { border-top: 0; }
.hit .num { grid-column: 1; font-family: var(--font-mono); font-weight: 600; font-size: 15px; color: var(--accent); text-decoration: none; overflow-wrap: anywhere; }
.hit .num:hover { text-decoration: underline; }
.hit-body { grid-column: 2; min-width: 0; }
.hit-meta { grid-column: 3; font-family: var(--font-mono); font-size: 12px; color: var(--muted); white-space: nowrap; text-align: right; line-height: 1.6; }
.hit-snip { margin: 0; max-width: 78ch; color: var(--ink-2); line-height: 1.6; font-size: 14.5px; overflow-wrap: anywhere; }
.hit-links { display: flex; flex-wrap: wrap; gap: 4px 18px; margin-top: 10px; font-size: 13px; font-weight: 600; }
.hit-links a { text-decoration: none; }
.hit-links a:hover { text-decoration: underline; }
@media (max-width: 640px) {
  .hit { grid-template-columns: minmax(0, 1fr); row-gap: 6px; }
  .hit .num, .hit-body, .hit-meta { grid-column: 1; }
  .hit-meta { white-space: normal; }
}

/* Pagination */
#pagination { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; margin-top: 8px; }
.page-btn { min-width: 36px; height: 34px; padding: 0 10px; border: 1px solid var(--line); border-radius: var(--r); background: var(--surface); color: var(--ink-2); font-weight: 600; font-size: 13.5px; cursor: pointer; }
.page-btn:hover:not(.active) { border-color: var(--accent); color: var(--accent); }
.page-btn.active { background: var(--accent); border-color: var(--accent); color: var(--accent-ink); }
.ellipsis { color: var(--muted); font-size: 13px; padding: 0 2px; }

/* Order page */
.dochead { background: var(--surface); box-shadow: 0 0 0 100vmax var(--surface); clip-path: inset(0 -100vmax); padding: 18px 0 20px; border-bottom: 1px solid var(--line); display: grid; gap: 10px; }
.dochead h2 { font-size: 22px; }
.formerflag { background: var(--surface-2); color: var(--ink-2); }
.facts { display: flex; flex-wrap: wrap; gap: 4px 24px; margin: 0; font-size: 14px; color: var(--ink-2); }
.facts dt { display: inline; color: var(--muted); }
.facts dd { display: inline; margin: 0 0 0 4px; font-family: var(--font-mono); font-size: 13.5px; }
.btn { display: inline-flex; align-items: center; height: 36px; padding: 0 14px; border-radius: var(--r); background: var(--accent); color: var(--accent-ink); border: 1px solid var(--accent); font-size: 14px; font-weight: 600; text-decoration: none; }
.btn:hover { background: var(--accent-strong); border-color: var(--accent-strong); }
.btn.ghost { background: var(--surface); color: var(--accent); border-color: var(--line); }
.btn.ghost:hover { border-color: var(--accent); background: var(--accent-soft); }
.pdf-embed { margin-top: 20px; }
.pdf-embed iframe { display: block; width: 100%; height: 80vh; border: 1px solid var(--line); border-radius: var(--r); background: var(--surface); }
@media (max-width: 780px) { .pdf-embed iframe { height: 60vh; } }
.textsec { margin-top: 20px; }
.textsec summary { cursor: pointer; font-weight: 600; font-size: 14px; color: var(--accent); }
.extracted-text { white-space: pre-wrap; font-family: var(--font-mono); font-size: 12.5px; line-height: 1.6; color: var(--ink-2); background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); padding: 16px; margin: 10px 0 0; max-height: 420px; overflow-y: auto; }

/* Spinner */
.spinner { display: inline-block; width: 12px; height: 12px; border: 2px solid var(--line); border-top-color: var(--accent); border-radius: 50%; animation: spin .8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .spinner { animation: none; } }

/* Filters (same as CFOP Finder's) */
.filters { display: flex; flex-wrap: wrap; gap: 8px 20px; align-items: center; font-size: 13px; color: var(--muted); }
.filters label { display: flex; align-items: center; gap: 6px; min-width: 0; }
.filters select { height: 32px; max-width: 100%; border: 1px solid var(--line); border-radius: var(--r); background: var(--surface); padding: 0 8px; color: var(--ink); }
.startover { margin-left: auto; background: none; border: 0; padding: 4px 2px; color: var(--accent); font-size: 14px; font-weight: 600; cursor: pointer; }
.startover:hover { text-decoration: underline; text-underline-offset: 2px; }
@media (max-width: 640px) { .filters label { width: 100%; } .filters select { flex: 1; min-width: 0; } }

/* Outcome labels: neutral greys for the agency prevailing, color only where the petitioner gained something */
.pill { display: inline-block; font-size: 11px; font-weight: 700; letter-spacing: .02em; text-transform: uppercase; line-height: 1.5; padding: 0 7px; border-radius: 999px; white-space: nowrap; vertical-align: 1px; background: var(--surface-2); color: var(--ink-2); }
.pill.o-granted { background: color-mix(in srgb, var(--ok) 18%, var(--surface)); color: color-mix(in srgb, var(--ok) 65%, var(--ink)); }
.pill.o-partly-granted { background: color-mix(in srgb, var(--warn) 18%, var(--surface)); color: color-mix(in srgb, var(--warn) 65%, var(--ink)); }
.pill.o-remanded { background: var(--accent-soft); color: var(--accent); }
.pill.o-dismissed, .pill.o-unclear { background: none; box-shadow: inset 0 0 0 1px var(--line); color: var(--muted); }
.obar { display: inline-flex; width: 72px; height: 6px; border-radius: 3px; overflow: hidden; background: var(--surface-2); margin-right: 10px; vertical-align: 1px; }
.obar i { display: block; height: 100%; }
.obar .o-denied { background: color-mix(in srgb, var(--muted) 55%, var(--surface)); }
.obar .o-granted { background: var(--ok); }
.obar .o-partly-granted { background: var(--warn); }
.obar .o-remanded { background: var(--accent-strong); }
.obar .o-dismissed, .obar .o-unclear { background: transparent; }

/* Index: orders grouped by issue */
.treebar { display: flex; justify-content: space-between; align-items: center; gap: 14px; margin: 4px 0 8px; }
.treebar button { background: none; border: 0; padding: 0; color: var(--accent); font-size: 13px; font-weight: 600; cursor: pointer; }
.treebar button:hover { text-decoration: underline; }
details.group { border-top: 1px solid var(--line); }
details.group:last-child { border-bottom: 1px solid var(--line); }
details.group > summary { display: flex; align-items: center; gap: 10px; padding: 14px 4px; cursor: pointer; list-style: none; font-weight: 700; font-size: 15px; }
details.group > summary::-webkit-details-marker { display: none; }
details.group > summary:hover .gname { color: var(--accent); }
details.group > summary .chev { flex: none; color: var(--muted); transition: transform .15s; }
details.group[open] > summary .chev { transform: rotate(90deg); }
/* The group's size sits beside its name, so the right edge is left to the count columns below it. */
details.group > summary .cnt { display: inline-flex; align-items: center; font-size: 12.5px; font-weight: 500; color: var(--muted); white-space: nowrap; }
.rows { padding: 0 0 10px 24px; }
.orow { display: grid; grid-template-columns: 128px minmax(0, 1fr) auto; gap: 16px; align-items: baseline; padding: 7px 4px; text-decoration: none; color: var(--ink-2); border-radius: var(--r); }
.orow:hover { background: var(--surface); }
.orow:hover .osum { color: var(--ink); }
.orow .num { font-family: var(--font-mono); font-weight: 600; font-size: 13.5px; color: var(--accent); }
.osum { font-size: 14px; line-height: 1.45; }
@media (max-width: 640px) {
  .rows { padding-left: 4px; }
  .orow { grid-template-columns: minmax(0, 1fr) auto; row-gap: 2px; }
  .orow .osum { grid-column: 1 / -1; grid-row: 2; }
  .obar { display: none; }
}

/* Search results: tags above the excerpt */
.hit-sum { margin: 0 0 8px; max-width: 78ch; color: var(--ink); font-size: 14.5px; line-height: 1.5; }

/* Order page: tags */
.tagline { margin: 0; max-width: 92ch; font-size: 15px; color: var(--ink); }
.facts a { text-decoration: none; }
.facts a:hover { text-decoration: underline; }
.facts dd.plain { font-family: var(--font-ui); font-size: 14px; }
.autonote { margin: 0; font-size: 12.5px; color: var(--muted); }

/* Order page: side index of the results it was opened from + the order (like CFOP Finder's reader) */
.reader.withlist { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 0 28px; max-width: 1480px; }
.rlist { position: sticky; top: 64px; align-self: start; max-height: calc(100vh - 80px); display: flex; flex-direction: column; padding: 18px 4px 0 0; min-width: 0; }
.rlist-head { display: flex; align-items: baseline; gap: 10px; padding-bottom: 10px; border-bottom: 1px solid var(--ink-2); }
.rlist-head h2 { font-size: 15px; font-weight: 700; min-width: 0; }
.rlist-head h2 span { display: block; font-size: 12.5px; font-weight: 500; color: var(--muted); margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rlist-head .linkbtn { margin-left: auto; }
.linkbtn { background: none; border: 0; padding: 0; color: var(--accent); font-size: 13px; font-weight: 600; cursor: pointer; white-space: nowrap; }
.linkbtn:hover { text-decoration: underline; }
.rlist-items { list-style: none; margin: 0; padding: 4px 0 24px; overflow-y: auto; min-height: 0; }
.rlist-items a { display: flex; flex-wrap: wrap; gap: 2px 8px; align-items: baseline; padding: 8px 6px 8px 10px; text-decoration: none; color: var(--ink-2); border-bottom: 1px solid var(--line); }
.rlist-items a:hover { color: var(--ink); background: var(--surface); }
.rlist-items a .num { font-family: var(--font-mono); font-weight: 600; font-size: 13px; color: var(--accent); }
.rlist-items a .pill { justify-self: start; }
.rlist-items a .osum { grid-column: 1 / -1; font-size: 13px; line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.rlist-items a.current { background: var(--accent-soft); color: var(--ink); box-shadow: inset 3px 0 0 var(--accent-strong); }
.rdoc { min-width: 0; }
.navrow { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 20px; }
.ordernav { margin-left: auto; display: flex; align-items: center; gap: 6px 14px; flex-wrap: wrap; font-size: 14px; }
.navbtn { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; text-decoration: none; cursor: pointer; }
.navbtn:hover { text-decoration: underline; }
.navbtn[aria-disabled="true"] { color: var(--muted); opacity: .5; cursor: default; text-decoration: none; }
.ordercount { font-family: var(--font-mono); font-size: 12.5px; color: var(--muted); white-space: nowrap; }
.mbtn { display: inline-flex; align-items: center; gap: 5px; height: 32px; padding: 0 10px; border: 1px solid var(--line); border-radius: var(--r); background: var(--surface); color: var(--accent); font-weight: 600; font-size: 13px; cursor: pointer; }
.mbtn:hover:not(:disabled) { border-color: var(--accent); background: var(--accent-soft); }
.mbtn:disabled { color: var(--muted); cursor: default; }
.pdf-embed iframe#viewer { height: calc(100vh - 140px); min-height: 520px; }
@media (max-width: 900px) {
  .reader.withlist { display: block; }
  .rlist { position: static; max-height: 45vh; border-bottom: 1px solid var(--line); margin-bottom: 8px; }
}
.reader.withlist .dochead { clip-path: inset(0 -100vmax 0 -28px); }  /* white band stops at the side index */
[hidden] { display: none !important; }  /* components with their own display (flex lists, nav rows) must still hide */
/* The callout: a tinted note with a stripe. --co is its tone: the source's color (info), --warn, --bad or --ok. */
.autogen, .rulemaking, .doahnote, .previewnote, .howstatus { --co: var(--sc, var(--accent)); max-width: 92ch; font-size: 13.5px; color: var(--ink-2);
  background: color-mix(in srgb, var(--co) 8%, var(--surface)); box-shadow: inset 4px 0 0 var(--co); border: 0; border-radius: var(--r); padding: 8px 12px 8px 16px; }
.autogen { margin: 0; }
.autogen strong { color: var(--ink); }

/* Order page on wider screens: the page itself doesn't scroll. Header, then the side index and the order fill the
   window; the list and the PDF (or the extracted text) each scroll on their own, so scrolling one never moves the
   rest of the page. Phones keep a normal scrolling page. */
@media (min-width: 901px) {
  body.docpage { height: 100vh; overflow: hidden; display: flex; flex-direction: column; }
  body.docpage .top { position: static; flex: none; }
  body.docpage .reader { flex: 1; min-height: 0; width: 100%; display: grid; grid-template-columns: minmax(0, 1fr); padding-bottom: 12px; }
  body.docpage .reader.withlist { grid-template-columns: 300px minmax(0, 1fr); }
  body.docpage .rlist { position: static; max-height: none; height: 100%; min-height: 0; }
  body.docpage .rdoc { display: flex; flex-direction: column; min-height: 0; }
  body.docpage .dochead { flex: none; padding: 12px 0 14px; gap: 8px; }
  body.docpage .pdf-embed { flex: 1; min-height: 0; margin-top: 12px; }
  body.docpage .pdf-embed iframe#viewer { height: 100%; min-height: 0; }
  body.docpage .extracted-text { flex: 1; min-height: 0; max-height: none; margin-top: 12px; }
}
.extracted-text { overscroll-behavior: contain; }
.rlist-items { overscroll-behavior: contain; }
button.btn { cursor: pointer; font-family: inherit; }

/* ---------- Appeals Finder additions ---------- */
.dochead h2 .casename { display: block; font-family: var(--font-ui); font-size: 15px; font-weight: 600; color: var(--ink); margin-top: 4px; }
.hit-name { margin: 0 0 4px; font-weight: 600; color: var(--ink); font-size: 14.5px; }
.ocourt { display: inline-block; margin-left: 8px; font-family: var(--font-mono); font-size: 11.5px; color: var(--muted); }
.opinion-pane { margin-top: 12px; overflow-y: auto; overscroll-behavior: contain; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); padding: 22px 28px 28px; }
.opinion { max-width: 78ch; font-size: 15.5px; line-height: 1.7; color: var(--ink); }
.opinion p { margin: 0 0 1em; }
.opinion pre { white-space: pre-wrap; font-family: var(--font-ui); }
/* CourtListener splits a text opinion into <pre class="inline"> runs with each citation between them; as blocks, every citation got its own line. */
.opinion pre.inline { display: inline; margin: 0; }
.opinion hr { border: 0; border-top: 1px solid var(--line); margin: 2em 0; }
.opinion a.cite.in { font-weight: 600; }
mark.current, .opinion mark.current { background: var(--hl-strong); color: var(--hl-ink); box-shadow: 0 0 0 2px var(--hl-strong); }
.citations { max-width: 78ch; }
.citations h3 { font-size: 17px; margin: 0 0 6px; }
.citations h4 { font-size: 14px; margin: 22px 0 6px; padding-bottom: 6px; border-bottom: 1px solid var(--ink-2); }
.citations .h4note { font-weight: 400; color: var(--muted); font-size: 12.5px; margin-left: 6px; }
.cbsum { margin: 0 0 6px; font-size: 14px; color: var(--ink); }
.cbnote { margin: 0; font-size: 12.5px; color: var(--muted); }
.depth { display: inline-block; font-family: var(--font-mono); font-size: 11.5px; font-weight: 600; color: var(--accent); background: var(--accent-soft, transparent); border: 1px solid var(--line); border-radius: 3px; padding: 0 4px; }
.panetabs { display: flex; gap: 4px; margin-top: 12px; border-bottom: 1px solid var(--line); flex: none; }
.panetabs button { font: inherit; font-size: 14px; font-weight: 600; color: var(--ink-2); background: none; border: 0; border-bottom: 2px solid transparent; padding: 7px 12px; margin-bottom: -1px; cursor: pointer; }
.panetabs button:hover { color: var(--accent); }
.panetabs button[aria-selected="true"] { color: var(--accent); border-bottom-color: var(--accent); }
.panetabs .tcount { font-family: var(--font-mono); font-size: 12px; font-weight: 500; color: var(--muted); margin-left: 2px; }
.panetabs + .opinion-pane { margin-top: 0; border-top-left-radius: 0; border-top-right-radius: 0; }
.citelist { list-style: none; margin: 0; padding: 0; }
.citelist li { padding: 10px 0; border-bottom: 1px solid var(--line); font-size: 14px; }
.citelist a { text-decoration: none; color: var(--ink); }
.citelist a:hover .cname { color: var(--accent); text-decoration: underline; }
.citelist .num { font-family: var(--font-mono); font-weight: 600; color: var(--accent); font-size: 13px; margin-right: 6px; }
.citelist .csum { display: block; color: var(--ink-2); font-size: 13px; margin-top: 2px; }
.source { max-width: 78ch; margin: 20px 0 0; font-size: 12.5px; color: var(--muted); }
@media (min-width: 901px) {
  body.docpage .opinion-pane { flex: 1; min-height: 0; }
}
@media (max-width: 640px) { .opinion-pane { padding: 14px; } .orow { grid-template-columns: minmax(0, 1fr) auto; } }

/* ---------- Statutes & rules ---------- */
.browsetabs { display: flex; gap: 4px; margin: 18px 0 0; border-bottom: 1px solid var(--line); overflow-x: auto; scrollbar-width: none; }
/* In the header, the tab bar is its bottom row: the current tab's underline sits on the header's edge. */
.top .browsetabs { flex-basis: 100%; margin: 2px 0 -10px; border-bottom: 0; }
.browsetabs a { font-size: 14px; font-weight: 600; color: var(--ink-2); text-decoration: none; padding: 7px 12px; border-bottom: 2px solid transparent; margin-bottom: -1px; white-space: nowrap; }
.browsetabs a:hover { color: var(--accent); }
.browsetabs a[aria-current="page"] { color: var(--accent); border-bottom-color: var(--accent); }
/* data-src="<source>" sets --sc, the source's color, for everything inside it (tabs, bands, stripes, callouts). */
[data-src="stat"] { --sc: var(--t-stat); } [data-src="rule"] { --sc: var(--t-rules); } [data-src="fac"] { --sc: var(--t-fac); }
[data-src="cfop"] { --sc: var(--t-cfops); } [data-src="form"] { --sc: var(--t-forms); } [data-src="fed"] { --sc: var(--t-fed); }
[data-src="cases"] { --sc: var(--t-cases); } [data-src="changes"] { --sc: var(--t-changes); }
.browsetabs a[data-src]:hover { color: color-mix(in srgb, var(--sc) 80%, var(--ink)); }
.browsetabs a[data-src][aria-current="page"] { color: color-mix(in srgb, var(--sc) 80%, var(--ink)); border-bottom-color: var(--sc); }
.lawhead { font-size: 17px; margin: 26px 0 8px; }
.lawhead span { font-weight: 500; color: var(--muted); font-size: 14px; margin-left: 6px; }
.lawnote { font-size: 13.5px; color: var(--ink-2); margin: 6px 0 10px; }
.lawrow .num { white-space: nowrap; }
.lawrow.uncited { opacity: .62; }
.lawrow .intext { display: inline-block; margin-left: 8px; font-size: 11.5px; color: var(--accent); font-weight: 600; }
.lawrow .ometa { font-family: var(--font-mono); font-size: 12px; color: var(--muted); white-space: nowrap; }
.muted { color: var(--muted); }
.noresults { color: var(--ink-2); margin: 18px 0; }

.lawreader { display: flex; flex-direction: column; }
.lawmeta { margin: 4px 0 0; font-size: 13px; color: var(--ink-2); }
.lawpanes { display: grid; grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr); gap: 18px; margin-top: 12px; }
.lawpanes.single { grid-template-columns: minmax(0, 1fr); }
.lawtext, .lawcases { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); padding: 16px 20px; overflow-y: auto; overscroll-behavior: contain; }
.lawtext { font-size: 14.5px; line-height: 1.6; }
.lawtip { font-size: 12.5px; color: var(--muted); margin: 0 0 10px; }
.prov p { margin: 0 0 .55em; }
.prov .pnum { font-weight: 700; color: var(--ink); }
.pkids { margin-left: 18px; }
.pafter { margin-left: 0; }
.lawhistory { font-size: 12.5px; color: var(--muted); margin-top: 18px; border-top: 1px solid var(--line); padding-top: 10px; }
.ptext[data-prov] { cursor: pointer; border-radius: 3px; box-decoration-break: clone; -webkit-box-decoration-break: clone; padding: 1px 2px; text-decoration: underline dotted color-mix(in srgb, var(--accent) 45%, transparent); text-underline-offset: 3px; }
.ptext.h1 { background: color-mix(in srgb, var(--accent) 6%, transparent); }
.ptext.h2 { background: color-mix(in srgb, var(--accent) 14%, transparent); }
.ptext.h3 { background: color-mix(in srgb, var(--accent) 26%, transparent); }
.ptext.h4 { background: color-mix(in srgb, var(--accent) 44%, transparent); }
.ptext[data-prov]:hover { text-decoration-style: solid; }
.ptext[data-prov]:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.ptext.on { outline: 2px solid var(--accent); outline-offset: 1px; }
.lawtip .ptext { padding: 0 4px; }
.lawcasehead { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 8px; border-bottom: 1px solid var(--ink-2); padding-bottom: 8px; }
.lawcasehead h3 { font-size: 15px; margin: 0; }
.lawtools { display: flex; gap: 12px; align-items: baseline; font-size: 13px; }
.lawtools select { font: inherit; font-size: 13px; }
.pfilter strong { font-family: var(--font-mono); }
.lawcaselist { list-style: none; margin: 0; padding: 0; }
.lawcaselist li { padding: 10px 0; border-bottom: 1px solid var(--line); }
.lcase { text-decoration: none; color: var(--ink); }
.lcase .num { font-family: var(--font-mono); font-weight: 600; color: var(--accent); font-size: 13px; margin-right: 6px; }
.lcase:hover .cname { color: var(--accent); text-decoration: underline; }
.lcase .cname { font-weight: 600; font-size: 14px; }
.lcmeta { margin: 4px 0 0; font-size: 12.5px; color: var(--ink-2); }
.lcprovs .pref { font-family: var(--font-mono); }
.lcprovs .pref.on { color: var(--accent); font-weight: 700; }
.viaf { color: var(--muted); }
.lawcaselist .csum { margin: 4px 0 0; font-size: 13px; color: var(--ink-2); }
.lsnip { margin: 4px 0 0; font-size: 12.5px; color: var(--muted); line-height: 1.5; }
.lsnip mark { background: var(--hl); color: var(--hl-ink); padding: 0 1px; }
.lawfact dd a { white-space: nowrap; }
@media (min-width: 901px) {
  body.docpage .lawreader { flex: 1; min-height: 0; width: 100%; padding-bottom: 14px; }
  body.docpage .lawdochead { flex: none; }
  body.docpage .lawpanes { flex: 1; min-height: 0; }
}
@media (max-width: 900px) { .lawpanes { grid-template-columns: minmax(0, 1fr); } }
.lawtree { margin: 22px 0 -40px; position: relative; z-index: 1; }
.ascited { display: block; margin-top: 2px; font-size: 12px; color: var(--muted); }
.dochead h2.casetitle { font-family: var(--font-ui); font-size: 24px; font-weight: 700; color: var(--ink); line-height: 1.25; text-wrap: balance; }
.dochead h2.casetitle .casenum { display: block; font-family: var(--font-mono); font-size: 14px; font-weight: 600; color: var(--accent); margin-top: 4px; }
@media (max-width: 640px) { .dochead h2.casetitle { font-size: 20px; } }

/* ---------- Case name first, everywhere ---------- */
.orow.namerow { grid-template-columns: minmax(0, 1fr) auto; padding: 9px 6px; }
.namerow .otext { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.namerow .oname { font-weight: 650; color: var(--ink); font-size: 14.5px; line-height: 1.35; }
.namerow:hover .oname { color: var(--accent); }
.namerow .osum { font-size: 13.5px; }
.namerow .ocourt { margin-left: 0; }
.ocourt .seg { white-space: nowrap; }  /* on a narrow screen the line wraps between its pieces, never inside one */
.hit.namehit { grid-template-columns: minmax(0, 1fr) auto; }
.namehit .hit-body { grid-column: 1; }
.namehit .hit-meta { grid-column: 2; }
.namehit .hit-name { display: block; font-size: 15px; font-weight: 700; color: var(--ink); text-decoration: none; line-height: 1.3; margin: 0 0 2px; }
.namehit .hit-name:hover { color: var(--accent); text-decoration: underline; }
.hit-num { margin: 0 0 8px; font-family: var(--font-mono); font-size: 12.5px; font-weight: 600; color: var(--accent); }
@media (max-width: 640px) { .hit.namehit { grid-template-columns: minmax(0, 1fr); } .namehit .hit-meta { grid-column: 1; text-align: left; } }
.rlist-items a .oname { grid-column: 1 / -1; font-weight: 650; font-size: 13.5px; color: var(--ink); line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.rlist-items a .num { font-size: 11.5px; }
.citelist .cname, .lcase .cname { font-weight: 650; font-size: 15px; }
.citelist .ocourt, .lcase .ocourt { margin-left: 6px; }
.lcauth { margin: 3px 0 0; font-size: 12.5px; font-weight: 600; color: var(--accent); }
.lcauth .authtotal { font-weight: 400; color: var(--muted); }
.cbtimes { font-size: 12px; color: var(--muted); }
.lcauth.zero .authn { font-weight: 400; color: var(--muted); }
.ocrfix { text-decoration: underline dotted var(--muted); text-underline-offset: 3px; cursor: help; }

/* ---------- Index: topics with sub-topics; group by issue or facts ---------- */
.treebar .treebtns { display: flex; gap: 6px; }
.gbys { font-size: 13px; color: var(--muted); display: inline-flex; align-items: center; gap: 4px; }
.treebar .gby { font-size: 13px; font-weight: 600; color: var(--ink-2); padding: 3px 10px; border: 1px solid var(--line); border-radius: 999px; background: var(--surface); }
.treebar .gby:hover { text-decoration: none; color: var(--accent); }
.treebar .gby.on { background: var(--accent); border-color: var(--accent); color: var(--accent-ink); }
details.group .subgroups { margin: 0 0 8px 22px; border-left: 2px solid var(--line); }
details.group.sub { border-top: 1px solid var(--line); }
details.group.sub:first-child { border-top: 0; }
details.group.sub > summary { padding: 9px 4px 9px 10px; font-size: 14px; font-weight: 600; }
details.group.sub .rows { padding-left: 10px; }
.treebar .treebtns button { font-size: 13px; font-weight: 600; color: var(--ink-2); padding: 3px 10px; border: 1px solid var(--line); border-radius: 999px; background: var(--surface); }
.treebar .treebtns button:hover { color: var(--accent); border-color: var(--accent); text-decoration: none; }

/* ---------- Search: "By topic" counts above the results ---------- */
.facets { margin: 4px 0 14px; display: grid; gap: 8px; }
.frow { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.frow.sub { padding-left: 14px; border-left: 2px solid var(--line); }
.flabel { font-size: 12.5px; font-weight: 700; color: var(--ink-2); margin-right: 4px; }
.elsewhere { font-size: 12.5px; color: var(--muted); margin-left: auto; }
.elsewhere a { color: var(--accent); font-weight: 600; }
.fchip { font: inherit; font-size: 13px; font-weight: 600; color: var(--ink-2); padding: 3px 10px; border: 1px solid var(--line); border-radius: 999px; background: var(--surface); cursor: pointer; }
.fchip span { font-family: var(--font-mono); font-size: 11.5px; font-weight: 500; color: var(--muted); margin-left: 3px; }
.fchip:hover { border-color: var(--accent); color: var(--accent); }
.fchip.on { background: var(--accent); border-color: var(--accent); color: var(--accent-ink); }
.fchip.on span { color: inherit; opacity: .8; }
.fnote { font-size: 12.5px; color: var(--muted); margin-left: 6px; }
.fclear { font: inherit; font-size: 12.5px; font-weight: 600; color: var(--accent); background: none; border: 0; cursor: pointer; margin-left: 6px; }
.fclear:hover { text-decoration: underline; }
.treebar.lawtree { justify-content: flex-end; }
.rulehist { margin-top: 18px; border-top: 1px solid var(--line); padding-top: 10px; }
.rulehist h4 { font-size: 14px; margin: 0 0 4px; }
.rulehist ul { list-style: none; margin: 6px 0 0; padding: 0; font-size: 13px; }
.rulehist li { padding: 3px 0; border-bottom: 1px solid var(--line); }
.rulehist .heff { font-family: var(--font-mono); font-size: 12px; color: var(--muted); margin-right: 6px; }
.rulenotes { margin-top: 14px; font-size: 13px; color: var(--ink-2); }
.rulenotes summary { cursor: pointer; font-weight: 600; color: var(--accent); }
.rulenotes p { margin: 8px 0 0; line-height: 1.5; }
.lawhead-row { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.lawhead-row .treebtns { display: flex; gap: 6px; }
.lawhead-row .treebtns button { font: inherit; font-size: 13px; font-weight: 600; color: var(--ink-2); padding: 3px 10px; border: 1px solid var(--line); border-radius: 999px; background: var(--surface); cursor: pointer; }
.lawhead-row .treebtns button:hover { color: var(--accent); border-color: var(--accent); }
/* Federal acts fold to their title. */
.lawhead .actcnt { font-weight: 400; font-size: 13px; margin-left: 8px; }
.earlier { margin-top: 22px; border-top: 1px solid var(--ink-2); padding-top: 10px; } .earlier h4 { font-size: 14px; margin: 0 0 4px; }

/* ---------- Index: an issue (or fact pattern) is one line linking to its list ---------- */
.orow.issuerow { grid-template-columns: minmax(0, 1fr) auto; padding: 9px 6px 9px 10px; border-top: 1px solid var(--line); text-decoration: none; }
.issuerow:first-child { border-top: 0; }
.issuerow .osum { font-size: 14.5px; font-weight: 600; color: var(--ink); }
.issuerow:hover .osum { color: var(--accent); text-decoration: underline; }
.issuerow .ometa { font-size: 13px; color: var(--muted); white-space: nowrap; }
.issuerows { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.alllink { font-weight: 600; text-decoration: none; }
.alllink:hover { text-decoration: underline; }

/* ---------- Search statutes & rules: provision hits ---------- */
#libresults { margin-top: 14px; }
.libhits { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.libhits li { padding: 10px 4px; border-bottom: 1px solid var(--line); }
.libhits a { text-decoration: none; color: var(--ink); }
.libhits .libnum { font-family: var(--font-mono); font-weight: 600; color: var(--accent); font-size: 13.5px; }
.libhits .libtitle { font-weight: 600; font-size: 14.5px; margin-left: 6px; }
.libhits a:hover .libtitle { color: var(--accent); text-decoration: underline; }
.libsnip { margin: 4px 0 0; font-size: 13.5px; color: var(--ink-2); line-height: 1.5; max-width: 92ch; }
.libsnip mark { background: var(--hl); color: var(--hl-ink); padding: 0 1px; }
.lawtext mark.hl { background: var(--hl); color: var(--hl-ink); padding: 0 1px; border-radius: 3px; }
.prov.flash > p { box-shadow: inset 3px 0 0 var(--accent); background: color-mix(in srgb, var(--accent) 6%, transparent); }

/* Statute and rule pages: what cites it, by type (cases, CFOPs), with a chooser above. */
.typebar { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 10px; }
.lawcases > .pfilter { display: block; margin: 0 0 10px; font-size: 13px; }
.lawcases > .pfilter[hidden] { display: none; }
.lawgroup[hidden] + .lawgroup { margin-top: 0; padding-top: 0; border-top: 0; }
.lawgroup .more { margin: 8px 0 0; font-size: 13px; }
.cfoplist { list-style: none; margin: 8px 0 0; padding: 0; font-size: 13.5px; }
.cfoplist li { padding: 8px 0; border-bottom: 1px solid var(--line); color: var(--ink-2); line-height: 1.45; }
.cfoplist .cnum { font-family: var(--font-mono); font-weight: 600; font-size: 12.5px; color: var(--accent); margin-right: 4px; }
.cfoplist .ctitle { color: var(--ink); font-weight: 600; }
.cfoplist .cpages { display: flex; flex-wrap: wrap; gap: 2px 12px; margin-top: 3px; font-size: 12.5px; }
.cfoplist .cpages a { color: var(--accent); text-decoration: none; }
.cfoplist .cpages a:hover { text-decoration: underline; }
.cfoplist .cpages a[hidden] { display: none; }

/* Statutes and rules lists: citing counts by source, as columns under a header. */
.ocounts { display: grid; grid-auto-flow: column; grid-auto-columns: 52px; text-align: right; font-family: var(--font-mono); font-size: 12px; color: var(--ink-2); white-space: nowrap; }
.ocounts .zero { color: var(--muted); opacity: .6; }
.counthead { padding-top: 4px; padding-bottom: 4px; position: sticky; top: var(--toph, 57px); z-index: 5; background: var(--bg); border-radius: 0; box-shadow: 0 1px 0 var(--line); }  /* stays under the site header while the list scrolls */
.counthead .ocounts { font-family: inherit; font-size: 11px; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; color: var(--muted); }
@media (max-width: 640px) { .counthead > span:first-child { display: none; } }
.ocounts.one { grid-template-columns: auto; min-width: 52px; }
.counthead.one { grid-template-columns: minmax(0, 1fr) auto; }
.counthead .ocounts.one span { min-width: 52px; }
.issuerow .ocounts { font-size: 13px; }

/* Citations inside the law's text, linked to their pages. */
a.lawref { color: var(--accent); text-decoration: underline; text-decoration-style: dotted; text-underline-offset: 2px; }
a.lawref:hover { text-decoration-style: solid; }

/* ---------- Statute, rule and admin code pages: the left pane's groups, each in its own color ----------
   A tinted header band per group and a thin rule in the group's color down the left of each item, in place of
   lines between items and groups. */
/* The three kinds of citing material keep these colors wherever they appear side by side: the groups here, the
   chooser above them, the count columns on the lists, and the "Also: … in CFOPs" links under a search. */
.lawgroup[data-type="cases"], .typebar .fchip[data-type="cases"] { --tc: var(--t-cases); }
.lawgroup[data-type="fac"], .typebar .fchip[data-type="fac"], .elsewhere a.src-fac { --tc: var(--t-fac); }
.lawgroup[data-type="cfops"], .typebar .fchip[data-type="cfops"], .elsewhere a.src-cfop { --tc: var(--t-cfops); }
.typebar .fchip[data-type]:not([data-type=""])::before { content: ""; display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--tc); margin-right: 6px; vertical-align: 0; }
.typebar .fchip.on[data-type]:not([data-type=""]) { background: var(--tc); border-color: var(--tc); }
.typebar .fchip.on[data-type]:not([data-type=""])::before { background: var(--surface); }
.lawgroup + .lawgroup { margin-top: 26px; padding-top: 0; border-top: 0; }
.lawgroup > .lawcasehead { border-bottom: 0; padding: 9px 12px; border-radius: var(--r); background: color-mix(in srgb, var(--tc) 11%, var(--surface)); box-shadow: inset 4px 0 0 var(--tc); }
.lawgroup > .lawcasehead h3 { color: var(--ink); }
.lawgroup > .lawcasehead .lawtip { flex-basis: 100%; margin: 0; }
.lawgroup .lawcaselist li, .lawgroup .cfoplist li { padding: 10px 2px; margin: 0; }
.lawgroup .cfoplist .cnum, .lawgroup .cfoplist a.ctitle { color: var(--ink); }
.lawgroup .cfoplist .cnum { color: color-mix(in srgb, var(--tc) 75%, var(--ink)); }
.lawgroup .earlier { border-top: 0; padding-top: 0; }
.lawgroup .faclist a.cnum, .lawgroup .faclist a.ctitle { text-decoration: none; }
.lawgroup .faclist li:hover a.ctitle { text-decoration: underline; }
.lawgroup .faclist .cpages a { margin-right: 4px; }

/* The lists' count columns: CASES, F.A.C., CFOPS in their colors (a dash for none stays grey). */
.ocounts:not(.one) > span:nth-child(1) { color: color-mix(in srgb, var(--t-cases) 85%, var(--ink)); }
.ocounts:not(.one) > span:nth-child(2) { color: color-mix(in srgb, var(--t-fac) 85%, var(--ink)); }
.ocounts:not(.one) > span:nth-child(3) { color: color-mix(in srgb, var(--t-cfops) 85%, var(--ink)); }
.ocounts:not(.one) > span.zero { color: var(--muted); }
/* The Forms tab: admin code rules, CFOPs, and the date a file last changed. */
.ocounts.formcounts { grid-template-columns: 52px 52px 96px; }
.ocounts.formcounts > span:nth-child(1) { color: color-mix(in srgb, var(--t-fac) 85%, var(--ink)); }
.ocounts.formcounts > span:nth-child(2) { color: color-mix(in srgb, var(--t-cfops) 85%, var(--ink)); }
.ocounts.formcounts > span:nth-child(3) { color: var(--ink-2); }
.ocounts.formcounts > span.zero { color: var(--muted); }
.counthead .ocounts:not(.one) > span { opacity: 1; }
/* "Also: 159 in Admin Code · 81 in CFOPs": the dot of that kind's color. */
.elsewhere a.src-fac::before, .elsewhere a.src-cfop::before { content: ""; display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--tc); margin-right: 5px; vertical-align: 1px; }

/* The case page's reporter citation, beside the docket number, and its copy button. */
.casetitle .repcite { font-family: var(--font-mono); }
.casetitle .copycite { margin-left: 8px; font-family: var(--font-ui); font-size: 12.5px; vertical-align: 1px; }

/* Rulemaking: the rule page's note and notice list, and the Admin Code tab's group. */
.rulemaking { --co: var(--t-changes); margin: 10px 0 0; }
.rulenotices { margin: 8px 0 0; font-size: 13px; }
.rulenotices summary { cursor: pointer; font-weight: 600; color: var(--accent); }
.rulenotices ul { margin: 6px 0 0; padding-left: 18px; }
.rulenotices li { margin: 3px 0; }
.rulemakinggroup > summary .gname { color: color-mix(in srgb, var(--t-changes) 80%, var(--ink)); }
.rulenotices .heff { font-family: var(--font-mono); font-size: 12px; color: var(--muted); margin-right: 6px; }

/* The usage note (analytics.py). */
.usagenote { margin: 28px 0 8px; font-size: 12px; color: var(--muted); }

/* Rule and statute pages: the statutes a rule goes with, and the reverse (law/rule_statutes.json). */
/* A DCF form's page: its files, then its text as read from them. */
.formfiles { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0 4px; }
.formfile { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border: 1px solid var(--accent); border-radius: 999px; font-size: 13.5px; font-weight: 600; color: var(--accent); text-decoration: none; background: var(--surface); }
.formfile:hover { background: var(--accent-soft); }
.formfile.alt { border-color: var(--line); color: var(--ink-2); }
.formfile .muted { font-weight: 400; }
.formview { margin: 18px 0 8px; }
.formviewer { display: block; width: 100%; height: calc(100vh - 140px); min-height: 520px; border: 1px solid var(--line); border-radius: var(--r); background: var(--surface); }
.formpick { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 8px; }
.formpick button { font: inherit; font-size: 13px; font-weight: 600; padding: 4px 12px; border: 1px solid var(--line); border-radius: 999px; background: var(--surface); color: var(--ink-2); cursor: pointer; }
.formpick button[aria-selected="true"] { border-color: var(--accent); color: var(--accent); background: var(--accent-soft); }
.formtext { margin: 22px 0; }
.formtext h3 { font-size: 15px; margin: 0 0 2px; }
.formbody { white-space: pre-wrap; overflow-wrap: anywhere; font-family: var(--font-mono); font-size: 12.5px; line-height: 1.55; color: var(--ink); background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); padding: 14px 16px; max-height: none; }
.lawlinks { margin: 8px 0 0; max-width: 92ch; font-size: 13.5px; color: var(--ink-2); line-height: 1.6; }
.lawlinks a { font-family: var(--font-mono); font-size: 13px; font-weight: 600; text-decoration: none; }
.lawlinks a:hover { text-decoration: underline; }
.lawlinks a.primary { color: var(--accent); }

/* The text pane's tools: shading on or off, print, download. */
.lawtools-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 14px; margin: 0 0 8px; font-size: 13px; }
.lawtools-bar .shadebox { display: inline-flex; align-items: center; gap: 6px; color: var(--ink-2); cursor: pointer; }
.lawtools-actions { display: inline-flex; gap: 14px; }
.lawtext.noshade .ptext[data-prov] { background: none; text-decoration: none; }
.lawtext.noshade .lawtip { display: none; }

/* Printing a statute, rule or admin code rule: the law only, in full, in black. */
@media print {
  body.docpage { height: auto !important; overflow: visible !important; display: block !important; background: #fff; color: #000; }
  .top, .browsetabs, .navrow, .lawcases, .lawtools-bar, .lawtip, .usagenote, .rulemaking a, .rulenotices summary::marker { display: none !important; }
  .lawpanes { display: block !important; }
  .lawtext { border: 0 !important; padding: 0 !important; overflow: visible !important; height: auto !important; max-height: none !important; font-size: 11.5pt; }
  .lawtext .ptext, .lawtext .ptext.on { background: none !important; outline: 0 !important; text-decoration: none !important; }
  .lawtext a, .lawlinks a { color: #000 !important; text-decoration: none !important; }
  .dochead h2.casetitle { font-size: 18pt; color: #000; }
  .dochead h2.casetitle .casenum { color: #000; }
  .rulenotices { display: block; } .rulenotices > * { display: block !important; }
  .prov { break-inside: auto; }  /* a subsection can run longer than a page: keep only each paragraph whole */
  .prov > p, .lawhistory { break-inside: avoid; }
  .lawdochead { break-after: avoid; }
  .lawpanes, .lawtext, .lawreader { break-before: auto; margin-top: 0 !important; }
  html, body, main, .lawreader, .lawpanes, .lawtext { height: auto !important; min-height: 0 !important; max-height: none !important; }
  main, .lawreader, .lawpanes { padding-bottom: 0 !important; margin-bottom: 0 !important; }
  .lawtext > :last-child { margin-bottom: 0 !important; }
}

/* Law Changes: what isn't law yet, apart from the five law tabs. */
.browsetabs .tab-changes { margin-left: auto; color: color-mix(in srgb, var(--t-changes) 80%, var(--ink)); }
.browsetabs .tab-changes[aria-current="page"] { color: color-mix(in srgb, var(--t-changes) 80%, var(--ink)); border-bottom-color: var(--t-changes); }
.flag { display: inline-block; font-family: var(--font-ui); font-size: 11px; font-weight: 700; letter-spacing: .02em; text-transform: uppercase;
        padding: 1px 7px; border-radius: 999px; vertical-align: 1px; margin-left: 6px; }
.openflag { background: color-mix(in srgb, var(--t-changes) 18%, var(--surface)); color: color-mix(in srgb, var(--t-changes) 70%, var(--ink)); cursor: pointer; }
.newflag { background: color-mix(in srgb, var(--t-changes) 30%, var(--surface)); color: color-mix(in srgb, var(--t-changes) 75%, var(--ink)); }
.rulemakingnote { margin: 4px 0 12px; font-size: 13.5px; color: var(--ink-2); }
.rulemakingnote .flag { margin: 0 6px 0 0; }
.change { margin: 14px 0; padding: 12px 16px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r);
          box-shadow: inset 4px 0 0 var(--t-changes); }
.change.flash { box-shadow: inset 4px 0 0 var(--t-changes), 0 0 0 3px color-mix(in srgb, var(--t-changes) 35%, transparent); }
.change h3, .change h4 { margin: 0; font-size: 17px; cursor: pointer; }
.change-meta { margin: 3px 0 8px; font-size: 13px; color: var(--ink-2); }
.change-meta .cnum { font-family: var(--font-mono); font-weight: 600; color: var(--accent); }
.notices { list-style: none; margin: 0; padding: 0; }
.notices > li { padding: 8px 0; border-top: 1px solid var(--line); font-size: 13.5px; }
.notice-line { margin: 0 0 4px; }
.notice-line .heff { font-family: var(--font-mono); font-size: 12px; color: var(--muted); margin-right: 6px; }
.notice-text { margin: 4px 0 0 0; }
.notice-text summary { cursor: pointer; font-weight: 600; color: var(--accent); font-size: 13px; }
.notice-text .ruletext, .notice-text .noticebody { margin: 8px 0 4px; padding: 10px 14px; background: var(--bg); border-radius: var(--r);
          font-size: 13.5px; line-height: 1.55; max-height: 70vh; overflow: auto; }
.notice-text p { margin: 0 0 8px; }
.ruletext u { text-decoration-color: color-mix(in srgb, var(--t-fac) 80%, var(--ink)); text-decoration-thickness: 1.5px; background: color-mix(in srgb, var(--t-fac) 10%, transparent); }
.ruletext s { color: color-mix(in srgb, var(--bad) 75%, var(--ink)); background: color-mix(in srgb, var(--bad) 8%, transparent); }
.change .anchor { display: block; position: relative; top: -12px; }
.change-rules { list-style: none; margin: 4px 0 8px; padding: 0; font-size: 13.5px; columns: 2 320px; column-gap: 24px; }
.change-rules li { padding: 2px 0; break-inside: avoid; }
.change-rules .cnum { font-family: var(--font-mono); font-size: 12px; font-weight: 600; color: var(--accent); margin-right: 6px; }
.change-purpose { margin: 4px 0 8px; font-size: 13.5px; color: var(--ink-2); }
.doahflag { background: color-mix(in srgb, var(--bad) 16%, var(--surface)); color: color-mix(in srgb, var(--bad) 75%, var(--ink)); }
.doahnote { --co: var(--bad); margin: 6px 0 8px; color: var(--ink); }
.timeline { margin: 6px 0 8px; }
.falcon { list-style: none; margin: 8px 0 4px; padding: 0 0 0 14px; border-left: 2px solid var(--line); font-size: 13.5px; }
.falcon li { padding: 3px 0; position: relative; }
.falcon li::before { content: ""; position: absolute; left: -19px; top: 10px; width: 8px; height: 8px; border-radius: 50%; background: var(--line); }
.falcon li.ev-doah::before { background: var(--bad); }
.falcon li.ev-doah { font-weight: 600; }
.falcon .heff { font-family: var(--font-mono); font-size: 12px; color: var(--muted); margin-right: 8px; }
.falconsrc { font-size: 12px; margin: 4px 0 0; }
.falcon li.ev-future { color: var(--muted); }
.falcon li.ev-future::before { background: var(--surface); border: 1.5px solid var(--muted); width: 6px; height: 6px; }
.falcon .upcoming { font-family: var(--font-ui); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .02em; margin-right: 6px; }
.change, .change .anchor { scroll-margin-top: 96px; }

/* Law Changes: bills. */
.billflag { background: color-mix(in srgb, var(--t-changes) 16%, var(--surface)); color: color-mix(in srgb, var(--t-changes) 75%, var(--ink)); cursor: pointer; }
.billflag.enacted { background: color-mix(in srgb, var(--t-changes) 30%, var(--surface)); color: color-mix(in srgb, var(--t-changes) 75%, var(--ink)); }
.change.bill { box-shadow: inset 4px 0 0 var(--t-changes); }
.change.bill.flash { box-shadow: inset 4px 0 0 var(--t-changes), 0 0 0 3px color-mix(in srgb, var(--t-changes) 30%, transparent); }
.billnums { margin: 2px 0 6px; font-size: 13.5px; color: var(--ink-2); }
.billnums .bnum { font-family: var(--font-mono); font-weight: 600; }
.billstate { font-weight: 600; }
.billstate.enacted { color: color-mix(in srgb, var(--t-changes) 70%, var(--ink)); }
.billlinks { margin: 4px 0 8px; font-size: 13px; }
.affects { margin: 6px 0 4px; font-size: 13.5px; }
.affects a { font-family: var(--font-mono); font-size: 12.5px; }
.billsec { margin: 2px 0; }
.billsec .directive { font-style: italic; color: var(--ink-2); }
.history { list-style: none; margin: 8px 0 4px; padding: 0; font-size: 13px; }
.history li { padding: 2px 0; }
.history .heff { font-family: var(--font-mono); font-size: 12px; color: var(--muted); margin-right: 8px; }
.history .hnum { font-family: var(--font-mono); font-size: 12px; font-weight: 600; margin-right: 6px; }
.previewnote { --co: var(--warn); }
.textnote { font-size: 12.5px; margin: 4px 0; }

/* Law Changes: the merged Register + JAPC timeline. */
.diffflag { background: color-mix(in srgb, var(--warn) 18%, var(--surface)); color: color-mix(in srgb, var(--warn) 75%, var(--ink)); }
.diffnote { color: color-mix(in srgb, var(--warn) 80%, var(--ink)); font-weight: 600; font-size: 12.5px; margin-left: 6px; }
.falcon li.ev-diff::before { background: var(--warn); }
.falcon .srcs { margin-left: 6px; }
.falcon .src { font-family: var(--font-ui); font-size: 11px; font-weight: 700; letter-spacing: .02em;
               color: var(--ink-2); background: var(--surface-2); border-radius: 3px; padding: 0 6px; margin-right: 3px; }
.innernotice { margin: 2px 0 4px; }
.innernotice summary { font-size: 12.5px; }

/* Law Changes: folding entries. */
.foldbtn { border: 0; background: none; padding: 0 6px 0 0; margin: 0; color: var(--muted); cursor: pointer; vertical-align: 1px; }
.foldbtn svg { transform: rotate(90deg); transition: transform .15s; }
.change.collapsed .foldbtn svg { transform: none; }
.change.collapsed { padding-bottom: 8px; }
.change.collapsed > :not(.change-head):not(.anchor) { display: none; }
.change.collapsed .change-head > :not(h3):not(h4):not(.billnums) { display: none; }

/* The note on how the index was built sits under the search bar. */
.searchbar .hint + .autogen { margin-top: 10px; }

/* Admin Code tab: a proposed new rule, in its place in the chapter. */
.lawrow.proposedrow { background: color-mix(in srgb, var(--t-changes) 5%, transparent); }
.lawrow.proposedrow .num { color: color-mix(in srgb, var(--t-changes) 75%, var(--ink)); font-style: italic; }
.lawrow.proposedrow .osum { color: var(--ink-2); }
.change.bill.sought { box-shadow: inset 4px 0 0 color-mix(in srgb, var(--t-changes) 40%, var(--line)); }

/* Court rule search results, grouped by part and subpart; a rule's matching subdivisions fold under it. */
.hitpart { margin: 18px 0 4px; font-size: 16px; }
.hitsub { margin: 10px 0 4px; font-size: 13px; font-weight: 600; color: var(--ink-2); text-transform: none; }
.hitprovs { margin: 4px 0 0; }
.hitprovs summary { cursor: pointer; font-size: 13px; font-weight: 600; color: var(--accent); }
.hitprovs ol { list-style: none; margin: 6px 0 0; padding: 0 0 0 14px; border-left: 2px solid var(--line); }
.libhits .hitprovs li { padding: 5px 0; border: 0; font-size: 13.5px; }
.hitprovs .libsnip { display: inline; margin: 0 0 0 6px; }
.hitprovs .hitwhere { font-size: 12.5px; color: var(--muted); margin-left: 6px; }
.hitprovs .hitwhere + .libsnip { display: block; margin: 2px 0 0; }

/* Search results: a match's lead-in (the provisions it sits inside), small and muted, stepped in by level. */
.leadin { margin: 0 0 3px; font-size: 12.5px; line-height: 1.4; color: var(--muted); }
.leadin > div { padding-left: calc(var(--lvl) * 14px); }
.leadin .lnum { font-family: var(--font-mono); font-size: 11.5px; color: var(--ink-2); }
.no-leadin .leadin { display: none; }
.leadswitch { display: inline-flex; align-items: center; gap: 5px; font-size: 12.5px; color: var(--ink-2); margin-left: 12px; cursor: pointer; }
.libhits .hitprovs li[style] { padding-left: calc(var(--lvl) * 16px); }
.libhits .hitprovs li.leadin { padding-top: 3px; padding-bottom: 0; margin: 0; }

/* Law Changes: each section in its own color (the admin code's teal, the cases' blue; raspberry for court rules,
   the tab's violet for statutes), on a tinted heading band and on its entries' stripes, so each section's start
   stands out; a row of jump links at the top. */
.changes { --sc: var(--t-changes); margin-top: 34px; }
.changes[data-kind="fac"], .changejump [data-kind="fac"] { --sc: var(--t-fac); }
.changes[data-kind="rules"], .changejump [data-kind="rules"] { --sc: var(--t-rules); }
.changes[data-kind="cases"], .changejump [data-kind="cases"] { --sc: var(--t-cases); }
.changes[data-kind="stat"], .changejump [data-kind="stat"] { --sc: var(--t-stat); }
.changes .change, .changes .change.bill { box-shadow: inset 4px 0 0 var(--sc); }
.changes .change.flash, .changes .change.bill.flash { box-shadow: inset 4px 0 0 var(--sc), 0 0 0 3px color-mix(in srgb, var(--sc) 35%, transparent); }
.changes .change.bill.sought { box-shadow: inset 4px 0 0 color-mix(in srgb, var(--sc) 40%, var(--line)); }
.changes .billflag, .changes .openflag, .changes .newflag { background: color-mix(in srgb, var(--sc) 16%, var(--surface)); color: color-mix(in srgb, var(--sc) 75%, var(--ink)); }
.changes .billflag.enacted { background: color-mix(in srgb, var(--sc) 30%, var(--surface)); }
.changes .billstate.enacted { color: color-mix(in srgb, var(--sc) 70%, var(--ink)); }
.changes, .changes > .lawhead-row { scroll-margin-top: 96px; }
.changejump { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.changejump a { display: inline-flex; align-items: center; gap: 7px; padding: 4px 12px 4px 10px; border-radius: 999px; font-size: 13.5px;
          font-weight: 600; text-decoration: none; color: color-mix(in srgb, var(--sc) 72%, var(--ink));
          background: color-mix(in srgb, var(--sc) 11%, var(--surface)); border: 1px solid color-mix(in srgb, var(--sc) 35%, var(--line)); }
.changejump a::before { content: ""; width: 9px; height: 9px; border-radius: 50%; background: var(--sc); }
.changejump a:hover { border-color: var(--sc); }
.changejump a span { font-family: var(--font-mono); font-size: 12px; color: var(--ink-2); }

/* Sources: the sources, by tab, each with its schedule, last check and what's here now. */
.howstatus { --co: var(--ok); display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin-top: 12px; padding: 10px 14px 10px 18px; font-size: 14px; color: var(--ink); max-width: none; }
.howstatus.bad { --co: var(--bad); }
.howstatus.none { --co: var(--line); }
.howtimes { margin-left: auto; color: var(--ink-2); font-size: 13px; }
.howtimes b { font-weight: 600; color: var(--ink); }
.dot { display: inline-block; flex: none; width: 9px; height: 9px; border-radius: 50%; margin-right: 6px; background: var(--line); vertical-align: 1px; }
.dot.ok { background: var(--ok); }
.dot.failed { background: var(--bad); }
.dot.manual, .dot.unknown { background: transparent; border: 1.5px solid var(--muted); }
.dot.unknown { border-style: dashed; }
/* By hand: green once nothing is waiting, an amber ring (as the "waiting" note beside it) while something is. */
.dot.manual.done { background: var(--ok); border-color: var(--ok); }
.dot.manual.waiting { border-color: var(--warn); }
.howtable { margin-top: 18px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); overflow: hidden; }
.howrow { display: grid; grid-template-columns: minmax(0, 2.4fr) minmax(0, .9fr) minmax(0, 1.3fr) minmax(0, 1.6fr); gap: 4px 16px;
          padding: 9px 16px; border-top: 1px solid var(--line); font-size: 14px; align-items: baseline; }
.howheadrow { border-top: 0; background: var(--surface-2); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); }
.howgroup { --tc: var(--accent); }
.howgroup[data-tab="stat"] { --tc: var(--t-stat); }
.howgroup[data-tab="form"] { --tc: var(--t-forms); }
.howgroup[data-tab="cases"] { --tc: var(--t-cases); }
.howgroup[data-tab="rule"] { --tc: var(--t-rules); }
.howgroup[data-tab="fac"] { --tc: var(--t-fac); }
.howgroup[data-tab="cfop"] { --tc: var(--t-cfops); }
.howgroup[data-tab="changes"] { --tc: var(--t-changes); }
.howtab { margin: 0; padding: 9px 16px 9px 18px; font-size: 16px; font-weight: 800; border-top: 1px solid color-mix(in srgb, var(--tc) 28%, var(--line));
          color: var(--ink); background: color-mix(in srgb, var(--tc) 8%, var(--surface)); box-shadow: inset 4px 0 0 var(--tc); }
.howgroup .howrow { box-shadow: inset 4px 0 0 color-mix(in srgb, var(--tc) 35%, transparent); }
.hsrc a, .hsrc b { font-weight: 600; }
.howgroup .hsrc { padding-left: 14px; }  /* a source under its tab's heading */
.howrow small { display: block; margin-top: 1px; font-size: 12.5px; color: var(--muted); }
.hsched { color: var(--ink-2); }
.hnow { font-variant-numeric: tabular-nums; }
.hnow.warn { color: color-mix(in srgb, var(--warn) 80%, var(--ink)); font-weight: 600; }
.hownote { max-width: 92ch; margin: 14px 0 0; font-size: 13px; color: var(--ink-2); }
@media (max-width: 720px) {
  .howheadrow { display: none; }
  .howrow { grid-template-columns: 1fr 1fr; }
  .hsrc { grid-column: 1 / -1; }
  .hnow { grid-column: 1 / -1; }
  .howtimes { margin-left: 0; }
}

/* Law Changes as of a past date (?asof=): a banner under the site header, in view while the page scrolls, and the
   date on the Statutes heading and its jump link. */
.asofbanner { position: sticky; top: var(--toph, 57px); z-index: 15; display: flex; align-items: center; gap: 12px;
          margin: 14px 0 0; padding: 12px 16px; border-radius: var(--r); color: color-mix(in srgb, var(--warn) 70%, var(--ink));
          background: color-mix(in srgb, var(--warn) 16%, var(--surface)); border: 1.5px solid color-mix(in srgb, var(--warn) 60%, var(--line));
          box-shadow: 0 2px 8px rgba(16, 24, 40, .08); }
.asofbanner svg { flex: none; }
.asoftext { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.asoftext strong { font-size: 17px; }
.asoftext span { font-size: 13px; color: var(--ink-2); }
.asofback { margin-left: auto; flex: none; padding: 6px 14px; border-radius: 999px; font-size: 13.5px; font-weight: 700; text-decoration: none;
          color: #fff; background: color-mix(in srgb, var(--warn) 72%, #000); }
.asofback:hover { background: color-mix(in srgb, var(--warn) 58%, #000); }
.asofchip { font-style: normal; font-size: 12px; font-weight: 700; padding: 1px 8px; border-radius: 999px; margin-left: 4px;
          color: color-mix(in srgb, var(--warn) 70%, var(--ink)); background: color-mix(in srgb, var(--warn) 18%, var(--surface)); }
.lawhead .asofchip { font-size: 13px; vertical-align: 2px; }
@media (max-width: 600px) { .asofbanner { flex-wrap: wrap; } .asofback { margin-left: 30px; } }
/* With the banner in view, a section or entry jumped to lands below it. */
main:has(.asofbanner) .changes, main:has(.asofbanner) .changes > .lawhead-row, main:has(.asofbanner) .change, main:has(.asofbanner) .change .anchor { scroll-margin-top: calc(var(--toph, 57px) + 92px); }
/* Case page, "Cited by": after the collection's citing opinions, one link to the rest on CourtListener. */
.cbmore { margin: 14px 0 6px; font-size: 14px; font-weight: 600; }

/* Case page, side list: its order, the same dropdown as a statute page's list of opinions. */
.rlist-sort { padding: 8px 0; border-bottom: 1px solid var(--line); }
.rlist-sort select { max-width: 100%; }
.rlist-sort[hidden] { display: none; }
.rlist-items .lcourt, .rlist-items .lcited { display: inline-block; margin-left: 6px; font-size: 11.5px; color: var(--muted); }
/* A side list row as one wrapping line (number, court, outcome, times cited) between the name and the summary, so a
   long court name on a phone wraps instead of pushing the row past the edge. */
.rlist-items a .oname, .rlist-items a .osum { flex: 0 0 100%; min-width: 0; }
.rlist-items .lcourt, .rlist-items .lcited { margin-left: 0; min-width: 0; }
.rlist-items .lcited { font-weight: 600; color: var(--ink-2); }

/* Phones: the header scrolls away instead of staying pinned, its tagline is dropped, and every tab shows (wrapping to
   a second line rather than scrolling off the edge). The long introductions and source notes are left to wider
   screens and Sources, and the Cases filters fold behind a button. */
.searchbar { grid-template-columns: minmax(0, 1fr); }
.filtertoggle { display: none; }
@media (max-width: 640px) {
  .top { position: static; }
  html { --toph: 0px !important; }  /* what stuck under the pinned header now sticks to the top */
  .top .wrap { padding-block: 8px; gap: 2px 16px; }
  .brand p { display: none; }
  .sitelink { font-size: 12px; }
  .browsetabs { flex-wrap: wrap; overflow: visible; gap: 0 2px; margin-top: 10px; }
  .browsetabs a { font-size: 13.5px; padding: 6px 8px; }
  .browsetabs .tab-changes { margin-left: 0; }
  .searchbar { padding-top: 14px; }
  .searchbar > .intro:not(.keep), .lawhead-row + .autogen { display: none; }
  .filtertoggle { display: block; justify-self: start; height: 34px; padding: 0 14px; border: 1px solid var(--line);
                  border-radius: var(--r); background: var(--surface); color: var(--accent); font-weight: 600; font-size: 14px; cursor: pointer; }
  .filtertoggle[aria-expanded="true"] { background: var(--accent-soft); border-color: var(--accent); }
  .filters:not(.open) { display: none; }
}

/* A statute or rule on a phone: with a provision chosen and the list out of view, a bar at the bottom says what
   cites it, with a jump up to the list. */
.provbar { position: fixed; left: 8px; right: 8px; bottom: max(8px, env(safe-area-inset-bottom)); z-index: 30; display: flex;
           align-items: center; gap: 8px 12px; flex-wrap: wrap; padding: 10px 12px; border-radius: var(--r); font-size: 14px;
           background: var(--ink); color: var(--surface); box-shadow: 0 4px 16px rgba(16, 24, 40, .25); }
.provbar[hidden] { display: none; }
.provbar span { flex: 1 1 160px; min-width: 0; }
.provbar b { font-family: var(--font-mono); font-weight: 600; }
.provbar button { border: 0; border-radius: 999px; padding: 6px 12px; font-size: 13.5px; font-weight: 700; cursor: pointer; }
#provbar-go { background: var(--accent); color: var(--accent-ink); }
#provbar-clear { background: transparent; color: var(--surface); text-decoration: underline; padding-inline: 4px; }
@media print { .provbar { display: none !important; } }

/* Federal law (the Federal tab, U.S. Code and CFR pages): a slate blue of its own, a "U.S. Code" / "CFR" tag on each
   group, and a provision's own heading ("(a) Notice; time for commencement of proceedings.") in bold. */
.howgroup[data-tab="fed"] { --tc: var(--t-fed); }
.changes[data-kind="fedrules"], .changejump [data-kind="fedrules"],
.changes[data-kind="fedbills"], .changejump [data-kind="fedbills"] { --sc: var(--t-fed); }
.fedcode { display: inline-block; margin-right: 6px; padding: 0 6px; border-radius: 3px; font-size: 11px; font-weight: 700;
           letter-spacing: .02em; color: var(--t-fed); background: color-mix(in srgb, var(--t-fed) 12%, var(--surface)); vertical-align: 1px; }
.phead { font-weight: 650; color: var(--ink); }
.lawgroup[data-type="law"], .typebar .fchip[data-type="law"], .elsewhere a.src-fed { --tc: var(--t-fed); }
.elsewhere a.src-fed::before { content: ""; display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--tc); margin-right: 5px; vertical-align: 1px; }

/* Federal bills on Law Changes: an AI-written summary, labeled as such, apart from the bill's own words. */
.aitag, .quotetag { display: inline-block; padding: 0 6px; border-radius: 3px; font-size: 11px; font-weight: 700;
                    letter-spacing: .02em; vertical-align: 1px; white-space: nowrap; }
.aitag { color: color-mix(in srgb, var(--warn) 62%, var(--ink)); background: color-mix(in srgb, var(--warn) 16%, var(--surface)); }
.quotetag { color: var(--ink-2); background: var(--surface-2); }
.aisum { margin: 6px 0 0; font-size: 14px; color: var(--ink-2); }
.billquote { margin: 8px 0 0; padding: 8px 12px; border-left: 3px solid var(--line); background: var(--surface);
             font-family: Georgia, "Times New Roman", serif; font-size: 13.5px; line-height: 1.5; color: var(--ink); }
.billquote .quotetag { font-family: var(--font-ui); margin-right: 4px; }
.billquote a { font-family: var(--font-ui); font-size: 12.5px; white-space: nowrap; }

/* Case page: a court PDF's footnotes, taken out of the running text and collected at the end. */
.footnotes { margin-top: 28px; padding-top: 12px; border-top: 1px solid var(--line); font-size: 0.92em; }
.footnotes h4 { margin: 0 0 8px; font-size: 14px; color: var(--ink-2); }
.footnotes .fn { margin: 0 0 8px; padding-left: 1.8em; text-indent: -1.8em; }  /* flowing text, the number hanging */
.footnotes .fnnum { display: inline-block; width: 1.8em; text-indent: 0; font-weight: 700; color: var(--ink-2); }
.footnotes .fn pre.inline { margin: 0; }
.opinion a.fnref { font-size: 0.72em; vertical-align: super; line-height: 0; padding: 0 1px; text-decoration: none; font-weight: 700; }
.footnotes a.fnnum { text-decoration: none; }
.footnotes a.fnnum:hover, .opinion a.fnref:hover { text-decoration: underline; }
.footnotes .fn:target, .opinion a.fnref:target { background: var(--accent-soft); }
.opinion a.fnref, .footnotes .fn { scroll-margin-top: 90px; }

/* A DCF form's reader (templates/form.html), laid out like the CFOP reader: a bar on top with the search's previous /
   next match; the search, its matches by page and the form's links on the left; PDF.js filling the rest. */
html:has(body.formreader) { height: 100%; }
body.formreader { height: 100%; margin: 0; display: grid; background: var(--bg); }
.formreader .rbar { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; background: var(--surface); border-bottom: 1px solid var(--line); }
.formreader .doctitle { grid-column: 2; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 12px; padding: 10px 20px; min-width: 0; }
.formreader .doctitle .num { font-family: var(--font-mono); font-weight: 600; font-size: 15px; color: var(--accent); white-space: nowrap; }
.formreader .doctitle h1 { margin: 0; font-size: 18px; font-weight: 800; letter-spacing: -.01em; line-height: 1.25; text-wrap: balance; min-width: 10ch; }
.formreader .doctitle .ed { flex: 1 0 100%; font-family: var(--font-mono); font-size: 12px; color: var(--muted); }
.formreader .actions { grid-column: 3; display: flex; gap: 18px; align-items: center; padding: 10px 16px; font-size: 13px; }
.formreader .actions a { font-weight: 600; text-decoration: none; white-space: nowrap; }
.formreader .actions a:hover, .formreader .linkbtn:hover { text-decoration: underline; text-underline-offset: 2px; }
.formreader .linkbtn { font: inherit; font-size: 13px; font-weight: 600; background: none; border: 0; padding: 0; color: var(--accent); cursor: pointer; white-space: nowrap; }
.formreader .rmain { display: grid; grid-template-columns: 340px minmax(0, 1fr); }
.formreader .rmain.noside { grid-template-columns: minmax(0, 1fr); }
.formreader .rside { overflow-y: auto; min-height: 0; background: var(--surface); border-right: 1px solid var(--line); padding: 16px 18px 28px; }
.formreader .viewer { display: block; width: 100%; height: 100%; border: 0; background: var(--surface-2); }
.formreader .noview { padding: 32px; max-width: 60ch; }
.formreader .hits { margin: 0 0 6px; }
.formreader .hitshead, .formreader .sideblock h2 { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin: 0 0 8px; padding-bottom: 8px; border-bottom: 1px solid var(--ink-2); }
.formreader .hitshead h2, .formreader .sideblock h2 { margin: 0; font-size: 15px; font-weight: 700; color: var(--ink); }
.formreader .hitshead span { font-size: 12.5px; color: var(--muted); }
.formreader .hitpage { padding: 4px 0 6px; border-bottom: 1px solid var(--line); }
.formreader .hitpage.here .hp { color: var(--accent); }
.formreader .hp { display: flex; align-items: center; gap: 8px; width: 100%; font: inherit; font-size: 13.5px; font-weight: 700; text-align: left; background: none; border: 0; padding: 4px 0; color: var(--ink); cursor: pointer; }
.formreader .hp:hover { color: var(--accent); }
.formreader .tcount { font-family: var(--font-mono); font-size: 11px; font-weight: 600; background: var(--accent-soft); color: var(--accent); border-radius: 999px; padding: 0 6px; }
.formreader .hitpage ol { list-style: none; margin: 0; padding: 0; }
.formreader .hs { display: block; width: 100%; font: inherit; font-size: 12.5px; line-height: 1.45; text-align: left; background: none; border: 0; padding: 4px 6px 4px 10px; color: var(--ink-2); cursor: pointer; border-radius: 0; }
.formreader .hs:hover { color: var(--ink); background: var(--accent-soft); }
.formreader .hs.current { color: var(--ink); box-shadow: inset 2px 0 0 var(--accent-strong); background: var(--accent-soft); }
.formreader .hs mark { background: var(--hl); color: var(--hl-ink); border-radius: 3px; padding: 0 1px; }
.formreader .hitpage .more { font-size: 12px; color: var(--muted); padding: 2px 10px; }
.formreader .sideblock { margin-top: 22px; }
.formreader .sidelist { list-style: none; margin: 0; padding: 0; font-size: 13px; line-height: 1.45; }
.formreader .sidelist li { padding: 5px 0; border-bottom: 1px solid var(--line); }
.formreader .sidelist li:last-child { border-bottom: 0; }
.formreader .sidelist a { font-weight: 600; text-decoration: none; }
.formreader .sidelist a:hover { text-decoration: underline; }
.formreader .sidelist .mono, .formreader .mono { font-family: var(--font-mono); font-size: 12.5px; }
.formreader .tag { font-size: 11px; font-weight: 700; color: var(--accent); background: var(--accent-soft); border-radius: 3px; padding: 0 6px; }
.formreader .sideblock .hint { font-size: 12.5px; margin: 8px 0 0; }
.formreader .formpick { display: flex; flex-wrap: wrap; gap: 6px; }
@media (max-width: 860px) {
  .formreader .rbar { grid-template-columns: minmax(0, 1fr); }
  .formreader .rbar > * { grid-column: 1 !important; grid-row: auto !important; }
  .formreader .actions { flex-wrap: wrap; padding-top: 0; }
  .formreader .rmain { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr); }
  .formreader .rside { border-right: 0; border-bottom: 1px solid var(--line); max-height: 40vh; }
  .formreader .rmain.noside { grid-template-rows: minmax(0, 1fr); }
}
.formreader [hidden] { display: none !important; }

/* The form reader's list of the other forms the search finds, and its previous / next form. */
.formreader .formnav { display: inline-flex; align-items: center; gap: 6px 10px; padding-left: 14px; border-left: 1px solid color-mix(in srgb, var(--hl-ink) 25%, transparent); }
.formreader .formlist { margin: 0 0 14px; }
.formreader .formlist > summary { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; padding-bottom: 8px; margin-bottom: 4px; border-bottom: 1px solid var(--ink-2); cursor: pointer; list-style: none; }
.formreader .formlist > summary::-webkit-details-marker { display: none; }
.formreader .formlist > summary h2 { margin: 0; font-size: 15px; font-weight: 700; }
.formreader .formlist > summary span { font-size: 12.5px; color: var(--muted); }
.formreader #flitems { max-height: 32vh; overflow-y: auto; }
.formreader #flitems h3 { margin: 8px 0 2px; font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); }
.formreader .fl { display: block; padding: 4px 6px 4px 10px; font-size: 12.5px; line-height: 1.4; color: var(--ink-2); text-decoration: none; }
.formreader .fl .mono { font-size: 11.5px; color: var(--accent); }
.formreader .fl:hover { background: var(--accent-soft); color: var(--ink); }
.formreader .fl.current { color: var(--ink); font-weight: 600; background: var(--accent-soft); box-shadow: inset 2px 0 0 var(--accent-strong); }
.lawlinks a.plain { font-family: inherit; font-size: 13.5px; }

/* The library tabs' section headers (a statute chapter, the rules, the admin code, a federal act, the CFOPs, the
   forms): a band that marks where each starts. The topic ("Adoption") is as large as the chapter label and the
   boldest thing in it, since readers look for the subject, not the number; a descriptor ("by series") stays quiet. */
/* The section band, the same on every tab: tinted and striped in the section's source color (--sc). The title is
   the boldest thing in it; a label before it ("Chapter 39") and a descriptor after it stay quieter. */
.lawsect > .lawhead-row, .changes > .lawhead-row { align-items: center; margin: 30px 0 10px; padding: 10px 14px 10px 18px;
  background: color-mix(in srgb, var(--sc, var(--accent)) 8%, var(--surface)); border: 1px solid color-mix(in srgb, var(--sc, var(--accent)) 28%, var(--line));
  border-radius: var(--r); box-shadow: inset 4px 0 0 var(--sc, var(--accent)); }
.lawsect > .lawhead-row .lawhead { margin: 0; font-size: 18px; font-weight: 600; color: var(--ink-2); line-height: 1.3; }
.changes > .lawhead-row .lawhead { margin: 0; font-size: 18px; font-weight: 800; color: var(--ink); line-height: 1.3; }
.lawsect > .lawhead-row .lawhead span, .changes > .lawhead-row .lawhead span { font-size: 14px; color: var(--ink-2); font-weight: 500; }
.lawsect > .lawhead-row .lawhead .topic { font-size: 18px; font-weight: 800; color: var(--ink); margin-left: 0; }
.lawsect > .lawhead-row .lawhead .topic::before { content: "·"; margin: 0 8px 0 4px; color: var(--muted); font-weight: 400; }
.lawsect > .lawhead-row .lawhead .actcnt { font-size: 13px; font-weight: 400; color: var(--muted); }
@media (max-width: 640px) {
  .lawsect > .lawhead-row { padding: 8px 10px 8px 12px; }
  .lawsect > .lawhead-row .lawhead, .lawsect > .lawhead-row .lawhead .topic { font-size: 16px; }
  .lawsect > .lawhead-row .lawhead .topic { display: block; }
  .lawsect > .lawhead-row .lawhead .topic::before { content: none; }
}
.lawsect > .lawhead-row .lawhead { flex: 1 1 0; min-width: 0; }

/* Law Changes, Federal Statutes: the bills grouped by act, each group under a quiet band like the library's. */
.fedgroup { margin-top: 26px; }
.fedgrouphead { margin: 0 0 8px; padding: 7px 12px 7px 16px; font-size: 16px; font-weight: 700; color: color-mix(in srgb, var(--sc) 72%, var(--ink));
  background: color-mix(in srgb, var(--sc) 10%, var(--surface)); border: 1px solid color-mix(in srgb, var(--sc) 45%, var(--line)); box-shadow: inset 4px 0 0 var(--sc); border-radius: var(--r); }
.fedgrouphead span { margin-left: 6px; font-size: 13px; font-weight: 400; color: var(--muted); }
.fedalso { margin: 4px 0 10px 4px; }

/* Page widths: tab pages 1180px; viewers (a case, a section, a form) 1480px, room for a side list beside the text. */
body.docpage .wrap, body.formreader .top .wrap { max-width: 1480px; }
body.formreader { grid-template-rows: auto auto minmax(0, 1fr); }

/* The private usage report. */
.rep { padding-block: 24px 60px; }
.rep h1 { font-size: 22px; margin: 0 0 4px; }
.rep h2 { font-size: 15px; margin: 28px 0 8px; }
.rep table { border-collapse: collapse; width: 100%; font-size: 13.5px; }
.rep th, .rep td { text-align: left; padding: 5px 8px; border-bottom: 1px solid var(--line); vertical-align: top; }
.rep td.n { text-align: right; font-family: var(--font-mono); font-size: 12.5px; }
.rep .days a { margin-right: 10px; }

/* A viewer's tool row: its tools (Hide list, Copy link, then the source's own) and the find bar. */
.toolrow { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 20px; }
.tools { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 18px; font-size: 13.5px; }
.tools a, .tools .linkbtn { font-size: 13.5px; font-weight: 600; text-decoration: none; }
.tools a:hover { text-decoration: underline; }
.findbar { display: flex; align-items: center; gap: 6px; margin-left: auto; color: var(--muted); }
.findbar input { width: 230px; max-width: 46vw; height: 32px; padding: 0 10px; font-size: 14px; border: 1px solid var(--line); border-radius: var(--r); background: var(--surface); color: var(--ink); }
.findbar input:focus { outline: 2px solid var(--accent-strong); outline-offset: 0; border-color: transparent; }
.findbar .mbtn { padding: 0 8px; }
.find-count { font-family: var(--font-mono); font-size: 12.5px; color: var(--ink-2); white-space: nowrap; min-width: 0; }
.find-count:empty { display: none; }
@media (max-width: 640px) { .findbar { margin-left: 0; width: 100%; } .findbar input { flex: 1; max-width: none; width: auto; } }
.formreader .formtools { grid-column: 1 / -1; grid-row: 2; padding: 6px 16px; border-top: 1px solid var(--line); background: var(--surface); }
.formreader .formtools .findbar { margin-left: 0; }
.formreader .formtools .formnav { border-left: 1px solid var(--line); }

/* The breadcrumb trail under the header (static/trail.js). */
.trail { flex: none; width: 100%; padding-block: 8px 0; font-size: 13px; color: var(--muted); }
.trail ol { list-style: none; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 6px; margin: 0; padding: 0; }
.trail li { min-width: 0; max-width: 40ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.trail li + li::before { content: "›"; margin-right: 6px; color: var(--muted); }
.trail a { font-weight: 600; text-decoration: none; }
.trail a:hover { text-decoration: underline; }
.trail [aria-current] { color: var(--ink-2); font-weight: 600; }
body.formreader { display: flex; flex-direction: column; }
body.formreader .trail { max-width: none; padding-bottom: 6px; background: var(--bg); }
.formreader .rmain { flex: 1; min-height: 0; }
.formreader .rbar { grid-template-columns: minmax(0, 1fr) auto; }
.formreader .doctitle { grid-column: 1; }
.formreader .actions { grid-column: 2; }
/* A section opened from a library search: previous / next result, and the list of them. */
.resultnav { justify-content: flex-end; }
.resultlist { position: relative; font-size: 13.5px; }
.resultlist > summary { cursor: pointer; font-weight: 600; color: var(--accent); list-style: none; }
.resultlist > summary::-webkit-details-marker { display: none; }
.resultlist ol { position: absolute; right: 0; z-index: 25; width: min(440px, 90vw); max-height: 60vh; overflow-y: auto; margin: 6px 0 0; padding: 4px 0;
  list-style: none; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); box-shadow: 0 4px 16px rgba(16, 24, 40, .12); }
.resultlist li a { display: block; padding: 6px 12px; text-decoration: none; color: var(--ink-2); }
.resultlist li a:hover { background: var(--accent-soft); color: var(--ink); }
.resultlist li a.current { background: var(--accent-soft); color: var(--ink); box-shadow: inset 3px 0 0 var(--accent-strong); }
.resultlist .num { font-family: var(--font-mono); font-weight: 600; font-size: 12.5px; color: var(--accent); margin-right: 6px; }

/* CFOPs (formerly CFOP Finder): the comparison with DCF's severities, the reader's contents, the details page. */
.flag.sev-high { background: color-mix(in srgb, var(--bad) 16%, var(--surface)); color: color-mix(in srgb, var(--bad) 75%, var(--ink)); }
.flag.sev-medium { background: color-mix(in srgb, var(--warn) 18%, var(--surface)); color: color-mix(in srgb, var(--warn) 70%, var(--ink)); }
.flag.sev-low { background: var(--surface-2); color: var(--ink-2); }
.flag.sev-info { background: none; box-shadow: inset 0 0 0 1px var(--line); color: var(--muted); }
.autogen .flag { margin-left: 0; }
.auditlist { list-style: none; margin: 4px 0 12px; padding: 0 0 0 24px; font-size: 13.5px; }
.auditlist li { padding: 6px 0; border-bottom: 1px solid var(--line); color: var(--ink-2); }
.auditlist li b { color: var(--ink); }
.cfopreader .toc { display: flex; flex-direction: column; }
.cfopreader .te { display: flex; justify-content: space-between; gap: 8px; padding: 4px 6px 4px 10px; font-size: 13px; line-height: 1.35; text-decoration: none; color: var(--ink-2); }
.cfopreader .te:hover { background: var(--accent-soft); color: var(--ink); }
.cfopreader .te.current { background: var(--accent-soft); color: var(--ink); box-shadow: inset 2px 0 0 var(--accent-strong); font-weight: 600; }
.cfopreader .te.nohit { opacity: .55; }
.cfopreader .te .tp { flex: none; font-family: var(--font-mono); font-size: 11.5px; color: var(--muted); white-space: nowrap; }
.cfopreader .te .tp .tcount { margin-right: 6px; }
.cfopreader .te.l3 { padding-left: 24px; }
.cfopreader details.tch > summary { display: flex; align-items: center; list-style: none; cursor: pointer; }
.cfopreader details.tch > summary::-webkit-details-marker { display: none; }
.cfopreader details.tch > summary .chev { flex: none; color: var(--muted); transition: transform .15s; }
.cfopreader details.tch[open] > summary .chev { transform: rotate(90deg); }
.cfopreader details.tch > summary .te { flex: 1; min-width: 0; font-weight: 600; color: var(--ink); }
.cfopreader .tkids { padding-left: 10px; }
.cfopreader .tintro { margin: 2px 0; padding-left: 10px; font-size: 12.5px; color: var(--muted); }
.cfopreader .hitshead .treebtns { display: flex; gap: 6px; }
.cfopreader .hitshead .treebtns button { font: inherit; font-size: 12px; font-weight: 600; color: var(--ink-2); padding: 1px 8px; border: 1px solid var(--line); border-radius: 999px; background: var(--surface); cursor: pointer; }
.cfopreader .tocall { white-space: nowrap; color: var(--ink-2); }
.cfopdetails .facts { margin-top: 4px; }
.hunks { list-style: none; margin: 0; padding: 0; }
.hunks li { padding: 10px 0; border-bottom: 1px solid var(--line); }
.hunkhead { margin: 0 0 4px; font-size: 13px; }
.hunkhead .flag { margin: 0 6px 0 0; }
.hunktext { margin: 0; max-width: 92ch; font-size: 14px; line-height: 1.6; }
.hunktext ins { background: color-mix(in srgb, var(--ok) 18%, transparent); text-decoration: none; }
.hunktext del { background: color-mix(in srgb, var(--bad) 14%, transparent); color: var(--ink-2); }
.cfopsummary { max-width: 92ch; margin: 0; font-size: 14px; }
.cfoptoc { list-style: none; margin: 0; padding: 0; columns: 2 380px; column-gap: 28px; font-size: 13.5px; }
.cfoptoc li { padding: 2px 0; break-inside: avoid; }
.cfoptoc li.lv0 { font-weight: 600; margin-top: 6px; }
.cfoptoc li.lv1 { padding-left: 14px; }
.cfoptoc li.lv2 { padding-left: 28px; }
.cfoptoc a { text-decoration: none; }
.cfoptoc a:hover { text-decoration: underline; }
.citehead { font-size: 15px; margin: 16px 0 4px; }
.cfopcites .csum a { margin-right: 2px; }

/* The notice a visitor agrees to on their first visit (templates/_header.html). */
dialog.notice { max-width: min(560px, calc(100vw - 32px)); padding: 0; border: 1px solid var(--line); border-radius: var(--r);
  background: var(--surface); color: var(--ink); box-shadow: 0 12px 40px rgba(16, 24, 40, .25); }
dialog.notice::backdrop { background: rgba(16, 24, 40, .45); }
dialog.notice form { padding: 22px 24px 20px; }
dialog.notice h2 { font-size: 18px; font-weight: 800; margin: 0 0 10px; }
dialog.notice p { margin: 0 0 10px; font-size: 14.5px; line-height: 1.55; color: var(--ink-2); }
.noticeact { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; margin-top: 16px; }
.noticeact label { display: inline-flex; align-items: center; gap: 6px; font-size: 13.5px; color: var(--ink-2); cursor: pointer; }
.noticeact button { font: inherit; font-weight: 700; padding: 8px 20px; border: 0; border-radius: var(--r); background: var(--accent); color: var(--accent-ink); cursor: pointer; }
.noticeact button:hover { background: var(--accent-strong); }
.noticebtns { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 8px 16px; margin-left: auto; }
.noticebtns a { font-size: 13.5px; font-weight: 600; text-decoration: none; }
.noticebtns a:hover { text-decoration: underline; }
.officialsources .casetitle { margin: 24px 0 6px; }
/* Official sources: a line that links to its own page at the source looks like a link (blue, with the off-site arrow);
   one that doesn't is plain text, so nothing looks broken. */
.officialsources .citelist a .cname { color: var(--accent); }
.officialsources .citelist a .cname::after { content: "\2197"; margin-left: 4px; font-size: .85em; color: var(--muted); }
.officialsources .citelist a:hover .cname { text-decoration: underline; }
.officialsources .citelist li > .cname { font-weight: 500; color: var(--ink); }
.officialsources .lawhead span a { font-weight: 600; }
.officialsources .lawhead span a::after { content: "\2197"; margin-left: 3px; font-size: .85em; }
/* A band whose title comes first (no "Chapter 39" label before it) has no separator dot. */
.lawsect > .lawhead-row .lawhead .topic:first-child::before { content: none; }
