/* Layout: scope switcher sets what you see, rail accordions by entity, centre is a work
   queue rather than a directory. Light is the default; chrome is theme-aware so a light
   page has no dark bands. Brass accent from an official seal; semantics kept separate. */
:root{
  --ink:#16243a; --paper:#f7f6f2; --surface:#ffffff; --rail:#f1efe9;
  --line:#dcd9d0; --line-soft:#e8e5dd;
  --fg:#1c2638; --fg-dim:#5a6376; --fg-faint:#878d9b;
  --chrome-bg:#fcfbf8; --chrome-fg:#1c2638; --chrome-dim:#5a6376; --chrome-line:#dcd9d0;
  --chrome-field:#ffffff; --chrome-field-line:#d3d0c6; --chrome-field-fg:#1c2638;
  --chrome-hover:#f1efe9; --scrim:rgba(28,38,56,.34); --shadow:rgba(28,38,56,.14);
  --sel-bg:#16243a; --sel-fg:#f7f6f2; --go-bg:#16243a; --go-fg:#ffffff;
  --brass:#876a2d; --brass-soft:#f2ebd9;
  --certain:#9b2423; --certain-soft:#f9e8e6;
  --judge:#855810; --judge-soft:#fcf1e0;
  --blocked:#3b5976; --blocked-soft:#e8eff5;
  --done:#2a6341; --done-soft:#e6f1ea;
  --ui:"Public Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --doc:"Source Serif 4",Georgia,"Times New Roman",serif;
  --mono:"IBM Plex Mono",ui-monospace,"SFMono-Regular",Menlo,monospace;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]):not([data-ui-theme="light"]){
  --ink:#0d1420; --paper:#12181f; --surface:#171e27; --rail:#141b24;
  --line:#2a3340; --line-soft:#222b36;
  --fg:#e6e9ee; --fg-dim:#a2abba; --fg-faint:#737d8d;
  --chrome-bg:#0a1119; --chrome-fg:#e9ecf1; --chrome-dim:#9aa3af; --chrome-line:#1d2531;
  --chrome-field:#161d27; --chrome-field-line:#2a3340; --chrome-field-fg:#e9ecf1;
  --chrome-hover:#1c2531; --scrim:rgba(4,7,11,.62); --shadow:rgba(0,0,0,.5);
  --sel-bg:#30405a; --sel-fg:#eef1f6; --go-bg:#c9a861; --go-fg:#0d1420;
  --brass:#c9a861; --brass-soft:#2c2619;
  --certain:#e8807c; --certain-soft:#331d1d;
  --judge:#d8a254; --judge-soft:#30261a;
  --blocked:#8ab2d4; --blocked-soft:#1b2630;
  --done:#6fbd8c; --done-soft:#1a2a20;
  color-scheme:dark;
}}
:root[data-theme="dark"]:not([data-ui-theme="light"]),:root[data-ui-theme="dark"]{
  --ink:#0d1420; --paper:#12181f; --surface:#171e27; --rail:#141b24;
  --line:#2a3340; --line-soft:#222b36;
  --fg:#e6e9ee; --fg-dim:#a2abba; --fg-faint:#737d8d;
  --chrome-bg:#0a1119; --chrome-fg:#e9ecf1; --chrome-dim:#9aa3af; --chrome-line:#1d2531;
  --chrome-field:#161d27; --chrome-field-line:#2a3340; --chrome-field-fg:#e9ecf1;
  --chrome-hover:#1c2531; --scrim:rgba(4,7,11,.62); --shadow:rgba(0,0,0,.5);
  --sel-bg:#30405a; --sel-fg:#eef1f6; --go-bg:#c9a861; --go-fg:#0d1420;
  --brass:#c9a861; --brass-soft:#2c2619;
  --certain:#e8807c; --certain-soft:#331d1d;
  --judge:#d8a254; --judge-soft:#30261a;
  --blocked:#8ab2d4; --blocked-soft:#1b2630;
  --done:#6fbd8c; --done-soft:#1a2a20;
  color-scheme:dark;
}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--fg);font:400 15px/1.55 var(--ui);
  -webkit-font-smoothing:antialiased}
h1,h2,h3,h4{margin:0;text-wrap:balance;letter-spacing:-.01em}
button{font:inherit;color:inherit;cursor:pointer}
input,textarea,select{font:inherit;color:var(--fg)}
.mono{font-family:var(--mono);font-variant-numeric:tabular-nums}
.spacer{flex:1 1 auto}
:focus-visible{outline:2px solid var(--brass);outline-offset:2px}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* chrome */
header.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:40;background:var(--chrome-bg);
  color:var(--chrome-fg);border-bottom:1px solid var(--chrome-line)}
.topin{max-width:1320px;margin:0 auto;padding-block:10px;padding-inline:20px;display:flex;
  align-items:center;gap:13px;flex-wrap:wrap}
.brand{font-weight:700;font-size:15px;display:flex;align-items:center;gap:8px;letter-spacing:.02em}
.seal{width:19px;height:19px;border:1.5px solid var(--brass);border-radius:50%;display:grid;
  place-items:center;font:600 9px/1 var(--mono);color:var(--brass)}
.scope{display:flex;background:var(--chrome-field);border:1px solid var(--chrome-field-line);
  border-radius:3px;overflow:hidden;max-width:100%;min-width:0}
.scope button{border:0;background:none;color:var(--chrome-dim);padding:6px 11px;font-size:12.5px;
  display:flex;align-items:center;gap:6px;white-space:nowrap;min-width:0;max-width:100%}
.scope b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.scope button + button{border-left:1px solid var(--chrome-field-line)}
.scope button:hover{background:var(--chrome-hover)}
.scope b{color:var(--chrome-field-fg);font-weight:600}
.caret{opacity:.55;font-size:10px}
.ksearch{border:1px solid var(--chrome-field-line);background:var(--chrome-field);border-radius:3px;
  color:var(--chrome-dim);padding:6px 11px;font-size:12.5px;display:flex;align-items:center;gap:9px;
  min-width:0}
.ksearch kbd{font:600 10.5px/1 var(--mono);border:1px solid var(--chrome-field-line);
  border-radius:2px;padding:2px 4px;color:var(--chrome-dim)}
.theme{display:flex;border:1px solid var(--chrome-field-line);border-radius:3px;overflow:hidden;
  background:var(--chrome-field)}
.theme button{border:0;background:none;color:var(--chrome-dim);padding:5px 10px;font-size:11.5px;
  font-weight:600;letter-spacing:.03em}
.theme button + button{border-left:1px solid var(--chrome-field-line)}
.theme button:hover{background:var(--chrome-hover);color:var(--chrome-fg)}
.theme button[aria-pressed="true"]{background:var(--sel-bg);color:var(--sel-fg)}
.who{font-size:12.5px;color:var(--chrome-dim);white-space:nowrap}

.shell{max-width:1320px;margin:0 auto;padding-inline:20px;padding-block:18px 76px;display:grid;
  grid-template-columns:252px minmax(0,1fr);gap:22px;align-items:start}
/* Both tracks need an explicit zero floor, and so do the items: a grid item's
   default min-width is min-content, so one nowrap clause path in the rail was
   widening the document to 737px at a 400px viewport. */
.shell > *{min-width:0}
@media (max-width:900px){.shell{grid-template-columns:minmax(0,1fr);gap:14px}}

/* rail */
.rail{background:var(--rail);border:1px solid var(--line-soft);border-radius:4px;padding:13px 12px;
  position:sticky;top:calc(env(safe-area-inset-top,0px) + 60px);max-height:calc(100vh - 150px);
  overflow:auto}
@media (max-width:900px){.rail{position:static;max-height:none}}
.rail h2{font-size:10.5px;text-transform:uppercase;letter-spacing:.09em;color:var(--fg-faint);
  margin:0 0 8px;font-weight:600}
