
/* ---------- faces ---------- */
@font-face{font-family:"Newsreader";src:url(/assets/fonts/newsreader.woff2) format("woff2-variations");
 font-weight:200 800;font-style:normal;font-display:swap}
@font-face{font-family:"Newsreader";src:url(/assets/fonts/newsreader-italic.woff2) format("woff2-variations");
 font-weight:200 800;font-style:italic;font-display:swap}
@font-face{font-family:"Plex Mono";src:url(/assets/fonts/plexmono.woff2) format("woff2");
 font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Plex Mono";src:url(/assets/fonts/plexmono-500.woff2) format("woff2");
 font-weight:500;font-style:normal;font-display:swap}

:root{
 --paper:#FBFAF7;      /* stock, not white */
 --panel:#F3F0E9;      /* second surface — exhibits, pull-quotes */
 --ink:#17191D;
 --mid:#565A61;
 --soft:#8C8E92;
 --hair:#E2DED5;
 --rule:#C9C4B8;
 --acc:#8E1B2C;        /* oxblood */
 --slot:#B08C1E;
 --dark:#17191D;
 --ser:"Newsreader",Palatino,"Iowan Old Style",Georgia,serif;
 --mono:"Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
 --s1:8px; --s2:16px; --s3:24px; --s4:32px; --s5:48px; --s6:64px; --s7:96px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--ser);
 font-size:18.5px;line-height:1.62;font-weight:380;
 -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
 font-feature-settings:"kern" 1,"liga" 1,"onum" 1}
a{color:inherit}
.wrap{max-width:1280px;margin:0 auto;padding:0 var(--s5)}
.lbl,.mono,.rl,.cap,.ul,.role,.mastr,.navin,.num,.auth,.meta,.fin,.flinks,th,.crumb,.step,.fld label{
 font-family:var(--mono);font-feature-settings:"kern" 1}

/* ---------- masthead ---------- */
.mast{border-bottom:1px solid var(--rule);background:var(--paper)}
.mastin{max-width:1280px;margin:0 auto;padding:var(--s4) var(--s5) var(--s3);
 display:grid;grid-template-columns:1fr auto;gap:var(--s5);align-items:end}
.name{font-family:var(--ser);font-size:40px;font-weight:420;line-height:1;letter-spacing:-.02em;margin:0}
.name a{text-decoration:none}
.role{font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--mid);margin-top:14px}
.mastr{font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--mid);
 text-align:right;line-height:2.2}
.mastr a{text-decoration:none}
.navbar{border-bottom:1px solid var(--hair)}
.navin{max-width:1280px;margin:0 auto;padding:14px var(--s5);display:flex;flex-wrap:wrap;gap:var(--s4);
 font-size:10.5px;letter-spacing:.18em;text-transform:uppercase}
