/* Editorial, dense, broadsheet. Dark charcoal, warm off-white, hairline rules.
   Serif for headings, monospaced figures right-aligned so money lines up.
   No shadows, no pills, no gradients, no decorative icons. */
:root{
  --bg:#1a1a18; --panel:#111110; --ink:#e8e0d0; --ink-bright:#f0e8d8;
  --dim:#8a8578; --dimmer:#666; --rule:#2a2a28; --hair:#222;
  --accent:#8b5e3c; --warn:#c0622a;
  --confirmed:#4a7c59; --estimate:#8b5e3c; --open:#4a4a46;
  --tint-client:#1e2a1e; --tint-attorney:#1a2030;
  --serif:Georgia,"Times New Roman",serif; --mono:"Courier New",ui-monospace,monospace;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{background:var(--bg);color:var(--ink);font-family:var(--serif);font-size:15px;line-height:1.45;-webkit-font-smoothing:antialiased}

/* masthead */
.masthead{display:flex;align-items:center;gap:24px;flex-wrap:wrap;background:var(--panel);border-bottom:1px solid var(--accent);padding:10px 24px}
.brand{display:flex;align-items:baseline;gap:14px}
.title{font-size:19px;font-weight:700;color:var(--ink-bright)}
.kicker{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim)}
.caseform{margin-left:auto;display:flex;align-items:center;gap:8px}
.caseform label{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--dim)}
.caseform select{min-width:250px}
select,input{background:#111;color:var(--ink);border:1px solid #444;font-family:var(--serif);font-size:13px;padding:4px 8px}
input:focus,select:focus,button:focus,a:focus{outline:2px solid var(--accent);outline-offset:1px}
.btn{display:inline-block;border:1px solid #555;color:#ccc;padding:4px 12px;font-size:12px;text-decoration:none;background:none;cursor:pointer;font-family:var(--serif)}
.btn:hover{color:var(--ink-bright);border-color:#777}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--ink-bright)}
.review-nav{border-color:var(--accent);color:var(--ink-bright);font-weight:700}
button{background:var(--accent);border:1px solid var(--accent);color:var(--ink-bright);font-family:var(--serif);font-size:12px;padding:4px 12px;cursor:pointer}

/* tabs */
.tabs{display:flex;flex-wrap:wrap;background:var(--panel);border-bottom:1px solid var(--rule);padding:0 24px}
.tab{font-size:12.5px;padding:10px 15px 8px;color:var(--dim);text-decoration:none;border-bottom:2px solid transparent}
.tab:hover{color:var(--ink)}
.tab.on{color:var(--ink-bright);border-bottom-color:var(--accent)}
.tab .c{color:#555;font-family:var(--mono);font-size:11px}

.flash{background:#3a2418;border-bottom:1px solid var(--warn);color:#f0d8c8;padding:8px 24px;font-size:13px}

/* layout */
.layout{display:flex;align-items:flex-start}
.content{flex:3;padding:38px 44px;min-width:0}
.content.wide{flex:1}
.rail{flex:1;min-width:300px;max-width:400px;padding:34px 30px;border-left:1px solid var(--rule)}

h1{font-size:46px;font-weight:700;color:var(--ink-bright);margin:0 0 8px;line-height:1.02;letter-spacing:-.015em}
.descriptor{font-size:14px;color:#a49c8e;margin:0 0 6px;line-height:1.45;max-width:62ch}
.statusline{font-size:12px;color:var(--dimmer);margin:0 0 8px}

.titlebar{display:flex;justify-content:space-between;align-items:flex-start;gap:30px;flex-wrap:wrap}
.readat{font-family:var(--mono);font-size:10px;letter-spacing:.06em;color:var(--dim);text-transform:uppercase;white-space:nowrap;padding-top:14px}

/* headline strip */
.headlines{display:flex;flex-wrap:wrap;gap:56px;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:22px 0;margin-bottom:32px}
.headline .cap{font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin-bottom:8px}
.headline .big{font-family:var(--mono);font-size:31px;font-weight:700;color:var(--ink-bright);line-height:1.1;letter-spacing:-.01em}
.headline .big .warn{color:var(--warn)}
.headline .sub{font-size:10.5px;color:var(--dimmer);margin-top:5px}

/* blocks */
.cols{display:flex;gap:56px;flex-wrap:wrap}
.cols>.block{flex:1;min-width:290px}
.block{border-top:2px solid var(--accent);padding-top:18px;margin-bottom:34px}
.blocknum{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-bottom:10px;display:flex;align-items:baseline;gap:10px}
.blocknum .name{font-size:21px;letter-spacing:0;text-transform:none;color:var(--ink-bright);font-weight:700}
.row{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;padding:11px 0;border-bottom:1px solid var(--hair)}
.row.total{border-bottom:1px solid #3a3a36}
.row.total .lbl,.row.total .num{font-weight:700;color:var(--ink-bright)}
.lbl{font-size:14px;color:#b4aea2;flex:1}
.note{display:block;font-size:11px;color:var(--dimmer);margin-top:4px;line-height:1.45}
.num{font-family:var(--mono);font-size:14.5px;color:var(--ink-bright);white-space:nowrap;text-align:right}
.num.warn,.warn{color:var(--warn)}
.quiet{color:var(--dimmer)}
.small{font-size:11px}
.caveat{font-size:10.5px;color:#7a7368;margin:6px 0 0}

/* ── A WITHHELD FIGURE IS FORMATTING, NOT AN ESSAY ───────────────────────────
   Superseded `.blocked`, which printed the whole list of missing inputs in place of
   the number. On a file opened this morning that was every figure on the page, each
   one explaining itself at length. Conditional formatting instead: the same hatch
   used for an empty month cell, loud enough to be unmissable, quiet enough not to
   read as an error — because an unanswered question is not a fault. The reasons live
   on the hover. */
.awaiting{
  font-family:var(--mono);font-size:11.5px;font-style:italic;color:#a99e88;
  background:repeating-linear-gradient(135deg,transparent,transparent 4px,rgba(255,255,255,.05) 4px,rgba(255,255,255,.05) 8px);
  box-shadow:inset 2px 0 0 rgba(255,255,255,.22);
  padding:2px 7px;cursor:help;white-space:nowrap
}
/* The ONE refusal that earns attention: figures that are present contradict each
   other. Warm warning, never the red used for "read by scan and unchecked" — those
   mean opposite things and must not share a colour. Attorney-side only; compute.js
   does not produce this kind for a client. */
.conflicted{
  font-family:var(--mono);font-size:11.5px;color:var(--warn);
  background:rgba(192,98,42,.1);box-shadow:inset 2px 0 0 var(--warn);
  padding:2px 7px;cursor:help;white-space:nowrap
}
.blocked-inline{font-size:11px;color:#9a8e7a;font-style:italic}

.deadline{display:flex;justify-content:space-between;gap:16px;padding:8px 0;border-bottom:1px solid var(--hair)}
.dl-matter{font-size:13px;color:var(--ink)}
.dl-detail{font-size:11px;color:var(--dimmer)}

.threshold{margin-top:12px;background:#1e1e1c;border:1px solid #333;padding:9px 11px}
.threshold label{display:block;font-size:10px;color:var(--dimmer);margin-bottom:5px}
.threshold input{font-family:var(--mono);width:110px}
.threshold .note{margin-top:5px}

/* rail */
.rail-block{margin-bottom:26px}
.rail-block h2{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin:0 0 8px;padding-top:14px;border-top:1px solid var(--rule)}
.rail-block .sub{font-size:11px;color:var(--dimmer);margin:0 0 16px}
.rail-block .sub.caps{text-transform:uppercase;letter-spacing:.08em;margin-top:14px}
dl{margin:0}
dt{font-size:13px;color:#d8d0c0;font-weight:700;margin-bottom:4px}
dd{font-size:12px;color:#948c7e;line-height:1.55;margin:0 0 16px}
.legend{list-style:none;margin:0;padding:0}
.legend li{font-size:11.5px;color:#b4aea2;margin-bottom:9px;line-height:1.5}

/* the two marks */
.mark{display:inline-block;width:10px;height:10px;margin-right:6px;vertical-align:middle;border:1px solid transparent}
.state-CONFIRMED{background:var(--confirmed)}
.state-CLIENT_ESTIMATE{background:var(--estimate)}
.state-OPEN{background:transparent;border-color:#666}
.swatch{display:inline-block;width:10px;height:10px;margin-right:6px;vertical-align:middle;border:1px solid #333}
.swatch.origin-scan{background:transparent;border-color:#555}
.swatch.origin-client{background:var(--tint-client)}
.swatch.origin-attorney{background:var(--tint-attorney)}
.val.origin-client{background:var(--tint-client)}
.val.origin-attorney{background:var(--tint-attorney)}
/* A scanned value is NOT confirmed. Italic, always. */
.val.scanned{font-style:italic}

/* registers */
.grid{width:100%;border-collapse:collapse;margin:14px 0}
.grid th{font-size:9.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--dim);text-align:left;font-weight:400;padding:6px 8px;border-bottom:1px solid var(--rule)}
.grid td{font-size:12.5px;padding:7px 8px;border-bottom:1px solid var(--hair);vertical-align:top}
.grid .r{text-align:right}
.grid .mono{font-family:var(--mono);font-size:11.5px;color:var(--dim)}
.grid .src{font-size:11px;color:var(--dim)}
.grid .small{font-size:11px}
.document-filters{display:flex;align-items:end;gap:10px;flex-wrap:wrap;margin:18px 0 8px;padding:11px 12px;border:1px solid var(--hair);background:var(--panel)}
.document-filters label{display:grid;gap:4px;color:var(--dim);font-size:10px;letter-spacing:.08em;text-transform:uppercase}
.document-filters input,.document-filters select{min-height:32px;min-width:170px;padding:5px 7px;background:var(--bg);color:var(--ink);border:1px solid var(--rule);font:12px var(--mono)}
.document-filters [data-document-count]{margin:0 0 7px auto;white-space:nowrap}
.review-page{max-width:980px}.review-actions{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0 28px}.review-form{margin-top:18px}.review-grid input{width:100%;max-width:260px}.review-grid .note{display:block;margin-top:3px}.review-page .block{margin-top:20px}
.confirmed-by{display:block;font-size:9.5px;color:#5f7a63;margin-top:2px}
.edit{color:var(--dim);font-size:11.5px;text-decoration:none;border-bottom:1px dotted #555}
.edit:hover{color:var(--ink)}
.empty{font-size:13px;color:#9a8e7a;font-style:italic;border-left:2px solid var(--accent);padding:8px 12px;margin:16px 0}
.notbuilt{font-size:14px;color:#c8c0b0;border-left:2px solid var(--accent);padding:8px 12px;margin:14px 0}

/* edit panel — a deliberate act, not an inline nudge */
.panel-backdrop{position:fixed;inset:0;background:rgba(10,10,9,.72);display:flex;justify-content:flex-end;z-index:10}
.panel{background:var(--panel);border-left:1px solid var(--accent);width:min(420px,100%);height:100%;overflow:auto;padding:24px}
.panel h2{font-size:17px;color:var(--ink-bright);margin:0 0 16px}
.panel label{display:block;font-size:11px;color:var(--dim);margin-bottom:13px}
.panel input:not([type=checkbox]),.panel select{display:block;width:100%;margin-top:4px;font-size:13px;padding:6px 8px}
.panel label.check{display:flex;align-items:flex-start;gap:8px;font-size:12px;color:#aaa;flex-wrap:wrap}
.panel-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:20px;border-top:1px solid var(--rule);padding-top:16px}

.foot{display:flex;align-items:center;gap:20px;flex-wrap:wrap;border-top:1px solid var(--rule);margin-top:10px;padding:14px 32px;font-size:11px;color:var(--dimmer)}
.whoami{display:flex;align-items:center;gap:8px}
.whoami input{width:170px}
.sample{margin-left:auto;font-style:italic}

@media (max-width:1100px){
  .masthead{gap:10px;padding:9px 14px}.brand{width:100%}.caseform{margin-left:0;width:100%;gap:6px}.caseform select{min-width:0;flex:1}.caseform .btn{padding:5px 8px}
  .layout{flex-direction:column}
  .rail{max-width:none;width:100%;border-left:0;border-top:1px solid var(--rule)}
  h1{font-size:30px}
  .content{padding:22px 18px}
  .grid{display:block;overflow-x:auto}
}
@media print{
  .tabs,.caseform,.foot,.edit,.panel-backdrop,.flash{display:none}
  body{background:#fff;color:#000}
  .masthead{background:#fff;border-color:#000}
  .title,h1,.num,dt{color:#000}
  .rail{border-left:1px solid #999}
  .blocked{color:#444}
}

.months{border:1px solid #333;padding:10px;margin-bottom:13px}
.months legend{font-size:10px;color:var(--dim);text-transform:uppercase;letter-spacing:.08em;padding:0 6px}
.months .m{display:inline-block;width:31%;margin:0 1% 8px 0;font-size:10px}
.months .m input{width:100%}

.namebar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 8px}
.namebar label{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--dim)}
.namebar input{width:260px}
.namebar .note{margin:0;flex-basis:100%}

.uploader{border:1px solid #333;background:#1e1e1c;padding:14px;margin:16px 0}
.uploader label{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--dim);margin-bottom:6px}
.uploader input[type=file]{color:var(--ink);font-size:12px;margin-right:10px}
.uploader .note{margin-top:8px;max-width:70ch}

/* The headline figures were still rendering small: the inner .num span sets its own
   font-size, which beat the .big parent. The large size never applied to the one place on
   the page that most needed it. Let the strip win for its own children. */
.headline .big .num{font-size:inherit;color:inherit;font-weight:inherit}
.headline .big .num.warn,.headline .big .warn{color:var(--warn)}
/* A withheld headline is a short sentence, not a figure — readable, but not shouting. */
.headline .big .blocked{font-size:15px;text-align:left;max-width:30ch}
.headline .big .blocked .why{font-size:11.5px}

.client-summary{max-width:760px;padding:42px 44px}.client-kicker{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin:0 0 8px}.client-summary .descriptor{margin-bottom:28px}.review-command{border:2px solid var(--accent);background:#241b14;padding:18px 20px;margin:0 0 26px}.review-command .eyebrow{margin:0 0 5px;color:var(--accent);font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}.review-command h2{margin:0;color:var(--ink-bright);font-size:25px}.review-command p:not(.eyebrow){margin:6px 0 14px;color:var(--dim)}.review-command .task-expectation{font-size:12px;color:#b8af9d}.review-command .btn{font-size:14px;padding:8px 14px}.client-urgency{border-left:3px solid var(--warn);background:#302018;padding:11px 13px;margin:0 0 18px;font-size:13px}.client-help{margin:20px 0 0;border:1px solid var(--rule);padding:11px 13px;background:#1c1c19}.client-help summary{cursor:pointer;color:var(--ink-bright);font-weight:700}.client-help p{margin:9px 0 0;color:var(--dim);font-size:12px;max-width:66ch}.todo-list{border-top:2px solid var(--accent)}.todo-list details{border-bottom:1px solid var(--rule);padding:13px 0}.todo-list summary{cursor:pointer;color:var(--ink-bright);font-size:17px;font-weight:700}.todo-list ul{list-style:none;margin:10px 0 0;padding:0}.todo-list li{padding:9px 0;border-top:1px solid var(--hair);display:flex;gap:12px;justify-content:space-between;align-items:baseline;flex-wrap:wrap}.todo-list li a{color:var(--ink);text-decoration:none;border-bottom:1px dotted var(--accent)}.todo-list li a:hover{color:var(--ink-bright)}.todo-list li span,.todo-done span{font-size:11px;color:var(--dimmer)}.todo-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}.todo-done{border-left:2px solid var(--confirmed);padding:12px 14px;background:#1a211a;display:grid;gap:4px}.organized-upload{margin:22px 0;border:1px solid var(--accent);border-left-width:3px;padding:18px 20px;background:#1d1915}.organized-upload h2{margin:0 0 8px}.organized-upload .eyebrow{margin:0 0 6px}.upload-steps{margin:12px 0 16px;padding-left:21px;color:#c4bbab}.upload-steps li{margin:6px 0}.document-task-note{display:block;font-size:11px;color:var(--dimmer);margin-top:5px}

/* A flag, not a verdict. Visible enough to catch the eye, quiet enough that a legitimate
   pair of cards from one bank does not look like an error. */
tr.dup td{background:rgba(192,98,42,.06)}
.dupnote{display:block;font-size:10.5px;color:var(--warn);margin-top:3px;line-height:1.4;max-width:46ch}
.caveat.flagged{color:#c08a5a;border-left:2px solid var(--warn);padding-left:10px}

.btn.danger{border-color:var(--warn);color:var(--warn)}
.btn.danger:hover{background:var(--warn);color:#1a1a18;border-color:var(--warn)}
button.btn.danger{background:none}
button.btn.danger:hover{background:var(--warn);color:#1a1a18}
.removewhat{font-family:var(--mono);font-size:14px;color:var(--ink-bright);border-left:2px solid var(--warn);padding:8px 12px;margin:14px 0}
.panel-actions{flex-wrap:wrap}

.grid tfoot .totalrow{font-weight:700;color:var(--ink-bright);border-top:1px solid #3a3a36;padding-top:9px}

/* a line that has not been entered is present but quiet — visible as an unanswered item */
tr.unentered td{opacity:.62}
/* lookback */
.lookback-batch-actions{position:sticky;top:72px;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:10px 12px;margin:0 0 4px;background:var(--panel);border:1px solid var(--accent)}
.lookback-batch-actions b{display:block;font-size:14px;color:var(--ink-bright)}
.lookback-batch-actions .small{display:block;margin-top:2px}
.lookback-batch-ready .lbq button[type=submit]{display:none}
.lbq{border-bottom:1px solid var(--hair);padding:14px 0;display:block}
.lbq-head{display:flex;gap:12px;align-items:baseline;margin-bottom:8px}
.lbq-no{font-family:var(--mono);font-size:11px;color:var(--dim);min-width:24px}
.lbq-text{font-size:14px;color:#c8c0b0;flex:1;line-height:1.45}
.lbq-window{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--accent);white-space:nowrap}
.lbq-answer{display:flex;gap:14px;align-items:center;flex-wrap:wrap;padding-left:36px}
.lbq .radio{font-size:12.5px;color:#aaa;display:flex;align-items:center;gap:5px}
.lbq-details{flex:1;min-width:220px;font-size:12.5px}
.lbq-flag{font-size:10.5px;color:var(--warn);text-transform:uppercase;letter-spacing:.07em}
.lbq.yes{border-left:2px solid var(--accent);padding-left:12px}
.lbq.blank .lbq-text{color:#8a8578}

/* Classes replacing former inline style attributes. The CSP forbids inline styles, and the
   markup was changed to fit the policy rather than the policy loosened to fit the markup. */
.narrow{width:90px}
.narrow-page{max-width:460px}
.h1-sm{font-size:26px}
.plainform{border:0;padding:0;width:auto;height:auto;background:none}
.panel-actions.start{justify-content:flex-start}
.pagemsg{font-family:var(--serif);font-size:14px;padding:2rem;color:var(--ink)}

.danger-link{color:var(--warn);border-bottom-color:var(--warn);margin-left:12px}
.danger-link:hover{color:#e08050}

.inlineform{display:inline}

/* The sign-in form is not inside a .panel, so it never inherited the panel's field layout and
   the labels collapsed onto one line. Give it the same treatment explicitly. */
.plainform label{display:block;font-size:11px;color:var(--dim);margin-bottom:14px}
.plainform input{display:block;width:100%;margin-top:5px;font-size:14px;padding:7px 9px}
.plainform .panel-actions{border-top:1px solid var(--rule);padding-top:16px;margin-top:4px}
.narrow-page h1.h1-sm{margin-bottom:10px}

/* ── median threshold provenance ─────────────────────────────────────────────
   The figure and its source are one unit. Nothing here should ever let the number
   appear without the table it came from. */
.median{margin-top:12px}
.median .inline{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.median select{font-family:var(--mono);font-size:11px;padding:5px 6px;background:#181816;color:var(--ink);border:1px solid #3a3a37}
.median input[type=date]{font-family:var(--mono);font-size:11px;width:130px}
.median .threshold input{width:130px}
.num .tag{font-family:var(--sans);font-size:9px;letter-spacing:.08em;text-transform:uppercase;
  color:#c08a5a;border:1px solid #6b4f34;padding:1px 4px;margin-left:6px;vertical-align:middle}
.num.cannot{color:var(--dimmer);font-style:italic;font-size:11px}
.tables{margin-top:12px;border-top:1px solid var(--rule);padding-top:9px}
.tables summary{font-size:10.5px;color:var(--dimmer);cursor:pointer;letter-spacing:.04em}
.tables summary:hover{color:var(--ink)}
.pending-tables{margin:9px 0}
.pending-row{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;
  padding:8px 0;border-bottom:1px solid #2a2a27}
.pending-row:last-child{border-bottom:0}
.pending-row b{font-size:11.5px}
button.ghost{background:transparent;border:1px solid #4a4a45;color:var(--dim)}
button.ghost:hover{border-color:var(--dim);color:var(--ink)}

/* A confirmation, distinct from .notbuilt which reports a refusal. Green-ish rather than
   accent, so "it worked" and "it did not" are never mistaken for one another at a glance. */
.caveat.done{font-size:14px;color:#9db98a;border-left:2px solid #6f8d5e;padding:8px 12px;margin:14px 0}
.plainform .note{display:block;font-size:11px;color:var(--dimmer);margin-top:5px;line-height:1.45}

/* ── the file itself: archive vs destroy ─────────────────────────────────────
   These two are NOT styled as a matching pair. Archiving is ordinary housekeeping and
   looks it; destroying sits behind a rule, in warning color, and reads as a decision. */
.casefile{margin-top:22px}
.archivebar,.destroybar{display:flex;justify-content:space-between;align-items:flex-start;
  gap:16px;padding:11px 0}
.archivebar b,.destroybar b{font-size:12.5px;display:block;margin-bottom:2px}
.archivebar{border-bottom:1px solid var(--rule)}
.destroybar{padding-top:14px}
.destroybar b{color:#c08a5a}
.archivebar .btn,.destroybar .btn{flex:none;align-self:center}
.archived-tag{font-family:var(--sans);font-size:10px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--dimmer);border:1px solid #4a4a45;padding:2px 6px;vertical-align:middle;margin-left:10px}
.danger-panel h2{color:#c08a5a}
.danger-panel .caveat,.danger-panel .quiet.small{margin:10px 0 18px;line-height:1.5}
.danger-panel .descriptor{margin-bottom:14px}
.checkline{display:block;margin-bottom:14px}
.checkline input[type=checkbox]{margin-right:7px;vertical-align:middle}
.checkline>span:first-of-type{font-size:11px;color:var(--dim);vertical-align:middle}
.checkline .note{margin-left:22px}
.flash a{color:inherit}
.you{font-family:var(--sans);font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--dimmer);
  border:1px solid #4a4a45;padding:1px 4px;margin-left:6px}
td.rowact{text-align:right;white-space:nowrap}
a.danger-link{color:#c08a5a}
a.danger-link:hover{color:var(--warn)}
.readnow{display:flex;align-items:center;gap:12px;margin:14px 0 4px}
.read-ok{color:#9db98a}
.read-bad{color:var(--warn)}
.read-none{color:var(--dimmer)}
button.linkish{background:var(--accent);border:1px solid var(--accent);color:var(--ink-bright);
  cursor:pointer;font-family:var(--serif);font-size:11px;font-weight:700;padding:4px 9px;margin-left:8px}
button.linkish:hover{background:#bd814d;border-color:#bd814d}
td.rowact .edit{margin-right:8px}

/* ── what was read, grouped by the document it came from ─────────────────────
   A person thinks in documents, not in field names. One block per file, so three
   months of payslips do not interleave into one undifferentiated list. */
.readblock{margin:16px 0 20px}
.readblock-head{font-size:12px;color:var(--ink);border-bottom:1px solid var(--rule);
  padding-bottom:5px;margin-bottom:2px;letter-spacing:.02em}
.grid.tight td{padding:5px 10px 5px 0;vertical-align:middle}
.lbl-cell{font-size:12.5px}
td.src{max-width:280px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
td.rowact .quiet{margin-right:6px;font-size:10.5px}

/* ── color is the status ────────────────────────────────────────────────────
   Red: a machine put this here and nobody has looked. Yellow (attorney view): the
   client says it is right. Green: settled for whoever is looking. A figure nobody
   has checked must never look finished. */
td.c-red{background:rgba(176,74,58,.16);box-shadow:inset 2px 0 0 #b04a3a}
td.c-yellow{background:rgba(198,160,68,.14);box-shadow:inset 2px 0 0 #c6a044}
td.c-green{background:rgba(110,150,90,.14);box-shadow:inset 2px 0 0 #6e965a}

/* ── blank is an instruction, not an absence ────────────────────────────────
   The scan enters a figure only where it can prove one, so every empty cell is a
   thing a person still has to do. An em dash read as "nothing here" — the same
   glyph served for a month of no income, a month nobody had reached, and a month
   whose payslip could not be dated. Hatched and labelled so it reads as an open
   question, and deliberately quieter than red: unanswered is not wrong. */
td.c-blank{
  background:repeating-linear-gradient(135deg,transparent,transparent 4px,rgba(255,255,255,.045) 4px,rgba(255,255,255,.045) 8px);
  box-shadow:inset 2px 0 0 rgba(255,255,255,.22);
  font-family:var(--serif);font-style:italic;font-size:10.5px;color:var(--dimmer);
  letter-spacing:.02em;white-space:nowrap
}
a.cellsrc{color:inherit;text-decoration:none;border-bottom:1px dotted rgba(255,255,255,.28)}
a.cellsrc:hover{border-bottom-style:solid}
.key{font-size:11px;color:var(--dimmer);margin:6px 0 14px}
.key .k{display:inline-block;width:10px;height:10px;vertical-align:middle;margin-right:5px;border:0}
tr.ded td{border-top:0;padding-top:2px;padding-bottom:2px}
td.ded-name{font-size:11.5px;color:var(--dim);padding-left:14px}
/* Net take-home closes the block, so it gets a rule above it and reads as a result
   rather than as one more deduction line. */
tr.ded.net td{border-top:1px solid var(--rule);padding-top:5px;padding-bottom:6px}
tr.ded.net .ded-name{color:var(--ink)}
/* the legend swatches — the color rules above are td-scoped, so the key needs its own */
.key .k.c-red{background:rgba(176,74,58,.55);box-shadow:inset 2px 0 0 #b04a3a}
.key .k.c-yellow{background:rgba(198,160,68,.5);box-shadow:inset 2px 0 0 #c6a044}
.key .k.c-green{background:rgba(110,150,90,.5);box-shadow:inset 2px 0 0 #6e965a}
.key .k.c-blank{background:repeating-linear-gradient(135deg,transparent,transparent 3px,rgba(255,255,255,.3) 3px,rgba(255,255,255,.3) 6px);box-shadow:inset 2px 0 0 rgba(255,255,255,.35)}

/* ── what the client reported, on the attorney's Urgency block ──────────────
   Separated from the deadlines above it by a rule, not merged into them: a date read
   off a document and a client saying "I have been sued" are different kinds of fact,
   and a block that adds them together reports a number meaning neither. */
.reported { border-top: 1px solid var(--rule); margin-top: 14px; padding-top: 12px; }
.reported-head { font-size: 11px; letter-spacing: .08em; text-transform: uppercase;
  color: var(--warn); margin-bottom: 8px; }
.reported ul { margin: 0 0 8px; padding-left: 18px; }
.reported li { margin: 3px 0; }
/* A file whose two claims disagree. Not styled as an error — neither claim is wrong yet. */
.mismatch { color: var(--warn); cursor: help; }

/* ── whether documents on this case are read ──────────────────────────────────
   Off is loud. It is a setting that persists, so the cost of forgetting it is a
   fortnight of manual entry — the notice has to survive being scrolled past. */
.reading-on { font-size: 13px; color: var(--dim); margin: 10px 0 0; }
.reading-off { border: 1px solid var(--warn); border-left-width: 3px;
  background: rgba(192,98,42,.07); padding: 14px 16px; margin: 12px 0; }
.reading-off p { margin: 0 0 8px; font-size: 14px; }
.reading-off p:last-of-type { margin-bottom: 0; }
.reading-off-head { font-size: 11px !important; letter-spacing: .08em; text-transform: uppercase;
  color: var(--warn); font-weight: 700; }
.reading-off-ask { font-weight: 700; }
.reading-actions { display: flex; gap: 10px; margin-top: 12px; flex-wrap: wrap; }
.reading-off.quiet-form { border-left-width: 1px; background: none; padding: 9px 12px;
  font-size: 13px; color: var(--dim); }
/* Visually hidden labels remain available to assistive technology. */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

/* Client document actions come immediately after the filename.  The older trailing cell is
   retained for the attorney table; hide its duplicate only in the client table. */
.client-document-table td.r.document-actions{display:none}
.client-document-table td.document-actions{white-space:nowrap}
@media (max-width:1100px){
  .client-document-table{display:block;overflow:visible}
  .client-document-table thead{display:none}
  .client-document-table tbody,.client-document-table tr,.client-document-table td{display:block;width:auto}
  .client-document-table tr{border-bottom:1px solid var(--rule);padding:12px 0}
  .client-document-table td{border:0;padding:3px 0}
  .client-document-table td:first-child{font-weight:700}
  .client-document-table td.document-actions{margin:8px 0}
  .client-facts-table{display:block;overflow:visible}
  .client-facts-table thead{display:none}
  .client-facts-table tbody,.client-facts-table tr,.client-facts-table td{display:block;width:auto}
  .client-facts-table tr{border-bottom:1px solid var(--rule);padding:12px 0}
  .client-facts-table td{border:0;padding:2px 0}
  .client-facts-table td:nth-child(2){font-weight:700}
  .client-facts-table td:last-child{text-align:left;margin-top:8px}
}

/* ── owner-only app admission ───────────────────────────────────────────── */
.owner-access-nav{border-color:#8b6c45}
.access-page{max-width:1180px}
.access-summary{margin:20px 0 12px;padding:12px 0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);color:var(--dim)}
.access-summary b{font-family:var(--mono);font-size:18px;color:var(--ink-bright)}
.access-summary span{margin:0 8px;color:var(--dimmer)}
.access-table-wrap{overflow-x:auto}
.access-table{min-width:850px}
.access-table td{vertical-align:middle}
.access-table td:first-child{max-width:290px;overflow-wrap:anywhere}
.access-table tr.access-disabled td{color:var(--dimmer)}
.access-state{display:inline-block;font-family:var(--sans);font-size:9px;letter-spacing:.08em;text-transform:uppercase;border:1px solid;padding:3px 7px}
.access-state.is-active{color:#9db98a;border-color:#5f7852}
.access-state.is-disabled{color:#d49a70;border-color:#805036}
.access-note{margin-top:16px}

/* ── attorney work queue and factual case-readiness cockpit ─────────────── */
.readiness-workspace{max-width:1420px}
.readiness-kpis{border-top:2px solid var(--accent);margin:24px 0;padding-top:14px}
.readiness-kpis h2,.next-best-action h2,.readiness-open h2{font-size:22px;margin:0 0 12px}
.readiness-kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.readiness-kpi{display:block;min-height:126px;padding:14px;border:1px solid var(--rule);text-decoration:none;color:var(--ink);background:#171716}
.readiness-kpi:hover{border-color:var(--accent);background:#1b1a17}
.readiness-kpi span{display:block;font-family:var(--sans);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--dim);line-height:1.35}
.readiness-kpi b{display:block;font-family:var(--mono);font-size:30px;line-height:1.05;color:var(--ink-bright);margin:10px 0 5px}
.readiness-kpi small{display:block;font-size:11.5px;line-height:1.35;color:var(--ink)}
.readiness-kpi.lane-time_sensitive,.work-lane.lane-time_sensitive{border-color:#8e4d36}
.readiness-kpi.lane-needs_evidence,.work-lane.lane-needs_evidence{border-color:#806434}
.readiness-kpi.lane-attorney_review,.work-lane.lane-attorney_review{border-color:#6b5a38}
.readiness-kpi.lane-keystone_ready,.work-lane.lane-keystone_ready{border-color:#52734a}
.next-best-action{margin:24px 0;border-left:4px solid var(--accent);background:#1a1916;padding:18px 20px}
.next-best-action p{max-width:780px;line-height:1.5}
.readiness-open{margin-top:28px;border-top:1px solid var(--rule);padding-top:16px}
.readiness-lanes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:20px}
.work-lane{border:1px solid var(--rule);padding:14px;min-width:0}
.work-lane h2{font-size:18px;margin:0 0 3px}.work-lane>.quiet{margin:0 0 12px;font-size:11px}
.work-card{border-top:1px solid var(--rule);padding:13px 0}.work-card h3{font-size:16px;margin:2px 0 7px}.work-card p{font-size:13px;line-height:1.45;margin:5px 0}
.work-card-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:11px}.work-card-actions .inlineform{margin:0}
.work-blocked{border-left:2px solid var(--warn);padding-left:8px;color:#dda875}
.work-table td{vertical-align:top}.work-table td:first-child{font-size:11px;color:var(--dim);max-width:165px}
.work-table .work-item-label{display:block;min-width:210px;font-size:16px;font-weight:800;line-height:1.25;color:var(--ink-bright);text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:2px;text-underline-offset:4px}
.work-table .work-item-label:hover{color:var(--accent-bright)}
@media (max-width:900px){.readiness-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.readiness-lanes{grid-template-columns:1fr}.work-table{display:block;overflow-x:auto;white-space:normal}}
@media (max-width:520px){.readiness-kpi-grid{grid-template-columns:1fr}.readiness-kpi{min-height:auto}.next-best-action{padding:14px}.work-card-actions .btn{width:auto}}