.rail h2 + h2,.rail hr + h2{margin-top:15px}
.rail hr{border:0;border-top:1px solid var(--line);margin:14px 0 0}
.railfind{width:100%;border:1px solid var(--line);background:var(--surface);border-radius:3px;
  padding:6px 9px;font-size:12.5px;margin-bottom:9px}
.saved{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.saved button{width:100%;text-align:left;border:0;background:none;border-radius:3px;padding:5px 7px;
  font-size:12.5px;color:var(--fg-dim);display:flex;gap:8px}
.saved button:hover{background:var(--surface);color:var(--fg)}
.saved button[aria-current="true"]{background:var(--surface);color:var(--fg);font-weight:600;
  box-shadow:inset 2px 0 0 var(--brass)}
.saved .cnt{margin-left:auto}
.cnt{font-family:var(--mono);font-size:11px;color:var(--fg-faint);font-weight:500}
.cnt.hot{color:var(--certain);font-weight:700}
/* accordion, used in the rail and in the page body */
.acc{border-top:1px solid var(--line-soft)}
.acc:first-of-type{border-top:0}
.acctrig{display:flex;align-items:center;gap:7px;width:100%;border:0;background:none;
  padding:7px 6px;font-size:13px;font-weight:600;text-align:left;border-radius:3px}
.acctrig:hover{background:var(--surface)}
.acctrig .tw{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chev{width:12px;flex:0 0 auto;color:var(--fg-faint);font-size:10px;transition:transform .14s ease}
.acctrig[aria-expanded="true"] .chev{transform:rotate(90deg)}
.accbody{padding:0 0 7px}
.mats{list-style:none;margin:0;padding:0}
.mats button{display:block;width:100%;text-align:left;border:0;background:none;border-radius:3px;
  padding:4px 7px 4px 25px;font-size:12.5px;color:var(--fg-dim);overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
.mats button:hover{background:var(--surface);color:var(--fg)}
.mats button[aria-current="true"]{background:var(--surface);color:var(--fg);font-weight:600;
  box-shadow:inset 2px 0 0 var(--brass)}
.railnote{font-size:11.5px;color:var(--fg-faint);line-height:1.45;margin:13px 0 0}

/* tabs */
.tabs{display:flex;gap:2px;border-bottom:1px solid var(--line);margin-bottom:16px;overflow-x:auto;
  align-items:center}
.tab{border:0;background:none;padding:9px 12px;font-size:13.5px;color:var(--fg-dim);
  border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap;font-weight:500}
.tab[aria-selected="true"]{color:var(--fg);border-bottom-color:var(--brass);font-weight:600}
.tabsep{width:1px;height:18px;background:var(--line);margin-inline:7px;flex:0 0 auto}
.tabctx{font-size:10.5px;text-transform:uppercase;letter-spacing:.07em;color:var(--fg-faint);
  font-weight:600;padding-right:4px;white-space:nowrap}

/* shared bits */
.panel{border:1px solid var(--line);border-radius:4px;background:var(--surface);padding:16px}
.panel + .panel{margin-top:13px}
.panel h3{font-size:14.5px;margin-bottom:4px}
.panel p.lede{font-size:13.5px;color:var(--fg-dim);margin:0 0 13px;max-width:68ch}
.note{font-size:12.5px;color:var(--fg-dim);border-left:2px solid var(--line);padding-left:10px;
  margin-top:13px;max-width:68ch}
.stamp{font-family:var(--mono);font-size:11.5px;color:var(--fg-faint)}
.prov{font-family:var(--mono);font-size:11.5px;color:var(--fg-faint);word-break:break-word}
.badge{font-size:10.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;padding:2px 6px;
  border-radius:2px;background:var(--rail);color:var(--fg-dim);white-space:nowrap}
.badge.new{background:var(--judge-soft);color:var(--judge)}
.badge.err{background:var(--certain-soft);color:var(--certain)}
.badge.ok{background:var(--done-soft);color:var(--done)}
.badge.wait{background:var(--blocked-soft);color:var(--blocked)}
.ebadge{font-size:10.5px;font-weight:700;letter-spacing:.04em;padding:2px 6px;border-radius:2px;
  background:var(--rail);color:var(--fg-dim);white-space:nowrap}
.ebadge.difc{background:var(--blocked-soft);color:var(--blocked)}
.chip{border:1px solid var(--line);background:var(--surface);border-radius:3px;padding:5px 10px;
  font-size:12.5px;color:var(--fg-dim);display:flex;gap:6px;align-items:center}
.chip:hover{border-color:var(--fg-faint)}
.chip[aria-pressed="true"]{background:var(--sel-bg);border-color:var(--sel-bg);color:var(--sel-fg);
  font-weight:600}
.chip .n{font-family:var(--mono);opacity:.75;font-size:11.5px}
.filters{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px;align-items:center}
.fsep{width:1px;height:20px;background:var(--line);margin-inline:2px}
.btn{border:1px solid var(--line);background:var(--paper);border-radius:3px;padding:5px 11px;
  font-size:12.5px;color:var(--fg-dim)}
.btn:hover:not(:disabled){border-color:var(--fg-dim);color:var(--fg)}
.btn.primary{background:var(--go-bg);border-color:var(--go-bg);color:var(--go-fg);font-weight:600}
.btn:disabled{opacity:.45;cursor:not-allowed}
.tw2{overflow-x:auto}
table.g{width:100%;border-collapse:collapse;font-size:13px;min-width:560px}
table.g th,table.g td{text-align:left;padding:9px 10px;border-bottom:1px solid var(--line-soft);
  vertical-align:top}
table.g th{font-size:10.5px;text-transform:uppercase;letter-spacing:.07em;color:var(--fg-faint)}
table.g td.num{font-family:var(--mono);font-variant-numeric:tabular-nums;text-align:right;
  white-space:nowrap}
table.g td.num.flag{color:var(--certain);font-weight:600}
table.g td.num.abst{color:var(--blocked)}
table.g tr.total td{border-top:2px solid var(--line);border-bottom:0;font-weight:700}
.rule-txt{font-size:12.5px;color:var(--fg-dim);max-width:46ch}
.trend{font-size:11.5px;font-weight:700;padding:2px 6px;border-radius:2px;white-space:nowrap}
.trend.fixed{background:var(--done-soft);color:var(--done)}
.trend.open{background:var(--rail);color:var(--fg-dim)}
.trend.regress{background:var(--certain-soft);color:var(--certain)}
.trend.new{background:var(--judge-soft);color:var(--judge)}

/* queue */
.qhead{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:4px}
.qhead h3{font-size:16px}
.qsub{font-size:13px;color:var(--fg-dim);margin:0 0 16px;max-width:66ch}
.qgroup{margin-bottom:20px}
.qlab{display:flex;align-items:center;gap:8px;margin-bottom:7px}
.qlab h4{font-size:12px;text-transform:uppercase;letter-spacing:.07em;font-weight:700}
.qlab.new h4,.qlab.judge h4{color:var(--judge)}
.qlab.certain h4{color:var(--certain)}
.qlab.wait h4{color:var(--fg-faint)}
.qlab .rule{flex:1 1 auto;height:1px;background:var(--line)}
.q{display:grid;gap:5px}
.qrow{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:11px;align-items:center;
  border:1px solid var(--line);border-left-width:3px;border-radius:3px;background:var(--surface);
  padding:10px 13px;text-align:left;width:100%}
.qrow:hover{border-color:var(--fg-faint)}
.qrow.new,.qrow.judge{border-left-color:var(--judge)}
.qrow.certain{border-left-color:var(--certain)}
.qrow.wait{border-left-color:var(--line)}
.qn{font-family:var(--mono);font-size:17px;font-weight:600;min-width:28px;text-align:right}
.qt{min-width:0}
/* An inline element ignores overflow:hidden, so every ellipsis target has to be a
   block. Without this the nowrap titles widened the queue past a 400px viewport. */
.qt .t,.docrow .dn,.mtrig .mname,.pal .pt,.acctrig .tw,.mats button,.src .nm{display:block}
.qt .t{font-size:13.5px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.qt .m{font-size:11.5px;color:var(--fg-faint);display:flex;gap:7px;flex-wrap:wrap;margin-top:2px}
.ago{font-family:var(--mono);font-size:11px;color:var(--fg-faint);white-space:nowrap}

/* matters page */
.mhead{display:flex;gap:9px;align-items:center;flex-wrap:wrap;margin-bottom:11px}
.searchrow{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;margin-bottom:10px}
@media (max-width:620px){.searchrow{grid-template-columns:1fr}}
.searchrow input{border:1px solid var(--line);background:var(--surface);border-radius:3px;
  padding:9px 11px;font-size:13.5px;width:100%}
.advgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(168px,1fr));gap:9px;
  border:1px solid var(--line);border-radius:4px;background:var(--surface);padding:13px;
  margin-bottom:12px}
.fld{display:grid;gap:3px;min-width:0}
.fld label{font-size:10.5px;text-transform:uppercase;letter-spacing:.07em;color:var(--fg-faint);
  font-weight:600}
.fld select,.fld input{border:1px solid var(--line);background:var(--paper);border-radius:3px;
  padding:6px 8px;font-size:12.5px;width:100%}
.mcard{border:1px solid var(--line);border-radius:4px;background:var(--surface);margin-bottom:8px}
.mcard.archived{opacity:.6}
.mtrig{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;gap:11px;align-items:center;
  width:100%;border:0;background:none;padding:12px 14px;text-align:left}
@media (max-width:620px){.mtrig{grid-template-columns:auto minmax(0,1fr);row-gap:6px}
  .mtrig .mright,.mtrig .mcounts{grid-column:2}}
.mtrig:hover{background:var(--rail)}
.mtrig .mname{font-size:14px;font-weight:600;overflow:hidden;text-overflow:ellipsis;
  white-space:nowrap}
.mtrig .msub{font-size:11.5px;color:var(--fg-faint);margin-top:2px}
.mcounts{display:flex;gap:6px;flex-wrap:wrap}
.mright{display:flex;gap:7px;align-items:center}
.mbody{border-top:1px solid var(--line-soft);padding:12px 14px;display:grid;gap:9px}
.docrow{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:10px;align-items:center;
  border:1px solid var(--line-soft);border-radius:3px;padding:8px 11px;background:var(--paper);
  text-align:left;width:100%}
.docrow:hover{border-color:var(--fg-faint)}
.docrow .dn{font-size:13px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.docrow .dm{font-size:11.5px;color:var(--fg-faint);margin-top:1px}
.macts{display:flex;gap:6px;flex-wrap:wrap;padding-top:4px}

/* sources */
.src{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:11px;align-items:start;
  padding:11px 0;border-top:1px solid var(--line-soft)}
.src:first-of-type{border-top:0}
.src input[type=checkbox]{margin-top:3px;accent-color:var(--brass);width:16px;height:16px}
.src .nm{font-size:13.5px;font-weight:600;display:block}
.src .u{font-family:var(--mono);font-size:11.5px;color:var(--fg-faint);word-break:break-all;
  display:block}
.src .tagline{font-size:12px;color:var(--fg-dim);display:block;margin-top:2px}
.addsrc{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;border:1px dashed var(--line);
  border-radius:4px;padding:12px;margin-top:13px}
@media (max-width:620px){.addsrc{grid-template-columns:1fr}}
.addsrc input{border:1px solid var(--line);background:var(--surface);border-radius:3px;
  padding:8px 10px;font-size:13px;width:100%}
.spin{display:inline-block;width:9px;height:9px;border:1.5px solid var(--blocked);
  border-top-color:transparent;border-radius:50%;animation:sp .7s linear infinite;
  vertical-align:-1px;margin-right:5px}
@keyframes sp{to{transform:rotate(360deg)}}

/* ask */
.askbox{border:1px solid var(--line);border-radius:4px;background:var(--surface);padding:14px}
.askbox textarea{width:100%;border:1px solid var(--line);background:var(--paper);border-radius:3px;
  padding:10px 12px;font-size:14px;min-height:62px;resize:vertical}
.askrow{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:9px}
.bound{border-left:3px solid var(--brass);background:var(--brass-soft);padding:10px 13px;
  border-radius:0 3px 3px 0;font-size:13px;margin-bottom:13px}
.bound b{color:var(--brass)}
.ansum{border:1px dashed var(--brass);border-radius:4px;padding:12px 14px;margin:13px 0}
.ansum .who2{font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--brass);
  font-weight:700;margin-bottom:6px}
.hit{border:1px solid var(--line);border-left:3px solid var(--blocked);border-radius:3px;
  background:var(--surface);padding:11px 13px;margin-bottom:8px}
.hit .hh{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:5px}
.addr{font-family:var(--mono);font-size:12px;background:var(--rail);border:1px solid var(--line-soft);
  padding:1.5px 6px;border-radius:2px;color:var(--fg-dim);unicode-bidi:isolate}
.quote{font-family:var(--doc);font-size:14.5px;line-height:1.6;background:var(--paper);
  border:1px solid var(--line-soft);border-radius:3px;padding:10px 12px;unicode-bidi:isolate;
  white-space:pre-wrap}
.quote.del{border-left:3px solid var(--certain)}
.quote.src{border-left:3px solid var(--blocked)}
.refuse{border:1px solid var(--certain);border-left-width:3px;border-radius:3px;
  background:var(--certain-soft);padding:12px 14px}
.refuse b{color:var(--certain)}

/* auth: its own chrome. The shell, the scope switcher and the bottom bar all go away,
   so a signed-out page cannot hint at what is inside. The theme switch stays. */
body[data-auth] .shell,body[data-auth] .bar,body[data-auth] .scope,
body[data-auth] .ksearch,body[data-auth] .who,body[data-auth] .signout{display:none}
.authwrap{display:none}
body[data-auth] .authwrap{display:grid;place-items:start center;padding:8vh 16px 40px;
  min-height:60vh}
.authcard{width:100%;max-width:426px;border:1px solid var(--line);border-radius:6px;
  background:var(--surface);padding:26px 24px;display:grid;gap:14px}
.authcard.wide{max-width:520px}
.authseal{display:flex;align-items:center;gap:9px;font-weight:700;font-size:15px;
  letter-spacing:.02em}
.authcard h2{font-size:19px}
.authcard .sub{font-size:13.5px;color:var(--fg-dim);margin:0;line-height:1.55}
.authcard label{font-size:10.5px;text-transform:uppercase;letter-spacing:.07em;
  color:var(--fg-faint);font-weight:600;display:block;margin-bottom:4px}
.authcard input[type=email],.authcard input[type=text]{width:100%;border:1px solid var(--line);
  background:var(--paper);border-radius:3px;padding:10px 12px;font-size:14.5px}
.authcard .full{width:100%;justify-content:center;padding:10px 14px;font-size:13.5px}
.authfoot{font-size:12px;color:var(--fg-faint);line-height:1.5;border-top:1px solid var(--line-soft);
  padding-top:12px;margin:0}
.authfoot a,.linkish{color:var(--brass);font-weight:600;background:none;border:0;padding:0;
  text-decoration:underline;text-underline-offset:2px;font-size:inherit}
.autherr{border-left:3px solid var(--certain);background:var(--certain-soft);padding:9px 12px;
  border-radius:0 3px 3px 0;font-size:13px}
.autherr b{color:var(--certain)}
.authok{border-left:3px solid var(--done);background:var(--done-soft);padding:9px 12px;
  border-radius:0 3px 3px 0;font-size:13px}
.otpboxes{display:flex;gap:7px;justify-content:space-between}
.otpbox{width:100%;max-width:54px;aspect-ratio:1/1.18;border:1px solid var(--line);
  background:var(--paper);border-radius:4px;text-align:center;font:600 22px/1 var(--mono);
  color:var(--fg);padding:0}
.otpbox:focus{outline:2px solid var(--brass);outline-offset:1px;background:var(--surface)}
.otpbox[data-filled="1"]{border-color:var(--brass);background:var(--surface)}
.otpmeta{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;
  font-family:var(--mono);font-size:11.5px;color:var(--fg-faint)}
.remember{display:grid;grid-template-columns:auto minmax(0,1fr);gap:9px;align-items:start;
  font-size:12.5px;color:var(--fg-dim)}
.remember input{accent-color:var(--brass);width:16px;height:16px;margin-top:2px}
.wsrow{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:11px;align-items:center;
  border:1px solid var(--line);border-radius:4px;background:var(--paper);padding:12px 14px;
  text-align:left;width:100%}
.wsrow:hover{border-color:var(--brass)}
.wsrow .wn{font-size:13.5px;font-weight:600}
.wsrow .wd{font-size:12px;color:var(--fg-faint);margin-top:2px}
.protohint{border:1px dashed var(--line);border-radius:4px;padding:9px 11px;font-size:11.5px;
  color:var(--fg-faint);font-family:var(--mono);line-height:1.5}

/* two-level nav: primary, then document context */
.nav2{display:flex;gap:2px;align-items:center;background:var(--rail);border:1px solid var(--line-soft);
  border-radius:4px;padding:5px 8px;margin:-8px 0 16px;overflow-x:auto}
.nav2 .tab{padding:5px 10px;font-size:12.5px;border-bottom:0;border-radius:3px;margin:0}
.nav2 .tab[aria-selected="true"]{background:var(--surface);border-bottom:0;box-shadow:inset 0 -2px 0 var(--brass)}
.nav2 .doc{font-size:11.5px;font-weight:700;color:var(--fg-dim);padding-right:9px;margin-right:4px;
  border-right:1px solid var(--line);white-space:nowrap}

/* screen index */
.idx{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:9px}
.idxc{border:1px solid var(--line);border-radius:4px;background:var(--surface);padding:12px 14px;
  text-align:left;width:100%;display:grid;gap:4px}
.idxc:hover{border-color:var(--brass)}
.idxc .k{font:700 10.5px/1 var(--mono);color:var(--brass);letter-spacing:.06em}
.idxc .t{font-size:13.5px;font-weight:600}
.idxc .d{font-size:12px;color:var(--fg-dim);line-height:1.45}
.idxg{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--fg-faint);
  font-weight:700;margin:18px 0 8px;display:flex;align-items:center;gap:8px}
.idxg::after{content:"";flex:1 1 auto;height:1px;background:var(--line)}
.idxg:first-of-type{margin-top:0}

/* upload / dropzone */
.drop{border:2px dashed var(--line);border-radius:5px;background:var(--surface);padding:28px 18px;
  text-align:center;display:grid;gap:7px;justify-items:center}
.drop b{font-size:14.5px}
.drop .sm{font-size:12.5px;color:var(--fg-dim);max-width:52ch}
.filecard{border:1px solid var(--line);border-left:3px solid var(--done);border-radius:4px;
  background:var(--surface);padding:13px 15px;margin-top:11px}
.props{display:grid;grid-template-columns:repeat(auto-fit,minmax(142px,1fr));gap:9px;margin-top:11px}
.prop{border:1px solid var(--line-soft);border-radius:3px;background:var(--paper);padding:8px 10px}
.prop .pl{font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--fg-faint);
  font-weight:600}