.navin a{color:var(--mid);text-decoration:none;padding-bottom:2px;border-bottom:1px solid transparent}
.navin a:hover{color:var(--acc)}
.navin a[aria-current]{color:var(--ink);border-bottom-color:var(--acc)}
/* the only nav item that is a request rather than a destination */
.navin a.nav-join{color:var(--acc);font-family:var(--mono)}
.navin a.nav-join:hover{color:var(--acc);border-bottom-color:var(--acc)}
.navin a.nav-join[aria-current]{color:var(--acc);border-bottom-color:var(--acc)}
.flinks a.nav-join{color:#C4808C}
.flinks a.nav-join:hover{color:var(--acc)}

/* ---------- opening ---------- */
.state{max-width:1280px;margin:0 auto;padding:var(--s7) var(--s5) var(--s6);
 border-bottom:1px solid var(--rule)}
/* on the home page the hero carries the h1, so the premise below it sits quieter */
.state.demoted{padding-top:var(--s5);padding-bottom:var(--s5)}
.state.demoted p:first-of-type{font-size:19px;line-height:1.66;color:#2E3238}
.state .lbl{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--acc);
 margin-bottom:var(--s3);display:block}
.state h1,.premise-h{font-family:var(--ser);font-size:clamp(30px,3.9vw,46px);line-height:1.12;
 font-weight:400;letter-spacing:-.028em;margin:0 0 var(--s4);max-width:16em;border:0;padding:0}
.state p{margin:0 0 var(--s2);color:#2E3238;max-width:34em;font-size:19px;line-height:1.68}
.state p:first-of-type{font-size:21px;line-height:1.58;color:var(--ink)}
.pf{margin:0;padding:0}
.pf img{width:100%;height:auto;display:block;filter:saturate(.92) contrast(1.03);
 box-shadow:0 1px 2px rgba(23,25,29,.10),0 12px 32px -12px rgba(23,25,29,.28)}
.pf figcaption{font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;
 color:var(--soft);padding:14px 0 0;line-height:2}

/* ---------- shell ---------- */
.shell{max-width:1280px;margin:0 auto;padding:0 var(--s5);display:grid;
 grid-template-columns:150px 1fr;gap:var(--s7);align-items:start}
.rail{position:sticky;top:0;padding:var(--s6) 0 var(--s5)}
.rail .rl{font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--soft);
 margin-bottom:var(--s2);padding-bottom:var(--s1);border-bottom:1px solid var(--rule)}
.rail a{display:block;font-size:15px;line-height:1.3;color:var(--mid);padding:11px 0;
 border-bottom:1px solid var(--hair);text-decoration:none}
.rail a:hover{color:var(--acc)}
.rail a i{display:block;font-family:var(--mono);font-style:normal;font-size:9.5px;
 letter-spacing:.16em;color:var(--soft);margin-bottom:4px}
.main{padding:var(--s6) 0 0;min-width:0}

/* ---------- group heads ---------- */
.grp{scroll-margin-top:var(--s3);margin-bottom:var(--s5)}
.ghead{display:grid;grid-template-columns:auto 1fr;align-items:baseline;gap:var(--s3);
 border-bottom:2px solid var(--ink);padding-bottom:var(--s2);margin-bottom:var(--s2)}
.ghead i{font-family:var(--ser);font-style:normal;font-size:46px;font-weight:300;line-height:.9;
 color:var(--acc);opacity:.9;letter-spacing:-.02em}
.ghead h2{font-family:var(--ser);font-size:30px;font-weight:400;letter-spacing:-.02em;margin:0}

/* ---------- entries ---------- */
.e{display:grid;grid-template-columns:1fr;padding:var(--s5) 0;border-bottom:1px solid var(--hair)}
.e:not(.has){grid-template-columns:96px 1fr;gap:var(--s4)}
.e:not(.has)::before{content:attr(data-n);font-family:var(--ser);font-size:60px;font-weight:300;
 line-height:.85;color:var(--acc);opacity:.16;letter-spacing:-.04em;font-variant-numeric:lining-nums}
.e:not(.has) .num{display:none}
.e:last-child{border-bottom:0}
/* entries carrying an exhibit get the panel treatment — this is the rhythm */
.e.has{grid-template-columns:1fr 340px;gap:var(--s6);align-items:start;
 background:linear-gradient(90deg,transparent 0 58%,var(--panel) 58% 100%);
 padding:var(--s5) var(--s4) var(--s5) 0;margin-right:calc(var(--s4) * -1);
 border-radius:2px}
.e .num{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;color:var(--acc);
 margin-bottom:var(--s2);font-weight:500}
.e h3{font-family:var(--ser);font-size:27px;font-weight:400;letter-spacing:-.02em;margin:0 0 var(--s2);
 line-height:1.18;max-width:16em}
.e h3 a{text-decoration:none;background-image:linear-gradient(var(--acc),var(--acc));
 background-size:0 1px;background-repeat:no-repeat;background-position:0 100%;transition:background-size .25s}
.e h3 a:hover{color:var(--acc);background-size:100% 1px}
.auth{font-size:11px;line-height:1.7;color:var(--mid);letter-spacing:.02em;
 display:inline-block;padding:0 0 0 12px;margin-bottom:var(--s3);border-left:2px solid var(--acc)}
.auth.none{border-left-color:var(--hair);color:var(--soft)}
.does{margin:0 0 var(--s3);color:#2E3238;max-width:36em;font-size:18.5px}
.used{font-size:16px;line-height:1.62;color:var(--mid);border-top:1px solid var(--hair);
 padding-top:var(--s2);max-width:38em}
.used b{color:var(--ink);font-weight:600}
.ul{display:block;font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;
 color:var(--soft);margin-bottom:var(--s1)}
.more{display:inline-block;margin-top:var(--s3);font-family:var(--mono);font-size:10px;
 letter-spacing:.18em;text-transform:uppercase;color:var(--acc);text-decoration:none;
 border-bottom:1px solid var(--acc);padding-bottom:3px;opacity:.85}
.more:hover{opacity:1}

/* ---------- exhibits ---------- */
.fig{margin:0}
.fig img{width:100%;height:auto;display:block;background:#fff;
 filter:contrast(1.14) brightness(1.04) saturate(.6);
 box-shadow:0 1px 2px rgba(23,25,29,.12),0 18px 40px -16px rgba(23,25,29,.34)}
.cap{font-family:var(--mono);font-size:9.5px;line-height:1.9;letter-spacing:.09em;
 text-transform:uppercase;color:var(--soft);margin:14px 0 0}
.exlbl{font-family:var(--mono);font-size:9px;letter-spacing:.22em;text-transform:uppercase;
 color:var(--acc);margin:0 0 12px;font-weight:500}
.slotbox{border:1px dashed var(--slot);background:#FDFBF1;aspect-ratio:76/98;
 display:flex;align-items:center;justify-content:center;text-align:center;
 font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;
 color:#8A6D0B;line-height:2.4}

/* ---------- article pages ---------- */
.crumb{font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--soft);
 padding:var(--s3) 0 0;max-width:1280px;margin:0 auto}
.crumb a{color:var(--soft);text-decoration:none}
.crumb a:hover{color:var(--acc)}
.art{max-width:1280px;margin:0 auto;padding:var(--s3) var(--s5) 0;display:grid;
 grid-template-columns:1fr 300px;gap:var(--s7);align-items:start}
.art h1{font-family:var(--ser);font-size:clamp(30px,3.6vw,44px);line-height:1.12;font-weight:400;
 letter-spacing:-.028em;margin:0 0 var(--s3);max-width:15em}
.ans{border-top:2px solid var(--ink);border-bottom:1px solid var(--rule);background:transparent;
 padding:var(--s3) 0 var(--s4);margin:0 0 var(--s5);max-width:38em}
.ans .h{font-family:var(--mono);font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;
 color:var(--acc);margin-bottom:var(--s2)}
.ans p{margin:0;font-size:22px;line-height:1.5;color:var(--ink);font-weight:380;letter-spacing:-.008em}
.art h2{font-family:var(--ser);font-size:26px;font-weight:400;letter-spacing:-.02em;
 margin:var(--s6) 0 var(--s2);padding-bottom:var(--s1);border-bottom:1px solid var(--rule);max-width:38em}
.art h3{font-family:var(--ser);font-size:21px;font-weight:500;margin:var(--s4) 0 var(--s1)}
.art p{margin:0 0 var(--s2);color:#2E3238;max-width:36em}
.art ul,.art ol{margin:0 0 var(--s3);padding-left:22px;max-width:36em}
.art li{margin-bottom:12px;color:#2E3238}
.art ol{counter-reset:pu;list-style:none;padding-left:0}
.art ol>li{counter-increment:pu;position:relative;padding-left:38px}
.art ol>li::before{content:counter(pu,decimal-leading-zero);position:absolute;left:0;top:2px;
 font-family:var(--mono);font-size:10.5px;color:var(--acc);letter-spacing:.08em}
blockquote.rule{margin:0 0 var(--s3);padding:var(--s3) var(--s4);background:var(--panel);
 border-left:3px solid var(--acc);font-family:var(--ser);font-size:20px;line-height:1.52;
 color:var(--ink);max-width:38em;font-style:italic;font-weight:380}
blockquote.rule cite{display:block;font-family:var(--mono);font-size:9.5px;letter-spacing:.16em;
 text-transform:uppercase;color:var(--mid);font-style:normal;margin-top:var(--s2)}
.side{position:sticky;top:var(--s3);padding-top:var(--s4)}
.side .blk{border-top:2px solid var(--ink);padding:var(--s2) 0 var(--s4)}
.side .h{font-family:var(--mono);font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;
 color:var(--soft);margin-bottom:var(--s2)}
.side a{display:block;font-size:16px;line-height:1.32;color:var(--mid);padding:10px 0;
 border-bottom:1px solid var(--hair);text-decoration:none}
.side a:hover{color:var(--acc)}
.side p{font-size:15.5px;color:var(--mid);margin:0 0 var(--s2)}
.side .cta{display:inline-block;background:var(--ink);color:var(--paper);font-family:var(--mono);
 font-size:10px;letter-spacing:.18em;text-transform:uppercase;padding:14px 20px;
 text-decoration:none;margin-top:var(--s1);border-bottom:0}
.side .cta:hover{background:var(--acc);color:#fff}

/* ---------- exhibit block on article pages ---------- */
.ex{display:grid;grid-template-columns:330px 1fr;gap:var(--s5);margin:var(--s3) 0 var(--s4);
 align-items:start;background:var(--panel);padding:var(--s4);border-radius:2px}
.ex .doc{font-family:var(--mono);font-size:12px;line-height:1.95;color:#2E3238;
 background:#fff;border:1px solid var(--hair);padding:var(--s4);white-space:pre-wrap;margin:0;
 box-shadow:0 1px 2px rgba(23,25,29,.06)}
.ex .meta{font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;
 color:var(--soft);line-height:2;margin:var(--s2) 0 0}

/* ---------- faq ---------- */
.faq{border-top:2px solid var(--ink);margin-top:var(--s6);padding-top:var(--s1);max-width:40em}
.faq .q{font-family:var(--ser);font-size:21px;font-weight:500;margin:var(--s4) 0 var(--s1)}
.faq .a{margin:0;color:#2E3238;max-width:36em}

/* ---------- tables ---------- */
table{width:100%;border-collapse:collapse;font-size:17px}
th{text-align:left;font-family:var(--mono);font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;
 color:var(--soft);font-weight:400;padding:0 0 12px;border-bottom:1.5px solid var(--ink)}
td{padding:var(--s3) 0;border-bottom:1px solid var(--hair);vertical-align:top;color:var(--mid)}
td.t{color:var(--ink);font-weight:600;width:20%;padding-right:var(--s3)}
td.d{width:44%;padding-right:var(--s3)}
td.n{text-align:right;white-space:nowrap;color:var(--ink);font-weight:500;font-family:var(--mono);
 font-size:14px;font-variant-numeric:tabular-nums}
.awd{margin-top:var(--s4);border-left:3px solid var(--acc);background:var(--panel);
 padding:var(--s4)}
.awd .lb{font-family:var(--mono);font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;
 color:var(--soft);margin-bottom:var(--s2)}
.awd .r{display:grid;grid-template-columns:1fr auto;gap:var(--s3);padding:14px 0;
 border-bottom:1px solid var(--hair);align-items:baseline}
.awd .r:last-of-type{border-bottom:0}
.awd .r p{margin:0;font-size:16px;color:var(--mid)}
.awd .r b{display:block;color:var(--ink);font-weight:600;margin-bottom:3px}
.awd .r .a{font-family:var(--mono);font-size:16px;font-weight:500;color:var(--ink);white-space:nowrap;
 font-variant-numeric:tabular-nums}

/* ---------- sections ---------- */
.sec{max-width:1280px;margin:0 auto;padding:var(--s6) var(--s5);display:grid;
 grid-template-columns:150px 1fr;gap:var(--s7);border-bottom:1px solid var(--rule)}
.sec .lbl{font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;
 color:var(--acc);padding-top:10px}
.sec h2{font-family:var(--ser);font-size:34px;font-weight:400;letter-spacing:-.025em;
 margin:0 0 var(--s3);max-width:16em;line-height:1.16}
.sec p{margin:0 0 var(--s2);color:#2E3238;max-width:36em}

/* the dark band gives the page a spine */
.band{background:var(--dark);color:#E4E2DD;border:0;margin-top:var(--s5)}
.band .sec{border-bottom:0}
.band .lbl{color:#C4808C}
.band h2{color:#FBFAF7;font-size:38px;max-width:14em}
.band p{color:#B4B2AE;max-width:38em;font-size:18.5px}
.band em{color:#FBFAF7;font-style:italic}

/* ---------- intake ---------- */
.int{background:var(--dark);color:#E4E2DD;border-top:1px solid #2A2D33}
.intin{max-width:1280px;margin:0 auto;padding:var(--s6) var(--s5);
 display:grid;grid-template-columns:150px 1fr;gap:var(--s7)}
.intin .lbl{font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;
 color:#C4808C;padding-top:10px}
/* on /send/ the same heading is the page's h1 — one rule, either level */
.int h1,.int h2{font-family:var(--ser);font-size:34px;font-weight:400;letter-spacing:-.025em;
 margin:0 0 var(--s3);color:#FBFAF7}
.int p.i{margin:0 0 var(--s4);color:#B4B2AE;max-width:36em}
.int p.i a{color:#E4E2DD}
.step{font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:#8C8E92;
 margin:var(--s4) 0 var(--s2);padding-top:var(--s2);border-top:1px solid rgba(255,255,255,.14)}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s2)}
.fld label{display:block;font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;
 color:#8C8E92;margin-bottom:var(--s1)}
.fld input,.fld textarea,.fld select{width:100%;background:rgba(255,255,255,.045);
 border:1px solid rgba(255,255,255,.16);padding:13px 14px;font-size:16px;color:#fff;
 font-family:var(--ser);min-height:46px;border-radius:0}
.fld input:focus,.fld textarea:focus,.fld select:focus{outline:0;border-color:#C4808C;
 background:rgba(255,255,255,.07)}
.fld textarea{min-height:88px;resize:vertical}
.fld.w{grid-column:span 3}
.drop{grid-column:span 3;border:1px dashed rgba(255,255,255,.28);background:rgba(255,255,255,.03);
 padding:var(--s4);text-align:center;font-family:var(--mono);font-size:10px;letter-spacing:.14em;
 text-transform:uppercase;color:#B4B2AE;line-height:2.2}
.drop input{opacity:0;position:absolute;width:1px;height:1px}
.drop label{cursor:pointer;color:#fff;border-bottom:1px solid rgba(255,255,255,.4)}
.chk{grid-column:span 3;display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:start;
 padding-top:var(--s1)}
.chk input{margin-top:7px}
.chk span,.chk label{font-size:15px;color:#B4B2AE;line-height:1.6}
.chk label{cursor:pointer}
.go{display:inline-block;margin-top:var(--s3);background:#FBFAF7;color:var(--ink);border:0;
 font-family:var(--mono);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;
 padding:16px 26px;font-weight:500;cursor:pointer}
.go:hover{background:#C4808C;color:#fff}
.warn{font-size:14px;color:#85878B;margin-top:var(--s3);max-width:46em;line-height:1.62}

/* ---------- footer ---------- */
footer{max-width:1280px;margin:0 auto;padding:var(--s5) var(--s5) var(--s6)}
.frow{display:grid;grid-template-columns:150px 1fr;gap:var(--s7)}
.fin{font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--mid);
 line-height:2.2;margin-bottom:var(--s3)}
.fin a{text-decoration:none}
.fdis{font-size:13.5px;color:var(--soft);line-height:1.66;max-width:50em;margin:0}
.flinks{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--soft);
 margin:0 0 var(--s2)}
.flinks a{color:var(--soft);text-decoration:none;margin-right:var(--s3)}
.flinks a:hover{color:var(--acc)}



/* ---------- masthead: the name IS the mark, and the middle earns its keep ------
   The tagline and the availability lamp both used to sit up here, which left the
   name competing with two things that said less. They are gone; the name is the
   brand and carries the weight alone.

   The space they vacated now holds the daily strip — see .dstrip below. The bet
   is that a masthead a litigator checks every morning is worth more than one that
   only says who we are, and that the check becomes habit only if what is there is
   genuinely operational: the date they are counting from, the rule change that
   moved under them, and one mechanism they may not have reached for. */
.mastin{grid-template-columns:auto 1fr auto;align-items:center;
 padding:var(--s3) var(--s5);gap:var(--s3)}
.markwrap{display:flex;align-items:center;gap:0}
/* THE FULL FIRM NAME, ON TWO LINES, 9 Aug 2026 — his instruction, with the two
   things he named keeping: the oxblood bar and the face. So the ::before bar now
   stretches to whatever height the two lines make, rather than being pinned at
   34px and standing beside a taller mark. The second line is the same face at
   the same tracking, smaller and quieter — it is the legal form of the name, not
   a tagline, and it should read as part of the mark rather than as a second
   thing to look at. */
.mark{font-family:var(--mono);font-size:32px;font-weight:600;letter-spacing:.22em;
 text-transform:uppercase;color:var(--ink);text-decoration:none;padding-right:2px;
 display:inline-flex;align-items:stretch;gap:18px;line-height:1;white-space:nowrap}
.mark::before{content:"";width:6px;background:var(--acc);flex:none;align-self:stretch}
.markname{display:flex;flex-direction:column;justify-content:center;gap:7px;padding:2px 0}
.markname i{font-style:normal;font-size:12.5px;font-weight:500;letter-spacing:.24em;
 color:var(--mid);line-height:1}
.mastr{display:flex;flex-direction:column;align-items:flex-end;gap:2px;
 text-align:right;line-height:1.75}
.mastr-h{font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink);
 border-bottom:1.5px solid var(--acc);padding-bottom:3px;margin-bottom:6px;font-weight:500}

/* ---------- the daily strip ----------
   Rendered at build time so it is in the HTML for crawlers and for no-JS, then
   corrected in the browser: a static site freezes "today" at the last deploy, and
   a masthead that tells a lawyer the wrong date is worse than one that tells them
   nothing. jhDaily() in the inline script owns the correction. */
.dstrip{display:flex;justify-content:flex-start;gap:0;font-family:var(--mono);
 border-left:1px solid var(--hair);margin:0;
 min-width:0;overflow:hidden}
.dcell{padding:0 18px;border-right:1px solid var(--hair);min-width:0;flex:1 1 auto}
.dcell:last-child{border-right:0}
.dcell.fixed{flex:none}
.dcell.fixed .dv{overflow:visible}
.dk{font-size:8px;letter-spacing:.18em;text-transform:uppercase;color:var(--soft);
 display:block;margin-bottom:4px;white-space:nowrap}
.dv{font-size:11.5px;letter-spacing:0;color:var(--ink);display:block;
 white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dv a{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--rule)}
.dv a:hover{color:var(--acc);border-bottom-color:var(--acc)}
.dv .sub{color:var(--mid)}
/* THE WEATHER CELL HAD NO RULE ANYWHERE — CLAUDE.md §6a exactly: a class in the
   markup that TOKENS has never heard of does not fail, it just inherits the
   page's serif at the page's size and sits under a monospace date looking like
   a different application wrote it. It is the sibling of .dv and should have
   been written as one; it now is, one step down in weight because the date is
   the fact and the weather is the context. */
.dwx{font-family:var(--mono);font-size:11.5px;letter-spacing:0;color:var(--mid);
 display:block;margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(max-width:1240px){.dcell.dopt{display:none}}
.dmid{min-width:0}
@media(max-width:1000px){.dstrip{display:none}}

/* THE DOORS ARE NO LONGER COLOUR-CODED, and that is a reversal — worth saying why,
   because the two colours that used to be here were chosen carefully.

   With two doors, teal and indigo were a genuine wayfinding aid. At four they stop
   working, for two independent reasons:

   1. The palette cannot carry four. Measured the same way the indigo was: the
      trustee/attorney pair already sits at ΔE 8.9 under simulated protanopia, and
      that is the floor anything new has to clear. Every green tested collapses
      into the oxblood accent under deutan and protan (ΔE 0.5–7.5 — red and green
      converge, which is the whole point of red-green deficiency), and every blue
      near enough to read as "judicial" collapses into the trustee teal (ΔE 4.3).
      What survives the search is arbitrary — plum, magenta — chosen by the solver
      rather than by meaning, which is a worse answer than no colour at all.
   2. Four colours in the masthead compete with the name, and the name is now the
      brand. That was the point of this change.
   The words already tell the doors apart, which the old comment here said was the
   real safeguard anyway. Colour was the redundant channel; it is the one to drop.
   To put it back, restore --portal/--counsel on .mast-portal/.mast-counsel. */
.mastr a[class^="mast-"]{color:var(--mid);font-weight:500;
 border-bottom:1px solid var(--hair);padding-bottom:1px}
.mastr a[class^="mast-"]:hover{color:var(--acc);border-bottom-color:var(--acc)}
@media(max-width:900px){
  .mastin{grid-template-columns:1fr;gap:var(--s3)}
  .mastr{justify-content:flex-start;text-align:left;gap:16px}
  .mark{font-size:19px;letter-spacing:.24em}
  .markname{gap:5px}
  .markname i{font-size:9.5px;letter-spacing:.2em}
  .mark::before{height:21px}
}

/* ---------- hero: dark is the machine ---------- */
.hero{background:var(--dark);color:#E4E2DD;border-bottom:1px solid #2A2D33}
.heroin{max-width:1280px;margin:0 auto;padding:var(--s7) var(--s5) var(--s6);
 display:grid;grid-template-columns:1fr 400px;gap:var(--s7);align-items:start}
.hlbl{font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;
 color:#C4808C;margin-bottom:var(--s3)}
.hero h1{font-family:var(--ser);font-size:clamp(32px,4.3vw,52px);line-height:1.08;font-weight:400;
 letter-spacing:-.03em;margin:0 0 var(--s3);color:#FBFAF7;max-width:15em}
.hsub{font-size:19px;line-height:1.6;color:#A9AEB6;max-width:34em;margin:0 0 var(--s5)}
.heroform .drop{border:1px dashed rgba(255,255,255,.3);background:rgba(255,255,255,.04);
 padding:var(--s5) var(--s4);text-align:center;font-family:var(--mono);font-size:10px;
 letter-spacing:.14em;text-transform:uppercase;color:#B4B2AE;line-height:2.2}
.heroform .drop label{cursor:pointer;color:#fff;font-size:13px;letter-spacing:.12em;
 border-bottom:1px solid rgba(255,255,255,.45);padding-bottom:4px}
.heroform .drop input[type=file]{opacity:0;position:absolute;width:1px;height:1px}
.heroform .rest{margin-top:var(--s4)}
.hero .hcta{display:flex;gap:var(--s3);flex-wrap:wrap;align-items:center;margin-top:var(--s2)}
.hero .hcta a{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;
 text-decoration:none;color:#FBFAF7;border-bottom:1px solid rgba(255,255,255,.45);padding-bottom:5px}
.hero .hcta a.solid{background:var(--acc);border:0;padding:13px 22px;color:#fff}
.hero .hcta a.solid:hover{background:#A62234}
.hero .hcta a:hover{border-bottom-color:#C4808C}

/* ---------- the specimen: show the deliverable ---------- */
.spec{position:sticky;top:var(--s3)}
.speclbl{font-family:var(--mono);font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;
 color:#8C8E92;margin-bottom:var(--s2)}
.speccard{background:#FBFAF7;color:var(--ink);padding:var(--s2) var(--s4) var(--s3);
 box-shadow:0 1px 2px rgba(0,0,0,.3),0 24px 48px -20px rgba(0,0,0,.7);position:relative}
.specstamp{font-family:var(--mono);font-size:8.5px;letter-spacing:.2em;text-transform:uppercase;
 color:var(--acc);border-bottom:1px solid var(--hair);padding:0 0 12px;margin:0 0 4px;
 display:flex;align-items:center;gap:8px}
.specstamp::before{content:"";width:6px;height:6px;background:var(--acc);border-radius:50%;
 flex:0 0 auto}
.specrow{display:grid;grid-template-columns:1fr;gap:3px;padding:12px 0;
 border-bottom:1px solid var(--hair)}
.specrow:last-child{border-bottom:0}
.specrow span{font-family:var(--mono);font-size:8.5px;letter-spacing:.18em;text-transform:uppercase;
 color:var(--soft)}
.specrow b{font-family:var(--ser);font-size:16px;font-weight:500;line-height:1.35;letter-spacing:-.01em}
.specrow b.urgent{color:var(--acc)}
.specnote{font-family:var(--mono);font-size:9.5px;line-height:1.9;letter-spacing:.06em;
 text-transform:uppercase;color:#7E848C;margin:var(--s2) 0 0}

/* ---------- network application ---------- */
.napp{background:var(--dark);color:#E4E2DD;border-top:1px solid #2A2D33}
.nappin{max-width:1280px;margin:0 auto;padding:var(--s6) var(--s5)}
.nsteps{display:flex;gap:var(--s4);flex-wrap:wrap;font-family:var(--mono);font-size:9.5px;
 letter-spacing:.18em;text-transform:uppercase;color:#5E636B;
 border-bottom:1px solid rgba(255,255,255,.12);padding-bottom:var(--s3);margin-bottom:var(--s5)}
.nsteps b{font-weight:400;display:flex;align-items:center;gap:9px}
.nsteps b::before{content:"";width:6px;height:6px;border-radius:50%;background:#3A3E45}
.nsteps b.on{color:#FBFAF7}
.nsteps b.on::before{background:var(--acc);box-shadow:0 0 0 3px rgba(142,27,44,.28)}
.nsteps b.done{color:#8C9299}
.nsteps b.done::before{background:#1F6F43}
.npane{display:none}
.npane.on{display:block}
.npane h2{font-family:var(--ser);font-size:32px;font-weight:400;letter-spacing:-.025em;
 margin:0 0 var(--s2);color:#FBFAF7}
.npane p.i{margin:0 0 var(--s4);color:#B4B2AE;max-width:40em}
.nrow{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s3);max-width:44em}
.nrow.one{grid-template-columns:1fr}
.nfld label{display:block;font-family:var(--mono);font-size:9.5px;letter-spacing:.16em;
 text-transform:uppercase;color:#8C9299;margin-bottom:9px}
.nfld input,.nfld textarea{width:100%;background:rgba(255,255,255,.05);color:#FBFAF7;
 border:1px solid rgba(255,255,255,.18);padding:13px 14px;font-family:var(--ser);font-size:17px}
.nfld textarea{min-height:88px;resize:vertical}
.nfld input:focus,.nfld textarea:focus{outline:2px solid #C4808C;outline-offset:1px}
.nbtn{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;
 background:var(--acc);color:#fff;border:0;padding:14px 24px;cursor:pointer}
.nbtn:hover{background:#A62234}
.nbtn[disabled]{opacity:.5;cursor:default}
.nbtn.ghost{background:transparent;color:#B4B2AE;border-bottom:1px solid rgba(255,255,255,.35);
 padding:8px 0;margin-left:var(--s3)}
.nbtn.ghost:hover{background:transparent;color:#fff}
.nacts{margin-top:var(--s4);display:flex;align-items:center;flex-wrap:wrap;gap:var(--s2)}
.nerr{margin-top:var(--s3);padding:13px 16px;border-left:2px solid #C4808C;
 background:rgba(196,128,140,.1);font-size:15px;line-height:1.6;color:#E8D8DA;max-width:44em}
.nwait{font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;
 color:#8C9299;margin-top:var(--s3)}
/* the found profile */
.ncard{background:#FBFAF7;color:var(--ink);padding:var(--s3) var(--s4) var(--s4);max-width:44em;
 box-shadow:0 24px 48px -24px rgba(0,0,0,.7)}
.ncard .vh{font-family:var(--mono);font-size:9px;letter-spacing:.2em;text-transform:uppercase;
 display:flex;align-items:center;gap:8px;padding-bottom:11px;margin-bottom:var(--s2);
 border-bottom:1px solid var(--hair);color:#1F6F43}
.ncard .vh::before{content:"";width:6px;height:6px;border-radius:50%;background:#1F6F43}
.ncard .vh.un{color:var(--slot)}
.ncard .vh.un::before{background:var(--slot)}
.ncard .nr{display:grid;grid-template-columns:135px 1fr;gap:var(--s3);padding:9px 0;
 border-bottom:1px solid var(--hair);align-items:baseline}
.ncard .nr:last-child{border-bottom:0}
.ncard .nr span{font-family:var(--mono);font-size:9px;letter-spacing:.16em;text-transform:uppercase;
 color:var(--soft)}
.ncard .nr b{font-family:var(--ser);font-size:17px;font-weight:500;letter-spacing:-.01em}
.ncard .un-block{margin-top:var(--s4)}
.nfine{font-family:var(--mono);font-size:9.5px;line-height:1.9;letter-spacing:.05em;
 text-transform:uppercase;color:#7E848C;margin:var(--s3) 0 0;max-width:44em}
.ndrop{border:1px dashed rgba(255,255,255,.3);background:rgba(255,255,255,.04);
 padding:var(--s4);max-width:44em;font-family:var(--mono);font-size:10px;letter-spacing:.14em;
 text-transform:uppercase;color:#B4B2AE;line-height:2.2;text-align:center}
.ndrop label{cursor:pointer;color:#fff;font-size:13px;letter-spacing:.12em;
 border-bottom:1px solid rgba(255,255,255,.45);padding-bottom:4px}
.ndrop input[type=file]{opacity:0;position:absolute;width:1px;height:1px}
.ncal{background:#FBFAF7;padding:var(--s2);margin-top:var(--s3);min-height:560px}
.ncal iframe{width:100%;min-height:560px;border:0;display:block}
@media(max-width:760px){
 .nrow{grid-template-columns:1fr}
 .ncard .nr{grid-template-columns:1fr;gap:3px}
}

/* ---------- metrics strip ---------- */
.metrics{border-top:1px solid #2A2D33;background:#101215}
.metrics.paper{background:var(--paper);border-top:0;border-bottom:1px solid var(--rule)}
.metrics.paper .m b{color:var(--ink)}
.metrics.paper .m span{color:var(--mid)}
.metrics.paper .m.pending b{color:var(--acc)}
.hmach{font-family:var(--ser);font-size:clamp(30px,4vw,48px);line-height:1.08;font-weight:400;
 letter-spacing:-.03em;margin:0 0 var(--s3);color:#FBFAF7;max-width:15em;border:0;padding:0}
.metricsin{max-width:1280px;margin:0 auto;padding:var(--s4) var(--s5);
 display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s5)}
.metricsin .m b{display:block;font-family:var(--mono);font-size:30px;letter-spacing:-.03em;
 color:#FBFAF7;line-height:1}
.metricsin .m span{display:block;font-size:13.5px;color:#85878B;margin-top:10px;line-height:1.5}
.metricsin .m.pending b{color:#C4808C;font-size:22px}
/* a word rather than a numeral wants less weight than a tabular figure */
.metricsin .m.word b{font-size:19px;letter-spacing:.04em;padding-top:9px}

/* ---------- symptom router ---------- */
.router{border-bottom:1px solid var(--rule);background:var(--panel)}
.routerin{max-width:1280px;margin:0 auto;padding:var(--s6) var(--s5);display:grid;
 grid-template-columns:150px 1fr;gap:var(--s7)}
.routerin .lbl{font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;
 color:var(--acc);padding-top:10px}
.router h2{font-family:var(--ser);font-size:34px;font-weight:400;letter-spacing:-.025em;margin:0 0 var(--s2)}
.router .ri{margin:0 0 var(--s4);color:#2E3238;max-width:34em}
.rtgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--rule);
 border:1px solid var(--rule)}
.rt{display:block;background:var(--paper);padding:var(--s3);text-decoration:none;
 transition:background .15s}
.rt:hover{background:#fff}
.rt b{display:block;font-family:var(--ser);font-size:19px;font-weight:500;letter-spacing:-.012em;
 color:var(--ink);margin-bottom:6px;line-height:1.25}
.rt:hover b{color:var(--acc)}
.rt span{display:block;font-size:15px;color:var(--mid);line-height:1.5}
.rmore{margin:var(--s3) 0 0;font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;
 text-transform:uppercase}
.rmore a{color:var(--acc);text-decoration:none}

/* ---------- intake, inverted ---------- */
.dropname{font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;
 color:#A9AEB6;margin-top:10px}

/* ---------- attached files ----------
   Attaching a document used to replace the hint text with a filename in 10px
   uppercase mono, which is indistinguishable from the hint it replaced. A
   visitor could not tell whether the attachment had taken. Each file now gets a
   row of its own it can be removed from. */
.filelist{list-style:none;margin:var(--s3) 0 0;padding:0;text-align:left}
.filelist li{display:flex;align-items:center;gap:12px;background:rgba(255,255,255,.07);
 border:1px solid rgba(255,255,255,.18);padding:11px 12px;margin-top:8px}
.filelist li:first-child{margin-top:0}
.filelist svg{flex:0 0 auto;color:#C4808C}
.filelist .fn{font-family:var(--ser);font-size:15.5px;color:#FBFAF7;text-transform:none;
 letter-spacing:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1 1 auto;
 text-align:left}
.filelist .fsz{font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;color:#8C9299;
 flex:0 0 auto}
.filelist .rm{flex:0 0 auto;background:none;border:0;color:#8C9299;font-size:20px;line-height:1;
 cursor:pointer;padding:0 2px}
.filelist .rm:hover{color:#fff}
.filelist .rm:focus-visible{outline:2px solid #C4808C;outline-offset:2px}
.drop.over,.ndrop.over{border-color:#C4808C;background:rgba(196,128,140,.1)}
.nofile{display:inline-block;margin-top:14px;font-family:var(--mono);font-size:10px;
 letter-spacing:.12em;text-transform:uppercase;color:#C4808C;text-decoration:none;
 border-bottom:1px solid rgba(196,128,140,.5);padding-bottom:2px}
#intake .rest{margin-top:var(--s4)}
#intake.collapsed .rest{display:none}
#intake.collapsed.engaged .rest{display:block}
#posture-note{font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;
 color:#C4808C;border-left:2px solid #C4808C;padding:8px 14px;margin:0 0 var(--s3)}
.int .drop{grid-column:auto;margin-bottom:0}

/* ---------- triage tool ---------- */
.tset{border:0;border-top:1px solid var(--hair);padding:var(--s4) 0 var(--s2);margin:0}
.tset legend{font-family:var(--ser);font-size:21px;font-weight:500;letter-spacing:-.012em;
 padding:0 0 var(--s2);color:var(--ink)}
.tset legend i{font-family:var(--mono);font-style:normal;font-size:10.5px;letter-spacing:.14em;
 color:var(--acc);margin-right:14px}
.tq{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start;padding:11px 0;
 cursor:pointer;border-bottom:1px solid var(--hair)}
.tq:last-child{border-bottom:0}
.tq input{margin-top:7px;accent-color:var(--acc)}
.tq span{font-size:17px;color:#2E3238}
.tq:hover span{color:var(--ink)}
.tres{border-left:3px solid var(--rule);background:var(--panel);padding:var(--s4);
 margin:var(--s5) 0 var(--s3)}
.tres h3{font-family:var(--ser);font-size:26px;font-weight:400;letter-spacing:-.02em;margin:0 0 var(--s2)}
.tres p{margin:0 0 var(--s2);color:#2E3238}
.tres.t-ok{border-left-color:var(--ok);background:#F3F8F4}
.tres.t-warn{border-left-color:var(--warn);background:#FFFCF2}
.tres.t-no{border-left-color:var(--acc);background:#FCF4F5}
/* A price that is a decision rather than a rate. The badge marks it in the price
   column; the row under it carries the terms. Both are needed: the badge alone
   says "temporary" without saying until when or what it reverts to, and the row
   alone is missed by anyone scanning the right-hand column for a number. */
.offr{display:block;font-family:var(--mono);font-size:9px;letter-spacing:.14em;
 text-transform:uppercase;color:var(--ok);font-weight:500;margin-top:4px}
.offr-row td{border-bottom:1px solid var(--hair);padding-top:0}
.offr-row .d{font-size:14px;color:var(--mid);max-width:none}
/* A note attached to a verdict rather than a verdict of its own — the bond case
   above all, where the band alone ("worth a look") undersells the best fact on
   the page. Narrower rule, smaller type, same colour language. */
.tnote{border-left:3px solid var(--rule);padding:var(--s3) var(--s4);margin-top:var(--s2);
 font-size:15.5px}
.tnote p{margin:0;color:#2E3238}
.tnote.t-ok{border-left-color:var(--ok);background:#F3F8F4}
.tnote.t-no{border-left-color:var(--acc);background:#FCF4F5}
.tlinks{margin:0;display:flex;flex-wrap:wrap;gap:0 var(--s3)}
.tlinks a{font-family:var(--mono);font-size:10px;letter-spacing:.13em;text-transform:uppercase;
 color:var(--acc);text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:2px}

/* ---------- tokens the sheet already used but never declared ---------- */
/* --ok and --warn are referenced by .tres (the triage tool). They also used to
   dress the masthead availability lamp, which has been retired along with the
   tagline — the name is the mark now and was competing with both. */
:root{--ok:#1F6F43; --warn:#8A6A12}
:root{--portal:#1F5F6F}   /* trustee login — 6.88:1 on --paper */
/* The second door, for outside counsel. Chosen by measurement rather than taste:
   9.97:1 on --paper, and separated from BOTH existing link colours under
   simulated deutan and tritan vision (worst all-pairs ΔE 10.8 deutan, 11.0
   tritan, 15.4 normal — the indigo and green candidates failed that test against
   the teal and the claret respectively). The two doors also differ in wording, so
   colour is never the only thing telling them apart. */
:root{--counsel:#4B2E83}  /* attorney door — 9.97:1 on --paper */

/* ---------- skip link + focus ---------- */
.skip{position:absolute;left:-9999px;top:0;z-index:50;background:var(--ink);color:var(--paper);
 font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;
 padding:12px 18px;text-decoration:none}
.skip:focus{left:0}
#content{scroll-margin-top:0}
#content:focus{outline:0}
:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.intake-form :focus-visible{outline-color:#C4808C}
.drop input[type=file]:focus-visible+label{outline:2px solid #C4808C;outline-offset:4px}
button.nofile{background:none;border:0;padding:0 0 2px;cursor:pointer;font-size:10px}

/* entry and result titles carry the same face whichever level the outline needs */
.e h2{font-family:var(--ser);font-size:27px;font-weight:400;letter-spacing:-.02em;margin:0 0 var(--s2);
 line-height:1.18;max-width:16em}
.e h2 a{text-decoration:none;background-image:linear-gradient(var(--acc),var(--acc));
 background-size:0 1px;background-repeat:no-repeat;background-position:0 100%;transition:background-size .25s}
.e h2 a:hover{color:var(--acc);background-size:100% 1px}
.tres h2{font-family:var(--ser);font-size:26px;font-weight:400;letter-spacing:-.02em;margin:0 0 var(--s2)}

/* ---------- intake: submission states ---------- */
.fmsg{margin:var(--s3) 0 0;padding:14px 18px;border-left:2px solid #8C8E92;
 background:rgba(255,255,255,.05);font-size:15px;line-height:1.6;color:#D6D4CF;max-width:46em}
.fmsg a{color:#fff}
.fmsg.is-working{border-left-color:#C4808C;color:#B4B2AE}
.fmsg.is-ok{border-left-color:var(--ok);background:rgba(31,111,67,.14);color:#E4E2DD}
.fmsg.is-err{border-left-color:#C4808C;background:rgba(196,128,140,.12);color:#F0DEE1}
/* not-open-yet is not a failure and should not be dressed as one */
.fmsg.is-closed{border-left-color:var(--slot);background:rgba(176,140,30,.12);color:#EFE6CE}
.fmsg b{font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;
 display:block;margin-bottom:6px;font-weight:500}
.intake-form.is-sending .go{opacity:.5;pointer-events:none}
.intake-form.is-sent .go{display:none}
.intake-form .nojs{margin:var(--s3) 0 0;padding:14px 18px;border-left:2px solid #C4808C;
 font-size:15px;line-height:1.6;color:#B4B2AE;max-width:46em}
.intake-form .nojs a{color:#fff}

@media(max-width:1080px){
 .state,.shell,.sec,.intin,.frow,.art,.ex,.routerin,.heroin{grid-template-columns:1fr;gap:var(--s4)}
 .metricsin{grid-template-columns:repeat(2,1fr);gap:var(--s3)}
 .spec{position:static}
 .rtgrid{grid-template-columns:1fr}
 .state{padding-top:var(--s6)}
 .pf{max-width:240px}
 .rail{position:static;padding:var(--s4) 0 0;display:flex;flex-wrap:wrap;gap:0 var(--s3)}
 .rail .rl{width:100%;margin-bottom:var(--s1);border:0}
 .rail a{border-bottom:0;padding:5px 0;font-size:14px}
 .rail a i{display:inline;margin-right:8px}
 .main{padding-top:var(--s4)}
 .e.has{grid-template-columns:1fr;gap:var(--s4);background:var(--panel);padding:var(--s4);
   margin-right:0}
 .fig{max-width:320px}
 .ex{padding:var(--s3)}
 .grid{grid-template-columns:1fr}
 .fld.w,.drop,.chk{grid-column:span 1}
 .mastin{grid-template-columns:1fr;gap:var(--s2);align-items:start}
 .mastr{text-align:left}
 .side{position:static}
}
@media(max-width:660px){
 .wrap,.mastin,.navin,.state,.shell,.sec,.intin,footer,.art,.crumb{
   padding-left:var(--s3);padding-right:var(--s3)}
 body{font-size:17.5px}
 .ghead i{font-size:34px}
 td.t,td.d{width:auto}
 table,thead,tbody,tr,td,th{display:block;width:100%}
 th{display:none}
 td{border-bottom:0;padding:4px 0}
 tr{display:block;border-bottom:1px solid var(--hair);padding:var(--s2) 0}
 td.n{text-align:left;padding-top:var(--s1)}
}

/* ================= the platform site — /platform/ =================
   THE RESET IS NOT TIDINESS. It exists because the firm stylesheet, which every
   page here loads for the faces and the palette, carries BARE ELEMENT rules —
   and a class prefix cannot defend against those. `footer{max-width:1280px;
   margin:0 auto}` inherited straight through `.pl-foot`, so the platform footer
   drew as an 1280px island with paper down one side and nothing failed. Same
   family as the `.dk` collision the class check now catches; different mechanism,
   so it needs its own answer.

   The elements listed here are exactly the ones ELEMENT_RULES in
   check_no_element_collisions() reads out of build.py's CSS. Add a bare element
   rule over there and the build says so rather than a page quietly changing. */
.pl footer{max-width:none;margin:0;padding:0}
.pl table{width:auto;font-size:inherit}

.pl{--pl-ink:#17191D;--pl-deep:#101215;--pl-line:rgba(251,250,247,.14);
 --pl-dim:#A8ABB1;--pl-gold:#C9A227;
 --g-green:#1F6F43;--g-yellow:#B08C1E;--g-red:#A62234;--g-grey:#8C8E92}

.pl-mast{background:var(--pl-deep);color:var(--paper);border-bottom:1px solid var(--pl-line)}
.pl-mastin{max-width:1180px;margin:0 auto;padding:var(--s3) var(--s5);
 display:flex;justify-content:space-between;align-items:center;gap:var(--s4)}
.pl-navbar{border-top:1px solid var(--pl-line)}
.pl-navin{max-width:1180px;margin:0 auto;padding:13px var(--s5)}
.pl-brand{display:flex;align-items:center;gap:14px;text-decoration:none;color:var(--paper)}
.pl-mark{width:26px;height:33px;display:block;flex:0 0 auto}
.pl-word{font-family:var(--ser);font-size:23px;font-weight:430;letter-spacing:-.02em;line-height:1}
.pl-word i{display:block;font-family:var(--mono);font-style:normal;font-size:8.5px;
 letter-spacing:.24em;text-transform:uppercase;color:var(--pl-gold);margin-top:5px}
/* THE TWO ROWS IN THIS STRIP COMPETE FOR ONE LINE, and the professional logins
   arriving on 9 Aug is what made them collide — six nav items and four roles do
   not fit beside a mark at 1440px. Both are tightened rather than one being
   moved: the nav is where a reader goes and the roles are how they get in, and
   dropping either to a second row makes it look like the lesser one. */
/* NAV ON ITS OWN ROW, 9 Aug 2026, and this is the second time this strip ran out
   of width — the professional logins arriving off the firm site is what forced
   it, and shrinking both halves only bought one more item. Six destinations, four
   roles, a mark and a call to action do not fit on one line at 1180px and never
   will. The firm site solved the same problem the same way and its masthead has
   not moved since. */
.pl-nav{display:flex;flex-wrap:wrap;gap:var(--s4);
 font-family:var(--mono);font-size:10px;letter-spacing:.17em;text-transform:uppercase}
.pl-nav a{color:var(--pl-dim);text-decoration:none;padding-bottom:3px;border-bottom:1px solid transparent}
.pl-nav a:hover{color:var(--paper)}
.pl-nav a[aria-current]{color:var(--paper);border-bottom-color:var(--pl-gold)}
.pl-mastr{display:flex;gap:13px;align-items:center;
 font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase}
.pl-signin{color:var(--soft);letter-spacing:.2em}
.pl-mastr a:not(.pl-in){border-bottom:1px solid transparent;padding-bottom:2px}
.pl-mastr a:not(.pl-in):hover{border-bottom-color:var(--pl-gold)}
.pl-mastr a{color:var(--pl-dim);text-decoration:none}
.pl-mastr a:hover{color:var(--paper)}
.pl-mastr a.pl-in{color:var(--pl-ink);background:var(--pl-gold);padding:9px 14px;
 border-radius:2px;margin-left:6px;letter-spacing:.13em}
.pl-mastr a.pl-in:hover{color:var(--pl-ink);background:#DCB63A}

/* ---- the screenshot figure ----
   A LAWYER CANNOT PICTURE A SURFACE THEY HAVE NEVER SEEN, which is John's note
   on the first review of this site and the reason these exist. Every image is a
   real render of the product — see site/shots/render_shots.mjs — so the frame is
   deliberately plain: a hairline and a shadow, no fake browser chrome, no
   perspective, no laptop bezel. A drawn frame around a real screen makes the
   screen look drawn too.
   The CAPTION IS NOT DECORATION. It says the matter is invented, and it is on
   every figure without exception, because a screenshot of a real client's file
   on a public page is a Tex. Disciplinary R. 1.05 problem and saying so is
   better marketing than hoping nobody wonders. */
.pl-shot{margin:0;min-width:0}
.pl-shot img{width:100%;height:auto;display:block;border:1px solid var(--rule);border-radius:3px;
 box-shadow:0 2px 4px rgba(0,0,0,.18),0 24px 56px -20px rgba(0,0,0,.5);background:var(--paper)}
.pl-shot figcaption{font-family:var(--mono);font-size:9.5px;letter-spacing:.13em;
 text-transform:uppercase;line-height:1.9;color:var(--soft);padding:14px 2px 0}
.pl-shot figcaption b{color:var(--mid);font-weight:500}
.pl-sec.pl-dk .pl-shot figcaption,.pl-hero .pl-shot figcaption{color:#7E8288}
.pl-sec.pl-dk .pl-shot figcaption b,.pl-hero .pl-shot figcaption b{color:var(--pl-dim)}
.pl-sec.pl-dk .pl-shot img,.pl-hero .pl-shot img{border-color:rgba(251,250,247,.16)}

/* copy left, screen right — the shape John asked for */
.pl-split{display:grid;grid-template-columns:1fr 1.12fr;gap:var(--s6);align-items:center}
.pl-split.pl-wide{grid-template-columns:1fr 1.5fr}
.pl-split > div{min-width:0}
.pl-split h2{max-width:none}
.pl-split p,.pl-split ul{max-width:none}

/* ---- hero ---- */
.pl-hero{background:var(--pl-deep);color:var(--paper);border-bottom:1px solid var(--pl-line)}
.pl-heroin{max-width:1180px;margin:0 auto;padding:var(--s7) var(--s5) var(--s6);
 display:grid;grid-template-columns:1fr 250px;gap:var(--s7);align-items:center}
/* a hero carrying a screenshot instead of the mark needs the room for it */
.pl-heroin.pl-withshot{grid-template-columns:1fr 1.12fr;gap:var(--s6)}
.pl-heroin.pl-withshot h1{font-size:clamp(30px,3.6vw,44px);max-width:none}
.pl-heroin.pl-withshot p{font-size:18.5px}
.pl-heroin.pl-withshot p:first-of-type{font-size:20px}
.pl-kick{font-family:var(--mono);font-size:9.5px;letter-spacing:.24em;text-transform:uppercase;
 color:var(--pl-gold);display:block;margin-bottom:var(--s3)}
.pl-hero h1{font-family:var(--ser);font-size:clamp(32px,4.3vw,54px);line-height:1.1;font-weight:400;
 letter-spacing:-.03em;margin:0 0 var(--s4);max-width:15em}
.pl-hero p{margin:0 0 var(--s2);max-width:36em;font-size:19.5px;line-height:1.66;color:#D9DADD}
.pl-hero p:first-of-type{font-size:21px;color:var(--paper)}
.pl-heromark{color:var(--pl-gold);opacity:.9}
.pl-heromark svg{width:100%;height:auto}
.pl-acts{display:flex;flex-wrap:wrap;gap:var(--s2);margin-top:var(--s4)}
.pl-btn{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;
 text-decoration:none;padding:15px 26px;border-radius:2px;display:inline-block}
.pl-btn.pl-p{background:var(--pl-gold);color:var(--pl-ink)}
.pl-btn.pl-p:hover{background:#DCB63A}
.pl-btn.pl-s{border:1px solid var(--pl-line);color:var(--paper)}
.pl-btn.pl-s:hover{border-color:var(--pl-gold);color:var(--pl-gold)}

/* ---- body ---- */
.pl-body{background:var(--paper)}
.pl-sec{max-width:1180px;margin:0 auto;padding:var(--s6) var(--s5);border-bottom:1px solid var(--hair)}
.pl-sec:last-of-type{border-bottom:0}
.pl-sec.pl-dk{max-width:none;background:var(--pl-ink);color:var(--paper);border-bottom:0}
.pl-sec.pl-dk .pl-in{max-width:1180px;margin:0 auto;padding:0}
.pl-sec.pl-dk h2,.pl-sec.pl-dk h3{color:var(--paper)}
.pl-sec.pl-dk p,.pl-sec.pl-dk li{color:#D2D4D8}
.pl-sec.pl-dk .pl-eyebrow{color:var(--pl-gold)}
.pl-eyebrow{font-family:var(--mono);font-size:9.5px;letter-spacing:.22em;text-transform:uppercase;
 color:var(--acc);display:block;margin-bottom:var(--s2)}
.pl-sec h2{font-family:var(--ser);font-size:clamp(26px,3vw,36px);font-weight:400;letter-spacing:-.025em;
 line-height:1.16;margin:0 0 var(--s3);max-width:19em}
.pl-sec h3{font-family:var(--ser);font-size:23px;font-weight:400;letter-spacing:-.02em;
 margin:0 0 var(--s1);line-height:1.24}
.pl-sec p{font-size:18.5px;line-height:1.66;color:#2E3238;max-width:38em;margin:0 0 var(--s2)}
.pl-lede{font-size:21px !important;line-height:1.56;color:var(--ink) !important;max-width:34em}
.pl-sec ul{max-width:38em;padding-left:1.15em}
.pl-sec li{font-size:18px;line-height:1.62;color:#2E3238;margin-bottom:10px}

/* ---- three propositions ---- */
.pl-props{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s5);margin-top:var(--s4)}
.pl-prop{border-top:2px solid var(--pl-gold);padding-top:var(--s3)}
.pl-prop i{font-family:var(--mono);font-style:normal;font-size:10px;letter-spacing:.2em;
 color:var(--pl-gold);display:block;margin-bottom:14px}
.pl-prop h3{font-size:21px;margin-bottom:12px}
.pl-prop p{font-size:16.5px;line-height:1.6;max-width:none;margin:0}

/* ---- capability grid ---- */
.pl-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--hair);
 border:1px solid var(--hair);margin-top:var(--s4)}
.pl-card{background:var(--paper);padding:var(--s4);text-decoration:none;display:block;color:inherit}
.pl-card:hover{background:var(--panel)}
.pl-card .pl-tag{font-family:var(--mono);font-size:9px;letter-spacing:.2em;text-transform:uppercase;
 color:var(--soft);display:block;margin-bottom:12px}
.pl-card h3{font-size:22px;margin-bottom:10px}
.pl-card p{font-size:16.5px;line-height:1.58;max-width:none;margin:0;color:var(--mid)}
.pl-card.soon{background:var(--panel)}
.pl-card.soon .pl-tag{color:var(--acc)}

/* ---- the authority card specimen ---- */
.pl-spec{border:1px solid var(--rule);background:var(--panel);padding:var(--s4);max-width:40em;
 margin-top:var(--s3)}
.pl-spec .pl-grade{font-family:var(--mono);font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;
 display:inline-flex;align-items:center;gap:8px;padding:5px 11px;border:1px solid currentColor;border-radius:2px}
.pl-spec .pl-grade b{width:7px;height:7px;border-radius:50%;background:currentColor;display:block}
.pl-spec .pl-g-red{color:var(--g-red)} .pl-spec .pl-g-yellow{color:var(--g-yellow)}
.pl-spec .pl-g-green{color:var(--g-green)} .pl-spec .pl-g-grey{color:var(--g-grey)}
.pl-spec .pl-cite{font-family:var(--mono);font-size:13.5px;line-height:1.6;margin:var(--s2) 0 0;color:var(--ink)}
.pl-spec dl{margin:var(--s2) 0 0;font-size:16.5px;line-height:1.6}
.pl-spec dt{font-family:var(--mono);font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;
 color:var(--soft);margin-top:14px}
.pl-spec dd{margin:4px 0 0;color:#2E3238}
.pl-legend{display:flex;flex-wrap:wrap;gap:var(--s2);margin-top:var(--s3)}
.pl-legend span{font-family:var(--mono);font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;
 display:inline-flex;align-items:center;gap:7px;color:var(--mid)}
.pl-legend b{width:8px;height:8px;border-radius:50%;display:block}

/* ---- what it will not do ---- */
.pl-wont{border-top:1px solid var(--pl-line);margin-top:var(--s4)}
.pl-wont div{border-bottom:1px solid var(--pl-line);padding:var(--s3) 0;
 display:grid;grid-template-columns:1fr 1.35fr;gap:var(--s5)}
.pl-wont h3{font-size:19px;margin:0;color:var(--paper)}
.pl-wont p{margin:0;font-size:16.5px;line-height:1.62;max-width:none}

/* ---- steps ---- */
.pl-steps{counter-reset:s;margin-top:var(--s4);max-width:44em}
.pl-step{counter-increment:s;display:grid;grid-template-columns:56px 1fr;gap:var(--s3);
 padding:var(--s3) 0;border-bottom:1px solid var(--hair)}
.pl-step::before{content:counter(s,decimal-leading-zero);font-family:var(--mono);font-size:11px;
 letter-spacing:.14em;color:var(--acc);padding-top:6px}
.pl-step h3{font-size:20px}
.pl-step p{font-size:17px;margin:0;max-width:none}

/* ---- caveat / pull ---- */
.pl-note{border-left:3px solid var(--acc);background:var(--panel);padding:var(--s3) var(--s4);
 max-width:40em;margin:var(--s4) 0}
.pl-note .pl-h{font-family:var(--mono);font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;
 color:var(--acc);margin-bottom:10px}
.pl-note p{margin:0 0 10px;font-size:17px;line-height:1.6}
.pl-note p:last-child{margin-bottom:0}
.pl-sec.pl-dk .pl-note{background:rgba(251,250,247,.05);border-left-color:var(--pl-gold)}
.pl-sec.pl-dk .pl-note .pl-h{color:var(--pl-gold)}

/* ---- field table ---- */
.pl-tbl{width:100%;border-collapse:collapse;margin-top:var(--s3);max-width:44em}
.pl-tbl th{font-family:var(--mono);font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;
 text-align:left;color:var(--soft);border-bottom:1px solid var(--rule);padding:0 var(--s3) 10px 0;font-weight:400}
.pl-tbl td{font-size:16.5px;line-height:1.55;border-bottom:1px solid var(--hair);
 padding:13px var(--s3) 13px 0;vertical-align:top;color:#2E3238}
.pl-tbl td:first-child{font-family:var(--mono);font-size:13px;color:var(--ink);white-space:nowrap}

/* ---- figures strip ---- */
.pl-figs{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s4);margin-top:var(--s4)}
.pl-fig{border-top:1px solid var(--pl-line);padding-top:var(--s2)}
.pl-fig b{font-family:var(--ser);font-size:38px;font-weight:300;line-height:1;display:block;
 letter-spacing:-.03em;color:var(--pl-gold)}
.pl-fig span{font-family:var(--mono);font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;
 color:var(--pl-dim);display:block;margin-top:10px;line-height:1.7}

/* ---- closing call ---- */
.pl-call{background:var(--pl-deep);color:var(--paper);text-align:center;padding:var(--s7) var(--s5)}
.pl-call h2{font-family:var(--ser);font-size:clamp(26px,3.2vw,38px);font-weight:400;letter-spacing:-.025em;
 margin:0 auto var(--s3);max-width:17em;line-height:1.16}
.pl-call p{margin:0 auto var(--s4);max-width:32em;color:#D2D4D8;font-size:18.5px;line-height:1.62}
.pl-call .pl-acts{justify-content:center}

/* ---- footer ---- */
.pl-foot{background:var(--pl-ink);color:var(--pl-dim);border-top:1px solid var(--pl-line);
 padding:var(--s5);font-size:15px}
.pl-footin{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:var(--s5)}
.pl-foot a{color:var(--pl-dim);text-decoration:none;display:block;padding:3px 0}
.pl-foot a:hover{color:var(--paper)}
.pl-foot .pl-h{font-family:var(--mono);font-size:9px;letter-spacing:.2em;text-transform:uppercase;
 color:var(--soft);margin-bottom:12px}
.pl-foot .pl-dis{font-size:13px;line-height:1.66;color:var(--soft);margin-top:var(--s3)}
.pl-foot .pl-brand{margin-bottom:var(--s2)}

@media (max-width:1000px){
 .pl-split,.pl-split.pl-wide,.pl-heroin.pl-withshot{grid-template-columns:1fr;gap:var(--s4)}
 .pl-mastin{flex-wrap:wrap;row-gap:var(--s2);padding:var(--s3)}
 .pl-navin{padding:10px var(--s3)}
 /* gap is one value on both axes, so the desktop 32px column gap was also a
    32px ROW gap and the wrapped nav ate half the first screen on a phone. */
 .pl-nav{gap:9px var(--s3);font-size:9.5px}
 .pl-mastr{flex-wrap:wrap;gap:10px}
 .pl-heroin{padding-top:var(--s5);padding-bottom:var(--s5)}
 .pl-hero h1{font-size:clamp(28px,7.5vw,38px)}
 .pl-heroin{grid-template-columns:1fr;gap:var(--s4)}
 .pl-heromark{display:none}
 .pl-props,.pl-grid,.pl-figs,.pl-footin{grid-template-columns:1fr}
 .pl-wont div{grid-template-columns:1fr;gap:10px}
 .pl-sec,.pl-heroin,.pl-call{padding-left:var(--s3);padding-right:var(--s3)}
}