.prop .pv{font-size:13.5px;font-weight:600;font-variant-numeric:tabular-nums;margin-top:2px}
.radios{display:grid;gap:7px;margin-top:11px}
.radio{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;border:1px solid var(--line);
  border-radius:3px;padding:10px 12px;background:var(--paper);align-items:start}
.radio input{margin-top:3px;accent-color:var(--brass);width:16px;height:16px}
.radio .rl{font-size:13.5px;font-weight:600}
.radio .rd{font-size:12.5px;color:var(--fg-dim);margin-top:2px}

/* run progress */
.steps{display:grid;gap:3px;margin-top:13px}
.step{display:grid;grid-template-columns:20px minmax(0,1fr) auto;gap:10px;align-items:center;
  padding:9px 11px;border:1px solid var(--line-soft);border-radius:3px;background:var(--paper)}
.step.done{border-left:3px solid var(--done)}
.step.now{border-left:3px solid var(--brass);background:var(--brass-soft)}
.step.todo{opacity:.55}
.step .si{font:700 11px/1 var(--mono);color:var(--fg-faint);text-align:center}
.step.done .si{color:var(--done)}
.step .st{font-size:13px;font-weight:600}
.step .sv{font-family:var(--mono);font-size:11.5px;color:var(--fg-faint);white-space:nowrap}

/* reader */
.readwrap{display:grid;grid-template-columns:minmax(0,1fr) 288px;gap:16px;align-items:start}
@media (max-width:980px){.readwrap{grid-template-columns:1fr}}
.doccol{border:1px solid var(--line);border-radius:4px;background:var(--surface);padding:20px 22px}
.doccol h4{font-size:12px;text-transform:uppercase;letter-spacing:.07em;color:var(--fg-faint);
  margin:0 0 12px}
.cl{padding:9px 0;border-top:1px solid var(--line-soft)}
.cl:first-of-type{border-top:0}
.cl .cnum{font:600 11.5px/1 var(--mono);color:var(--brass)}
.cl .ctxt{font-family:var(--doc);font-size:14.5px;line-height:1.65;margin-top:4px;unicode-bidi:isolate}
.cl.flagged{background:var(--certain-soft);border-radius:3px;padding:9px 11px;
  box-shadow:inset 3px 0 0 var(--certain)}
.cl.flagged.judge{background:var(--judge-soft);box-shadow:inset 3px 0 0 var(--judge)}
.margin{display:grid;gap:8px;position:sticky;top:calc(env(safe-area-inset-top,0px) + 60px)}
@media (max-width:980px){.margin{position:static}}
.pin{border:1px solid var(--line);border-left:3px solid var(--certain);border-radius:3px;
  background:var(--surface);padding:10px 12px;text-align:left;width:100%}
.pin.judge{border-left-color:var(--judge)}
.pin:hover{border-color:var(--fg-dim)}
.pin .pt2{font-size:12.5px;font-weight:600;line-height:1.4}
.pin .pa{font:600 11px/1 var(--mono);color:var(--fg-faint);margin-bottom:4px}

/* text diff */
.dsel{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:11px;align-items:end;
  border:1px solid var(--line);border-radius:4px;background:var(--surface);padding:13px 15px;
  margin-bottom:12px}
@media (max-width:620px){.dsel{grid-template-columns:1fr}.dsel .arrow{display:none}}
.dsel .arrow{font-family:var(--mono);color:var(--fg-faint);padding-bottom:7px}
.drow{border:1px solid var(--line);border-left-width:3px;border-radius:3px;background:var(--surface);
  padding:11px 13px;margin-bottom:7px}
.drow.substantive{border-left-color:var(--certain)}
.drow.inserted{border-left-color:var(--done)}
.drow.deleted{border-left-color:var(--judge)}
.drow.moved{border-left-color:var(--blocked)}
.drow.renumbered,.drow.orthographic{border-left-color:var(--line)}
.dhead{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:6px}
.dkind{font-size:10.5px;text-transform:uppercase;letter-spacing:.07em;font-weight:700;
  padding:2.5px 7px;border-radius:2px}
.dkind.substantive{background:var(--certain-soft);color:var(--certain)}
.dkind.inserted{background:var(--done-soft);color:var(--done)}
.dkind.deleted{background:var(--judge-soft);color:var(--judge)}
.dkind.moved{background:var(--blocked-soft);color:var(--blocked)}
.dkind.renumbered,.dkind.orthographic{background:var(--rail);color:var(--fg-dim)}
.dtext{font-family:var(--doc);font-size:14.5px;line-height:1.65;unicode-bidi:isolate;
  background:var(--paper);border:1px solid var(--line-soft);border-radius:3px;padding:10px 12px}
.dtext del{background:rgba(155,36,35,.14);color:var(--certain);text-decoration:line-through;
  padding:0 2px;border-radius:2px}
.dtext ins{background:rgba(42,99,65,.14);color:var(--done);text-decoration:none;padding:0 2px;
  border-radius:2px}
.dby{font-family:var(--mono);font-size:11px;color:var(--fg-faint);margin-top:6px}

/* output */
.outrow{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:11px;align-items:center;
  border:1px solid var(--line-soft);border-radius:3px;background:var(--paper);padding:10px 12px}
.outrow .oi{font:700 11px/1 var(--mono);color:var(--brass)}
.dlbox{border:1px solid var(--brass);border-radius:4px;background:var(--brass-soft);padding:14px 16px;
  margin-top:13px}
.dlbox h4{font-size:13.5px;margin-bottom:5px}

/* activity */
table.g td.who3{font-weight:600;white-space:nowrap}
.actkind{font:700 10.5px/1 var(--mono);padding:2px 5px;border-radius:2px;background:var(--rail);
  color:var(--fg-dim);white-space:nowrap}

/* settings */
.setgrid{display:grid;gap:11px}
.setrow{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;
  border:1px solid var(--line-soft);border-radius:3px;padding:11px 13px;background:var(--paper)}
.setrow .sn{font-size:13.5px;font-weight:600}
.setrow .sd{font-size:12.5px;color:var(--fg-dim);margin-top:2px}
.toggle{width:38px;height:21px;border-radius:11px;border:1px solid var(--line);background:var(--rail);
  position:relative;flex:0 0 auto}
.toggle[aria-pressed="true"]{background:var(--done);border-color:var(--done)}
.toggle::after{content:"";position:absolute;top:2px;left:2px;width:15px;height:15px;border-radius:50%;
  background:var(--surface);transition:transform .15s ease}
.toggle[aria-pressed="true"]::after{transform:translateX(17px)}

/* forms */
.form{display:grid;gap:12px;max-width:620px}
.form .fld input,.form .fld select,.form .fld textarea{padding:8px 10px;font-size:13.5px}
.inherit{border-left:3px solid var(--blocked);background:var(--blocked-soft);padding:10px 12px;
  border-radius:0 3px 3px 0;font-size:12.5px}

/* run failure */
.pickrow{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 12px}
.failtop{border:1px solid var(--line);border-left:3px solid var(--certain);
  background:var(--certain-soft);border-radius:0 4px 4px 0;padding:14px 16px;margin-bottom:12px;
  display:grid;gap:7px}
.failtop h3{font-size:15.5px;margin:0}
.step.fail{border-left:3px solid var(--certain);background:var(--certain-soft)}
.step.fail .si{color:var(--certain)}
.kept{border:1px solid var(--line-soft);border-radius:3px;background:var(--paper);
  padding:11px 13px;margin-top:13px}
.kept h4{font-size:10.5px;text-transform:uppercase;letter-spacing:.07em;color:var(--fg-faint);
  margin:0 0 5px}

/* finding detail: assignment and discussion */
.assign{display:grid;grid-template-columns:repeat(auto-fit,minmax(172px,1fr));gap:8px}
.who4{text-align:left;border:1px solid var(--line);border-radius:3px;background:var(--paper);
  padding:9px 11px;display:grid;gap:2px}
.who4:hover{border-color:var(--fg-faint)}
.who4[aria-pressed="true"]{border-color:var(--sel-bg);background:var(--sel-bg);color:var(--sel-fg)}
.who4 .wn2{font-size:13.5px;font-weight:600;display:block}
.who4 .wr{font-size:11.5px;color:var(--fg-dim);display:block}
.who4[aria-pressed="true"] .wr{color:var(--sel-fg);opacity:.8}
.thr{display:grid;gap:8px;margin-bottom:12px}
.cmt{border:1px solid var(--line-soft);border-radius:3px;background:var(--paper);padding:10px 12px}
.cmt.mine{border-left:3px solid var(--sel-bg);border-radius:0 3px 3px 0}
.cmt.ext{border-left:3px solid var(--blocked);background:var(--blocked-soft);
  border-radius:0 3px 3px 0}
.ch2{display:flex;flex-wrap:wrap;gap:7px;align-items:center;margin-bottom:5px}
.ch2 .cw{font-size:12.5px;font-weight:700}
.ch2 .ct{font-family:var(--mono);font-size:11px;color:var(--fg-faint)}
.cmt .cb{font-size:13px;line-height:1.52}
.cmtbox{border:1px solid var(--line);border-radius:3px;background:var(--surface);padding:11px 12px}
.cmtbox textarea{width:100%;box-sizing:border-box;min-height:66px;font-family:var(--ui);
  font-size:13px;padding:8px 10px;border:1px solid var(--line);border-radius:3px;
  background:var(--paper);color:var(--fg);resize:vertical}
.vis{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:9px}

/* bulk re-run */
.rrow{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;gap:11px;align-items:center;
  border:1px solid var(--line-soft);border-radius:3px;background:var(--paper);padding:10px 12px}
.rrow .rn2{font-size:13.5px;font-weight:600;display:block}
.rrow .rm{font-size:12px;color:var(--fg-dim);display:block;margin-top:2px}
.rrow .rt{font-family:var(--mono);font-size:11px;color:var(--fg-faint);white-space:nowrap}
.rrow .rwhy{display:block;margin-top:4px;font-size:11.5px;color:var(--judge);
  background:var(--judge-soft);border-radius:2px;padding:2px 6px;justify-self:start;width:fit-content}
.bar2{display:block;width:80px;height:5px;border-radius:3px;background:var(--rail);overflow:hidden}
.bar2 i{display:block;height:100%;background:var(--done)}
@media (max-width:760px){.rrow{grid-template-columns:auto minmax(0,1fr)}
  .rrow .rs,.rrow .rt{grid-column:2}}

/* source detail: snapshot history */
.snap{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:11px;align-items:start;
  border:1px solid var(--line-soft);border-radius:3px;background:var(--paper);padding:10px 12px;
  margin-bottom:6px}
.snap .sdot{width:7px;height:7px;border-radius:50%;background:var(--fg-faint);margin-top:5px}
.snap.changed{border-left:3px solid var(--judge);background:var(--judge-soft);
  border-radius:0 3px 3px 0}
.snap.changed .sdot{background:var(--judge)}
.snap.first{border-left:3px solid var(--line);border-radius:0 3px 3px 0}
.snap .st2{font-size:13px;font-weight:600;display:block}
.snap .sd2{font-size:12.5px;color:var(--fg-dim);display:block;margin-top:3px;line-height:1.5}
.snap .sw{font-family:var(--mono);font-size:11px;color:var(--fg-faint);white-space:nowrap}
@media (max-width:620px){.snap{grid-template-columns:auto minmax(0,1fr)}.snap .sw{grid-column:2}}

/* empty state */
.empty0{border:1px solid var(--line);border-radius:5px;background:var(--surface);padding:28px 22px;
  display:grid;gap:13px;justify-items:start;max-width:640px}
.empty0 h3{font-size:17px}
.stepsq{display:grid;gap:7px;counter-reset:s}
.stepsq li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:11px;font-size:13.5px;
  align-items:baseline}
.stepsq li::before{counter-increment:s;content:counter(s);font:700 11px/19px var(--mono);
  width:19px;height:19px;border-radius:50%;background:var(--sel-bg);color:var(--sel-fg);
  text-align:center}

/* ask: chat with a matter */
.scopebar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:11px;align-items:center;
  border:1px solid var(--line);border-radius:4px;background:var(--surface);padding:11px 14px;
  margin-bottom:11px}
@media (max-width:620px){.scopebar{grid-template-columns:1fr}}
.scopebar .sl{font-size:10.5px;text-transform:uppercase;letter-spacing:.07em;color:var(--fg-faint);
  font-weight:600}
.scopebar .sv{font-size:13.5px;font-weight:600;margin-top:2px}
.scopebar .sm{font-size:11.5px;color:var(--fg-faint);margin-top:2px}
.scopebar select{border:1px solid var(--line);background:var(--paper);border-radius:3px;
  padding:6px 8px;font-size:12.5px;max-width:100%}
.gapwarn{border-left:3px solid var(--blocked);background:var(--blocked-soft);padding:8px 11px;
  border-radius:0 3px 3px 0;font-size:12.5px;margin-bottom:11px}
.thread{display:grid;gap:11px;margin-bottom:13px}
.turn{display:grid;gap:7px}
.you{justify-self:end;max-width:min(560px,92%);background:var(--sel-bg);color:var(--sel-fg);
  border-radius:4px 4px 0 4px;padding:9px 13px;font-size:13.5px}
.ans{border:1px solid var(--line);border-left-width:3px;border-radius:4px;background:var(--surface);
  padding:13px 15px;max-width:min(760px,100%)}
.ans.grounded{border-left-color:var(--done)}
.ans.none{border-left-color:var(--judge)}
.ans.partial{border-left-color:var(--blocked)}
.ans.outside{border-left-color:var(--certain)}
.kind{font-size:10.5px;text-transform:uppercase;letter-spacing:.07em;font-weight:700;
  padding:2.5px 7px;border-radius:2px;white-space:nowrap}
.kind.grounded{background:var(--done-soft);color:var(--done)}
.kind.none{background:var(--judge-soft);color:var(--judge)}
.kind.partial{background:var(--blocked-soft);color:var(--blocked)}
.kind.outside{background:var(--certain-soft);color:var(--certain)}
.ahead{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:7px}
.cover{font-family:var(--mono);font-size:11px;color:var(--fg-faint)}
.abody{font-size:14px;line-height:1.6}
.abody p{margin:0 0 8px}
.cref{display:inline-flex;align-items:center;border:1px solid var(--brass);background:var(--brass-soft);
  color:var(--brass);border-radius:2px;padding:0 4px;font:600 11px/1.5 var(--mono);
  margin-inline:1px;cursor:pointer;vertical-align:1px}
.cref:hover{background:var(--brass);color:var(--go-fg)}
.cref[aria-expanded="true"]{background:var(--brass);color:var(--go-fg)}
.cites{display:grid;gap:6px;margin-top:10px}
.cite{border:1px solid var(--line-soft);border-left:3px solid var(--blocked);border-radius:3px;
  background:var(--paper);padding:9px 11px}
.cite .ch{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:5px}
.cite .cn{font:700 11px/1 var(--mono);color:var(--brass)}
.aacts{display:flex;gap:6px;flex-wrap:wrap;margin-top:11px;padding-top:10px;
  border-top:1px solid var(--line-soft)}
.follow{display:flex;gap:6px;flex-wrap:wrap;margin-top:9px}
.composer{border:1px solid var(--line);border-radius:4px;background:var(--surface);padding:12px;
  position:sticky;bottom:60px}
@media (max-width:900px){.composer{position:static}}
.composer textarea{width:100%;border:1px solid var(--line);background:var(--paper);border-radius:3px;
  padding:10px 12px;font-size:14px;min-height:56px;resize:vertical}
.crow{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:9px}
.thinking{display:flex;gap:8px;align-items:center;font-size:13px;color:var(--fg-dim)}

/* findings */
.run{border:1px solid var(--line);border-radius:4px;background:var(--surface);padding:14px 16px;
  margin-bottom:16px;display:grid;gap:10px}
.run .hdl{display:flex;gap:10px;align-items:baseline;flex-wrap:wrap}
.run h3{font-size:15px}
.newsrc{border-left:3px solid var(--judge);background:var(--judge-soft);padding:10px 13px;
  border-radius:0 3px 3px 0;font-size:13.5px}
.newsrc b{color:var(--judge)}
.bulk{display:flex;gap:8px;align-items:center;flex-wrap:wrap;border:1px solid var(--brass);
  background:var(--brass-soft);border-radius:3px;padding:8px 12px;margin-bottom:11px;font-size:13px}
.bulk b{font-family:var(--mono)}
.list{display:grid;gap:8px}
.f{border:1px solid var(--line);border-left-width:3px;border-radius:3px;background:var(--surface)}
.f.certain{border-left-color:var(--certain)}
.f.judge{border-left-color:var(--judge)}
.f.blocked{border-left-color:var(--blocked)}
.f.resolved{opacity:.6}
.fhead{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:11px;padding:12px 14px;
  align-items:start}
@media (max-width:660px){.fhead{grid-template-columns:auto minmax(0,1fr)}}
.fhead input[type=checkbox]{margin-top:4px;accent-color:var(--brass);width:15px;height:15px}
.fmeta{display:flex;gap:7px;align-items:center;flex-wrap:wrap;margin-bottom:4px}
.sev{font-size:10.5px;text-transform:uppercase;letter-spacing:.07em;font-weight:700;padding:2.5px 7px;
  border-radius:2px}
.sev.certain{background:var(--certain-soft);color:var(--certain)}
.sev.judge{background:var(--judge-soft);color:var(--judge)}
.sev.blocked{background:var(--blocked-soft);color:var(--blocked)}
.cat{font-size:11.5px;color:var(--fg-faint)}
.ftitle{font-size:14.5px;font-weight:600;line-height:1.4;margin:0 0 3px}
.fwhy{font-size:13.5px;color:var(--fg-dim);margin:0}
.statusbox{display:flex;flex-direction:column;gap:6px;align-items:flex-end;min-width:0}
@media (max-width:660px){.statusbox{align-items:flex-start;grid-column:2}}
.state{font-size:11.5px;font-weight:600;padding:3px 8px;border-radius:2px;white-space:nowrap}
.state.open{background:var(--rail);color:var(--fg-dim)}
.state.fixing{background:var(--brass-soft);color:var(--brass)}
.state.fixed{background:var(--done-soft);color:var(--done)}
.state.wont{background:var(--blocked-soft);color:var(--blocked)}
.acts{display:flex;gap:5px;flex-wrap:wrap}
.act{border:1px solid var(--line);background:var(--paper);border-radius:3px;padding:4px 9px;
  font-size:12px;color:var(--fg-dim)}
.act:hover:not(:disabled){border-color:var(--fg-dim);color:var(--fg)}
.act[aria-pressed="true"]{background:var(--sel-bg);border-color:var(--sel-bg);color:var(--sel-fg)}
.act:disabled{opacity:.42;cursor:not-allowed}
.act.prep{border-color:var(--brass);color:var(--brass);font-weight:600}
.act.prep:disabled{border-color:var(--line);color:var(--fg-faint);font-weight:400}
.disclose{border:0;background:none;padding:0;font-size:12.5px;color:var(--brass);font-weight:600;
  text-decoration:underline;text-underline-offset:2px}
.ev{border-top:1px solid var(--line-soft);padding:13px 14px;display:grid;gap:11px;
  background:var(--paper);border-radius:0 0 3px 3px}
.evrow{display:grid;gap:4px}
.evlab{font-size:10.5px;text-transform:uppercase;letter-spacing:.07em;color:var(--fg-faint);
  font-weight:600}
.inner{display:grid;gap:3px;margin:0;padding:0;list-style:none}
.inner li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:9px;font-size:12.5px;
  padding:5px 8px;background:var(--surface);border:1px solid var(--line-soft);border-radius:2px}
.inner code{font-family:var(--mono);font-size:12px;color:var(--fg)}
.whybox textarea{font-size:13px;border:1px solid var(--line);border-radius:3px;padding:7px 9px;
  background:var(--surface);resize:vertical;min-height:46px;width:100%}
.audit{font-size:12px;color:var(--fg-faint);font-family:var(--mono)}

/* palette */
.scrim{position:fixed;inset:0;background:var(--scrim);z-index:50;display:grid;
  place-items:start center;padding:14vh 16px 16px}
.pal{background:var(--surface);border:1px solid var(--line);border-radius:5px;width:100%;
  max-width:560px;box-shadow:0 18px 50px var(--shadow);overflow:hidden}
.pal input{width:100%;border:0;border-bottom:1px solid var(--line);padding:14px 16px;font-size:15px;
  background:none}
.pal input:focus{outline:0}
.pal ul{list-style:none;margin:0;padding:6px;max-height:50vh;overflow:auto}
.pal li button{width:100%;text-align:left;border:0;background:none;border-radius:3px;padding:8px 10px;
  display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center}
.pal li button:hover,.pal li button:focus-visible{background:var(--rail)}
.pal .pt{font-size:13.5px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pal .pm{font-size:11.5px;color:var(--fg-faint)}
.pal .pk{font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--fg-faint);
  font-weight:700}
.pal .empty{padding:14px 16px;font-size:13px;color:var(--fg-dim)}

/* bottom bar */
.bar{position:fixed;left:0;right:0;bottom:0;z-index:35;background:var(--chrome-bg);
  color:var(--chrome-fg);padding-block:10px;
  padding-bottom:calc(10px + env(safe-area-inset-bottom,0px));padding-inline:20px;
  border-top:1px solid var(--chrome-line)}
.barin{max-width:1320px;margin:0 auto;display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.barin .s{font-size:12.5px;color:var(--chrome-dim)}
.go{border:1px solid var(--go-bg);background:var(--go-bg);color:var(--go-fg);border-radius:3px;
  padding:7px 14px;font-size:13px;font-weight:700}
.go.ghost{background:none;color:var(--brass);border-color:var(--line)}
.go:disabled{opacity:.45;cursor:not-allowed}

/* ── the served application ─────────────────────────────────────────────────
   The prototype rendered its chrome from JavaScript. These are the few rules
   the server-rendered markup needs that the prototype did not have a class for. */
.themesw{display:flex;gap:0;border:1px solid var(--chrome-field-line);border-radius:3px;
  overflow:hidden}
.themesw button{font:600 11.5px/1 var(--ui);padding:5px 10px;background:var(--chrome-field);
  color:var(--chrome-dim);border:0}
.themesw button[aria-current="true"]{background:var(--sel-bg);color:var(--sel-fg)}
.rail .ent{padding:9px 10px 4px;display:grid;gap:1px}
.rail .ent .en{font-size:12.5px;font-weight:700}
.rail .ent .ek{font:500 10.5px/1 var(--mono);color:var(--fg-faint);text-transform:uppercase;
  letter-spacing:.05em}
.rail a.mat{display:block;padding:6px 10px 6px 18px;font-size:13px;color:var(--fg-dim);
  text-decoration:none;border-left:2px solid transparent}
.rail a.mat:hover{color:var(--fg);border-left-color:var(--brass);background:var(--chrome-hover)}
a.qrow{text-decoration:none;color:inherit}
.qrow .qm{font-size:12px;color:var(--fg-dim);display:block;margin-top:2px}
a.tab{text-decoration:none;display:inline-block}
.statusbox form.acts{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}
header.top form{display:flex;margin:0}

/* The served finding head has no select box, so the body is the first cell
   rather than the second. The prototype's mobile rules place the status column
   at grid-column 2, which pushes it off a phone screen here. */
.fhead.plain{grid-template-columns:minmax(0,1fr) auto}
@media (max-width:660px){
  .fhead.plain{grid-template-columns:minmax(0,1fr)}
  .fhead.plain .statusbox{grid-column:1;flex-direction:row;align-items:center;flex-wrap:wrap}
  .fhead.plain .statusbox form.acts{margin-top:0}
}

/* source history */
.snap{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:11px;align-items:start;
  border:1px solid var(--line-soft);border-radius:3px;background:var(--paper);padding:10px 12px;
  margin-bottom:6px}
.snap .sdot{width:7px;height:7px;border-radius:50%;background:var(--fg-faint);margin-top:5px}
.snap.changed{border-left:3px solid var(--judge);background:var(--judge-soft);
  border-radius:0 3px 3px 0}
.snap.changed .sdot{background:var(--judge)}
.snap.first{border-left:3px solid var(--line);border-radius:0 3px 3px 0}
.snap .st2{font-size:13px;font-weight:600;display:block}
.snap .sd2{font-size:12.5px;color:var(--fg-dim);display:block;margin-top:3px;line-height:1.5}
.snap .sw{font-family:var(--mono);font-size:11px;color:var(--fg-faint);white-space:nowrap}
@media (max-width:620px){.snap{grid-template-columns:auto minmax(0,1fr)}.snap .sw{grid-column:2}}
.src a.nm{color:inherit;text-decoration:none}
.src a.nm:hover{text-decoration:underline}
/* The prototype's add-a-source row held a field and a button. These hold a
   field, a chooser and a button, and a two-column grid gave each one the full
   width of the first column, which runs off a phone screen. Wrapping flex suits
   a row whose number of controls varies. */
.addsrc{display:flex;flex-wrap:wrap;align-items:center}
.addsrc > *{flex:0 1 auto;min-width:0}
.addsrc input[type=text],.addsrc input[type=url],.addsrc input:not([type]),
.addsrc input[type=file]{flex:1 1 220px}
.addsrc select{flex:1 1 180px;padding:7px 9px;font-size:13px;border:1px solid var(--line);
  border-radius:3px;background:var(--surface);color:var(--fg)}
.addsrc button{flex:0 0 auto}
@media (max-width:620px){.addsrc > *{flex:1 1 100%}}
a.btn{text-decoration:none;display:inline-block}
/* A badge never widens its row: the row is a grid and the badge is the last
   cell, so an over-long one has nowhere to go but off the screen. */
.src .badge,.qrow .badge{white-space:normal;overflow-wrap:anywhere;text-align:right}
/* A portal URL is one long unbroken token. It has to be shown in full — it is
   the provenance — so it wraps rather than being clipped or truncated. */
.src .u,.prov,.snap .sd2{overflow-wrap:anywhere}

/* comparing two drafts */
.trk{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:11px;align-items:start;
  border:1px solid var(--line-soft);border-radius:3px;background:var(--paper);padding:10px 12px;
  margin-bottom:6px}
.trk .tst{font:700 10px/1.5 var(--mono);text-transform:uppercase;letter-spacing:.06em;
  padding:3px 7px;border-radius:2px;white-space:nowrap;background:var(--rail);color:var(--fg-dim)}
.trk.fixed{border-left:3px solid var(--done);border-radius:0 3px 3px 0}
.trk.fixed .tst{background:var(--done-soft);color:var(--done)}
.trk.returned{border-left:3px solid var(--certain);border-radius:0 3px 3px 0}
.trk.returned .tst{background:var(--certain-soft);color:var(--certain)}
.trk.carried{border-left:3px solid var(--judge);border-radius:0 3px 3px 0}
.trk.carried .tst{background:var(--judge-soft);color:var(--judge)}
.trk.new{border-left:3px solid var(--blocked);border-radius:0 3px 3px 0}
.trk.new .tst{background:var(--blocked-soft);color:var(--blocked)}
.trk .ttl{font-size:13.5px;font-weight:600;display:block}
.trk .tad{font-size:12px;color:var(--fg-dim);display:block;margin-top:2px}
@media (max-width:620px){.trk{grid-template-columns:auto minmax(0,1fr)}.trk .prov{grid-column:2}}

.drow{border:1px solid var(--line-soft);border-radius:3px;background:var(--paper);
  padding:10px 12px;margin-bottom:7px}
.drow.substantive{border-left:3px solid var(--certain);border-radius:0 3px 3px 0}
.drow.inserted{border-left:3px solid var(--done);border-radius:0 3px 3px 0}
.drow.deleted{border-left:3px solid var(--fg-faint);border-radius:0 3px 3px 0}
.drow.moved{border-left:3px solid var(--blocked);border-radius:0 3px 3px 0}
.drow.orthographic,.drow.renumbered{opacity:.8}
.dhead{display:flex;flex-wrap:wrap;gap:8px;align-items:baseline;margin-bottom:5px}
.dhead .dk{font:700 10px/1.5 var(--mono);text-transform:uppercase;letter-spacing:.06em;
  color:var(--fg-faint)}
.dhead .daddr{font-family:var(--mono);font-size:11.5px;font-weight:600}
.dtext{font-family:var(--doc);font-size:13.5px;line-height:1.62;margin:0;overflow-wrap:anywhere}
.dtext del{background:var(--certain-soft);color:var(--certain);text-decoration:line-through;
  text-decoration-thickness:1px;padding:0 2px;border-radius:2px}
.dtext ins{background:var(--done-soft);color:var(--done);text-decoration:none;padding:0 2px;
  border-radius:2px}
.pickrow a.chip{text-decoration:none}

/* the reader */
.rtool{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0 0 12px}
.rtool select,.rtool input{padding:7px 9px;font-size:13px;border:1px solid var(--line);
  border-radius:3px;background:var(--surface);color:var(--fg);min-width:0}
.rtool input{flex:1 1 170px}
.rtool select{flex:1 1 150px}
.rnav{display:flex;gap:8px;margin:2px 0 12px}
.rnav:last-child{margin:12px 0 0}
.cl.d1{padding-left:18px}.cl.d2{padding-left:34px}.cl.d3{padding-left:50px}.cl.d4{padding-left:66px}
.cl.flagged.d1,.cl.flagged.d2,.cl.flagged.d3,.cl.flagged.d4{padding-left:11px;margin-left:18px}
.cl.flagged.blocked{background:var(--blocked-soft);box-shadow:inset 3px 0 0 var(--blocked)}
.cl.hit .ctxt{background:var(--brass-soft);border-radius:2px}
.cl .cnum{overflow-wrap:anywhere}
.pinnote{display:block;margin-top:7px;font-size:12px;line-height:1.45;color:var(--fg-dim);
  text-decoration:none;border-top:1px dashed var(--line);padding-top:6px}
.pinnote b{color:var(--fg)}
.pinnote .prov{margin-left:6px}
.pinnote:hover{color:var(--fg)}
a.pin{display:block;text-decoration:none;color:inherit}
.pin.blocked{border-left-color:var(--blocked)}
.pin.certain{border-left-color:var(--certain)}

/* the document header: views are tabs, actions are buttons */
.hact{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.hact form{margin:0;display:flex}
.sumtiles{margin:6px 0 8px}
.sumtiles .tile{border-left:3px solid var(--line)}
.sumtiles .tile.certain{border-left-color:var(--certain)}
.sumtiles .tile.judge{border-left-color:var(--judge)}
.sumtiles .tile.blocked{border-left-color:var(--blocked)}
.sumline{margin:0 0 12px;max-width:80ch}
.nav2 .tab .mono{font-size:10.5px;color:var(--fg-faint);margin-left:3px}

/* On a phone the entity list is a screen of preamble above every page, and the Matters
   tab lists the same entities and matters. It stays beside the page where there is room. */
@media (max-width:980px){.rail{display:none}}

/* An address to copy. It is selected whole on focus so one click takes all of it. */
.linkbox{width:100%;border:1px solid var(--line);background:var(--paper);border-radius:3px;
  padding:8px 10px;font:12.5px/1.4 var(--mono);color:var(--fg)}

/* People and access: a row per person that wraps, not a table. A role menu and two buttons
   beside an address cannot fit a phone in columns, and a table that scrolls sideways hides
   the Remove button off the edge, which is the one thing here that must not be missed. */
.plist{display:grid}
.prow{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;padding:11px 0;
  border-top:1px solid var(--line-soft)}
.prow:first-child{border-top:0}
.prow .pwho{flex:1 1 220px;min-width:0;overflow-wrap:anywhere;font-size:13.5px}
.prow form{margin:0;min-width:0}
.prow select{padding:6px 8px;font-size:13px;border:1px solid var(--line);background:var(--surface);
  border-radius:3px;max-width:100%}

/* Links inside the sign-in style card: the card sits outside the app's own link styling,
   and the browser's default blue on a cream card reads as a mistake. */
.authcard a:not(.btn){color:var(--brass);text-decoration:underline;text-underline-offset:2px}
.authcard a:not(.btn):hover{color:var(--fg)}

/* Ask. Three registers, kept apart on purpose: the question (the person), the passages
   (copied from a document or a retrieval, in the document's serif), and the model's own
   words (small, labelled, in the blue-grey the stylesheet uses for "about us"). She must
   be able to tell at a glance which words the machine wrote and which it only fetched. */
.askform label{display:block;margin-bottom:5px}
.askform textarea{width:100%;border:1px solid var(--line);background:var(--paper);border-radius:3px;
  padding:9px 11px;font:inherit;font-size:14px;line-height:1.5;resize:vertical;margin-bottom:9px}
.q{border:1px solid var(--line);border-radius:5px;background:var(--surface);padding:14px 16px;
  margin-top:13px}
.qh{display:grid;gap:3px;margin-bottom:11px}
.qtext{font-size:15px;overflow-wrap:anywhere}
.mnote{border-left:3px solid var(--blocked);background:var(--blocked-soft);padding:9px 12px;
  margin:0 0 11px;border-radius:0 3px 3px 0}
.mnote p{margin:4px 0 0;font-size:13.5px;line-height:1.5}
.mlabel{display:block;font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  color:var(--blocked)}
.pwhy .mlabel{display:inline;margin-right:6px}
.pcard{border:1px solid var(--line);border-radius:4px;background:var(--paper);padding:11px 13px;
  margin-top:9px}
.pcard.law{border-left:3px solid var(--done)}
.pcard.documents{border-left:3px solid var(--brass)}
.pmeta{display:flex;flex-wrap:wrap;gap:4px 9px;align-items:baseline;font-size:13px}
.pmeta .pid{margin-left:auto;font:600 11px var(--mono);color:var(--fg-faint)}
.pwhy{margin:7px 0 0;font-size:13px;color:var(--blocked);line-height:1.45}
.ptext{margin:9px 0 0;font-family:var(--doc);font-size:14.5px;line-height:1.6;white-space:pre-wrap;
  overflow-wrap:anywhere;max-height:22em;overflow:auto}
.ptext mark{background:var(--judge-soft);color:inherit;box-shadow:0 0 0 2px var(--judge-soft);
  border-radius:2px}
.pfoot{margin-top:9px;overflow-wrap:anywhere}
.searched{margin-top:12px;font-size:13px}
.searched summary{cursor:pointer;color:var(--fg-dim);font-weight:600}
.searched ul{margin:6px 0 0;padding-left:18px}
.searched li{margin:2px 0;overflow-wrap:anywhere}