/* CaseForm app: the Northfalk CRM's design language (fine rules, small tracked labels, outlined controls,
   light type, day/night theme), with larger type for easier reading. */
@font-face{font-family:"Switzer";font-weight:300;font-display:swap;src:url(/static/fonts/switzer-300.woff2) format("woff2")}
@font-face{font-family:"Switzer";font-weight:400;font-display:swap;src:url(/static/fonts/switzer-400.woff2) format("woff2")}
@font-face{font-family:"Switzer";font-weight:500;font-display:swap;src:url(/static/fonts/switzer-500.woff2) format("woff2")}
@font-face{font-family:"Newsreader NF";font-weight:400;font-display:swap;src:url(/static/fonts/newsreader-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Archivo NF";font-weight:100 900;font-stretch:62% 125%;font-display:swap;src:url(/static/fonts/archivo-wdth.woff2) format("woff2")}

:root{--blue:#1e47d1;--navy:#2a3544;--font:"Switzer","Helvetica Neue",Helvetica,Arial,sans-serif;--display:"Archivo NF","Switzer",sans-serif;
 --bg:#fff;--ink:#2a3544;--strong:#151b24;--muted:#6b7077;--line:#e3e7ec;--line2:#c3cad3;--tile-a:#ebeef2;--tile-b:#f8f9fb;
 --accent:#1e47d1;--accent-ink:#fff;--bad:#b42318;--ok:#157f4b;--warn-bg:#fff4e5;--warn-ink:#7a4b00;color-scheme:light}
:root[data-theme=dark]{--bg:#0d121a;--ink:#dfe3ea;--strong:#fff;--muted:#8d939b;--line:#222b37;--line2:#3a4555;--tile-a:#1a2230;--tile-b:#10161f;
 --accent:#8aa4ff;--accent-ink:#0d121a;--bad:#f97066;--ok:#4ade80;--warn-bg:#2a2112;--warn-ink:#f2c98a;color-scheme:dark}
@media(prefers-color-scheme:dark){:root:not([data-theme]){--bg:#0d121a;--ink:#dfe3ea;--strong:#fff;--muted:#8d939b;--line:#222b37;--line2:#3a4555;--tile-a:#1a2230;--tile-b:#10161f;
 --accent:#8aa4ff;--accent-ink:#0d121a;--bad:#f97066;--ok:#4ade80;--warn-bg:#2a2112;--warn-ink:#f2c98a;color-scheme:dark}}

*{box-sizing:border-box}[hidden]{display:none!important}
body{margin:0;background:var(--bg);color:var(--ink);font:300 15px/1.6 var(--font);-webkit-font-smoothing:antialiased;transition:background-color .4s,color .4s}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
h1,h2,h3,p{margin:0}p{margin-bottom:.6em}
::selection{background:var(--blue);color:#fff}
::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:var(--line2)}::-webkit-scrollbar-track{background:transparent}
a{color:var(--ink);text-underline-offset:3px;text-decoration-color:var(--line2);cursor:pointer}a:hover{text-decoration-color:var(--ink)}
:focus-visible{outline:1px solid var(--accent);outline-offset:3px}

/* top bar: three places, a quiet second row for the one you are in, an account menu */
.top{display:flex;align-items:center;gap:2.4vw;padding:20px 3.2vw 0;position:sticky;top:0;z-index:7;background:var(--bg);border-bottom:1px solid var(--line);flex-wrap:wrap;row-gap:0}
.brand{font:500 13px/1 var(--display);font-stretch:115%;letter-spacing:.24em;text-transform:uppercase;color:var(--strong);white-space:nowrap;cursor:pointer;text-decoration:none;padding-bottom:16px}
.top nav.main{display:flex;gap:clamp(18px,3vw,46px);flex:1}
.top nav.main button{font-size:14px;letter-spacing:.17em;text-transform:uppercase;font-weight:500;color:var(--ink);opacity:.6;padding:0 0 16px;border-bottom:2px solid transparent}
.top nav.main button:hover,.top nav.main button.on{opacity:1}.top nav.main button.on{border-bottom-color:var(--blue)}
.top-right{display:flex;gap:18px;align-items:center;margin-left:auto;padding-bottom:12px}
.subnav{flex-basis:100%;display:flex;gap:26px;flex-wrap:wrap;padding:11px 0 11px;border-top:1px solid var(--line)}
.subnav button{font-size:13px;letter-spacing:.04em;color:var(--muted);padding-bottom:3px;border-bottom:1px solid transparent}.subnav button:hover,.subnav button.on{color:var(--strong)}.subnav button.on{border-bottom-color:var(--ink)}
.acct{position:relative}.acct summary{list-style:none;cursor:pointer;font-size:12px;letter-spacing:.17em;text-transform:uppercase;font-weight:500;color:var(--muted);border:1px solid var(--line2);padding:7px 14px}
.acct summary::-webkit-details-marker{display:none}.acct summary:hover,.acct[open] summary{color:var(--strong);border-color:var(--ink)}
.acct .menu{position:absolute;right:0;top:calc(100% + 6px);min-width:190px;background:var(--bg);border:1px solid var(--ink);display:flex;flex-direction:column;z-index:9}
.acct .menu button{text-align:left;padding:12px 16px;font-size:14px;border-bottom:1px solid var(--line)}.acct .menu button:last-child{border-bottom:0}.acct .menu button:hover{background:var(--tile-a)}
.theme{display:inline-flex;border:1px solid var(--line2)}.theme button{width:32px;height:30px;display:grid;place-items:center;color:var(--muted)}
.theme button.on{background:var(--ink);color:var(--bg)}.theme svg{width:15px;height:15px}
@media(max-width:720px){.top nav.main{order:3;flex-basis:100%;justify-content:space-between}.top-right{padding-bottom:12px}.brand{padding-bottom:12px}}

main{padding:5vh 6.2vw 90px;max-width:1280px;margin:0 auto}
main:has(.cols){max-width:1500px}
h1{font:300 clamp(30px,3.2vw,46px)/1.05 var(--display);font-stretch:115%;letter-spacing:-.025em;color:var(--strong);margin-bottom:10px}
h2{font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:500;color:var(--ink)}
h3{font-weight:500;color:var(--strong)}
.mute{color:var(--muted);font-size:14px}.err{color:var(--bad)}.ok{color:var(--ok)}
.sp{flex:1}

/* sections: tiny label over a rule, no boxes */
.card{margin:0 0 40px}
.card>h2:first-child{padding-bottom:11px;border-bottom:1px solid var(--ink);margin-bottom:16px}

/* stats strip */
.stats{display:inline-grid;grid-auto-flow:column;border:1px solid var(--ink);margin-bottom:38px;max-width:100%;overflow-x:auto}
.stats a{padding:16px 30px 14px;border-right:1px solid var(--line2);min-width:128px;text-decoration:none;cursor:default}.stats a:last-child{border-right:0}
.stats small{display:block;font-size:10px;letter-spacing:.2em;text-transform:uppercase;font-weight:500;margin-bottom:8px;white-space:nowrap}
.stats b{font:300 32px/1 var(--display);font-stretch:115%;color:var(--strong)}

/* forms */
label{display:block;font-size:10.5px;letter-spacing:.17em;text-transform:uppercase;font-weight:500;color:var(--muted);margin-top:4px}
label.chk{display:flex;align-items:center;gap:9px;font-size:15px;letter-spacing:0;text-transform:none;font-weight:300;color:var(--ink);margin:6px 0;cursor:pointer}
input,select{font:300 15px var(--font);color:var(--strong);background:transparent;border:0;border-bottom:1px solid var(--line2);padding:8px 0;width:100%;border-radius:0;outline:none;margin:2px 0 14px}
textarea{font:300 15px/1.6 var(--font);color:var(--strong);background:transparent;border:1px solid var(--line2);padding:11px 13px;width:100%;border-radius:0;outline:none;margin:4px 0 14px;min-height:120px;resize:vertical}
input:focus,select:focus,textarea:focus{border-color:var(--accent)}
input::placeholder,textarea::placeholder{color:var(--muted)}select{background:var(--bg)}
input[type=checkbox]{width:17px;height:17px;margin:0;accent-color:var(--blue);padding:0}
input[type=file]{border:0;padding:6px 0;font-size:14px}

/* buttons: primary is solid blue, .alt is outlined */
.btn{border:1px solid var(--blue);background:var(--blue);color:#fff;padding:9px 20px;font-size:14px;font-weight:400;white-space:nowrap;margin:2px 0}
.btn:hover{background:var(--navy);border-color:var(--navy)}
:root[data-theme=dark] .btn:hover{background:#fff;color:#0d121a;border-color:#fff}
.btn.alt{background:transparent;border-color:var(--ink);color:var(--ink)}.btn.alt:hover{background:var(--ink);color:var(--bg)}
.btn.bad{background:transparent;border-color:var(--bad);color:var(--bad)}.btn.bad:hover{background:var(--bad);color:#fff}
.btn:disabled{opacity:.45;cursor:default}
.row{display:flex;gap:22px;flex-wrap:wrap;align-items:end}.row>*{flex:1;min-width:170px}

/* tables and lists */
table{width:100%;border-collapse:collapse;font-size:14px}
th{font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;font-weight:500;text-align:left;padding:8px 14px 9px 0;border-bottom:1px solid var(--ink);white-space:nowrap}
td{padding:13px 14px 13px 0;border-bottom:1px solid var(--line);vertical-align:top}
tr:hover td{background:var(--tile-a)}
.pill{display:inline-block;font-size:10px;letter-spacing:.18em;text-transform:uppercase;font-weight:500;padding:4px 9px;border:1px solid var(--line2);white-space:nowrap}
.snip{color:var(--muted);font-size:14px}pre{white-space:pre-wrap;font:inherit;margin:0 0 10px}
.notice{border-left:2px solid var(--accent);background:var(--tile-a);padding:10px 14px;font-size:14px;margin:8px 0 14px}
.warn{border-left:2px solid #d98b00;background:var(--warn-bg);color:var(--warn-ink);padding:10px 14px;font-size:14px;margin:8px 0 14px}

/* sign-in */
.login{max-width:420px;margin:15vh auto 0;padding:0 24px}.login .brand{display:block;margin-bottom:46px;font-size:15px}
.login h1{font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:500;font-family:var(--font);font-stretch:100%;margin-bottom:12px;color:var(--strong)}
.login .btn{margin-top:14px}.login .card{margin:0;border:0}

/* cards used for steps and panes */
.steps{display:flex;gap:0;margin-bottom:30px;border:1px solid var(--ink);width:max-content;max-width:100%;flex-wrap:wrap}
.step{padding:10px 22px;font-size:11px;letter-spacing:.17em;text-transform:uppercase;font-weight:500;color:var(--muted);border-right:1px solid var(--line2)}.step:last-child{border-right:0}
.step.on{background:var(--blue);color:#fff}.step.done{color:var(--ok)}
.cols{display:grid;gap:5vw;grid-template-columns:minmax(300px,5fr) minmax(0,7fr);align-items:start}@media(max-width:960px){.cols{grid-template-columns:1fr;gap:0}}
.colL{position:sticky;top:96px;max-height:calc(100vh - 110px);overflow:auto;padding-right:6px}@media(max-width:960px){.colL{position:static;max-height:none}}
.law{border-bottom:1px solid var(--line);padding:12px 0}.law-detail pre{max-height:260px;overflow:auto;background:var(--tile-a);padding:10px;margin-top:8px;font-size:13.5px}
.checks{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:2px 16px;margin-bottom:12px}
.thumbs{display:flex;gap:14px;flex-wrap:wrap;margin-top:14px}.thumb{width:140px;font-size:13px}.thumb img{width:140px;height:105px;object-fit:cover;display:block;margin-bottom:4px}
.rowx{display:grid;gap:6px;grid-template-columns:1fr;border:1px solid var(--line);padding:12px;margin-bottom:10px}.rowx a{font-size:13px}
iframe{width:100%;height:520px;border:1px solid var(--line);background:#fff}

/* document paper (always white, like the printed page) */
.paper{background:#fff;color:#111;font:16px/1.65 Georgia,'Times New Roman',serif;width:100%}
textarea.paper{padding:44px 52px;border:1px solid var(--line2);box-shadow:0 1px 8px rgba(0,0,0,.12);margin:0}
.page{padding:52px;min-height:600px;border:1px solid var(--line2);box-shadow:0 1px 8px rgba(0,0,0,.12);position:relative}.page h1{font:700 21px Georgia,serif;text-align:center;color:#111;letter-spacing:0;margin:10px 0}.page h2{font:700 17px Georgia,serif;text-transform:none;letter-spacing:0;margin:16px 0 4px;color:#111}
.page .lh{text-align:center;border-bottom:1px solid #999;padding-bottom:8px;margin-bottom:14px}.page .lh b{font-size:19px}.stamp{position:absolute;top:12px;right:16px;color:#b32020;font:700 11px system-ui;letter-spacing:.05em}
.sigblk{margin-top:28px}.sigblk img{max-width:250px;max-height:95px;display:block}.sigblk .typed{font:italic 28px Georgia,serif}.sigblk .gap{height:38px}
.pad{width:100%;max-width:700px;height:auto;aspect-ratio:700/220;background:#fff;border:1px dashed #888;touch-action:none;cursor:crosshair;display:block}.padwrap{margin-bottom:10px}
.sigprev{background:#fff;padding:12px;border:1px solid var(--line);display:inline-block;margin-bottom:8px}.sigprev img{max-width:300px;display:block}
.tools{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}.tools .btn{padding:6px 14px;font-size:13px}
.pbody{outline:none;min-height:360px;cursor:text}.pbody:focus{box-shadow:0 0 0 1px var(--accent) inset}.pbody p{margin:0 0 .9em}.pbody ul{margin:0 0 .9em;padding-left:22px}
.page .lh,.page .stamp,.page .sigblk{user-select:none}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}.chip{border:1px solid var(--ink);padding:5px 12px;font-size:13px}.chip:hover{background:var(--ink);color:var(--bg)}
details.cov summary{cursor:pointer;font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:500;padding-bottom:11px;border-bottom:1px solid var(--ink);margin-bottom:14px}

/* documents */
.drop{border:1px dashed var(--line2);padding:22px;text-align:center;color:var(--muted);margin-bottom:12px}.drop.on{border-color:var(--accent);background:var(--tile-a)}
.lnk{color:var(--accent);cursor:pointer;text-decoration:underline;text-underline-offset:3px;display:inline;font-size:inherit;letter-spacing:0;text-transform:none;font-weight:400;margin:0}
.frow{border-bottom:1px solid var(--line);padding:11px 0}.facts{display:flex;gap:18px;flex-wrap:wrap;font-size:13px;margin-top:4px;align-items:center}.facts .chk{margin:0;font-size:13px}
.pill.bad{border-color:var(--bad);color:var(--bad)}.small{font-size:12px}
/* modal */
.overlay{position:fixed;inset:0;background:rgba(10,14,22,.55);z-index:30;display:grid;place-items:center;padding:20px}
.modal{background:var(--bg);color:var(--ink);border:1px solid var(--ink);width:min(820px,100%);max-height:88vh;display:flex;flex-direction:column}
.mhead{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border-bottom:1px solid var(--ink);gap:14px}.mhead h2{margin:0}
.x{font-size:24px;line-height:1;color:var(--muted);padding:0 6px}.x:hover{color:var(--strong)}.mbody{padding:18px;overflow:auto}.mbody h3{margin:16px 0 4px;font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
/* chat bubble */
.bubble{position:fixed;right:22px;bottom:76px;z-index:20;display:flex;align-items:center;gap:10px;background:var(--blue);color:#fff;border-radius:5px;padding:13px 20px 13px 16px;font-size:14px;box-shadow:0 4px 18px rgba(0,0,0,.28)}
.bubble svg{width:20px;height:20px}.bubble:hover{background:var(--navy)}
.chat{position:fixed;right:22px;bottom:138px;z-index:20;width:min(460px,calc(100vw - 24px));height:min(640px,calc(100vh - 180px));background:var(--bg);color:var(--ink);border:1px solid var(--ink);display:flex;flex-direction:column;box-shadow:0 8px 30px rgba(0,0,0,.3)}
.chat .msgs{flex:1;overflow:auto;padding:14px 16px;display:flex;flex-direction:column;gap:12px}.msg{max-width:92%}.msg.user{align-self:flex-end}
.msg .mtext{padding:10px 13px;white-space:pre-wrap;overflow-wrap:anywhere;font-size:14.5px}.msg.user .mtext{background:var(--blue);color:#fff}.msg.ai .mtext{background:var(--tile-a);color:var(--strong)}
.srcs{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}.src{font-size:12px;border:1px solid var(--line2);padding:3px 8px;cursor:pointer;text-decoration:none;color:var(--ink);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.src:hover{border-color:var(--accent);color:var(--accent)}
.cin{display:flex;gap:8px;padding:10px 12px;border-top:1px solid var(--line);align-items:flex-end}.cin textarea{margin:0;min-height:0;flex:1;resize:none}.chat>.mute{padding:0 14px 8px}
@media(max-width:560px){.bubble span{display:none}.bubble{padding:14px}.chat{right:8px;bottom:132px}}

/* bottom bar */
.dock{position:fixed;left:0;right:0;bottom:0;z-index:15;height:56px;background:var(--bg);border-top:1px solid var(--ink);display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 22px}
.dnotes{display:flex;align-items:center;gap:10px;min-width:0;overflow:hidden;font-size:13px}
.dact{display:flex;gap:8px;align-items:center;flex-shrink:0}
.dact .btn{padding:8px 14px;font-size:13px;margin:0}
.nchip{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line2);padding:6px 11px;color:var(--ink);cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:260px;font-size:13px}
.nchip:hover{border-color:var(--accent);color:var(--accent)}
.nchip i{width:8px;height:8px;border-radius:50%;background:var(--accent);flex-shrink:0}.nchip.warn i{background:var(--bad)}
.nmore{cursor:pointer;color:var(--accent);white-space:nowrap}
.act{border:1px solid var(--line2);padding:10px 12px;margin-top:8px;display:flex;flex-direction:column;gap:6px;background:var(--bg);color:var(--ink)}
.act .btn{padding:6px 14px;font-size:13px}
.ctx{padding:6px 16px;font-size:12px;color:var(--muted);border-bottom:1px solid var(--line)}
@media(max-width:760px){.dock{padding:0 10px;gap:8px}.dnotes .nchip:nth-child(n+2){display:none}.dact{padding-right:0}.dact .btn:nth-child(n+3){display:none}.nchip{max-width:150px}}


/* ---------- the layout of the reference: a dark notification bar, a quiet header, a big two-tone heading, a list beside cards ---------- */
:root{--serif:"Newsreader NF","Newsreader",Georgia,"Times New Roman",serif;--page:#f8f9fc;--card:#fff;--ab:64px}
:root[data-theme=dark]{--page:#090d14;--card:#0f151f}
@media(prefers-color-scheme:dark){:root:not([data-theme]){--page:#090d14;--card:#0f151f}}
body{background:var(--page)}
body.has-dock{--ab:44px}
.top{display:block;padding:0;border:0;position:sticky;top:calc(var(--ab) * -1);z-index:7;background:var(--page)}
.alertbar{display:flex;align-items:center;gap:20px;height:var(--ab);padding:0 3.2vw;background:linear-gradient(180deg,#161528 0%,#25253f 100%);color:#fff;font-size:14.5px;overflow:hidden}
.abdate{font-size:13px;opacity:.72;white-space:nowrap;min-width:150px}
.abmsg{flex:1;display:flex;align-items:center;justify-content:center;gap:14px;min-width:0}
.abtext{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.abdot{width:8px;height:8px;border-radius:50%;background:#8aa4ff;flex:none}.abdot.warn{background:#ff8577}.abdot.msg{background:#5be3a1}
.abpill{flex:none;background:rgba(255,255,255,.14);color:#fff;border-radius:5px;padding:8px 16px;font-size:14px;white-space:nowrap}.abpill:hover{background:rgba(255,255,255,.26)}
.abright{display:flex;align-items:center;gap:4px;font-size:13px;min-width:150px;justify-content:flex-end;color:#fff}
.abcount{opacity:.72;font-variant-numeric:tabular-nums;padding:0 4px}
.abstep{color:#fff;opacity:.8;padding:2px 8px;font-size:18px;line-height:1;border-radius:5px}.abstep:hover{opacity:1;background:rgba(255,255,255,.14)}.abstep.all{font-size:13px;margin-left:4px;border:1px solid rgba(255,255,255,.3);border-radius:5px;padding:4px 12px}
.hdr{display:flex;align-items:center;gap:2.4vw;padding:20px 3.2vw;background:var(--page)}
.brand{display:inline-flex;align-items:center;gap:10px;font:500 21px/1 var(--font);font-stretch:100%;letter-spacing:-.01em;text-transform:none;padding:0;color:var(--strong)}
.logo{width:26px;height:26px;fill:none;stroke:var(--strong);stroke-width:2.6}
.top nav.main{flex:1;justify-content:center;gap:clamp(18px,3vw,42px)}
.top nav.main button{font-size:15px;letter-spacing:0;text-transform:none;font-weight:400;padding:6px 0;opacity:1;color:var(--strong);border-bottom:2px solid transparent}
.top nav.main button:hover{color:var(--blue)}.top nav.main button.on{color:var(--strong);border-bottom-color:var(--blue)}
.top-right{padding:0;margin-left:0}
.acct summary{border-radius:5px;text-transform:none;letter-spacing:0;font-size:14px;padding:8px 18px}
.theme{border-radius:5px;overflow:hidden}
.subnav{flex-basis:auto;border:0;padding:0 3.2vw 14px;background:var(--page)}
main.shell{max-width:1240px;padding:3vh 3.2vw 90px}
main:has(.cols){max-width:1500px}
.page-hero{text-align:center;max-width:920px;margin:34px auto 58px}
.page-hero h1{font:400 clamp(40px,5.6vw,76px)/1.04 var(--serif);font-stretch:100%;letter-spacing:-.025em;color:var(--strong);margin:0 0 22px}
.page-hero h1 .two{display:block;color:#6b7280}
:root[data-theme=dark] .page-hero h1 .two{color:#8d939b}
.lede{font-size:clamp(16px,1.5vw,20px);line-height:1.55;color:var(--ink);max-width:700px;margin:0 auto}
.hero-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:28px}
.hero-actions .btn{border-radius:5px;padding:11px 24px;font-size:15px}
.page-actions{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:22px}.page-actions .btn{border-radius:5px;padding:9px 20px}
.layout{display:grid;grid-template-columns:230px minmax(0,1fr);gap:clamp(28px,5vw,84px);align-items:start}
.side{display:flex;flex-direction:column;border-right:1px solid var(--line2);position:sticky;top:calc(var(--ab) + 96px)}
.side button{text-align:left;font-size:19px;color:var(--muted);padding:13px 28px 13px 0;position:relative}
.side button:hover{color:var(--strong)}.side button.on{color:var(--blue)}
.side button.on::after{content:"";position:absolute;right:-1px;top:9px;bottom:9px;width:2px;background:var(--blue)}
.content{min-width:0}
.btn{border-radius:5px}
.card{background:var(--card);border:1px solid var(--line);border-radius:5px;padding:24px 26px;margin:0 0 20px}
.card>h2:first-child{border:0;padding:0;margin:0 0 14px;font-size:13px;letter-spacing:.14em}
.stats{border:1px solid var(--line);border-radius:5px;background:var(--card);margin-bottom:28px}.stats a{border-right-color:var(--line)}
.bubble{bottom:22px}.chat{bottom:84px}
body.has-dock .bubble{bottom:76px}body.has-dock .chat{bottom:138px}
@media(max-width:900px){
  .layout{grid-template-columns:1fr;gap:18px}
  .side{flex-direction:row;overflow-x:auto;border-right:0;border-bottom:1px solid var(--line2);position:static}
  .side button{padding:10px 20px 12px 0;font-size:16px;white-space:nowrap}.side button.on::after{display:none}
  .alertbar{gap:10px;padding:0 14px;font-size:13px}.abdate,.abright .abcount{display:none}.abright{min-width:0}.abmsg{justify-content:flex-start}
  .hdr{flex-wrap:wrap;gap:12px 14px;padding:14px}.top nav.main{order:3;flex-basis:100%;justify-content:space-between}
  .page-hero{margin:18px auto 34px}
}

/* one corner radius for everything that has an edge: boxes a little rounder than controls */
:root{--r:5px;--r-s:5px}
.card,.stats,.modal,.chat,.act,.drop,.notice,.pad,.sigprev,.rowx,.steps,.acct .menu,textarea,textarea.paper,.msg .mtext,.tabs,.wb-snip{border-radius:5px}
.acct .menu,.modal,.stats{overflow:hidden}
.btn,.hero-actions .btn,.page-actions .btn,.abpill,.acct summary,.theme,.pill,.nchip,.src,.abstep.all,.linkbtn,.chip,.wb-pill,.wb-seg,.wb-tile,.dock .btn,.wb-drawer .btn{border-radius:5px}
.theme,.wb-seg{overflow:hidden}
.bubble{border-radius:5px}
.wb-stage{border-radius:5px;overflow:hidden}.wb-tile img{border-radius:5px}
.page{border-radius:5px}
.pagehead{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:0 0 22px}
.pagehead h1{margin:0;font-size:clamp(26px,2.5vw,36px)}
.pagehead .page-actions{margin:0}
.content>h1,main.shell>h1{font-size:clamp(26px,2.5vw,36px);margin:0 0 22px}

/* ---------- the clock and its drop-down, far right of the top bar ---------- */
.tmenu{position:relative}
.tbtn{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 11px;border:1px solid var(--line2);border-radius:5px;color:var(--ink);background:var(--bg)}
.tbtn:hover,.tbtn[aria-expanded=true]{border-color:var(--ink)}
.tbtn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}
.tbtn.on{border-color:var(--blue);color:var(--blue)}.tclock{font-variant-numeric:tabular-nums;font-size:14px;font-weight:500;color:var(--strong)}
.tpanel{position:absolute;right:0;top:calc(100% + 10px);width:min(350px,92vw);z-index:12;background:var(--bg);border:1px solid var(--line2);border-radius:5px;padding:18px 18px 16px;box-shadow:0 16px 44px rgba(20,30,60,.18)}
.tpanel h3{font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:500;margin:0 0 12px;color:var(--ink)}
.tlab{display:block;font-size:12px;color:var(--muted);margin-bottom:2px}.tlab select,.tlab input,.tpanel select,.tpanel input{margin:2px 0 12px;font-size:15px}
.tpanel select{background:var(--bg)}
.tbig{font:300 44px/1 var(--display);font-variant-numeric:tabular-nums;color:var(--strong);margin:2px 0 12px}
.tinfo{margin:0 0 14px;font-size:15px;line-height:1.5}
.tstats{display:inline-grid;margin-bottom:18px}
.small{font-size:12.5px}

/* ---------- Research: a chat window with its options on the left ---------- */
main.shell.chatmode{max-width:1500px;padding-top:2vh}
.research{display:grid;grid-template-columns:330px minmax(0,1fr);min-height:calc(100vh - 210px);background:var(--card);border:1px solid var(--line);border-radius:5px;overflow:hidden}
.rside{border-right:1px solid var(--line);padding:18px;display:flex;flex-direction:column;gap:6px;background:var(--page);overflow-y:auto;max-height:calc(100vh - 150px);position:sticky;top:calc(var(--ab) * -1 + 84px)}
.rnew{width:100%;margin:0 0 8px;padding:11px}
.rsec{padding:14px 0 6px;border-top:1px solid var(--line)}.rsec h3{font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:500;margin:0 0 10px;color:var(--ink)}
.rsec .chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}.rsec .chip{padding:5px 10px;font-size:13px;border:1px solid var(--line2);background:var(--bg)}
.rsec select{margin:2px 0 10px;font-size:14px;background:var(--page)}
.rsec .btn{padding:8px 16px;font-size:14px}
.rsec details>summary{cursor:pointer;font-size:14px;color:var(--ink)}.rsec table{font-size:12.5px;margin-top:8px}
.rsec input[type=file]{font-size:13px}
.rdoc{display:flex;justify-content:space-between;gap:10px;font-size:13px;padding:5px 0;border-bottom:1px solid var(--line)}.rdoc span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rmain{display:flex;flex-direction:column;min-width:0;position:relative}
.rmsgs{flex:1;padding:34px clamp(16px,5vw,72px) 20px;display:flex;flex-direction:column;gap:26px;width:100%;max-width:920px;margin:0 auto}
.rempty{margin:8vh auto 0;max-width:640px;text-align:center}.rtitle{font:400 clamp(30px,3.4vw,46px)/1.1 var(--serif);text-transform:none;letter-spacing:-.02em;color:var(--strong);margin:0 0 12px}
.rex{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:26px;text-align:left}
.rexbtn{border:1px solid var(--line2);border-radius:5px;padding:14px 16px;font-size:14.5px;line-height:1.45;text-align:left;color:var(--ink);background:var(--bg)}.rexbtn:hover{border-color:var(--blue);color:var(--blue)}
.rmsg{max-width:100%}.rmsg.user{align-self:flex-end;max-width:80%}
.rmsg.user .rtext{background:var(--tile-a);border-radius:5px;padding:12px 16px;white-space:pre-wrap;overflow-wrap:anywhere}
.rmsg.ai .rtext{line-height:1.7;font-size:16px;white-space:pre-wrap;overflow-wrap:anywhere;color:var(--strong)}
.cite{display:inline-block;font-size:11px;font-weight:500;padding:0 6px;margin:0 2px;border-radius:5px;background:var(--tile-a);color:var(--blue);vertical-align:2px;text-decoration:none;cursor:pointer}.cite:hover{background:var(--blue);color:#fff}
.rhead{font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:500;margin:20px 0 10px;color:var(--ink)}
.rsrcs{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px}
.rsrc{display:flex;flex-direction:column;gap:3px;border:1px solid var(--line);border-radius:5px;padding:11px 13px;text-decoration:none;cursor:pointer;background:var(--bg)}.rsrc:hover{border-color:var(--blue)}
.rsrc.used{border-color:var(--line2)}.rsrc .rl{font-size:11px;font-weight:500;color:var(--blue)}.rsrc b{font-weight:500;color:var(--strong);font-size:14px}.rsrc small{color:var(--muted);font-size:12.5px;line-height:1.4}
.rcompose{position:sticky;bottom:0;padding:12px clamp(16px,5vw,72px) 18px;background:linear-gradient(rgba(255,255,255,0),var(--card) 28%);width:100%;max-width:920px;margin:0 auto}
:root[data-theme=dark] .rcompose{background:linear-gradient(rgba(15,21,31,0),var(--card) 28%)}
.rbox{display:flex;align-items:flex-end;gap:8px;border:1px solid var(--line2);border-radius:5px;padding:8px 8px 8px 16px;background:var(--bg);box-shadow:0 4px 20px rgba(20,30,60,.07)}
.rbox:focus-within{border-color:var(--blue)}
.rbox textarea{flex:1;border:0;margin:0;padding:8px 0;min-height:28px;max-height:200px;resize:none;background:transparent;border-radius:0;font-size:16px;overflow-y:auto}
.rsend{flex:none;width:40px;height:40px;border-radius:5px;background:var(--blue);color:#fff;display:grid;place-items:center}.rsend:hover{background:var(--navy)}.rsend:disabled{opacity:.45}
.rsend svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.rhint{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:8px 4px 0;font-size:12.5px;color:var(--muted)}.rtoggle{display:inline-flex;align-items:center;gap:6px;cursor:pointer;font-size:12.5px}
@media(max-width:900px){.research{grid-template-columns:1fr}.rside{position:static;max-height:none;border-right:0;border-bottom:1px solid var(--line)}.rex{grid-template-columns:1fr}}
.alertbar .abdot{display:inline-block;width:8px;height:8px;min-width:8px;padding:0;margin:0;border-radius:50%;flex:none;background:#8aa4ff}
.alertbar .abdot.warn{background:#ff8577}.alertbar .abdot.msg{background:#5be3a1}
.rbox textarea,.rbox textarea:focus{border:0;outline:0;box-shadow:none;background:transparent}
.rsec .cov summary{font-size:14px;letter-spacing:0;text-transform:none;font-weight:400;line-height:1.45;border:0;padding:0}
.rsec .cov{border:0;margin:0}
.rtoggle{text-transform:none;letter-spacing:0;font-weight:400;margin:0}
.rhint label{margin:0}
body.chatpage .bubble span{display:none}body.chatpage .bubble{padding:14px}


/* ================= refined, compact inner elements (the shell above is unchanged) ================= */
:root{--r:5px;--r-s:5px;--fill:#f1f3f6;--ab:52px}
:root[data-theme=dark]{--fill:#1b2330}
@media(prefers-color-scheme:dark){:root:not([data-theme]){--fill:#1b2330}}
body{font:400 14px/1.5 var(--font);letter-spacing:-.003em}
.hdr{padding:12px 28px}.alertbar{padding:0 28px}
main.shell{max-width:1680px;padding:16px 28px 56px}
h1{font:600 22px/1.2 var(--font);font-stretch:100%;letter-spacing:-.02em;color:var(--strong);margin:0 0 6px}
h2{font-size:13px;letter-spacing:0;text-transform:none;font-weight:600;color:var(--strong)}
h3{font-size:13.5px;font-weight:600;letter-spacing:0;text-transform:none}
.mute{font-size:13px;margin-bottom:.4em}p{margin-bottom:.45em}
label{font-size:12px;letter-spacing:0;text-transform:none;font-weight:500;color:var(--muted);margin-top:2px}
label.chk{font-size:14px;font-weight:400;margin:4px 0}
input,select,textarea{font:400 14px/1.4 var(--font);color:var(--strong);background:var(--fill);border:1px solid transparent;border-radius:5px;padding:6px 10px;margin:3px 0 9px}
textarea{min-height:68px;line-height:1.5}
select{background:var(--fill);padding-right:6px}
input:focus,select:focus,textarea:focus{border-color:var(--accent);background:var(--bg);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 20%,transparent)}
input[type=file]{background:none;padding:3px 0;font-size:13px;border:0}input[type=file]:focus{box-shadow:none;background:none}
input[type=checkbox]{padding:0;box-shadow:none}
.btn{height:30px;padding:0 13px;font-size:13px;font-weight:500;line-height:1;border:0;border-radius:5px;background:var(--blue);color:#fff;margin:0;display:inline-flex;align-items:center;justify-content:center}
.btn:hover{background:#1639ad}:root[data-theme=dark] .btn:hover{background:#6f8cf5;color:#0d121a}
.btn.alt{background:var(--fill);color:var(--strong)}.btn.alt:hover{background:color-mix(in srgb,var(--fill) 78%,var(--ink) 22%);color:var(--strong)}
.btn.bad{background:color-mix(in srgb,var(--bad) 11%,transparent);color:var(--bad)}.btn.bad:hover{background:var(--bad);color:#fff}
.btn:disabled{opacity:.4}
.hero-actions .btn,.page-actions .btn,.dock .btn,.wb-drawer .btn{height:30px;padding:0 13px;font-size:13px;border-radius:5px}
.card{padding:14px 16px;margin:0 0 12px;border-radius:5px}
.card>h2:first-child{margin:0 0 8px;padding:0;border:0}
details.fold{padding:0}details.fold>summary{cursor:pointer;list-style:none;padding:11px 16px;font-size:13px;font-weight:600;color:var(--strong);border-radius:5px}
details.fold>summary::-webkit-details-marker{display:none}details.fold>summary:hover{background:var(--fill)}
details.fold[open]>summary{border-bottom:1px solid var(--line);border-bottom-left-radius:0;border-bottom-right-radius:0;margin-bottom:12px}details.fold>*:not(summary){margin-left:16px;margin-right:16px}details.fold>*:last-child{margin-bottom:14px}
.stats{border-radius:5px;margin-bottom:12px;border-color:var(--line)}.stats a{padding:8px 18px;min-width:0}
.stats small{font-size:11px;letter-spacing:0;text-transform:none;font-weight:500;color:var(--muted);margin-bottom:2px}.stats b{font:600 20px/1.15 var(--font);font-stretch:100%}
table{font-size:13.5px}
th{font-size:12px;letter-spacing:0;text-transform:none;font-weight:500;color:var(--muted);padding:5px 12px 6px 0;border-bottom:1px solid var(--line)}
td{padding:8px 12px 8px 0;border-bottom:1px solid var(--line);vertical-align:middle}tr:last-child td{border-bottom:0}
tr:hover td{background:transparent}
.pill{font-size:11px;letter-spacing:0;text-transform:none;font-weight:500;padding:2px 8px;border:0;border-radius:5px;background:var(--fill);color:var(--ink)}.pill.bad{background:color-mix(in srgb,var(--bad) 12%,transparent);color:var(--bad)}
.notice{border:0;border-radius:5px;background:color-mix(in srgb,var(--accent) 10%,transparent);padding:8px 12px;font-size:13px;margin:0 0 10px}
.steps{border:0;background:var(--fill);border-radius:5px;padding:3px;gap:2px;margin-bottom:14px}
.step{padding:5px 14px;font-size:13px;letter-spacing:0;text-transform:none;font-weight:500;border:0;border-radius:5px}.step.on{background:var(--bg);color:var(--strong);box-shadow:0 1px 3px rgba(20,30,60,.14)}
.chip{padding:3px 10px;font-size:12.5px;border:0;background:var(--fill);border-radius:5px}
.row{gap:12px}.row>*{min-width:140px}
.drop{padding:14px}
/* the second level of a section: a slim list beside the page */
.layout{grid-template-columns:168px minmax(0,1fr);gap:24px}
.side{border-right:0;top:calc(var(--ab) + 62px)}
.side button{font-size:14px;padding:6px 12px;margin-bottom:1px;border-radius:5px;color:var(--ink)}
.side button:hover{background:var(--fill)}.side button.on{color:var(--blue);background:var(--fill);font-weight:500}.side button.on::after{display:none}
.pagehead{margin:0 0 12px}.pagehead h1,.content>h1,main.shell>h1{font-size:22px;margin:0}.content>h1,main.shell>h1{margin-bottom:10px}
.page-actions{margin:0}
.subnav{padding:0 28px 10px}.subnav button{font-size:13px}
/* Home */
.page-hero{text-align:left;margin:2px 0 12px;max-width:none}
.page-hero h1{font:600 24px/1.2 var(--font);letter-spacing:-.02em;margin:0 0 2px}.page-hero h1 .two{display:inline;color:var(--muted);font-weight:500}
.lede{font-size:13.5px;color:var(--muted);margin:0;max-width:none}.hero-actions{justify-content:flex-start;margin-top:10px}
.dgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(380px,1fr));gap:12px}.dgrid .card{margin:0}
/* a client: time and cases on the left, details on the right */
.cgrid{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:12px;align-items:start}.stackc{display:flex;flex-direction:column;gap:12px;min-width:0}.stackc .card{margin:0}
.tstats{display:inline-grid;margin-bottom:12px}
/* long forms use the width */
.masonry{column-count:2;column-gap:12px}.masonry>*{break-inside:avoid}.masonry>h1,.masonry>.pagehead,.masonry>.notice,.masonry>p{column-span:all}
.masonry>.card{display:inline-block;width:100%}
@media(max-width:1100px){.masonry{column-count:1}.cgrid{grid-template-columns:1fr}}
/* case workspace */
.cols{gap:20px;grid-template-columns:minmax(300px,4fr) minmax(0,6fr)}.colL{top:70px;max-height:calc(100vh - 90px)}
/* Research */
main.shell.chatmode{padding-top:12px}
.research{grid-template-columns:250px minmax(0,1fr);min-height:calc(100vh - 150px);border-radius:5px}
.rside{padding:12px;gap:0;max-height:calc(100vh - 100px);top:calc(var(--ab) * -1 + 66px)}
.rnew{height:32px;margin:0 0 6px;padding:0;border:0;background:var(--blue);color:#fff;font-size:13px}.rnew:hover{background:#1639ad;color:#fff}
.rsec{padding:10px 0 4px}.rsec h3{font-size:12px;letter-spacing:0;text-transform:none;font-weight:600;margin:0 0 6px;color:var(--strong)}
.rsec select{margin:2px 0 8px;font-size:13px}.rsec .btn{height:28px;font-size:12.5px}
.rsec .mute,.rsec .small{font-size:12px}.rdoc{font-size:12.5px;padding:4px 0}
.rmsgs{padding:20px clamp(14px,3vw,40px) 10px;gap:16px;max-width:900px}
.rempty{margin:6vh auto 0}.rtitle{font-size:clamp(24px,2.4vw,30px)}
.rex{gap:8px;margin-top:16px}.rexbtn{padding:9px 12px;font-size:13px;border-radius:5px}
.rmsg.ai .rtext{font-size:14.5px;line-height:1.6}.rmsg.user .rtext{border-radius:5px;padding:9px 13px;background:var(--fill)}
.rsrcs{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px}.rsrc{padding:8px 11px;border-radius:5px}.rsrc b{font-size:13px}.rsrc small{font-size:12px}
.rhead{font-size:12px;letter-spacing:0;text-transform:none;font-weight:600;margin:14px 0 8px;color:var(--strong)}
.rcompose{padding:8px clamp(14px,3vw,40px) 12px}
.rbox{padding:4px 4px 4px 12px;border-radius:5px;box-shadow:0 2px 12px rgba(20,30,60,.06)}.rbox textarea{font-size:14.5px;padding:6px 0;min-height:24px}
.rsend{width:30px;height:30px;border-radius:5px}.rsend svg{width:17px;height:17px}.rhint{margin:6px 2px 0;font-size:12px}.rtoggle{font-size:12px}
/* timer, assistant, drop-downs */
.tpanel{padding:14px;width:min(320px,92vw)}.tpanel h3{font-size:12px;letter-spacing:0;text-transform:none;margin-bottom:8px}.tbig{font:600 34px/1 var(--font);margin:0 0 8px}
.tlab{margin:0}.tpanel select,.tpanel input{margin:2px 0 8px}
.chat{width:min(400px,calc(100vw - 24px));height:min(580px,calc(100vh - 150px))}
.cin textarea{min-height:0}.msg .mtext{font-size:14px}
.bubble{padding:10px 16px 10px 13px;font-size:13px}.bubble svg{width:18px;height:18px}
.mhead h2{font-size:13px}
.modal{border-radius:5px}.mbody{padding:16px}
@media(max-width:900px){.layout{grid-template-columns:1fr}.side{flex-direction:row;overflow-x:auto}.side button{white-space:nowrap}}
.card>h2:first-child,.card h2{letter-spacing:0}
h1,.page-hero h1{letter-spacing:-.012em;font-weight:600}

/* ---- polish pass: fewer boxes, one control style, a sans heading ---- */
.filein{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none;margin:0;padding:0}
.pickrow{display:flex;align-items:center;gap:8px;margin:2px 0 8px;position:relative}.pickbtn{cursor:pointer;height:28px;font-size:12.5px;margin:0}
.research{border:0;background:transparent;border-radius:0;grid-template-columns:240px minmax(0,1fr);gap:20px;min-height:calc(100vh - 140px);overflow:visible}
.rside{border:0;background:var(--fill);border-radius:5px;padding:12px;max-height:calc(100vh - 110px)}
.rmain{background:var(--card);border:1px solid var(--line);border-radius:5px}
.rnew{background:var(--bg);color:var(--strong);border:1px solid var(--line);font-weight:500}.rnew:hover{background:var(--bg);border-color:var(--line2);color:var(--strong)}
.rsec{border-top:0;padding:12px 0 2px}
.rsec .chips{gap:6px}.rsec .chip{background:var(--bg);border:1px solid var(--line);padding:3px 10px;font-size:12.5px}
.rsec select{background:var(--bg)}
.rtitle{font:600 clamp(24px,2.2vw,30px)/1.2 var(--font);letter-spacing:-.015em;margin:0 0 6px}
.rmain.empty{justify-content:center}.rmain.empty .rmsgs{flex:0 1 auto;padding-bottom:0}.rmain.empty .rempty{margin:0 auto;max-width:700px;width:100%}
.rempty .rcompose{position:static;padding:18px 0 6px;max-width:none;background:none}
.rex{grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}
.rexbtn{border:0;background:var(--fill);border-radius:5px;padding:9px 12px;font-size:12.5px;color:var(--ink)}.rexbtn:hover{background:color-mix(in srgb,var(--fill) 75%,var(--ink) 25%);color:var(--strong)}
.rsrc{border:0;background:var(--fill)}.rsrc:hover{background:color-mix(in srgb,var(--fill) 80%,var(--ink) 20%)}
.rbox{border:1px solid var(--line2);box-shadow:none}
.card{border-color:var(--line)}
.dgrid .card,.stackc .card{box-shadow:none}

/* ---- Research is an app window: the page stays put, only the conversation (and the options list) scroll ---- */
body.chatpage{overflow:hidden;height:100vh}
body.chatpage #app{height:100vh;display:flex;flex-direction:column;overflow:hidden}
body.chatpage .top{position:static;flex:none}
body.chatpage main.shell.chatmode{flex:1;min-height:0;display:flex;padding:12px 28px 16px;max-width:none;width:100%}
body.chatpage .research{flex:1;min-height:0;height:100%;width:100%;max-width:1680px;margin:0 auto}
body.chatpage .rside{position:static;max-height:none;height:100%;overflow-y:auto}
body.chatpage .rmain{min-height:0;height:100%;overflow:hidden}
body.chatpage .rmsgs{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain}
body.chatpage .rmain.empty .rmsgs{flex:0 1 auto}
body.chatpage .rcompose{position:static;flex:none}
body.chatpage .rempty .rcompose{padding-top:18px}
.rside .btn.alt{background:var(--bg);border:1px solid var(--line);color:var(--strong)}.rside .btn.alt:hover{border-color:var(--line2);background:var(--bg)}
.rside .pickrow .mute{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:110px}


/* ================= flat, hairline style (after Lumyn): sections are divided by rules, not boxed in cards ================= */
:root{--page:#fff;--hair:rgba(51,51,51,.09);--line:rgba(51,51,51,.10);--line2:rgba(51,51,51,.17);--fill:rgba(51,51,51,.045)}
:root[data-theme=dark]{--page:#0b1018;--hair:rgba(255,255,255,.09);--line:rgba(255,255,255,.10);--line2:rgba(255,255,255,.2);--fill:rgba(255,255,255,.06)}
@media(prefers-color-scheme:dark){:root:not([data-theme]){--page:#0b1018;--hair:rgba(255,255,255,.09);--line:rgba(255,255,255,.10);--line2:rgba(255,255,255,.2);--fill:rgba(255,255,255,.06)}}
body,.hdr,.top,.subnav{background:var(--page)}
main.shell{max-width:1180px;padding:20px 28px 60px}
main.shell:has(.cols){max-width:1500px}
h1,.pagehead h1,.content>h1,main.shell>h1{font-size:22px;font-weight:600;letter-spacing:-.03em}
/* sections: a rule and a small label, nothing around them */
.card{background:none;border:0;border-radius:0;box-shadow:none;padding:16px 0 18px;margin:0;border-top:1px solid var(--hair)}
.content>.card:first-child,main.shell>.card:first-child,.dgrid>.card,.stackc>.card:first-child,.masonry>.card:first-child{border-top:0;padding-top:4px}
.stackc{gap:0}.dgrid,.cgrid{gap:36px}.dgrid .card{padding-top:4px}
.card>h2:first-child,.card h2{font-size:10px;letter-spacing:.18em;text-transform:uppercase;font-weight:600;color:var(--muted);margin:0 0 10px}
h3{font-size:13px;font-weight:600}
details.fold{border:0;border-top:1px solid var(--hair);border-radius:0;padding:0}
details.fold>summary{padding:12px 0;border-radius:0;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}details.fold>summary:hover{background:none;color:var(--strong)}
details.fold[open]>summary{border:0;margin-bottom:4px}details.fold>*:not(summary){margin-left:0;margin-right:0}
.stats{display:flex;gap:40px;border:0;background:none;border-radius:0;padding:2px 0 14px;overflow:visible;margin-bottom:6px}
.stats a{padding:0;border:0;min-width:0}.stats small{font-size:10px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;color:var(--muted);margin-bottom:4px}.stats b{font:500 24px/1.1 var(--font);letter-spacing:-.03em}
.tstats{display:flex;margin-bottom:10px}
.notice{background:none;border:0;border-left:2px solid var(--accent);border-radius:0;padding:2px 10px;font-size:13px}
/* lists and tables */
table{font-size:13px}
th{font-size:10px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--muted);padding:4px 12px 8px 0;border-bottom:1px solid var(--hair)}
td{padding:10px 12px 10px 0;border-bottom:1px solid var(--hair)}tr:last-child td{border-bottom:0}
.pill{background:none;border:1px solid var(--line);border-radius:5px;font-size:10.5px;padding:1px 8px;color:var(--muted)}.pill.bad{background:none;border-color:var(--bad);color:var(--bad)}
.chip{background:none;border:1px solid var(--line2);border-radius:5px;color:var(--ink)}
/* controls: hairline inputs, outline buttons */
input,select,textarea{background:transparent;border:1px solid var(--line2);border-radius:5px;padding:7px 10px}
input:focus,select:focus,textarea:focus{background:transparent;border-color:var(--strong);box-shadow:none}
select{background:transparent}
.btn{border-radius:5px;height:30px}
.btn.alt{background:transparent;border:1px solid var(--line2);color:var(--strong)}.btn.alt:hover{background:var(--fill);color:var(--strong)}
.btn.bad{background:transparent;border:1px solid var(--bad);color:var(--bad)}.btn.bad:hover{background:var(--bad);color:#fff}
.page-actions .btn.alt,.hero-actions .btn.alt{background:transparent}
.steps{background:none;border:1px solid var(--line2);border-radius:5px;padding:0;gap:0;overflow:hidden}
.step{border-radius:0;border-right:1px solid var(--line);padding:5px 14px;font-size:12.5px}.step:last-child{border-right:0}.step.on{background:var(--ink);color:var(--bg);box-shadow:none}
.side button.on{background:none;color:var(--strong);font-weight:600}.side button:hover{background:none;color:var(--strong)}
.side{border-right:1px solid var(--hair)}.layout{grid-template-columns:150px minmax(0,1fr);gap:32px}
.side button.on::after{display:block;content:"";position:absolute;right:-1px;top:6px;bottom:6px;width:2px;background:var(--strong)}
/* Research: one open surface, hairlines only */
.research{gap:28px;grid-template-columns:220px minmax(0,1fr)}
.rside{background:none;border-radius:0;border-right:1px solid var(--hair);padding:0 18px 0 0}
.rmain{background:none;border:0;border-radius:0}
.rnew{border:1px solid var(--line2);background:transparent;color:var(--strong)}
.rside .btn.alt{background:transparent;border:1px solid var(--line2)}.rside .btn.alt:hover{background:var(--fill)}
.rsec{border-top:1px solid var(--hair);padding:14px 0 6px;margin-top:10px}.rsec:first-of-type{border-top:0}
.rsec h3{font-size:10px;letter-spacing:.18em;text-transform:uppercase;font-weight:600;color:var(--muted)}
.rsec .chip{background:none;border:1px solid var(--line2)}.rsec select{background:transparent}
.rex{display:block;border-top:1px solid var(--hair);margin-top:14px}
.rexbtn{display:block;width:100%;background:none;border:0;border-bottom:1px solid var(--hair);border-radius:0;padding:11px 2px;font-size:13px;color:var(--ink)}.rexbtn:hover{background:none;color:var(--blue)}
.rsrcs{display:block;border-top:1px solid var(--hair)}
.rsrc{display:flex;align-items:baseline;gap:10px;background:none;border:0;border-bottom:1px solid var(--hair);border-radius:0;padding:9px 0}.rsrc:hover{background:none}
.rsrc .rl{flex:none}.rsrc small{margin-left:auto;text-align:right;max-width:55%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rhead{font-size:10px;letter-spacing:.18em;text-transform:uppercase;font-weight:600;color:var(--muted)}
.rbox{border-radius:5px;border:1px solid var(--line2);box-shadow:none;background:transparent}
.rmsg.user .rtext{background:var(--fill)}
.tpanel,.chat,.modal,.acct .menu{background:var(--bg)}
.rsrc{flex-direction:row}.rsrc b{font-size:13px}
/* top notification bar: 10% shorter and darker */
:root{--ab:47px}body.has-dock{--ab:40px}
.alertbar{background:linear-gradient(180deg,#0a0912 0%,#15152a 100%);font-size:14px}
.abpill{padding:6px 14px;font-size:13.5px}

/* ---- Research: filters on the left, conversation in the middle, documents on the right; type sized like Claude Code ---- */
.research{grid-template-columns:268px minmax(0,1fr) 288px;gap:0;font-size:14.5px}
.rside{padding:0 14px 0 0;border-right:1px solid var(--hair);gap:0}
.rright{padding:0 0 0 20px;border-left:1px solid var(--hair);overflow-y:auto;min-height:0}
.rhd{font-size:13px;letter-spacing:0;text-transform:none;font-weight:500;color:var(--muted);margin:20px 0 6px;padding:0 8px}.rhd.first{margin-top:4px}
.rnavitem{display:flex;align-items:center;gap:10px;width:100%;padding:8px 10px;border-radius:5px;font-size:14.5px;color:var(--strong);text-align:left}.rnavitem:hover{background:var(--fill)}
.rnavitem svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.rrow{display:flex;align-items:center;gap:9px;padding:6px 8px;border-radius:5px;font-size:14.5px;line-height:1.35;cursor:pointer;text-transform:none;letter-spacing:0;font-weight:400;color:var(--strong);margin:0}
.rrow:hover{background:var(--fill)}.rrow.plain{cursor:default;padding-left:32px;color:var(--ink)}
.rrow input[type=checkbox]{margin:0;width:15px;height:15px;flex:none;padding:0}
.rrow .t{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rrow .x{opacity:0;color:var(--muted);font-size:17px;line-height:1;padding:0 3px}.rrow:hover .x{opacity:1}.rrow .x:hover{color:var(--bad)}
.rsub{margin:0 0 4px}.rsub select{margin:4px 8px 4px 32px;width:calc(100% - 40px);font-size:13.5px;padding:5px 8px}
.rlink{margin:0 0 2px 32px;padding:4px 8px;font-size:13px;color:var(--blue)}.rlink:hover{text-decoration:underline}
.rmuted{padding:4px 8px;font-size:13.5px;color:var(--muted)}.rsub .rmuted{padding-left:32px}
.rdrop{display:flex;flex-direction:column;gap:4px;border:1px dashed var(--line2);border-radius:5px;padding:16px 14px;cursor:pointer;text-transform:none;letter-spacing:0;font-weight:400;margin:0 0 8px;color:var(--ink)}
.rdrop b{font-size:14.5px;font-weight:500;color:var(--strong)}.rdrop span{font-size:13px;color:var(--muted);line-height:1.45}.rdrop:hover,.rdrop.on{border-color:var(--blue);background:var(--fill)}
.rright .rmuted,.rright .mute{padding-left:2px}
.rsrcrow{display:block;padding:6px 8px;border-radius:5px;font-size:14px;color:var(--strong);text-decoration:none;cursor:pointer;line-height:1.35}.rsrcrow:hover{background:var(--fill)}.rsrcrow .t{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rmsg.ai .rtext{font-size:15.5px;line-height:1.7}.rmsg.user .rtext{font-size:15px}
.rsrc{font-size:14px}.rsrc b{font-size:14px}.rsrc small{font-size:13px}.rhead{font-size:13px;letter-spacing:0;text-transform:none;font-weight:500}
.rtitle{font-size:clamp(26px,2.3vw,32px)}.rempty .mute{font-size:14.5px}
.rexbtn{font-size:14.5px}.rbox textarea{font-size:15px}.rhint,.rtoggle{font-size:13px}
@media(max-width:1180px){.research{grid-template-columns:240px minmax(0,1fr)}.rright{grid-column:1;grid-row:2;border:0;padding:12px 14px 0 0}body.chatpage .rside{height:auto}.rmain{grid-row:1 / span 2;grid-column:2}}
.rtitle{font-weight:500;letter-spacing:-.01em}

/* ---- conversations, and the reader beside the conversation ---- */
.rrow.conv{padding-left:8px}.rrow.conv.on{background:var(--fill);font-weight:500}
.research.reading{grid-template-columns:268px minmax(0,1fr) 470px}
.rreader{display:flex;flex-direction:column;min-height:0;height:100%;padding-bottom:4px}
.rrhead{display:flex;justify-content:space-between;align-items:center;margin:0 0 10px}
.rback{font-size:13.5px;color:var(--muted);padding:2px 0}.rback:hover{color:var(--strong)}.rlink2{font-size:13px;color:var(--blue)}
.rcite{font-size:17px;font-weight:600;letter-spacing:-.01em;margin:0 0 2px;color:var(--strong)}.rhdg{font-size:13.5px;color:var(--muted);margin:0 0 10px}
.rbody{flex:1;min-height:0;overflow-y:auto;white-space:pre-wrap;font-size:14.5px;line-height:1.7;padding:10px 12px;border:1px solid var(--hair);border-radius:5px;user-select:text;color:var(--strong)}
.rbody::selection{background:color-mix(in srgb,var(--blue) 25%,transparent)}
.rtools{flex:none;padding:12px 0 2px}.rlab{display:block;font-size:12.5px;margin:0 0 3px;color:var(--muted);text-transform:none;letter-spacing:0}
.rtools select{margin:0 0 8px;font-size:14px}.ractions{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:6px}.rnote{margin-top:6px}
.excerpt{padding:8px 0;border-top:1px solid var(--hair)}.excerpt blockquote{margin:4px 0 4px;padding-left:10px;border-left:2px solid var(--line2);font-size:13.5px;line-height:1.55;white-space:pre-wrap}
@media(max-width:1180px){.research.reading{grid-template-columns:240px minmax(0,1fr)}}
/* Research: the dividing lines run the full height, from the header to the bottom edge */
body.chatpage main.shell.chatmode{padding:0;max-width:none}
body.chatpage .research{max-width:none;margin:0;gap:0}
body.chatpage .rside{padding:16px 14px 16px 24px}
body.chatpage .rright{padding:16px 24px 16px 20px}

/* ---- notification drop-down ---- */
.abright{min-width:60px}
.abbell{position:relative;width:34px;height:30px;display:grid;place-items:center;border-radius:5px;color:#fff;opacity:.9}.abbell:hover,.abbell[aria-expanded=true]{background:rgba(255,255,255,.14);opacity:1}
.abbell svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.abbadge{position:absolute;top:-3px;right:-3px;min-width:17px;height:17px;padding:0 4px;border-radius:5px;background:#3b66f5;color:#fff;font-size:10.5px;font-weight:600;line-height:17px;text-align:center}
.npanel{position:fixed;right:22px;width:min(420px,calc(100vw - 24px));max-height:calc(100vh - 90px);display:flex;flex-direction:column;background:var(--bg);color:var(--strong);border:1px solid var(--hair);border-radius:5px;box-shadow:0 22px 60px rgba(20,30,60,.28);z-index:60;overflow:hidden}
.nhead{display:flex;justify-content:space-between;align-items:center;padding:16px 20px 0;border-bottom:1px solid var(--hair);gap:10px}
.ntabs{display:flex;gap:22px;min-width:0;overflow-x:auto}.ntab{font-size:14.5px;color:var(--muted);padding:2px 0 14px;border-bottom:2px solid transparent;white-space:nowrap}.ntab:hover{color:var(--strong)}.ntab.on{color:var(--strong);border-bottom-color:var(--blue)}
.ntools{display:flex;gap:4px;padding-bottom:10px;flex:none}.ntool{width:30px;height:30px;display:grid;place-items:center;border-radius:5px;color:var(--muted)}.ntool:hover,.ntool.on{background:var(--fill);color:var(--strong)}.ntool svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.nlist{overflow-y:auto;padding:8px 10px}
.nrow{position:relative;display:flex;gap:12px;align-items:flex-start;padding:12px 12px 12px 18px;border-radius:5px;cursor:pointer}.nrow:hover,.nrow:focus-visible{background:var(--fill);outline:none}
.ndot{position:absolute;left:6px;top:26px;width:6px;height:6px;border-radius:50%;background:transparent}.nrow.unread .ndot{background:var(--blue)}
.nav{flex:none;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-size:14px;font-weight:600;letter-spacing:.02em}
.nav svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.nav.blue{background:#e4ebff;color:#2447c4}.nav.red{background:#fde4e1;color:#b3261e}.nav.amber{background:#fdf0d6;color:#9a6200}.nav.green{background:#dcf3e5;color:#157f4b}.nav.gray{background:var(--fill);color:var(--muted)}
:root[data-theme=dark] .nav.blue{background:#1c2a55;color:#9db4ff}:root[data-theme=dark] .nav.red{background:#3a1f1d;color:#ff9a90}:root[data-theme=dark] .nav.amber{background:#3a2d12;color:#f2c98a}:root[data-theme=dark] .nav.green{background:#16301f;color:#7fe0a8}
.nbody{min-width:0;flex:1;padding-right:26px}.ntext{font-size:14.5px;line-height:1.45;color:var(--strong)}.ntext b{font-weight:600}.nsoft{color:var(--muted)}
.ndetail{font-size:13px;color:var(--muted);margin-top:2px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.nwhen{font-size:13px;color:var(--muted);margin-top:5px}
.nread{position:absolute;right:12px;top:50%;transform:translateY(-50%);width:22px;height:22px;display:grid;place-items:center;opacity:0}.nrow:hover .nread,.nrow:focus-within .nread{opacity:1}
.nread i{width:12px;height:12px;border:2px solid var(--blue);border-radius:50%;display:block}.nread:hover i{background:var(--blue)}
.ntip{position:absolute;right:30px;top:50%;transform:translateY(-50%);background:#20232a;color:#fff;font-size:12.5px;padding:7px 12px;border-radius:5px;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .12s}.nread:hover .ntip{opacity:1}
.nempty{padding:22px 14px;color:var(--muted);font-size:14px;text-align:center;margin:0}
.nset{display:flex;align-items:center;gap:10px;padding:10px 12px;font-size:14.5px;text-transform:none;letter-spacing:0;font-weight:400;color:var(--strong);cursor:pointer;margin:0}.nset input{margin:0}
.nmorebtn{display:block;width:100%;padding:14px;font-size:14.5px;color:var(--strong);border-top:1px solid var(--hair);text-align:center}.nmorebtn:hover{background:var(--fill)}
.npanel{width:min(450px,calc(100vw - 24px))}.ntabs{gap:18px}.ntab{font-size:14px}
.ntip{right:-4px;top:auto;bottom:calc(100% + 8px);transform:none}

/* ---- content sits in the middle of the screen; page actions live in a bottom bar ---- */
#app{min-height:100vh;display:flex;flex-direction:column}
.top{flex:none}
main.shell{flex:1;display:flex;flex-direction:column;width:100%;margin-left:auto;margin-right:auto}
main.shell>.mid{margin:auto 0;width:100%}
body.has-bar main.shell{padding-bottom:88px}
.actionbar{position:fixed;left:0;right:0;bottom:0;z-index:15;height:54px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 28px;background:var(--page);border-top:1px solid var(--hair)}
.actionbar .abl{font-size:13px;color:var(--muted);white-space:nowrap}
.actionbar .abr{display:flex;gap:8px;align-items:center;overflow-x:auto;flex-wrap:nowrap}
.actionbar .btn{height:32px;white-space:nowrap}
body.has-bar .bubble{bottom:68px}body.has-bar .chat{bottom:124px}
/* the centred Home */
.page-hero{text-align:center}.page-hero h1 .two{display:inline}.lede{margin:2px auto 0}
.stats{justify-content:center}
.dgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
body.chatpage main.shell.chatmode>.mid{margin:0;flex:1;min-height:0;display:flex}
@media(max-width:760px){.actionbar{padding:0 12px}.actionbar .abl{display:none}.dgrid{grid-template-columns:1fr}}
.mid>.notice{text-align:center;border-left:0;border-radius:5px;background:var(--fill);padding:8px 14px;margin:0 auto 14px;max-width:640px}
.rrow .x.ed{padding:0 3px;display:grid;place-items:center}.rrow .x.ed svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.rrow .x.ed:hover{color:var(--blue)}
.rrow.editing{padding:3px 6px}.rinput{width:100%;margin:0;padding:5px 8px;font-size:14.5px;border-radius:5px}
/* one focus ring, not two: boxed fields draw their own border when focused, so the browser's outline is switched off for them */
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:0}
.rinput,.rinput:focus,.rinput:focus-visible{outline:0;box-shadow:none;border:1px solid var(--blue);background:var(--bg)}
.rbox textarea:focus-visible{outline:0}
.rrow.editing,.rrow.editing:hover,.rrow.conv.on.editing{background:none;padding:0;cursor:text}
.rrow.editing .rinput{display:block;width:100%}
/* Research: a full-width rule under the top navigation, meeting the side rules */
body.chatpage .hdr{border-bottom:1px solid var(--hair)}
.cm{color:var(--blue);cursor:pointer;border-radius:3px;font-weight:500}.cm:hover,.cm:focus-visible{background:color-mix(in srgb,var(--blue) 14%,transparent);outline:0}
.rnewcase{display:flex;flex-direction:column;gap:0;margin:0 0 4px}.rnewcase input{margin:0 0 8px;font-size:14px}.rnewcase[hidden]{display:none}
.rnote.ok{color:var(--ok)}.rnote.err{color:var(--bad)}
/* the law text: no box around it, and a selection is solid blue with white text */
.rbody{border:0;border-radius:0;padding:2px 10px 2px 0}
.rbody::selection,.rbody ::selection{background:var(--blue);color:#fff}
.rbody::-moz-selection,.rbody ::-moz-selection{background:var(--blue);color:#fff}

/* the chat button in the bottom bar */
.abtn-ai{display:inline-flex;align-items:center;gap:8px;height:32px;padding:0 14px;border-radius:5px;background:var(--blue);color:#fff;font-size:13px;font-weight:500;white-space:nowrap}
.abtn-ai:hover{background:#1639ad}:root[data-theme=dark] .abtn-ai:hover{background:#6f8cf5;color:#0d121a}
.abtn-ai svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.actionbar .abl{font-size:inherit}
body.has-bar .chat{left:22px;right:auto;bottom:66px}
@media(max-width:760px){.abtn-ai span{display:none}.abtn-ai{padding:0 11px}}

/* case notes, strategy buttons, and the build-a-case card in Research */
.nt{min-height:54px;margin:6px 0 8px}
.note{font-size:13px;line-height:1.5;padding:6px 0;border-top:1px solid var(--line2)}
#cv-strategy .btn,.card .btn.alt{margin:4px 6px 0 0}
.buildcard{border:1px solid var(--line2);border-radius:5px;padding:12px 14px;margin:10px 0;max-width:640px}
.buildcard h3{font-size:14px;font-weight:600;margin:0 0 6px}
.buildcard label.ck{display:flex;gap:8px;align-items:center;font-size:13px;margin:3px 0}
.buildcard input[type=text]{margin:4px 0 8px}
.buildcard .steps div{font-size:13px;padding:2px 0}.buildcard .steps .done{color:var(--muted)}
.buildcard .row2{display:flex;gap:8px;align-items:center;margin-top:8px;flex-wrap:wrap}

/* sign-in: centred wordmark, rounded fields, dark pill button */
.login{max-width:420px;margin:0 auto;padding:0 24px;min-height:100vh;display:flex;flex-direction:column;justify-content:center;text-align:center}
.login .brand{font:400 clamp(52px,7vw,76px)/1 var(--serif);letter-spacing:-.025em;color:var(--strong);margin:0 0 16px;text-transform:none}
.login h1{font:600 18px/1.3 var(--font);letter-spacing:0;text-transform:none;color:var(--strong);margin:0 0 34px}
.login p.mute{margin:-18px 0 22px}
.login .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.login input{height:56px;border:1px solid var(--line2);border-radius:5px;padding:0 20px;margin:0 0 14px;font-size:15px;background:var(--bg);text-align:left}
.login .pwrap{position:relative}.login .pwrap input{padding-right:52px}
.login .eye{position:absolute;right:16px;top:17px;width:22px;height:22px;border:0;background:none;padding:0;color:var(--strong);cursor:pointer}
.login .forgotrow{text-align:right;margin:-2px 0 18px}.login .forgot{font-size:13px;font-weight:600;color:var(--strong);cursor:pointer}
.login .btn.pill{width:86%;height:46px;margin:0 auto;border-radius:5px;background:#2b2b2d;color:#fff;font-size:14px;font-weight:600;letter-spacing:.02em;text-transform:uppercase}
.login .btn.pill:hover{background:#000}
.login .switch{font-size:13px;color:var(--muted);margin-top:22px}.login .switch a{font-weight:600;color:var(--strong);cursor:pointer}
.login .notice{text-align:left;margin-bottom:16px}
body.has-bar .chat{left:auto;right:22px}

/* Home: one centred column, top-aligned, with the numbers and the two lists on the same width */
main.shell:has(.page-hero)>.mid{margin:0 auto;max-width:880px;padding-top:9vh}
.page-hero{margin-bottom:26px}
.page-hero .lede{margin:10px auto 0;text-align:center}
main.shell:has(.page-hero) .stats{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--hair);border-bottom:1px solid var(--hair);padding:18px 0;margin:0 0 36px;text-align:center}
main.shell:has(.page-hero) .stats a+a{border-left:1px solid var(--hair)}
main.shell:has(.page-hero) .stats b{font-size:28px}
main.shell:has(.page-hero) .dgrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:56px}
main.shell:has(.page-hero) .dgrid .card h2{margin-bottom:12px}

/* sign-in: keep the app's own font and a calmer size */
.login{max-width:360px}
.login .brand{font:600 26px/1 var(--font);letter-spacing:-.03em;margin:0 0 10px}
.login h1{font-size:14px;font-weight:500;color:var(--muted);margin:0 0 26px}
.login input{height:44px;border-radius:5px;padding:0 16px;font-size:14px;margin:0 0 10px}
.login .eye{top:11px;right:13px;width:20px;height:20px}
.login .btn.pill{height:40px;width:80%;font-size:13px}
.login .forgotrow{margin:-2px 0 14px}.login .forgot{font-size:12px}
.login .switch{font-size:12px;margin-top:18px}
.login{max-width:410px}

/* Home lists: centred like the numbers above, two equal halves with a divider */
main.shell:has(.page-hero) .dgrid{gap:0}
main.shell:has(.page-hero) .dgrid .card{text-align:center;padding:4px 24px}
main.shell:has(.page-hero) .dgrid .card+.card{border-left:1px solid var(--hair)}
main.shell:has(.page-hero)>.mid{margin:auto;padding-top:0}

/* branded dialogs (replace the browser's alert and confirm) */
.overlay.dlg{z-index:60;background:rgba(10,14,22,.42)}
.dlgcard{background:#fff;color:#1b2230;border-radius:5px;width:min(380px,100%);padding:22px 24px 18px;text-align:center;box-shadow:0 24px 70px rgba(10,14,22,.28)}
.dlgbrand{display:flex;align-items:center;justify-content:center;gap:8px;font-weight:600;font-size:14px;letter-spacing:-.02em;margin-bottom:12px}
.dlgbrand .logo{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2}
.dlgcard p{font-size:14px;line-height:1.5;margin:0 0 18px;color:#2b3342}
.dlgbtns{display:flex;gap:8px;justify-content:center}.dlgbtns .btn{min-width:92px;height:34px}
:root[data-theme=dark] .dlgcard{background:#fff;color:#1b2230}

/* Case builder section: the same full-height sidebar and divider lines as Research */
body.sidepage{overflow:hidden;height:100vh}
body.sidepage #app{height:100vh;display:flex;flex-direction:column;overflow:hidden}
body.sidepage .top{position:static;flex:none}
body.sidepage main.shell,body.sidepage.has-bar main.shell{flex:1;min-height:0;display:flex;padding:0 0 54px;max-width:none;width:100%;margin:0}
body.sidepage main.shell>.mid{margin:0;flex:1;min-height:0;display:flex;max-width:none;padding:0;width:100%}
body.sidepage .layout{flex:1;min-height:0;width:100%;display:grid;grid-template-columns:268px minmax(0,1fr);gap:0;align-items:stretch}
body.sidepage .side{position:static;height:100%;border-right:1px solid var(--hair);padding:14px;overflow-y:auto;display:flex;flex-direction:column;gap:2px;top:auto}
body.sidepage .side button{font-size:14px;padding:8px 12px;border-radius:5px;color:var(--ink);margin:0}
body.sidepage .side button:hover{background:var(--fill)}
body.sidepage .side button.on{background:var(--fill);color:var(--blue);font-weight:500}
body.sidepage .content{overflow-y:auto;min-height:0;padding:28px;display:flex;flex-direction:column;justify-content:safe center;align-items:center}
body.sidepage .content>*{width:100%;max-width:1000px}
@media(max-width:900px){body.sidepage .layout{grid-template-columns:1fr;grid-template-rows:auto 1fr}body.sidepage .side{flex-direction:row;height:auto;border-right:0;border-bottom:1px solid var(--hair);overflow-x:auto}body.sidepage .side button{white-space:nowrap}}

/* overview and calendar */
.otiles{display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid var(--hair);border-bottom:1px solid var(--hair);margin:6px 0 26px}
.otile{padding:14px 10px;text-align:center;cursor:pointer;text-decoration:none;color:inherit}.otile+.otile{border-left:1px solid var(--hair)}.otile:hover{background:var(--fill)}
.otile small{display:block;font-size:11px;font-weight:600;color:var(--muted);letter-spacing:.08em;text-transform:uppercase;margin-bottom:4px}.otile b{font:500 24px/1.1 var(--font);letter-spacing:-.03em}
.ogrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 48px}
.osec h2{font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--muted);margin:0}
.ohead{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:8px;border-bottom:1px solid var(--hair);padding-bottom:8px}.ohead a{font-size:12px;cursor:pointer}
.orow{display:flex;justify-content:space-between;gap:12px;padding:7px 0;font-size:13.5px;cursor:pointer;text-decoration:none;color:inherit;border-bottom:1px solid var(--hair)}.orow:hover{color:var(--blue)}
.orow span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.orow span:last-child{white-space:nowrap;font-size:12.5px}
.calgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px;margin-bottom:34px}
.calgrid h2{font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--muted);margin:0 0 12px}
.calgrid .row{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px}
.appt{display:flex;flex-direction:column;gap:2px;padding:9px 0;border-bottom:1px solid var(--hair);font-size:13.5px}
.appt .acts{display:flex;gap:14px;font-size:12.5px}.appt .acts a{cursor:pointer}
.remlist .ck{display:flex;gap:8px;align-items:center;font-size:13.5px;margin:5px 0}.calsync input[type=text]{margin:10px 0 6px}
@media(max-width:900px){.calgrid,.ogrid{grid-template-columns:1fr}.otiles{grid-template-columns:repeat(2,1fr)}}
body.sidepage .side button.on::after{display:none}

/* calendar: a month grid */
.calhead{display:flex;gap:8px;align-items:center;margin:0 0 12px}.calhead .grow{flex:1}.calt{font-size:18px;font-weight:600;letter-spacing:-.02em;min-width:150px;text-align:center}
.calwk{display:grid;grid-template-columns:repeat(7,1fr);font-size:11px;font-weight:600;color:var(--muted);letter-spacing:.08em;text-transform:uppercase;padding:0 0 6px}.calwk span{padding:0 8px}
.calg{display:grid;grid-template-columns:repeat(7,1fr);grid-template-rows:repeat(var(--wk,6),minmax(96px,1fr));border-top:1px solid var(--hair);border-left:1px solid var(--hair)}
.calc{border-right:1px solid var(--hair);border-bottom:1px solid var(--hair);padding:6px;min-width:0;overflow:hidden;cursor:pointer}.calc:hover{background:var(--fill)}
.calc.out{color:var(--muted);background:color-mix(in srgb,var(--fill) 45%,transparent)}
.calc .dn{display:inline-block;font-size:12px;min-width:22px;height:22px;line-height:22px;text-align:center;border-radius:5px}
.calc.today .dn{background:var(--blue);color:#fff}
.calev{display:block;font-size:11.5px;line-height:1.35;padding:2px 6px;margin-top:3px;border-radius:5px;background:color-mix(in srgb,var(--blue) 14%,transparent);color:var(--strong);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer}
.calev i{font-style:normal;color:var(--blue);margin-right:5px;font-weight:600}.calev.dl{background:var(--fill);color:var(--muted)}
.modal.small{width:min(460px,100%)}.apform{padding:4px 2px}.apform .row{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:10px}.apform .row2{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:6px}
.apform h3{font-size:13px;margin:16px 0 4px}
body.sidepage .content:has(.calg){justify-content:flex-start}body.sidepage .content>.calhead,body.sidepage .content>.calg,body.sidepage .content>.calwk{max-width:1200px}

/* list pages: title and its one action on a row, then search and the list; forms live in dialogs */
.listhead{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin:0 0 14px}
.listhead h1{margin:0!important}.listhead p{margin:4px 0 0}.lhb{display:flex;gap:8px}
body.sidepage .content:has(.listhead){justify-content:flex-start}
.content>.listhead+input{margin:0 0 6px}
.pill{font-size:11px}

/* detail pages (a client, a case, a document) sit under the same sidebar: start at the top and use the width */
body.sidepage .content:has(.cols),body.sidepage .content.masonry{justify-content:flex-start}
body.sidepage .content:has(.cols)>*{max-width:1400px}
.hdr{border-bottom:1px solid var(--hair)}

body.sidepage .side{justify-content:center}

/* ===================== the new shell: top bar, rail, menu drawer, split workspace ===================== */
html,body{height:100%}body{overflow:hidden}
#app{display:flex;flex-direction:column;height:100vh;min-height:0}
.tb{flex:none;height:64px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;padding:0 16px 0 20px;background:var(--bg);border-bottom:1px solid var(--hair);position:relative;z-index:8}
.tbrand{display:inline-flex;align-items:center;gap:9px;font-size:17px;font-weight:600;letter-spacing:-.025em;color:var(--strong);cursor:pointer;justify-self:start}
.tbrand .logo{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2}
.tbc{justify-self:center;min-width:0}.tbtitle{font-size:14px;font-weight:600;color:var(--strong)}
.seg{display:inline-flex;gap:2px;padding:3px;background:var(--fill);border-radius:5px}
.segbtn{height:32px;padding:0 16px;border-radius:5px;font-size:14px;font-weight:400;color:var(--muted);white-space:nowrap}
.segbtn:hover:not(:disabled){color:var(--strong)}.segbtn.on{background:color-mix(in srgb,var(--fill) 55%,var(--hair) 45%);color:var(--strong);font-weight:600}
.segbtn:disabled{opacity:.45;cursor:default}
.tbr{display:flex;align-items:center;gap:8px;justify-self:end}
.tb .abbell{color:var(--strong);width:36px;height:36px;border:1px solid var(--hair);border-radius:5px}.tb .abbell:hover,.tb .abbell[aria-expanded=true]{background:var(--fill)}
.tb .tbtn{height:36px;border:1px solid var(--hair);border-radius:5px}
.tb .acct summary{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 14px 0 4px;border:1px solid var(--hair);border-radius:5px;font-size:14px;text-transform:none;letter-spacing:0;color:var(--strong);background:var(--bg)}
.av{width:28px;height:28px;flex:none;border-radius:50%;background:var(--blue);color:#fff;font-size:11px;font-weight:600;display:grid;place-items:center;letter-spacing:0}
.tb .acct .menu{border:1px solid var(--hair);border-radius:5px;box-shadow:0 12px 36px rgba(10,14,22,.14);padding:6px;overflow:hidden;min-width:210px}
.tb .acct .menu button{border:0;border-radius:5px;padding:9px 12px;font-size:14px}.tb .acct .menu button:hover{background:var(--fill)}
.menurow{display:flex;justify-content:space-between;align-items:center;padding:6px 12px 8px;font-size:13px;color:var(--muted)}
.frame{flex:1;min-height:0;display:flex;background:var(--bg)}
.rail{width:64px;flex:none;border-right:1px solid var(--hair);padding:18px 0;display:flex;flex-direction:column;align-items:center;gap:12px}
.railbtn{width:40px;height:40px;border:1px solid var(--hair);border-radius:5px;display:grid;place-items:center;color:var(--strong);background:var(--bg)}
.railbtn:hover,.railbtn.on{background:var(--fill)}.railbtn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.drawer{width:0;flex:none;overflow:hidden;border-right:0 solid var(--hair);display:flex;flex-direction:column;transition:width .16s ease;background:var(--bg)}
.frame.dopen .drawer{width:290px;border-right-width:1px}
.drawer>*{width:290px;flex:none}.dnav{padding:12px 12px 6px}.dslot{flex:1;min-height:0;overflow-y:auto;padding:0 12px 16px}
.dnav button{display:block;width:100%;text-align:left;padding:8px 12px;border-radius:5px;font-size:14px;color:var(--strong)}.dnav button:hover{background:var(--fill)}.dnav button.on{background:var(--fill);font-weight:600}
.dgroup{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding:12px 12px 4px}
.dfilters{border-top:1px solid var(--hair);padding-top:8px}
.stage{flex:1;min-width:0;min-height:0;overflow:auto;background:var(--bg)}
.pg{max-width:1000px;margin:0 auto;padding:30px 32px 64px}.pg.wide{max-width:1240px}
.stage.work{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1fr);overflow:hidden}
.lpane{overflow-y:auto;min-width:0;background:var(--page);padding:0}
.lpin{padding:28px 40px 60px;max-width:860px;margin:0 auto}.lload{padding:40px}
.cpane{display:flex;flex-direction:column;min-height:0;min-width:0;border-left:1px solid var(--hair);background:var(--bg)}
.stage.work:not(.chaton){grid-template-columns:minmax(0,1fr)}.stage.work:not(.chaton) .cpane{display:none}
@media(max-width:900px){.stage.work{grid-template-columns:minmax(0,1fr)}.stage.work.chaton .lpane{display:none}.tb{grid-template-columns:auto 1fr auto}.tbrand{font-size:0;gap:0}.segbtn{padding:0 10px}}
/* the reader, in the style of a document: a quiet title, a grey line of detail, then the text in a serif face */
.readbox{min-height:100%;display:flex;flex-direction:column}
.rd{width:min(520px,100%);margin:0 auto;padding:44px 24px 32px}
.rdtitle{font-size:26px;font-weight:600;letter-spacing:-.02em;line-height:1.18;color:var(--muted);margin:10px 0 10px}
.rdmeta{font-size:13px;color:var(--muted);opacity:.85;margin:0 0 26px}.rdmeta a{color:var(--muted);text-decoration:underline}
.rd .rbody{font:400 13.5px/1.45 "Times New Roman",Times,"Newsreader NF",serif;color:var(--strong);border:0;padding:0;background:none;white-space:pre-wrap;outline:none}
.rd .rbody.plain{font-family:inherit;font-size:14px;line-height:1.55;margin:0 0 22px}
.rd .osec{margin:22px 0 0}.rd .osec h2{font-size:12px;letter-spacing:.1em;text-transform:uppercase;font-weight:600;color:var(--muted);margin:0 0 6px}
.lrow{display:flex;flex-direction:column;gap:1px;padding:9px 0;border-bottom:1px solid var(--hair);cursor:pointer;font-size:14px;color:var(--strong)}.lrow:hover b{color:var(--blue)}
.rblank{margin:auto;text-align:center;max-width:340px;padding:60px 20px}.rblank h2{font-size:16px;margin:0 0 6px}
.rtools{position:sticky;bottom:0;margin-top:auto;background:var(--page);border-top:1px solid var(--hair);padding:12px 24px 14px}
.rtools>*{max-width:520px;margin-left:auto;margin-right:auto}.rtools .ractions{display:flex;gap:8px;flex-wrap:wrap;margin:6px auto}
.rpick{display:flex;gap:8px;align-items:center}.rpick select{margin:0;flex:1}
/* the conversation */
.cmsgs{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:0}
.cempty{padding:28px 28px}.cempty .rex{display:flex;flex-direction:column;margin-top:10px}
.cmsg{display:flex;gap:12px;align-items:flex-start;padding:18px 28px;font-size:15px;line-height:1.5}
.cmsg.user{background:var(--bg);align-items:center}.cmsg.ai{background:var(--fill);position:relative;padding-right:84px}
.cmsg .ctext{white-space:pre-wrap;color:var(--strong)}.cbody{flex:1;min-width:0}
.cmark{flex:none;width:24px;height:24px;display:grid;place-items:center;margin-top:2px}.cmark .logo{width:20px;height:20px;fill:none;stroke:var(--strong);stroke-width:2}
.cacts{position:absolute;right:20px;top:14px;display:flex;gap:6px}
.cact{width:28px;height:28px;border-radius:5px;display:grid;place-items:center;color:var(--muted)}.cact:hover,.cact.on{background:color-mix(in srgb,var(--fill) 50%,var(--hair) 50%);color:var(--strong)}.cact svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.cact.on svg{fill:currentColor}
.cmsg .cite{font-weight:600;text-decoration:underline;color:var(--strong);cursor:pointer}.cmsg .cite:hover{color:var(--blue)}
.cmsg .rhead{font-size:12px;font-weight:600;color:var(--muted);margin:12px 0 6px}
.cmsg .rsrcs{display:flex;flex-direction:column;gap:2px}.cmsg .rsrc{display:flex;flex-direction:column;padding:6px 0;font-size:13.5px;cursor:pointer;border-top:1px solid var(--hair)}.cmsg .rsrc small{color:var(--muted)}.cmsg .rsrc:hover b{color:var(--blue)}
.ccompose{flex:none;padding:12px 24px 16px;border-top:1px solid var(--hair);background:var(--bg)}.chint{font-size:12px;color:var(--muted);margin:6px 2px 0}
.ccompose .rbox{display:flex;align-items:flex-end;gap:8px;border:1px solid var(--hair);border-radius:5px;padding:8px 8px 8px 14px;background:var(--bg)}
.ccompose textarea{border:0;margin:0;padding:6px 0;min-height:0;max-height:180px;resize:none;background:none;font-size:15px}.ccompose textarea:focus{outline:0;box-shadow:none}
.cmsg .buildcard{background:var(--bg);margin:0}
.rex .rexbtn{text-align:left;padding:10px 0;border-bottom:1px solid var(--hair);font-size:14.5px;color:var(--strong)}.rex .rexbtn:hover{color:var(--blue)}
/* + menu and the full-screen cards */
.newmenu{position:fixed;z-index:60;background:var(--bg);border:1px solid var(--hair);border-radius:5px;box-shadow:0 12px 36px rgba(10,14,22,.16);padding:6px;min-width:170px;display:flex;flex-direction:column}
.newmenu button{text-align:left;padding:9px 12px;border-radius:5px;font-size:14px;color:var(--strong)}.newmenu button:hover{background:var(--fill)}
.fs{position:fixed;inset:0;z-index:70;background:var(--bg);overflow-y:auto;display:flex}
.fsx{position:fixed;top:18px;right:22px;width:40px;height:40px;border-radius:5px;font-size:26px;line-height:1;color:var(--muted);z-index:2}.fsx:hover{background:var(--fill);color:var(--strong)}
.fsin{width:min(520px,100%);margin:auto;padding:56px 24px}.fsin h1{font-size:28px;font-weight:600;letter-spacing:-.025em;margin:0 0 6px}.fsin>p.mute{margin:0 0 26px}
.fsform label{display:block;font-size:13px;color:var(--muted);margin:14px 0 5px}.fsform input,.fsform select{height:46px;border-radius:5px;font-size:15px;margin:0}
.fsform .row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fsdrop{display:flex!important;flex-direction:column;gap:4px;align-items:center;text-align:center;border:1.5px dashed var(--line2);border-radius:5px;padding:22px 16px!important;cursor:pointer;margin-top:16px!important;color:var(--strong)!important}
.fsdrop b{font-size:14px;font-weight:600}.fsdrop span{font-size:13px;color:var(--muted)}.fsdrop.on,.fsdrop:hover{border-color:var(--blue);background:var(--fill)}.fsdrop input{display:none}
.thumbs{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}.thumb{position:relative;width:84px;height:84px;border-radius:5px;overflow:hidden;border:1px solid var(--hair);background:var(--fill)}
.thumb img{width:100%;height:100%;object-fit:cover}.tfile{display:block;font-size:11px;padding:8px;word-break:break-all;color:var(--muted)}
.thumb .tx{position:absolute;top:3px;right:3px;width:20px;height:20px;border-radius:50%;background:rgba(0,0,0,.6);color:#fff;font-size:14px;line-height:1}
.btn.big{height:48px;width:100%;border-radius:5px;font-size:15px;margin-top:22px}
.fssteps{margin-top:8px}.fsstep{display:flex;align-items:center;gap:12px;padding:10px 0;font-size:15px;color:var(--muted)}.fsstep i{width:14px;height:14px;border-radius:50%;border:2px solid var(--line2);border-top-color:var(--blue);animation:spin .8s linear infinite;flex:none}
.fsstep.done{color:var(--strong)}.fsstep.done i{animation:none;border:0;background:var(--blue)}
@keyframes spin{to{transform:rotate(360deg)}}
.fab{position:fixed;right:22px;bottom:22px;width:46px;height:46px;border-radius:50%;background:var(--blue);color:#fff;display:grid;place-items:center;box-shadow:0 8px 24px rgba(30,70,200,.35);z-index:14}.fab svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
body.has-fab .chat{left:auto;right:22px;bottom:80px}
.npanel{z-index:20}

/* ============ matched to the reference: a rounded window on grey, compact type, almost no lines ============ */
body.win{background:radial-gradient(120% 120% at 50% 0%,#efefef 0%,#e2e2e2 100%)}
:root[data-theme=dark] body.win{background:#0c0e12}
body.win #app{height:calc(100vh - 36px);margin:18px;border-radius:5px;overflow:hidden;background:var(--bg);box-shadow:0 22px 60px rgba(20,24,32,.13),0 2px 8px rgba(20,24,32,.05)}
@media(max-width:760px){body.win #app{height:100vh;margin:0;border-radius:0}}
.tb{height:56px;padding:0 14px 0 18px;border-bottom:1px solid #f3f3f3}
:root[data-theme=dark] .tb{border-bottom-color:var(--hair)}
.tbrand{font-size:16px;font-weight:600;gap:8px;letter-spacing:-.02em}.tbrand .logo{width:20px;height:20px;stroke-width:2.6;stroke-linecap:butt}
.seg{padding:0;gap:0;background:#fff;border:1px solid #f1f1f1;border-radius:5px;overflow:hidden}
:root[data-theme=dark] .seg{background:var(--bg);border-color:var(--hair)}
.segbtn{height:32px;padding:0 20px;border-radius:0;font-size:13px;font-weight:400;color:#555;background:#fff}
:root[data-theme=dark] .segbtn{background:var(--bg);color:var(--muted)}
.segbtn.on{background:#f4f4f4;color:#2b2b2b;font-weight:600}
:root[data-theme=dark] .segbtn.on{background:var(--fill);color:var(--strong)}
.tb .acct summary{height:30px;padding:0 12px 0 5px;gap:8px;border:1px solid #efefef;border-radius:5px;font-size:13px;color:#555;font-weight:400}
.av{width:20px;height:20px;background:#dcdcdc;color:#444;font-size:9px}
:root[data-theme=dark] .av{background:var(--line2);color:var(--strong)}
.rail{width:56px;border-right:1px solid var(--hair);padding:14px 0;gap:10px}
.railbtn{width:32px;height:32px;border:1px solid #eee;border-radius:5px;color:#444}.railbtn svg{width:15px;height:15px;stroke-width:1.5}
.railend{margin-top:auto;display:flex;flex-direction:column;gap:10px;align-items:center}
.railend .abbell,.railend .tbtn{width:32px;height:32px;padding:0;border:1px solid #eee;border-radius:5px;color:#444;display:grid;place-items:center;position:relative}
.railend .tbtn.on{width:auto;padding:0 8px;gap:6px;display:inline-flex}.railend .tclock{font-size:12px}
.railend .abbell svg,.railend .tbtn svg{width:15px;height:15px}
.railend .tpanel{left:calc(100% + 12px);right:auto;top:auto;bottom:0}
.npanel{left:64px!important;right:auto!important;top:auto!important;bottom:26px}
.frame{background:var(--bg)}
.drawer .dnav button,.rrow,.rnavitem{font-size:13px}
.stage.work{grid-template-columns:minmax(0,.9fr) minmax(0,1fr)}
.lpane{background:#fefefc;border-left:1px solid #f7f7f7}
:root[data-theme=dark] .lpane{background:var(--page);border-left-color:var(--hair)}
.cpane{border-left:1px solid #f4f4f4}
:root[data-theme=dark] .cpane{border-left-color:var(--hair)}
.rd{width:min(350px,100%);padding:34px 0 28px}
.rdtitle{font-size:22px;font-weight:600;letter-spacing:-.015em;line-height:1.22;color:#555;margin:0 0 10px}
:root[data-theme=dark] .rdtitle{color:var(--strong)}
.rdmeta{font-size:12px;color:#b4b4b4;margin:0 0 22px}.rdmeta a{color:#b4b4b4}
.rd .rbody{font:400 11.8px/1.42 "Times New Roman",Times,serif;color:#2c2c2c}
:root[data-theme=dark] .rd .rbody{color:var(--ink)}
.rd .rbody.plain{font:400 12.5px/1.5 var(--font);color:#555}
.rdoc{display:block}
.rtools{background:#fefefc;border-top:1px solid #f4f4f4;padding:10px 0 12px}.rtools>*{width:min(350px,100%);max-width:350px}
:root[data-theme=dark] .rtools{background:var(--page);border-top-color:var(--hair)}
.cmsg{padding:20px 26px;font-size:13px;line-height:1.5;gap:10px}
.cmsg.user{padding:22px 26px 16px}.cmsg.user .av{width:24px;height:24px;font-size:10px}
.cmsg.ai{background:#f8f8f8;padding:20px 80px 20px 26px}
:root[data-theme=dark] .cmsg.ai{background:var(--fill)}
.cmsg .ctext{color:#555;font-size:13px;line-height:1.5}.cmsg.user .ctext{color:#444;font-size:13px}
:root[data-theme=dark] .cmsg .ctext{color:var(--ink)}
.cmark{margin-top:1px;width:18px;height:18px}.cmark .logo{width:18px;height:18px;stroke-width:2.8;stroke-linecap:butt}
.cmsg .cite{color:#333;font-weight:600}
.cacts{right:22px;top:18px}.cact{width:24px;height:24px;color:#777}.cact svg{width:14px;height:14px}
.ccompose{padding:12px 22px 16px;border-top:0}
.ccompose .rbox{border-color:#eee;border-radius:5px;padding:6px 6px 6px 12px}.ccompose textarea{font-size:13px}
.rsend{width:28px;height:28px;border-radius:5px}
.chint{font-size:11.5px}
.pg{font-size:13px}
.rex .rexbtn{font-size:13px}
.cmsg .cite{background:none!important;padding:0!important;border-radius:0!important;display:inline;font-size:inherit}
.cmsg .rsrc{flex-direction:column!important;align-items:flex-start!important;gap:1px}.cmsg .rsrc small{text-align:left;display:block}.cmsg .rsrc b{font-weight:600}
.cmsg .rhead{margin:12px 0 4px}

body.win .dock{left:18px;right:18px;bottom:18px;border-radius:0 0 5px 5px;border-top-color:var(--hair)}
body.win .wb-drawer{border-radius:0}
@media(max-width:760px){body.win .dock{left:0;right:0;bottom:0;border-radius:0}}
body.win .wb-drawer{box-shadow:none;border-left:1px solid var(--hair)}

/* Cases: a calm list of cards */
.pg:has(.cs){max-width:none;padding-top:34px}
.cs{max-width:820px;margin:0 auto}
.cs-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin:0 0 26px;flex-wrap:wrap}
.cs-head h1{font-size:36px;font-weight:700;letter-spacing:-.03em;line-height:1.1;margin:0 0 6px;color:var(--strong)}
.cs-sub{font-size:15px;color:#777;margin:0}
.cs-tools{display:flex;gap:10px;align-items:center}
.cs-search{display:flex;align-items:center;gap:9px;width:min(380px,60vw);height:42px;padding:0 14px;background:var(--bg);border:1px solid #efefef;border-radius:5px;box-shadow:0 2px 10px rgba(20,24,32,.05);color:#666}
.cs-search svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;flex:none}
.cs-search input{border:0;margin:0;padding:0;height:auto;min-height:0;background:none;font-size:14px;flex:1;min-width:0}.cs-search input:focus{outline:0;box-shadow:none}
.cs-filter{width:42px;height:42px;display:grid;place-items:center;border:1px solid #efefef;border-radius:5px;box-shadow:0 2px 10px rgba(20,24,32,.05);background:var(--bg);color:#555}
.cs-filter svg,.cs-more svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round}
.cs-list{max-width:720px;margin:0 auto;display:flex;flex-direction:column;gap:18px}
.cs-card{background:var(--bg);border:1px solid #f3f3f3;border-radius:5px;padding:28px 32px 26px;box-shadow:0 8px 30px rgba(20,24,32,.06);cursor:pointer;outline:none}
.cs-card:hover,.cs-card:focus-visible{box-shadow:0 10px 34px rgba(20,24,32,.1)}
.cs-top{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.cs-pill{display:inline-flex;align-items:center;gap:7px;height:28px;padding:0 13px;border-radius:5px;background:#f3f3f3;font-size:13px;font-weight:500;color:#333}
.cs-pill.st{background:#f6f6f6}
.dot{width:9px;height:9px;border-radius:50%;display:inline-block;background:#aaa}.dot.green{background:#22b45a}.dot.amber{background:#f5a524}.dot.gray{background:#b5b5b5}
.cs-more{margin-left:auto;width:32px;height:28px;display:grid;place-items:center;color:#333;border-radius:5px}.cs-more:hover{background:var(--fill)}.cs-more svg{stroke-width:3}
.cs-card h2{font-size:25px;font-weight:600;letter-spacing:-.02em;margin:0 0 6px;color:#1f1f1f}
.cs-id{font-size:15px;color:#7a7a7a;margin:0 0 20px}
.cs-stats{display:grid;grid-template-columns:1.25fr 1fr 1fr;border-top:1px solid #f1f1f1;padding-top:18px}
.cs-stat{padding:0 0 0 22px;border-left:1px solid #f1f1f1}.cs-stat.first{padding-left:0;border-left:0}
.cs-lab{display:flex;align-items:center;gap:8px;font-size:14px;color:#666;margin-bottom:6px}.cs-lab svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.cs-big{font-size:25px;font-weight:600;letter-spacing:-.02em;color:#222}.cs-small{font-size:14px;color:#7a7a7a;margin-top:3px}
.cs-empty{text-align:center;color:#888;padding:40px 0}
.cs-pop{position:fixed;z-index:60;background:var(--bg);border:1px solid var(--hair);border-radius:5px;box-shadow:0 12px 36px rgba(10,14,22,.16);padding:6px;min-width:170px;display:flex;flex-direction:column}
.cs-pop button{text-align:left;padding:8px 12px;border-radius:5px;font-size:13.5px;color:var(--strong)}.cs-pop button:hover,.cs-pop button.on{background:var(--fill)}.cs-pop button.on{font-weight:600}
.cs-pt{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding:6px 12px 2px}
@media(max-width:640px){.cs-stats{grid-template-columns:1fr 1fr}.cs-stat.first{grid-column:1/-1;margin-bottom:12px}.cs-card{padding:22px 20px}}
:root[data-theme=dark] .cs-card{border-color:var(--hair)}

/* full width: no floating window; wider reader; thinner lines on the right */
body.win{background:var(--bg)}
body.win #app{height:100vh;margin:0;border-radius:0;box-shadow:none}
body.win .dock{left:0;right:0;bottom:0;border-radius:0}
.stage.work{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.rd{width:min(680px,100%)}
.rd .rbody{font-size:12.8px;line-height:1.45}
.rdoc{display:block}
.lpane{border-left:0}
.cpane{border-left:.5px solid #e4e4e4}
:root[data-theme=dark] .cpane{border-left-color:var(--hair)}
.cmsg .rsrc{border-top:.5px solid #e6e6e6!important;margin:0!important}
.cmsg .rsrc small{margin:0!important;text-align:left!important;align-self:flex-start!important;margin-left:0!important}
.cmsg .rhead{border:0}
:root[data-theme=dark] .cmsg .rsrc{border-top-color:var(--hair)!important}
.rd{width:min(760px,100%);padding:36px 40px 28px;box-sizing:border-box}

/* top menu (Cases, Clients, Practice) and the Practice section, laid out like the reference */
.tbmenu{display:flex;gap:4px}
.tbmenu button{height:32px;padding:0 14px;border-radius:5px;font-size:13.5px;color:#555;background:none}
.tbmenu button:hover{background:var(--fill);color:var(--strong)}.tbmenu button.on{background:#f3f3f3;color:#1f1f1f;font-weight:500}
:root[data-theme=dark] .tbmenu button.on{background:var(--fill);color:var(--strong)}
.sec{display:flex;min-height:100%}
.secnav{width:260px;flex:none;padding:46px 22px 40px 56px;display:flex;flex-direction:column;gap:2px}
.secnav .sg{font-size:12px;font-weight:500;color:#777;padding:0 10px 8px}
.secnav hr{border:0;border-top:1px solid #eee;margin:14px 0 18px}
.secnav button{display:flex;align-items:center;gap:10px;height:32px;padding:0 10px;border-radius:5px;font-size:13px;color:#333;text-align:left;width:100%}
.secnav button svg{width:15px;height:15px;fill:none;stroke:#555;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:none}
.secnav button:hover{background:#f7f7f7}.secnav button.on{background:#f4f4f4;font-weight:500}
.secmain{flex:1;min-width:0;max-width:1060px;padding:46px 40px 64px 28px}
.secmain h1,.sech{font-size:26px;font-weight:600;letter-spacing:-.025em;margin:0 0 6px;color:#1a1a1a}
.secsub{font-size:14px;color:#777;margin:0 0 30px}
.pr{display:grid;grid-template-columns:minmax(0,560px) 210px;gap:48px;align-items:start}
.prmain{display:flex;flex-direction:column;gap:24px}
.grow{flex:1}
.prdark{background:#222;color:#e8e8e8;border-radius:5px;overflow:hidden;box-shadow:0 8px 24px rgba(0,0,0,.14)}
.prdh{padding:20px 22px 16px;display:flex;flex-direction:column;gap:5px}.prdh b{font-size:13.5px;font-weight:600;color:#fff}.prdh span{font-size:12px;color:#9a9a9a}
.prfile{display:flex;align-items:center;gap:10px;padding:9px 16px;background:#2b2b2b;border-top:1px solid #353535;border-bottom:1px solid #353535;font-size:12px}
.prchip{width:22px;height:18px;border-radius:4px;background:#444;color:#ccc;font-size:9px;display:grid;place-items:center;font-weight:600}.prfn{color:#cfcfcf;font-family:ui-monospace,Menlo,monospace}
.prcode{padding:16px 22px;font:12px/1.9 ui-monospace,Menlo,Consolas,monospace;color:#f2f2f2;overflow-x:auto;white-space:nowrap}.prcode i{font-style:normal;color:#666;display:inline-block;width:22px}
.prfoot{display:flex;align-items:center;gap:8px;padding:12px 16px;background:#2b2b2b;border-top:1px solid #353535;font-size:11.5px;color:#999}
.prbtn{height:26px;padding:0 11px;border:1px solid #e6e6e6;border-radius:5px;background:#fff;font-size:12px;font-weight:500;color:#222;white-space:nowrap}.prbtn:hover{background:#f7f7f7}
.prbtn.dark{background:#2f2f2f;border-color:#444;color:#eee}.prbtn.dark:hover{background:#3a3a3a}.prbtn.light{background:#fff;color:#222;border-color:#fff}
.prcopied{font-size:11px;color:#8fd19e}
.prcard{background:#f7f7f7;border-radius:5px;padding:18px 0 0;overflow:hidden;border:1px solid #f0f0f0}
.prcard h3{font-size:13.5px;font-weight:600;margin:0;padding:0 22px;color:#1f1f1f}.prcard p{font-size:12px;color:#777;margin:4px 22px 14px;max-width:420px;line-height:1.45}
.prrows{background:#fff;border-radius:5px;box-shadow:0 1px 4px rgba(0,0,0,.07);margin:0 1px 1px}
.prrow{display:flex;align-items:center;gap:12px;padding:12px 18px;border-top:1px solid #f1f1f1;font-size:12.5px}.prrow:first-child{border-top:0}.prrow b{font-weight:500;color:#222;min-width:96px}
.prrow code{font:11.5px ui-monospace,Menlo,monospace;color:#555;background:#f7f7f7;border:1px solid #eee;border-radius:5px;padding:4px 9px;max-width:230px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.prside{display:flex;flex-direction:column;gap:14px;padding-top:6px}
.prlink{display:flex;align-items:center;gap:10px;font-size:12.5px;font-weight:500;color:#333;cursor:pointer}.prlink:hover{color:var(--blue)}
.prlink svg{width:14px;height:14px;fill:none;stroke:#777;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.prside hr{border:0;border-top:1px solid #eee;margin:2px 0}.prmeta{font-size:12px;color:#777;margin:0}
:root[data-theme=dark] .prcard,:root[data-theme=dark] .prrows{background:var(--fill);border-color:var(--hair)}
@media(max-width:900px){.sec{flex-direction:column}.secnav{width:auto;padding:16px 20px 0;flex-direction:row;flex-wrap:wrap}.secnav hr,.secnav .sg{display:none}.secnav button{width:auto}.secmain{padding:20px}.pr{grid-template-columns:1fr}}

/* reading progress (thin black line) and the black bar that appears when text is highlighted */
.rprog{position:sticky;top:0;z-index:4;height:2px;margin-bottom:-2px;background:transparent}
.rprog i{display:block;height:2px;width:0;background:#111;transition:width .08s linear}
:root[data-theme=dark] .rprog i{background:#fff}
.rbar{display:none;position:sticky;bottom:0;margin-top:auto;z-index:4;background:#111;color:#fff;align-items:center;gap:10px;padding:12px 24px;box-shadow:0 -8px 24px rgba(0,0,0,.12)}
.rbar.show{display:flex}
.rbi{font-size:13px;color:#e6e6e6}
.rbb{height:32px;padding:0 14px;border-radius:5px;background:#fff;color:#111;font-size:13px;font-weight:600;white-space:nowrap}.rbb:hover{background:#e9e9e9}
.rbb.ghost{background:transparent;color:#fff;border:1px solid #555}.rbb.ghost:hover{background:#262626}
.rbx{width:30px;height:30px;border-radius:5px;color:#aaa;font-size:20px;line-height:1}.rbx:hover{background:#262626;color:#fff}
.rbs{height:32px;margin:0;max-width:240px;background:#222;color:#fff;border:1px solid #555;border-radius:5px;font-size:13px;padding:0 10px}
@media(max-width:700px){.rbar{flex-wrap:wrap}}
.rbi{white-space:nowrap;flex:none}.rbs{flex:0 1 220px;min-width:120px}

/* text controls at the top of the reader: a font pill and a number for the size */
.rtb{position:sticky;top:2px;z-index:3;display:flex;align-items:center;gap:14px;width:min(760px,100%);box-sizing:border-box;margin:0 auto;padding:14px 40px 4px;pointer-events:none}
.rtb>*{pointer-events:auto}
.rtpill{display:inline-flex;align-items:center;gap:8px;height:38px;padding:0 16px;border-radius:5px;background:#fff;font-size:14.5px;color:#1d1d1d;box-shadow:0 1px 3px rgba(0,0,0,.08),0 4px 14px rgba(0,0,0,.06)}
.rtpill svg{width:13px;height:13px;fill:none;stroke:#888;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.rtdiv{width:1px;height:26px;background:#dcdcdc}
.rtsq{width:38px;height:38px;border-radius:5px;background:#fff;font-size:15px;color:#1d1d1d;box-shadow:0 1px 3px rgba(0,0,0,.08),0 4px 14px rgba(0,0,0,.06)}
.rtpill:hover,.rtsq:hover{background:#fcfcfc}
.rtm{min-width:140px}
:root[data-theme=dark] .rtpill,:root[data-theme=dark] .rtsq{background:var(--fill);color:var(--strong);box-shadow:none}
.rd .rbody{font-family:var(--rf,"Times New Roman",Times,serif)!important;font-size:var(--rs,13px)!important;line-height:1.45}
.rd{padding-top:18px}

/* the slim input bar */
.ccompose{padding:12px 24px 16px;border-top:0}
.ccompose .rbox{display:flex;align-items:center;gap:12px;min-height:54px;padding:8px 8px 8px 22px;background:#fff;border:1px solid #ececec;border-radius:5px;box-shadow:0 1px 8px rgba(0,0,0,.05)}
.ccompose .rbox:focus-within{border-color:#dcdcdc;box-shadow:0 2px 14px rgba(0,0,0,.09)}
.ccompose textarea{flex:1;min-width:0;border:0;margin:0;padding:6px 0;background:none;font-size:15px;line-height:1.4;resize:none;max-height:180px}
.ccompose textarea::placeholder{color:#b3b3b3}
.cig{display:inline-flex;flex:none;border:1px solid #e6e6e6;border-radius:5px;overflow:hidden;background:#fff}
.cib{width:38px;height:36px;display:grid;place-items:center;color:#6b6b6b}.cib+.cib{border-left:1px solid #e6e6e6}.cib:hover{background:#f6f6f6;color:#222}
.cib.on{color:#fff;background:#d33}.cib svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ccompose .rsend{flex:none;width:40px;height:40px;border-radius:5px;background:#b9b9b9;color:#fff;display:grid;place-items:center}
.ccompose .rsend svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.ccompose .rsend.on{background:#111}.ccompose .rsend.on:hover{background:#000}.ccompose .rsend:disabled{opacity:.6}
:root[data-theme=dark] .ccompose .rbox,:root[data-theme=dark] .cig{background:var(--fill);border-color:var(--hair)}
:root[data-theme=dark] .ccompose .rsend.on{background:#fff;color:#111}
.ccompose textarea{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.ccompose textarea:not(:placeholder-shown){white-space:pre-wrap;overflow:auto}

/* Cases and Clients share one page: title and count, the New button, a full-width search, then cards */
.cs{max-width:760px}
.cs-head{align-items:flex-start;margin-bottom:20px}
.cs-head .btn{height:38px;padding:0 18px;border-radius:5px;font-size:14px;margin-top:4px}
.cs-search.wide{width:100%;margin:0 0 22px;box-sizing:border-box}
.cs-list{max-width:none}
.conflict{font-size:12.5px;color:var(--muted);margin:6px 0 0}.conflict.warnc{color:#b4570a}

/* smaller font and size controls */
.rtb{gap:10px;padding:12px 40px 2px}
.rtpill{height:30px;padding:0 12px;gap:6px;border-radius:5px;font-size:12.5px}
.rtpill svg{width:11px;height:11px}
.rtdiv{height:20px}
.rtsq{width:30px;height:30px;border-radius:5px;font-size:12.5px}
.rtm button{font-size:12.5px;padding:6px 10px}.rtm{min-width:120px}
.rd{padding-top:12px}

/* card pages, scaled to sit with the rest of the interface */
.cs{max-width:640px}
.pg:has(.cs){padding-top:26px}
.cs-head{margin-bottom:14px}
.cs-head h1{font-size:24px;letter-spacing:-.025em;margin:0 0 3px}
.cs-sub{font-size:13px}
.cs-head .btn{height:32px;padding:0 14px;border-radius:5px;font-size:13px;margin-top:0}
.cs-search{height:36px;border-radius:5px;padding:0 12px;font-size:13px}
.cs-search.wide{margin-bottom:16px}
.cs-search input{font-size:13px}.cs-search svg{width:14px;height:14px}
.cs-list{gap:12px}
.cs-card{border-radius:5px;padding:20px 24px 18px;box-shadow:0 4px 18px rgba(20,24,32,.05)}
.cs-top{margin-bottom:11px;gap:8px}
.cs-pill{height:23px;padding:0 10px;font-size:12px;gap:6px}
.dot{width:7px;height:7px}
.cs-more{width:26px;height:24px}.cs-more svg{width:16px;height:16px}
.cs-card h2{font-size:18px;margin:0 0 3px}
.cs-id{font-size:13px;margin:0 0 14px}
.cs-stats{padding-top:13px}
.cs-stat{padding-left:16px}
.cs-lab{font-size:12px;gap:6px;margin-bottom:4px}.cs-lab svg{width:14px;height:14px}
.cs-big{font-size:18px}
.cs-small{font-size:12px;margin-top:2px}

/* the reader: a fixed row for the text controls, then the text; no scrollbar (the thin line shows progress) */
.lpane{display:flex;flex-direction:column;overflow:hidden}
.lbar{flex:none;min-height:0}
.lbar:not(:empty){padding:12px 0 8px;border-bottom:.5px solid #eeeeea}
.lscroll{flex:1;min-height:0;overflow-y:auto;scrollbar-width:none;-ms-overflow-style:none}
.lscroll::-webkit-scrollbar{display:none}
.rtb{position:static;padding:0 40px;margin:0 auto;width:min(760px,100%);box-sizing:border-box}
.rd{padding-top:20px}
:root[data-theme=dark] .lbar:not(:empty){border-bottom-color:var(--hair)}

/* text controls: one small "Aa" button in the corner; the styled font and size pair opens from it */
.lpane{position:relative}
.lbar{position:absolute;top:12px;right:18px;z-index:6;flex:none}
.lbar:not(:empty){padding:0;border:0}
.rtaa{width:34px;height:30px;border-radius:5px;background:#fff;font-size:12.5px;font-weight:600;color:#333;letter-spacing:-.02em;box-shadow:0 1px 3px rgba(0,0,0,.08),0 3px 10px rgba(0,0,0,.05)}
.rtaa:hover{background:#fafafa}
.rtpanel{position:fixed;z-index:60;display:flex;align-items:center;gap:10px;background:#fff;padding:10px;border-radius:5px;box-shadow:0 12px 34px rgba(0,0,0,.16);border:.5px solid #ececec}
.rtpanel .rtpill,.rtpanel .rtsq{box-shadow:0 1px 3px rgba(0,0,0,.08),0 2px 8px rgba(0,0,0,.05)}
.rd{padding-top:30px}.rdtitle{padding-right:46px}
:root[data-theme=dark] .rtaa,:root[data-theme=dark] .rtpanel{background:var(--fill);color:var(--strong);border-color:var(--hair)}
.rd{padding-right:60px}.rdtitle{padding-right:0}

/* font and size live in the left rail while in Research */
.railtext{display:flex}.railtext:empty{display:none}
.rail .rtaa{width:32px;height:32px;border-radius:5px;font-size:12.5px;font-weight:600;color:#444;box-shadow:none;border:1px solid #eee;background:var(--bg);display:grid;place-items:center}
.rail .rtaa:hover{background:var(--fill)}
.lbar{display:none}
.rd{padding-right:40px}

/* Practice menu: a sticky, full-height side menu with a full-height divider */
.sec{display:flex;align-items:stretch;min-height:100%}
.secnav{position:sticky;top:0;align-self:flex-start;height:calc(100vh - 56px);box-sizing:border-box;width:250px;overflow-y:auto;border-right:.5px solid #e4e4e4;padding:44px 16px 32px 28px}
.secnav .sg{font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:#a0a0a0;padding:0 12px 8px}
.secnav hr{border:0;border-top:0;margin:16px 0 14px}
.secnav button{height:34px;border-radius:5px;padding:0 12px;font-size:12.5px;color:#777}
.secnav button svg{stroke:#999}
.secnav button:hover{background:#f7f7f7;color:#222}
.secnav button.on{background:#f3f3f3;color:#1f1f1f;font-weight:500}
:root[data-theme=dark] .secnav{border-right-color:var(--hair)}
.secmain{padding:46px 44px 64px 40px}
/* profile: dropdown sections and pills you tap */
.acclist{display:flex;flex-direction:column;gap:12px;max-width:720px}
.acc{border:1px solid #ececec;border-radius:5px;background:var(--bg)}
.acc summary{display:flex;align-items:center;gap:12px;padding:15px 20px;cursor:pointer;list-style:none}
.acc summary::-webkit-details-marker{display:none}
.acc summary b{font-size:14px;font-weight:600;color:#1f1f1f}.accs{margin-left:auto;font-size:12px;color:#8a8a8a}
.acc summary svg{width:15px;height:15px;fill:none;stroke:#888;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .15s}
.acc[open] summary svg{transform:rotate(180deg)}
.acc[open] summary{padding-bottom:8px}
.accb{padding:4px 20px 20px}
.pills{display:flex;flex-wrap:wrap;gap:8px}
.pillc{display:inline-flex;align-items:center;height:32px;padding:0 14px;border:1px solid #e3e3e3;border-radius:5px;font-size:13px;color:#444;cursor:pointer;background:var(--bg);user-select:none;margin:0}
.pillc[hidden]{display:none}.pillc input{display:none}.pillc:hover{border-color:#b9b9b9}
.pillc.on{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
:root[data-theme=dark] .pillc.on{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.accadd{display:flex;gap:10px;align-items:flex-end;margin-top:16px}.accadd>*{margin:0}.accadd input{flex:1;margin:0}
.accfind{margin-bottom:12px}
.profbar{position:sticky;bottom:0;display:flex;align-items:center;gap:14px;padding:14px 0 8px;background:linear-gradient(to bottom,transparent,var(--bg) 35%)}
:root[data-theme=dark] .acc{border-color:var(--hair)}

/* reading progress: a thin black line along the bottom of the reading pane */
.lpane{padding-bottom:2px}
.rprog{position:absolute;left:0;right:0;bottom:0;top:auto;height:2px;margin:0;z-index:7}
.rprog i{height:2px}
.lpane{padding-bottom:5px}.rprog{height:2px}

/* firm profile: open cards, a right-hand "on this page" menu, and a sticky bottom bar for the action */
.pcard{border:1px solid #ececec;border-radius:5px;background:var(--bg);padding:20px 22px 22px;scroll-margin-top:24px}
.pch{display:flex;align-items:baseline;gap:12px;margin-bottom:14px}.pch h2{font-size:14px;font-weight:600;margin:0;color:#1f1f1f;text-transform:none;letter-spacing:0}
.pch .accs{margin-left:auto;font-size:12px;color:#8a8a8a}
.pcb>p.mute:first-child{margin-top:0}
.acclist{gap:16px}
.sec .secmain{max-width:none;flex:1}
.secside{position:sticky;top:0;align-self:flex-start;height:calc(100vh - 56px);box-sizing:border-box;width:230px;flex:none;border-left:.5px solid #e4e4e4;padding:44px 16px 32px 22px;display:flex;flex-direction:column;gap:2px;overflow-y:auto}
.secside .sg{font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:#a0a0a0;padding:0 12px 8px}
.secside a{display:block;padding:8px 12px;border-radius:5px;font-size:12.5px;color:#777;cursor:pointer}
.secside a:hover{background:#f7f7f7;color:#222}.secside a.on{background:#f3f3f3;color:#1f1f1f;font-weight:500}
:root[data-theme=dark] .secside{border-left-color:var(--hair)}
.profbar{position:sticky;bottom:0;z-index:8;display:flex;align-items:center;gap:14px;padding:12px 28px;margin:0;background:var(--bg);border-top:.5px solid #e4e4e4}
:root[data-theme=dark] .profbar{border-top-color:var(--hair)}
@media(max-width:1100px){.secside{display:none}}
.sec.hasbar .secnav,.sec.hasbar .secside{height:calc(100vh - 56px - 58px)}
.profbar{flex-direction:row-reverse;justify-content:flex-end;padding-left:40px}.profbar .grow{display:none}

/* the workspace menu: client and case switch, then the law designators */
.drawer>*{width:290px}.dslot{padding:14px 14px 18px}
.cswitch{display:flex;flex-direction:column;gap:8px;padding:2px 0 10px;border-bottom:.5px solid #ececec;margin-bottom:4px}
.cswitch .rhd{margin:0 0 2px;padding:0 2px}
.swl{display:flex;flex-direction:column;gap:4px;font-size:11.5px;color:var(--muted);margin:0}
.swl select{margin:0;height:34px;font-size:13px;border-radius:5px;padding:0 10px;width:100%}
.dfilters{border-top:0;padding-top:0}
.dslot .rhd{font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:600;margin:16px 0 6px}
.dslot .rhd.sub{letter-spacing:0;text-transform:none;font-size:12.5px;font-weight:500;margin:12px 0 4px}
:root[data-theme=dark] .cswitch{border-bottom-color:var(--hair)}
.secsub{margin-bottom:22px}
.secmain>h1+.mute{margin:0 0 22px}
.acclist .pcb .masonry{display:block}

/* on pages with a bottom action bar the round chat button sits inside that bar, at its right end */
body.has-pbar .fab{right:26px;bottom:7px;width:44px;height:44px;box-shadow:0 2px 8px rgba(30,70,200,.28)}
body.has-pbar.has-fab .chat{bottom:68px}

/* the bottom bar: actions on the left, the chat button on the right, same padding either side, everything centred */
.profbar{flex-direction:row;justify-content:space-between;align-items:center;gap:16px;padding:12px 32px;min-height:58px;box-sizing:border-box}
.profbar .pbl{display:flex;flex-direction:row-reverse;justify-content:flex-end;align-items:center;gap:12px}
.profbar .btn{height:34px;margin:0}
.pbchat{flex:none;width:34px;height:34px;border-radius:50%;background:var(--blue);color:#fff;display:grid;place-items:center}
.pbchat svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.pbchat:hover{background:#1639ad}
body.has-pbar .fab{display:none}
body.has-pbar.has-fab .chat{bottom:68px}
body.has-pbar.has-fab .chat{right:32px;bottom:64px}

/* card sections: a grey panel with a title and a line of explanation, and the content on a white panel inside it */
.pcard{background:#f7f7f7;border:1px solid #efefef;border-radius:5px;padding:22px 0 0;overflow:hidden}
.pch{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;padding:0 26px;margin-bottom:0}
.pch h2{font-size:15px;font-weight:600;color:#1a1a1a}
.pch .accs{margin-left:auto;font-size:12px;color:#8a8a8a}
.pch .pdesc{flex:0 0 100%;font-size:13px;line-height:1.45;color:#7a7a7a;margin:2px 0 16px;max-width:560px}
.pcb{background:#fff;border-radius:5px;box-shadow:0 1px 4px rgba(0,0,0,.07);margin:0 1px 1px;padding:20px 24px 24px}
.pcb>p.mute:first-child{margin-top:0}
:root[data-theme=dark] .pcard{background:var(--fill);border-color:var(--hair)}:root[data-theme=dark] .pcb{background:var(--bg)}

/* Overview: an editorial page. Small spaced labels, serif headings, big light figures, off-white panels with square white cards */
.pg:has(.ov){max-width:none;padding:0}
.ov{max-width:940px;margin:0 auto;padding:56px 40px 96px;color:#1a1a1a}
.ov h1,.ov h2,.ov h3,.ov-stat b{font-family:"Newsreader NF","Newsreader",Georgia,"Times New Roman",serif;font-weight:400;letter-spacing:-.01em;color:#1a1a1a}
.ov-eb{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#777;margin:0}
.ov-lead{font-size:13px;line-height:1.55;color:#444;margin:0}
.ov-small{font-size:11px;line-height:1.55;color:#888;margin:12px 0 0}
.ov-txt{font-size:12.5px;line-height:1.55;color:#666;margin:10px 0 0}
.ov-top{display:grid;grid-template-columns:150px minmax(0,1fr) minmax(0,1fr);gap:28px;align-items:start;padding-bottom:56px}
.ov-top h1{font-size:30px;line-height:1.18;margin:0}
.ov-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 28px;padding-bottom:64px}.ov-stats.ov-stats3{grid-template-columns:repeat(3,minmax(0,1fr))}
.ov-stat{display:block;cursor:pointer;text-decoration:none;color:inherit}
.ov-stat b{display:block;font-size:50px;line-height:1.05;padding-bottom:14px;border-bottom:1px solid #eee;margin-bottom:12px;font-weight:300}
.ov-stat strong{display:block;font-size:12px;font-weight:600;color:#1a1a1a}.ov-stat span{display:block;font-size:11px;color:#8a8a8a;margin-top:3px}
.ov-stat:hover b{color:var(--blue)}
.ov-panel{background:#fafaf8;padding:44px 36px 36px;margin-bottom:44px}
.ov-panel h2{font-size:30px;line-height:1.15;margin:16px 0 0;max-width:15em}
.ov-panel>.ov-lead{margin:14px 0 30px;max-width:34em;font-size:12.5px;color:#555}
.ov-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2px}
.ov-card{background:#fff;padding:24px 22px 22px;min-height:290px;display:flex;flex-direction:column;position:relative}
.ov-card.click{cursor:pointer}.ov-card.click:hover .ov-more{text-decoration:underline}
.ov-card h3{font-size:23px;line-height:1.2;margin:22px 0 0}
.ov-more{margin-top:auto;padding-top:24px;font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#1a1a1a}
.ov-card:nth-child(2) .ov-more{color:var(--blue)}
.ov-accent{background:var(--blue);color:#fff}
.ov-accent h3{color:#fff;font-size:25px;margin-top:20px}.ov-accent .ov-txt{color:rgba(255,255,255,.88)}
.ov-mark{width:22px;height:22px;fill:none;stroke:#fff;stroke-width:2.4;stroke-linecap:butt}
.ov-btn{margin-top:auto;align-self:flex-start;height:30px;padding:0 14px;background:#fff;color:#1a1a1a;font-size:11px;font-weight:600;border-radius:3px}
.ov-btn:hover{background:#eee}
.ov-wide{grid-column:1/-1;min-height:0;padding:8px 22px}
.ov-cards .ov-wide,.ov-panel>.ov-wide{display:block}
.ov-rows{display:flex;flex-direction:column}
.ov-row{display:grid;grid-template-columns:minmax(0,1fr) auto 60px;gap:18px;align-items:baseline;padding:15px 0;border-top:1px solid #f0f0ec;cursor:pointer;font-size:13px;color:#1a1a1a;text-decoration:none}
.ov-row:first-child{border-top:0}.ov-row em{font-style:normal;font-size:11px;color:#999}.ov-row i{font-style:normal;font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;text-align:right}
.ov-row:hover i{color:var(--blue)}
@media(max-width:900px){.ov{padding:32px 20px 64px}.ov-top{grid-template-columns:1fr}.ov-stats{grid-template-columns:1fr 1fr;row-gap:28px}.ov-stats.ov-stats3{grid-template-columns:1fr 1fr}.ov-cards{grid-template-columns:1fr}.ov-card{min-height:0}.ov-panel{padding:28px 18px}}

/* settings pages sized like the Overview: 13px text, 10-11px labels, slim fields, compact cards */
.secmain{font-size:13px;padding:40px 40px 64px 36px}
.secmain h1,.sech{font-size:24px;margin:0 0 4px}
.secmain .secsub,.secmain>h1+.mute{font-size:12.5px;color:#777;margin:0 0 18px}
.secmain label,.secmain .field label{font-size:11.5px;color:#777;margin:0 0 4px;font-weight:400}
.secmain input,.secmain select,.secmain textarea{font-size:13px;height:34px;padding:0 12px;border-radius:5px;margin:0 0 12px}
.secmain textarea{height:auto;min-height:64px;padding:9px 12px;line-height:1.5}
.secmain input[type=checkbox]{height:auto;width:auto;margin:0}
.secmain .chk,.secmain label.chk{font-size:13px;color:#333;margin:2px 0 8px}
.secmain .mute,.secmain .small{font-size:12px;line-height:1.5}
.secmain .row{gap:12px}
.secmain .btn{height:32px;padding:0 14px;font-size:12.5px;border-radius:5px}
.acclist{gap:14px}
.pcard{border-radius:5px;padding:18px 0 0}
.pch{padding:0 20px}
.pch h2{font-size:13.5px}
.pch .pdesc{font-size:12px;margin:2px 0 12px}
.pch .accs{font-size:11.5px}
.pcb{border-radius:5px;padding:16px 20px 18px}
.pillc{height:28px;padding:0 12px;font-size:12px}
.pills{gap:6px}
.accadd{margin-top:12px}.accadd>*{margin:0}
.secnav button,.secside a{font-size:12.5px}
.profbar{padding:10px 32px;min-height:52px}
.profbar .btn{height:32px;font-size:12.5px}
.pbchat{width:32px;height:32px}
.sec.hasbar .secnav,.sec.hasbar .secside{height:calc(100vh - 56px - 52px)}
.secmain .thumbs .thumb{width:72px;height:72px}
.secmain .masonry,.secmain .acclist .masonry{font-size:13px}
.secmain table th,.secmain table td{font-size:12.5px;padding:8px 10px}

/* case template: a second drawer, wider than the menu, holding a Word-style page */
.padbar{width:0;flex:none;overflow:hidden;border-right:0 solid var(--hair);display:flex;flex-direction:column;transition:width .16s ease;background:var(--bg)}
.frame.popen .padbar{width:380px;border-right-width:1px}
.padbar>*{width:380px;flex:none}.padslot{flex:1;min-height:0;display:flex;flex-direction:column;padding:14px 14px 12px}
.padhead{display:flex;align-items:center;justify-content:space-between;font-size:13px;margin:0 0 10px}.padstate{font-size:11.5px}
.padtools{display:flex;align-items:center;gap:2px;margin:0 0 10px}.ptb{height:28px;min-width:28px;padding:0 7px;border:0;background:transparent;border-radius:5px;font-size:13px;color:#333;cursor:pointer}
.ptb:hover{background:#f0f0f0}.ptb.pb{font-weight:700}.ptb.pi{font-style:italic}.ptb.pu{text-decoration:underline}.psep{width:1px;height:16px;background:var(--hair);margin:0 5px}
.padpage{flex:1;min-height:0;overflow-y:auto;background:#fff;border:1px solid var(--hair);border-radius:5px;box-shadow:0 1px 3px rgba(0,0,0,.05)}
.padedit{min-height:100%;padding:26px 28px 40px;font-size:13px;line-height:1.65;outline:0;box-sizing:border-box}.padedit.over{background:#f6f8ff;box-shadow:inset 0 0 0 2px #1e47d1}
.padedit h1{font-size:19px;margin:0 0 12px;line-height:1.25}.padedit h2{font-size:14px;margin:18px 0 4px}.padedit p{margin:0 0 8px}
.padedit blockquote{margin:8px 0 12px;padding:2px 0 2px 12px;border-left:3px solid #1e47d1;color:#333;font-size:12.5px}.padedit ul,.padedit ol{margin:0 0 8px;padding-left:20px}
.padnote{font-size:11.5px;margin:10px 2px 0;line-height:1.5}.rsrc[draggable=true],.src[draggable=true]{cursor:grab}

/* Overview: the same sans-serif as the rest of the app (no serif headings) */
.ov h1,.ov h2,.ov h3,.ov-stat b{font-family:var(--font);font-stretch:100%;font-weight:600;letter-spacing:-.02em;color:var(--strong)}
.ov-stat b{font-weight:500}
.ov h1,.ov h2,.ov h3{font-weight:500}.ov-stat b{font-weight:300;font-size:44px}
.ov-top h1{font-size:26px}.ov-panel h2{font-size:24px;max-width:18em}.ov-card h3{font-size:18px}

/* ---- Document templates, case documents and the court-document editor ---- */
.tpl,.pg-docs{font-size:13px}
.tfilters,.dbar{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 14px}.tfilters input,.dbar input{flex:1 1 220px;min-width:180px}
.tfilters select,.dbar select{height:34px;font-size:13px;padding:0 10px;border-radius:5px;max-width:220px}.tfilters input,.dbar input{height:34px;font-size:13px;border-radius:5px;padding:0 12px}
.tcount{margin:0 0 10px}.tgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.tcard{border:1px solid var(--hair);border-radius:5px;background:#fff;padding:16px 18px;display:flex;flex-direction:column;gap:6px}
.tcard h3{font-size:14px;font-weight:600;letter-spacing:-.01em;margin:0;line-height:1.3}.ttop{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}.tnum{font-size:11px;color:#777;white-space:nowrap}
.tmeta{font-size:11.5px;color:#777;margin:0}.tdesc{font-size:12.5px;color:#555;margin:0;line-height:1.5;flex:1}
.tpills{display:flex;gap:6px;flex-wrap:wrap;margin-top:4px}.dpill{display:inline-block;font-size:10.5px;padding:2px 9px;border-radius:5px;background:#f1f1f1;color:#555;white-space:nowrap}.dpill:empty{display:none}
.dpill.warn,.dpill.missing{background:#fdf1dc;color:#8a5a00}.dpill.case{background:#e9effd;color:#1e47d1}.dpill.atty{background:#e6f4ea;color:#1b6b3a}.dpill.ai{background:#f1eafc;color:#5b2ea6}.dpill.verify{background:#fdf1dc;color:#8a5a00}
.tacts{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:8px}.tacts .btn{height:32px;padding:0 14px;font-size:12.5px;border-radius:5px;display:inline-flex;align-items:center;text-decoration:none}
.lnk{background:none;border:0;padding:0;color:var(--blue);font-size:12.5px;cursor:pointer;text-decoration:none}.lnk:hover{text-decoration:underline}
.tmore{text-align:center;margin:18px 0}.tdet .tdrow{display:grid;grid-template-columns:130px 1fr;gap:10px;padding:7px 0;border-bottom:1px solid var(--hair);font-size:12.5px}.tdet .tdrow b{font-weight:500;color:#777}
.lic{padding:12px 0;border-bottom:1px solid var(--hair)}.lic b{margin-right:8px}.lic p{margin:4px 0}
.fsin.wide{width:min(720px,100%)}.tpick{display:flex;flex-direction:column;gap:8px;max-height:52vh;overflow-y:auto;margin-top:8px}
.tchoice{display:flex;flex-direction:column;gap:2px;text-align:left;border:1px solid var(--hair);background:#fff;border-radius:5px;padding:11px 14px;cursor:pointer;font-size:13px}.tchoice:hover{border-color:#1e47d1}
.plan .prow,.prow{margin:0 0 12px}.prow label{display:flex;align-items:center;gap:8px;font-size:12px;color:#555;margin:0 0 4px}.prow small{display:block;margin:0 0 4px}.prow.need input,.prow.need textarea{border-color:#c0392b}
.prow input,.prow textarea,.prow select{width:100%;font-size:13px}.planopt{margin:0 0 14px}.planopt summary{cursor:pointer;font-size:12.5px;color:#555;margin:6px 0 12px}
/* a case's documents */
.dchips{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 12px}.dchip{border:1px solid var(--hair);background:#fff;border-radius:5px;padding:5px 12px;font-size:12px;cursor:pointer;color:#555}.dchip.on{background:#1a1a1a;color:#fff;border-color:#1a1a1a}
.dlist{border:1px solid var(--hair);border-radius:5px;background:#fff;overflow:hidden}.drow{display:flex;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid var(--hair)}.drow:last-child{border-bottom:0}
.dic{width:30px;height:30px;border-radius:5px;background:#f4f4f4;display:grid;place-items:center;flex:none}.dic svg{width:16px;height:16px}
.dmain{flex:1;min-width:0}.dname{font-size:13px;font-weight:500;cursor:pointer;color:var(--strong)}.dmeta{font-size:11.5px;color:#888;margin-top:2px}.dacts{display:flex;gap:12px;flex-wrap:wrap}
.dempty{padding:36px;text-align:center}.org label{display:block;font-size:12px;color:#555;margin:10px 0 4px}.org select,.org input{width:100%}
.docsnav{margin:0 0 10px}
/* the editor */
.de{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:0;min-height:calc(100vh - 56px);align-items:start}
.demain{padding:14px 24px 60px;background:#f6f6f7;min-height:calc(100vh - 56px)}.debar{display:flex;align-items:center;gap:10px;margin:0 0 10px;flex-wrap:wrap}
.detitle{flex:1 1 240px;min-width:160px;height:34px;font-size:14px;font-weight:600;border:1px solid transparent;background:transparent;border-radius:5px;padding:0 8px}.detitle:hover,.detitle:focus{border-color:var(--hair);background:#fff}
.debar .btn{height:32px;padding:0 14px;font-size:12.5px;border-radius:5px}.dstate{min-width:70px}.grow{flex:1}
.detools{display:flex;gap:2px;align-items:center;margin:0 0 10px;flex-wrap:wrap}.dewarn{margin:0 0 10px;font-size:12px}
.depage{width:8.5in;max-width:100%;min-height:11in;margin:0 auto;background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.12);box-sizing:border-box;color:#111}
.debody{outline:0;min-height:5in;white-space:pre-wrap;word-wrap:break-word}.debody>div{min-height:1em}
.debody>div[data-p="# "]{text-align:center;font-weight:700;text-transform:uppercase;margin:12px 0}.debody>div[data-p="## "]{text-align:center;font-weight:700;text-transform:uppercase;margin:14px 0 4px}
.debody>div[data-p="### "]{font-weight:700;margin:8px 0 2px}.debody>div[data-p="> "]{margin:6px 40px;line-height:1.35}.debody>div[data-p="- "]{padding-left:36px;text-indent:-14px}.debody>div[data-p="- "]:before{content:"\2022  "}
.pv{border-radius:3px;padding:0 1px}.pv-case{background:#e9effd}.pv-atty{background:#e6f4ea}.pv-ai{background:#f1eafc;box-shadow:inset 2px 0 0 #7a4fd1}.pv-verify{background:#fdf1dc;box-shadow:inset 0 -2px 0 #e0a030}.pv-missing{background:#fde4e2;color:#9a1d12;box-shadow:inset 0 -2px 0 #d9534f}
.pv-missing:before{content:"[";}.pv-missing:after{content:"]";}.pv-verify:before{content:"[";}.pv-verify:after{content:"]";}
.decap{margin:0 0 18px;line-height:1.3}.decap .cc{text-align:center;font-weight:700;margin:0 0 10px}.cbox{display:grid;grid-template-columns:1fr 1fr}.cl{border-bottom:1.5px solid #111;border-right:1.5px solid #111;padding:0 10px 12px 0}.cl .ci{padding-left:70px;margin:4px 0 10px}.cl .cv{padding-left:40px;margin:4px 0 10px}.cr{padding:0 0 12px 14px}.cr>*{margin:0 0 10px;display:block}
.desig{margin:22px 0 0 50%;line-height:1.3}.desig .sl{margin:18px 0 4px}.defoot{margin:26px 0 0;font-size:10.5px;color:#999;text-align:center;font-family:var(--font)}
.deside{border-left:1px solid var(--hair);background:#fff;min-height:calc(100vh - 56px);position:sticky;top:56px;max-height:calc(100vh - 56px);overflow-y:auto}.detabs{display:flex;gap:2px;padding:10px 12px 0;border-bottom:1px solid var(--hair);position:sticky;top:0;background:#fff}
.dtab{border:0;background:transparent;padding:8px 9px;font-size:12px;color:#777;cursor:pointer;border-bottom:2px solid transparent}.dtab.on{color:#111;border-bottom-color:#111}.depane{padding:14px 16px 40px;font-size:12.5px}
.depane label{display:block;font-size:11.5px;color:#777;margin:10px 0 4px}.depane input[type=text],.depane select,.depane textarea{width:100%;font-size:12.5px}.depane .chk{display:flex;gap:6px;align-items:center;margin:8px 0}
.chk.ok b{color:#1b6b3a}.chk.warn b{color:#8a5a00}.chk.fail b{color:#b3261e}.chk.info b{color:#555}.depane .chk{flex-direction:column;align-items:flex-start;gap:2px;border-bottom:1px solid var(--hair);padding:8px 0;margin:0}
.legend{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 10px}.legend .pv{padding:2px 8px;font-size:11px}.prv{display:flex;justify-content:space-between;gap:8px;padding:7px 0;border-bottom:1px solid var(--hair)}
.ver{padding:10px 0;border-bottom:1px solid var(--hair);display:flex;flex-direction:column;gap:3px}.exrow{display:flex;gap:6px;margin:0 0 6px;align-items:center}.exrow .exa{width:46px;flex:none}
.agrid{display:flex;gap:6px;flex-wrap:wrap;margin:6px 0}.agrid .btn{height:30px;padding:0 11px;font-size:12px;border-radius:5px}.ares{margin-top:14px}.astat{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:0 0 8px}.atext{white-space:pre-wrap;line-height:1.55;margin:0 0 10px}
.aitem{padding:8px 0;border-bottom:1px solid var(--hair);display:flex;flex-direction:column;gap:3px}.aitem b{margin-right:8px;font-weight:500}.diff{padding:8px 0;border-bottom:1px solid var(--hair)}.diff .dm{background:#fde4e2;padding:4px 6px;margin:3px 0;white-space:pre-wrap;border-radius:4px}.diff .dp{background:#e6f4ea;padding:4px 6px;margin:3px 0;white-space:pre-wrap;border-radius:4px}
@media (max-width:1000px){.de{grid-template-columns:1fr}.deside{position:static;max-height:none}}
@media print{body *{visibility:hidden}.depage,.depage *{visibility:visible}.depage{position:absolute;left:0;top:0;width:100%;box-shadow:none;margin:0;min-height:0}.defoot{display:none}.pv{background:none!important;box-shadow:none!important}.pv-missing,.pv-verify{color:#000}}

/* photo uploads: one tidy row each */
.uprow{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px 24px;align-items:center;padding:14px 0;border-bottom:1px solid var(--hair)}.uprow:last-of-type{border-bottom:0}
.uplabel{font-size:13px;color:#333;line-height:1.45}.upctl{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end}.upname{font-size:12px;color:#888;min-width:110px;max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.upctl .btn{height:32px;padding:0 14px;font-size:12.5px;border-radius:5px;margin:0}.upctl .btn[disabled]{opacity:.4;cursor:default}
@media (max-width:700px){.uprow{grid-template-columns:1fr}.upctl{justify-content:flex-start}}
/* the rail icons back to a comfortable size; the case template drawer wider */
.railbtn{width:40px;height:40px;border-radius:5px}.railbtn svg{width:19px;height:19px}.railtext .railbtn{width:40px;height:40px}
.frame.popen .padbar{width:480px}.padbar>*{width:480px}

.tpicker{margin-top:18px;padding-top:14px;border-top:1px solid var(--hair)}.tpicker h3{font-size:13.5px;font-weight:600;margin:0 0 2px}.tpicker select{width:100%;font-size:13px;margin:8px 0}
.tpsearch{display:flex;gap:8px;margin-top:8px}.tpsearch input{flex:1 1 55%;min-width:0;height:34px;font-size:13px;border-radius:5px}.tpsearch select{flex:1 1 45%;margin:0;height:34px;border-radius:5px}
.tsfield{margin:14px 0}.tsfield label{display:block;font-size:12px;color:#555;margin:0 0 6px}.tsel select{width:100%;margin:8px 0;font-size:13px}.tsel .tpsearch{margin-top:0}

/* the notification bell and the timer sit in the top bar, left of the name menu */
.tbr .abbell,.tbr .tbtn{width:36px;height:36px;padding:0;border:1px solid var(--hair);border-radius:5px;color:var(--strong);background:var(--bg);display:grid;place-items:center;position:relative}
.tbr .abbell:hover,.tbr .tbtn:hover,.tbr .tbtn[aria-expanded=true]{background:var(--fill)}.tbr .abbell svg,.tbr .tbtn svg{width:17px;height:17px}
.tbr .tbtn.on{width:auto;padding:0 10px;gap:6px;display:inline-flex;border-color:var(--blue);color:var(--blue)}.tbr .tclock{font-size:12.5px}
.tbr .tpanel{right:0;left:auto;top:calc(100% + 10px);bottom:auto}
.npanel{left:auto!important;right:22px!important;top:64px!important;bottom:auto!important}
.tbr .tbtn svg{display:block}.tbr .tbtn:not(.on){align-content:center}
.tbr .tclock:empty{display:none}

.defoot{color:#777}
/* ---------------------------------------------------------------- dark mode: the screens added later used fixed light colours */
:root[data-theme=dark] .tbmenu button,:root[data-theme=dark] details.acct>summary,:root[data-theme=dark] .tb .tbmenu button{color:#aab2be}
:root[data-theme=dark] .tbmenu button.on,:root[data-theme=dark] .tbmenu button:hover{color:#fff}
:root[data-theme=dark] .rlink,:root[data-theme=dark] .lnk,:root[data-theme=dark] label.lnk,:root[data-theme=dark] .tpicker .lnk,:root[data-theme=dark] .rlink.addlaw{color:#8aa4ff}
/* Overview */
:root[data-theme=dark] .ov-lead{color:#b9c0cb}:root[data-theme=dark] .ov-stat strong,:root[data-theme=dark] .ov h1,:root[data-theme=dark] .ov h2,:root[data-theme=dark] .ov h3,:root[data-theme=dark] .ov-stat b{color:#fff}
:root[data-theme=dark] .ov-stat b{border-bottom-color:var(--hair)}:root[data-theme=dark] .ov-stat span,:root[data-theme=dark] .ov-small,:root[data-theme=dark] .ov-txt,:root[data-theme=dark] .ov-eb{color:#98a1ad}
:root[data-theme=dark] .ov-panel{background:var(--card)}:root[data-theme=dark] .ov-card{background:#131a25;color:#dfe3ea}:root[data-theme=dark] .ov-more{color:#fff}
/* Cases and Clients cards */
:root[data-theme=dark] .cs-card{background:var(--card);border-color:var(--hair)}:root[data-theme=dark] .cs-card h2,:root[data-theme=dark] .cs-big{color:#fff}
:root[data-theme=dark] .cs-stat,:root[data-theme=dark] .cs-card p,:root[data-theme=dark] .cs-card small{color:#98a1ad}
/* Practice and settings pages */
:root[data-theme=dark] .secmain h1,:root[data-theme=dark] .sech,:root[data-theme=dark] .pch h2,:root[data-theme=dark] .prcard h3,:root[data-theme=dark] .prrow b{color:#fff}
:root[data-theme=dark] .prlink,:root[data-theme=dark] .secside a,:root[data-theme=dark] .secnav a,:root[data-theme=dark] .secnav button{color:#b9c0cb}
:root[data-theme=dark] .prcard,:root[data-theme=dark] .pcard{background:#131a25;border-color:var(--hair)}:root[data-theme=dark] .pcb{background:var(--card)}
:root[data-theme=dark] .secmain label,:root[data-theme=dark] .secmain .chk,:root[data-theme=dark] label.chk,:root[data-theme=dark] .uplabel,:root[data-theme=dark] .pdesc{color:#b9c0cb}
:root[data-theme=dark] .uprow{border-bottom-color:var(--hair)}:root[data-theme=dark] .upname{color:#8d939b}
:root[data-theme=dark] .profbar{background:var(--bg);border-top-color:var(--hair)}
/* buttons that were outlined in dark ink */
:root[data-theme=dark] .btn.alt,:root[data-theme=dark] .tacts .btn.alt,:root[data-theme=dark] .agrid .btn,:root[data-theme=dark] .debar .btn.alt{background:transparent;color:#e6e9ef;border-color:rgba(255,255,255,.28)}
:root[data-theme=dark] .btn.alt:hover,:root[data-theme=dark] .tacts .btn.alt:hover{background:#fff;color:#0d121a;border-color:#fff}
:root[data-theme=dark] .ptb{color:#cfd5de}:root[data-theme=dark] .ptb:hover{background:rgba(255,255,255,.08)}
/* Templates, documents, create flow */
:root[data-theme=dark] .tcard,:root[data-theme=dark] .dlist,:root[data-theme=dark] .tchoice{background:var(--card);border-color:var(--hair);color:#dfe3ea}
:root[data-theme=dark] .tcard h3,:root[data-theme=dark] .ttop h3,:root[data-theme=dark] .tchoice b,:root[data-theme=dark] .dname{color:#fff}
:root[data-theme=dark] .tmeta,:root[data-theme=dark] .tdesc,:root[data-theme=dark] .tnum,:root[data-theme=dark] .dmeta,:root[data-theme=dark] .tdet .tdrow b{color:#98a1ad}
:root[data-theme=dark] .tdesc{color:#b9c0cb}:root[data-theme=dark] .tchoice:hover{border-color:#8aa4ff}
:root[data-theme=dark] .dchip{background:var(--card);color:#b9c0cb;border-color:var(--hair)}:root[data-theme=dark] .dchip.on{background:#fff;color:#0d121a;border-color:#fff}
:root[data-theme=dark] .dic{background:rgba(255,255,255,.07);color:#cfd5de}:root[data-theme=dark] .drow,:root[data-theme=dark] .tdet .tdrow,:root[data-theme=dark] .lic{border-bottom-color:var(--hair)}
:root[data-theme=dark] .prow label,:root[data-theme=dark] .planopt summary,:root[data-theme=dark] .org label,:root[data-theme=dark] .tsfield label,:root[data-theme=dark] .depane label{color:#aab2be}
:root[data-theme=dark] .dpill{background:#222b37;color:#cfd5de}:root[data-theme=dark] .dpill.warn,:root[data-theme=dark] .dpill.missing,:root[data-theme=dark] .dpill.verify{background:#3a2d12;color:#f2c98a}
:root[data-theme=dark] .dpill.case{background:#1c2a55;color:#9db4ff}:root[data-theme=dark] .dpill.atty{background:#173a28;color:#8fe0b0}:root[data-theme=dark] .dpill.ai{background:#2b2045;color:#c9b0ff}
/* the editor: dark surround, the document itself stays white like paper */
:root[data-theme=dark] .demain{background:var(--page)}:root[data-theme=dark] .deside{background:var(--card);border-left-color:var(--hair)}:root[data-theme=dark] .detabs{background:var(--card);border-bottom-color:var(--hair)}
:root[data-theme=dark] .dtab{color:#98a1ad}:root[data-theme=dark] .dtab.on{color:#fff;border-bottom-color:#fff}:root[data-theme=dark] .depane,:root[data-theme=dark] .depane b{color:#dfe3ea}
:root[data-theme=dark] .detitle{color:#fff}:root[data-theme=dark] .detitle:hover,:root[data-theme=dark] .detitle:focus{background:var(--card);border-color:var(--hair)}
:root[data-theme=dark] .depage,:root[data-theme=dark] .padpage{background:#fff;color:#111}:root[data-theme=dark] .padedit,:root[data-theme=dark] .padedit h1,:root[data-theme=dark] .padedit h2,:root[data-theme=dark] .padedit p{color:#111}
:root[data-theme=dark] .chk.ok b{color:#6fd3a0}:root[data-theme=dark] .chk.warn b{color:#f2c98a}:root[data-theme=dark] .chk.fail b{color:#ff9a90}:root[data-theme=dark] .chk.info b{color:#cfd5de}
:root[data-theme=dark] .depane .chk,:root[data-theme=dark] .prv,:root[data-theme=dark] .ver,:root[data-theme=dark] .aitem,:root[data-theme=dark] .diff{border-bottom-color:var(--hair)}
:root[data-theme=dark] .legend .pv{color:#1a1a1a}:root[data-theme=dark] .diff .dm{background:#3a1f1d;color:#ffb4ac}:root[data-theme=dark] .diff .dp{background:#173a28;color:#a8ecc4}
:root[data-theme=dark] .padhead,:root[data-theme=dark] .padhead b{color:#fff}:root[data-theme=dark] .padbar{background:var(--bg)}
:root[data-theme=dark] .tpicker,:root[data-theme=dark] .tpicker h3{color:#fff;border-top-color:var(--hair)}
:root[data-theme=dark] .warn{background:#3a2d12;color:#f2c98a}:root[data-theme=dark] .notice{color:#cfd5de}
:root[data-theme=dark] .secnav button.on,:root[data-theme=dark] .secside a.on,:root[data-theme=dark] .tbmenu button.on{background:rgba(255,255,255,.09);color:#fff}
.ov-accent h3,.ov-accent h2,.ov-accent p,.ov-accent .ov-txt{color:#fff}.ov-accent .ov-txt{color:rgba(255,255,255,.82)}
.secnav .sg,.secside .sg{color:#7d8591}.rd .rdmeta{color:#7d8591}
:root[data-theme=dark] .secnav .sg,:root[data-theme=dark] .secside .sg{color:#8d939b}:root[data-theme=dark] .rd .rdmeta{color:#8d939b}

/* the law, broken into its lettered and numbered parts */
.rbody .lwp{margin:0 0 .7em;white-space:pre-wrap}.rbody .lwp.intro:empty{display:none}.rbody .lwp.intro{margin-bottom:.9em}
.rbody .lwp.d1{margin-left:1.6em}.rbody .lwp.d2{margin-left:3.2em}.rbody .lwp.d3{margin-left:4.8em}.rbody .lwp.d4{margin-left:6.2em}
.rbody .lwp .cm{margin-right:.15em}
/* the conversation column is narrower than the reader */
.stage.work.chaton{grid-template-columns:minmax(0,1fr) clamp(300px,30%,400px)}
/* the more side panels are open, the more of what is left goes to the conversation */
.frame.dopen:not(.popen) .stage.work.chaton,.frame.popen:not(.dopen) .stage.work.chaton{grid-template-columns:minmax(0,1fr) clamp(320px,36%,520px)}
.frame.dopen.popen .stage.work.chaton{grid-template-columns:minmax(0,1fr) clamp(340px,42%,640px)}
.tfoot{text-align:center;margin:8px 0 32px}

/* ---- sign-in: roomier, one calm card, no browser-blue autofill ---- */
.login{width:min(440px,calc(100% - 32px));max-width:none;min-height:0;margin:max(8vh,48px) auto 48px;padding:52px 48px 40px;border:1px solid var(--hair);border-radius:5px;background:var(--bg);box-shadow:0 1px 2px rgba(20,30,60,.04),0 24px 60px rgba(20,30,60,.07);text-align:center}
:root[data-theme=dark] .login{box-shadow:0 24px 60px rgba(0,0,0,.4)}
.login .brand{font:600 28px/1.1 var(--font);letter-spacing:-.035em;margin:0 0 12px}
.login h1{font:400 15px/1.5 var(--font);color:var(--muted);margin:0 0 40px}
.login h1+p.mute{margin:-24px 0 28px;font-size:13.5px;line-height:1.55}.login p.mute.small{margin:-4px 0 18px;font-size:12.5px;line-height:1.5;text-align:left}
.login input{height:52px;border-radius:5px;padding:0 18px;margin:0 0 16px;font-size:15px;background:var(--bg);border:1px solid var(--line2);box-shadow:none;transition:border-color .15s,box-shadow .15s}
.login input:focus{border-color:var(--blue);box-shadow:0 0 0 4px color-mix(in srgb,var(--blue) 14%,transparent);outline:0}
.login input:-webkit-autofill,.login input:-webkit-autofill:hover,.login input:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 1000px var(--bg) inset;-webkit-text-fill-color:var(--strong);caret-color:var(--strong);transition:background-color 9999s ease-in-out 0s}
.login input:autofill{box-shadow:0 0 0 1000px var(--bg) inset;-webkit-text-fill-color:var(--strong)}
.login .eye{top:15px;right:16px;width:22px;height:22px}
.login .forgotrow{text-align:right;margin:-4px 0 26px}.login .forgot{font-size:13px;font-weight:500;color:var(--muted)}.login .forgot:hover{color:var(--strong)}
.login .btn.pill{width:100%;height:52px;margin:0;border-radius:5px;font-size:13px;letter-spacing:.08em}
.login .switch{font-size:13.5px;margin:30px 0 0;padding-top:24px;border-top:1px solid var(--hair)}
.login label,.login .card label{display:block;text-align:left;font-size:12.5px;color:var(--muted);margin:0 0 6px}
.login .notice,.login .err,.login .ok{text-align:left;margin:0 0 16px}
@media (max-width:520px){.login{margin:0;min-height:100vh;border:0;border-radius:0;box-shadow:none;padding:72px 24px 32px}}
.login>*{flex-shrink:0}
:root[data-theme=dark] .login .btn.pill{background:#fff;color:#0d121a;border-color:#fff}:root[data-theme=dark] .login .btn.pill:hover{background:#dfe3ea}
/* template picker inside the new-case card: same field size as the other fields, aligned edges */
.fsform .tsel .tpsearch{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:12px;margin:0 0 12px}
.fsform .tsel .tpsearch input,.fsform .tsel .tpsearch select,.fsform .tsel>select{width:100%;height:46px;border-radius:5px;font-size:15px;margin:0;box-sizing:border-box}
.fsform .tsel>select{display:block}.fsform .tsel .small{margin:10px 0 0}
.fsform .tsfield label{font-size:13px;color:var(--muted);margin:14px 0 5px}
/* sign-in buttons in the brand blue (light and dark) */
.login .btn.pill,:root[data-theme=dark] .login .btn.pill{background:var(--blue);border-color:var(--blue);color:#fff}
.login .btn.pill:hover,:root[data-theme=dark] .login .btn.pill:hover{background:#1639ad;border-color:#1639ad;color:#fff}
.login .btn.pill:focus-visible{outline:0;box-shadow:0 0 0 4px color-mix(in srgb,var(--blue) 25%,transparent)}
/* Overview: rounded panels and cards like the rest of the app */
.ov-panel{border-radius:5px;padding:44px 32px 32px}.ov-cards{gap:12px}.ov-card{border-radius:5px;overflow:hidden}.ov-panel>.ov-wide,.ov-cards .ov-wide{border-radius:5px}
.ov-more,.ov-card .btn,.ov-card a.btn{border-radius:5px}
.ov-stat b{border-radius:0}
.ov-btn{border-radius:5px;height:32px}

/* the sticky action bar: taller, same on every page */
.profbar{min-height:68px;padding:14px 32px;gap:16px}.profbar .btn{height:40px;padding:0 20px;font-size:13.5px;border-radius:5px}
.pbchat{width:44px;height:44px}.pbchat svg{width:19px;height:19px}
.sec.hasbar .secnav,.sec.hasbar .secside{height:calc(100vh - 56px - 68px)}
.qbar{position:sticky;bottom:0;z-index:8;margin-top:auto}.stage>.pg{padding-bottom:40px}
.qbar .pbl{flex-direction:row;justify-content:flex-start}
body.has-pbar .bubble{display:none}body.has-pbar .chat{bottom:84px}
/* pages with the action bar: the page area fills the height, so the bar sits at the bottom even when the page is short */
.stage:has(>.qbar){display:flex;flex-direction:column}
.stage:has(>.qbar)>.pg{flex:1 0 auto;width:100%;box-sizing:border-box}
.stage>.qbar{flex:none;margin-top:auto;width:100%;box-sizing:border-box}
/* sign-in card dead centre, horizontally and vertically (and scrolls normally when the form is taller than the screen) */
#app:has(>.login){min-height:100vh;display:flex;align-items:center;justify-content:center;padding:32px 0;box-sizing:border-box}
#app>.login{margin:0}
@media (max-width:520px){#app:has(>.login){align-items:flex-start;padding:0}#app>.login{min-height:100vh}}
@media (max-width:520px){#app>.login{width:100%;box-sizing:border-box}}
.debody b,.debody strong{font-weight:700}.debody i,.debody em{font-style:italic}.debody u{text-decoration:underline}
.detabs{overflow-x:auto;scrollbar-width:none}.dtab{padding:8px 7px;font-size:12px;white-space:nowrap}

/* ================================================================ small screens: tablets and phones (kept last so it wins over the desktop rules above) */
@media (max-width:1100px){
  .tb{grid-template-columns:auto minmax(0,1fr) auto!important;gap:8px!important;padding:0 12px!important}
  .tbc.tbmenu{justify-self:stretch;min-width:0;overflow-x:auto;justify-content:flex-start;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .tbc.tbmenu::-webkit-scrollbar{display:none}.tbmenu button{flex:none;padding:0 11px}
  .tbrand{font-size:0!important;gap:0!important}.tbr{gap:6px!important}
}
@media (max-width:700px){
  details.acct>summary{padding:0 6px}details.acct>summary .nm{display:none}
  .rail{width:46px!important;padding:10px 0!important}.railbtn{width:36px!important;height:36px!important}.railbtn svg{width:17px!important;height:17px!important}
  .pg,.pg.wide{padding:20px 14px 90px!important}.listhead{flex-wrap:wrap;gap:10px}
  .tfilters select,.dbar select{max-width:none;flex:1 1 150px}.tfilters input,.dbar input{flex:1 1 100%}
  .profbar{padding:10px 12px!important;gap:8px!important;min-height:60px!important}.profbar .btn{padding:0 14px!important;font-size:13px!important}
  .fsin{padding:36px 16px!important}.fsin.wide{width:100%}
  .de{grid-template-columns:1fr!important}.demain{padding:10px 8px 60px!important}.depage{padding:22px 18px!important;min-height:0}.debar{gap:6px}.detitle{flex:1 1 100%}.deside{position:static!important;max-height:none!important}
  .detools{overflow-x:auto;flex-wrap:nowrap;padding-bottom:4px}.detools .ptb{flex:none}
  .cbox{grid-template-columns:1fr}.cl{border-right:0;padding-right:0}.cr{padding-left:0}
  .ov{padding-left:14px!important;padding-right:14px!important}.ov-panel{padding:26px 14px!important}.ov-cards{grid-template-columns:1fr!important}
}
@media (max-width:900px){
  /* the workspace: one column; the reader sits above the conversation when a law is open */
  .stage.work,.stage.work.chaton,.frame.dopen .stage.work.chaton,.frame.popen .stage.work.chaton,.frame.dopen.popen .stage.work.chaton{grid-template-columns:minmax(0,1fr)!important;grid-template-rows:minmax(0,1fr)}
  .stage.work.chaton .lpane{display:none}.stage.work.chaton:has(.lpane .rd){grid-template-rows:minmax(0,45%) minmax(0,55%)}.stage.work.chaton:has(.lpane .rd) .lpane{display:flex}
  /* side drawers float over the page instead of squeezing it */
  .frame{position:relative}.drawer,.padbar{position:absolute;left:46px;top:0;bottom:0;z-index:30;box-shadow:6px 0 24px rgba(20,30,60,.16)}
  .frame.dopen .drawer,.frame.popen .padbar,.frame.dopen.popen .padbar{width:min(340px,calc(100vw - 60px))!important}.padbar>*,.drawer>*{width:100%!important}
  .frame.dopen.popen .drawer{display:none}
  /* settings pages: the menu becomes a row across the top and the "on this page" list goes */
  .sec{flex-direction:column!important}.secnav{position:static!important;width:auto!important;height:auto!important;flex-direction:row!important;flex-wrap:nowrap!important;overflow-x:auto;padding:10px 12px!important;border-right:0!important;border-bottom:1px solid var(--hair);gap:6px!important}
  .secnav hr,.secnav .sg{display:none!important}.secnav button{width:auto!important;flex:none;white-space:nowrap}.secside{display:none!important}.secmain{padding:20px 14px 90px!important}.sec.hasbar .secnav{height:auto!important}
}
@media (max-width:700px){.depage{width:100%!important;max-width:100%!important;box-sizing:border-box}.demain{overflow-x:hidden}.decap,.debody,.desig{max-width:100%;overflow-wrap:anywhere}.desig{margin-left:0!important}}

.sr{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.tcard h2{font-size:14px;font-weight:600;letter-spacing:-.01em;margin:0;line-height:1.3}.prcard h2{font-size:13.5px;font-weight:600;margin:0}
:root[data-theme=dark] .tcard h2,:root[data-theme=dark] .ttop h2,:root[data-theme=dark] .prcard h2{color:#fff}
.prcard h2{padding:0 22px;color:#1f1f1f}

/* text colours raised to meet 4.5:1 on light surfaces (found by an automated contrast audit) */
:root:not([data-theme=dark]) .pch .pdesc,:root:not([data-theme=dark]) .pch .accs,:root:not([data-theme=dark]) .pcb .pillc,:root:not([data-theme=dark]) .cs-id,:root:not([data-theme=dark]) .cs-sub,
:root:not([data-theme=dark]) .dmeta,:root:not([data-theme=dark]) .dtab,:root:not([data-theme=dark]) .prmeta,:root:not([data-theme=dark]) .rdmeta,:root:not([data-theme=dark]) .ov-small,
:root:not([data-theme=dark]) .ov-stat>span,:root:not([data-theme=dark]) .ov-eb,:root:not([data-theme=dark]) .sg,:root:not([data-theme=dark]) .secsub,:root:not([data-theme=dark]) .secmain>.mute,
:root:not([data-theme=dark]) .secmain>p,:root:not([data-theme=dark]) .secnav>button,:root:not([data-theme=dark]) .secside>a,:root:not([data-theme=dark]) .tmeta,:root:not([data-theme=dark]) .prcard p,
:root:not([data-theme=dark]) .secmain label,:root:not([data-theme=dark]) .depane label,:root:not([data-theme=dark]) .fsform label,:root:not([data-theme=dark]) .prow label,:root:not([data-theme=dark]) .row label,
:root:not([data-theme=dark]) .card label,:root:not([data-theme=dark]) .org label{color:#666}
:root:not([data-theme=dark]) .secnav>button.on,:root:not([data-theme=dark]) .secside>a.on{color:#1a1a1a}
:root:not([data-theme=dark]) .rd .rdmeta{color:#666}
:root[data-theme=dark] .cs-sub,:root[data-theme=dark] .cs-lab,:root[data-theme=dark] .secsub,:root[data-theme=dark] .prcard p,:root[data-theme=dark] .prmeta,:root[data-theme=dark] .secmain>p,:root[data-theme=dark] .secmain>.mute,:root[data-theme=dark] .chk .mute.small{color:#a3abb7}
:root:not([data-theme=dark]) .rd .rdmeta{color:#666!important}
.rdmeta{opacity:1!important}.rdmeta a{color:inherit}
/* the template filters sit on one line (they wrap only on narrow screens) */
.tfilters{flex-wrap:nowrap}.tfilters select{flex:1 1 0;min-width:0;max-width:none}.tfilters input{flex:1.5 1 0;min-width:0}
@media (max-width:900px){.tfilters{flex-wrap:wrap}.tfilters select{flex:1 1 150px}.tfilters input{flex:1 1 100%}}

/* profile: account layout (photo header, label and description on the left, the field on the right) */
.acct{max-width:860px}
.ahead{display:flex;align-items:center;gap:22px;padding:28px 0;border-bottom:1px solid var(--hair);scroll-margin-top:24px}
.avwrap{position:relative;flex:none}
.aav{width:96px;height:96px;border-radius:50%;overflow:hidden;background:var(--fill);display:grid;place-items:center;font-size:30px;font-weight:500;color:var(--muted)}
.aav img{width:100%;height:100%;object-fit:cover;display:block}
.aedit{position:absolute;right:-2px;bottom:-2px;width:32px;height:32px;border-radius:50%;background:var(--bg);border:1px solid var(--hair);display:grid;place-items:center;color:var(--strong);cursor:pointer;padding:0}
.aedit svg{width:15px;height:15px}.aedit:hover{border-color:var(--muted)}
.aid{display:flex;flex-direction:column;gap:4px;align-items:flex-start}.aid b{font-size:19px;font-weight:600;color:var(--strong)}.aid>span{font-size:14.5px;color:var(--muted)}
.abadge{margin-top:6px;font-size:12.5px;background:var(--fill);color:var(--muted);padding:4px 12px;border-radius:999px}
.alink{font-size:12.5px;color:var(--muted);text-decoration:underline;cursor:pointer;margin-top:4px}.alink[hidden]{display:none}
.asec{padding:30px 0 8px;border-bottom:1px solid var(--hair);scroll-margin-top:24px}.asec:last-of-type{border-bottom:0}
.asec h2{font-size:18px;font-weight:600;letter-spacing:-.01em;margin:0 0 4px;text-transform:none;color:var(--strong)}
.asub{color:var(--muted);font-size:14px;margin:0 0 6px;max-width:44em}
.arow{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:12px 40px;align-items:start;padding:20px 0}
.alab{display:flex;flex-direction:column;gap:3px}.alab b{font-size:14.5px;font-weight:600;color:var(--strong)}.alab span{font-size:13.5px;color:var(--muted);line-height:1.45}
.actl input[type=text],.actl input[type=email],.actl input[type=tel],.actl textarea,.actl select{width:100%;margin:0}
.actl input[type=time]{width:auto;margin:0}
.actl textarea{min-height:88px}
.afull{padding:14px 0 22px}.afull textarea{width:100%;min-height:110px;margin-bottom:10px}
.afull .accadd input{max-width:320px}
.acopy{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.acopy .aurl{flex:1;min-width:200px;margin:0}
.aqr{display:flex;gap:18px;align-items:center;flex-wrap:wrap}.aqr>div{display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.qrimg{width:148px;height:148px;border:1px solid var(--hair);border-radius:12px;padding:8px;background:#fff}
.achk{display:flex;flex-direction:column;gap:8px}.achk .chk{margin:0}
.ahours{display:flex;flex-direction:column;gap:8px}
.ahr{display:grid;grid-template-columns:130px auto auto auto;gap:10px;align-items:center}.ahr .chk{margin:0}.ahr.off input[type=time]{opacity:.45}
.aups{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px;font-size:14px}
.sw{display:inline-flex;align-items:center;gap:12px;cursor:pointer;font-size:14.5px;margin:0;text-transform:none;letter-spacing:0;font-weight:400;color:var(--ink)}
.sw input{position:absolute;opacity:0;width:1px;height:1px}
.sw i{flex:none;width:42px;height:24px;border-radius:999px;background:#cfd4dc;position:relative;transition:background .15s}
.sw i::after{content:"";position:absolute;left:3px;top:3px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #0003;transition:transform .15s}
.sw input:checked+i{background:var(--accent)}.sw input:checked+i::after{transform:translateX(18px)}
.sw input:focus-visible+i{outline:2px solid var(--accent);outline-offset:3px}
@media(max-width:760px){.arow{grid-template-columns:1fr}.ahr{grid-template-columns:110px auto auto auto}}
:root:not([data-theme=dark]) .secmain .pillc.on,:root[data-theme=dark] .secmain .pillc.on{color:var(--accent-ink)}

/* overview calendar */
.ovc-body{display:grid;grid-template-columns:minmax(0,2.5fr) minmax(240px,1fr);gap:2px;align-items:stretch}
.ovc-cal{background:#fff;padding:22px 22px 24px}
.ovc-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.ovc-title{font-size:19px;font-weight:600;letter-spacing:-.01em;color:var(--strong)}
.ovc-nav{display:flex;gap:6px}
.ovc-b{height:30px;min-width:30px;padding:0 10px;border:1px solid #e3e3e3;background:transparent;color:#333;font:inherit;font-size:16px;line-height:1;cursor:pointer;border-radius:3px}
.ovc-b.ovc-t{font-size:11px;letter-spacing:.1em;text-transform:uppercase}
.ovc-b:hover{border-color:#999}
.ovc-wk{display:grid;grid-template-columns:repeat(7,1fr);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#777;padding:0 0 8px}
.ovc-wk span{padding-left:8px}
.ovc-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:1px;background:#ececec;border:1px solid #ececec}
.ovc-c{background:#fff;border:0;text-align:left;font:inherit;color:inherit;min-height:96px;padding:8px 6px 6px;display:flex;flex-direction:column;gap:3px;cursor:pointer;position:relative;min-width:0}
.ovc-c:hover{background:#fafaf8}
.ovc-c.out{background:#fbfbfa;color:#aaa}.ovc-c.out .ovc-e{opacity:.55}
.ovc-c.sel{box-shadow:inset 0 0 0 1.5px var(--accent)}
.ovc-n{font-size:12.5px;font-weight:500;width:24px;height:24px;display:grid;place-items:center;margin-bottom:2px}
.ovc-c.today .ovc-n{background:var(--accent);color:var(--accent-ink)}
.ovc-e{display:block;font-size:11px;line-height:1.3;padding:2px 5px 2px 6px;border-left:2px solid var(--accent);background:#f3f6ff;color:#222;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.ovc-e.dl{border-left-color:#b25e09;background:#fff6ea}
.ovc-e i{font-style:normal;color:#666;margin-right:4px}
.ovc-more{font-size:10.5px;color:#777;padding-left:6px}
.ovc-dots{display:none;gap:3px;margin-top:auto}.ovc-dots i{width:5px;height:5px;border-radius:50%;background:var(--accent)}.ovc-dots i.dl{background:#b25e09}
.ovc-agenda{background:#fff;padding:24px 22px;display:flex;flex-direction:column}
.ovc-agenda h3{font-size:21px;line-height:1.2;margin:12px 0 14px}
.ovc-a{display:grid;grid-template-columns:62px 1fr;gap:10px;text-align:left;background:transparent;border:0;border-top:1px solid #ececec;padding:13px 0;font:inherit;color:inherit;cursor:pointer}
.ovc-a:hover{background:#fafaf8}
.ovc-a em{font-style:normal;font-size:12px;color:#666;padding-top:2px}.ovc-a.dl em{color:#b25e09}
.ovc-a b{display:block;font-size:14px;font-weight:500;line-height:1.35}.ovc-a small{display:block;font-size:12px;color:#777;margin-top:2px}
.ovc-add{margin-top:auto;align-self:flex-start}
.ovc-agenda .ov-txt{margin:0 0 18px}
.ovc-agenda .ovc-add{margin-top:22px}
.ovc-full{display:inline-block;margin-top:16px;cursor:pointer}
:root[data-theme=dark] .ovc-cal,:root[data-theme=dark] .ovc-agenda{background:#131a25;color:#dfe3ea}
:root[data-theme=dark] .ovc-grid{background:var(--line);border-color:var(--line)}:root[data-theme=dark] .ovc-c{background:#131a25}:root[data-theme=dark] .ovc-c:hover{background:#18212e}:root[data-theme=dark] .ovc-c.out{background:#10161f;color:#667}
:root[data-theme=dark] .ovc-e{background:#1a2640;color:#dfe3ea}:root[data-theme=dark] .ovc-e.dl{background:#2a2112}:root[data-theme=dark] .ovc-b{border-color:var(--line);color:#dfe3ea}
:root[data-theme=dark] .ovc-a{border-top-color:var(--line)}:root[data-theme=dark] .ovc-a:hover{background:#18212e}
@media(max-width:900px){.ovc-body{grid-template-columns:1fr}.ovc-cal{padding:16px 10px 18px}.ovc-c{min-height:54px;padding:6px 3px;align-items:center}.ovc-e,.ovc-more{display:none}.ovc-dots{display:flex}.ovc-wk span{padding-left:0;text-align:center}.ovc-n{margin-bottom:0}}
.ovc-add{background:var(--accent);color:var(--accent-ink);border:0;height:38px;padding:0 18px;font:inherit;font-size:13px;font-weight:500;border-radius:3px;cursor:pointer}
.ovc-add:hover{filter:brightness(1.08)}
.fsform .row.row3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:700px){.fsform .row.row3{grid-template-columns:1fr}}

/* the bar: date, next appointment, and the time-to-leave reminder */
.qbi{display:flex;align-items:center;gap:14px;margin-left:auto;margin-right:6px;min-width:0;font-size:12.5px;color:#555}
.qb-date{font-weight:500;color:var(--strong);white-space:nowrap}
.qb-sep{width:1px;height:16px;background:#ddd;flex:none}
.qb-next{display:flex;align-items:baseline;gap:8px;min-width:0;background:none;border:0;padding:4px 6px;margin:0;font:inherit;color:inherit;cursor:pointer;text-align:left;border-radius:3px}
.qb-next:hover:not([disabled]){background:#f4f4f2}.qb-next[disabled]{cursor:default}
.qb-next small{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#888}
.qb-next b{font-weight:500;color:var(--strong);white-space:nowrap}
.qb-next em{font-style:normal;color:var(--accent);white-space:nowrap}
.qb-next span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:26ch}
.qb-none{color:#888}
.leavecard{position:fixed;right:24px;bottom:92px;z-index:2000;width:min(360px,calc(100vw - 32px));background:#fff;border:1px solid #d9dde8;border-left:3px solid var(--accent);box-shadow:0 18px 48px -18px #0d121a55;padding:18px 18px 16px;display:grid;grid-template-columns:34px 1fr;gap:4px 14px;animation:lcin .6s cubic-bezier(.2,.7,.2,1)}
.leavecard .lc-i{color:var(--accent)}.leavecard .lc-i svg{width:26px;height:26px}
.leavecard .lc-t b{display:block;font-size:16px;font-weight:600;color:var(--strong)}
.leavecard .lc-t span{display:block;font-size:14px;margin-top:2px}.leavecard .lc-t em{display:block;font-style:normal;font-size:12.5px;color:#777;margin-top:2px}
.leavecard .lc-b{grid-column:2;display:flex;gap:8px;margin-top:12px}.leavecard .lc-b .btn{height:34px;font-size:12.5px;margin:0}
@keyframes lcin{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
:root[data-theme=dark] .leavecard,:root[data-theme=dark] @media(max-width:640px){.qbi{display:none}.leavecard{right:12px;bottom:84px}}
@media(prefers-reduced-motion:reduce){.leavecard{animation:none}}

/* the Reminders tab in the notifications panel */
.rsec{padding:16px 18px 4px}.rhd{font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:#777}
.rnext{display:grid;gap:3px;text-align:left;width:calc(100% - 36px);margin:8px 18px 6px;padding:14px 16px;border:1px solid #e6e6e6;border-left:3px solid var(--accent);background:transparent;cursor:pointer;font:inherit;color:inherit}
.rnext:hover{background:#fafaf8}.rnext b{font-size:16px;font-weight:600;color:var(--strong)}.rnext em{font-style:normal;color:var(--accent);font-size:13px}.rnext span{font-size:14px}.rnext small{color:#777;font-size:12.5px}
.rset{padding:8px 18px 14px;display:flex;flex-direction:column;gap:12px;align-items:flex-start}.rset p{margin:0;font-size:12.5px;color:#666;line-height:1.45}
.rset select{width:100%;margin:0}.rset .chk{margin:0}.rset .btn{height:32px;font-size:12.5px;margin:0}
.rrow{display:grid;grid-template-columns:134px 1fr;gap:10px;width:100%;text-align:left;padding:11px 18px;background:none;border:0;border-top:1px solid #eee;cursor:pointer;font:inherit;color:inherit;font-size:13.5px}
.rrow:hover{background:#fafaf8}.rrow em{font-style:normal;color:#666;font-size:12.5px;padding-top:1px}
:root[data-theme=dark] .rnext{border-color:var(--line);border-left-color:var(--accent)}:root[data-theme=dark] .rnext:hover,:root[data-theme=dark] .rrow:hover{background:#18212e}:root[data-theme=dark] .rrow{border-top-color:var(--line)}

.npanel{width:min(590px,calc(100vw - 24px))}.ntabs{gap:20px}

/* the slim bar on Research and case pages: today's date and the next appointment */
.wbar{flex:none;height:44px;display:flex;align-items:center;gap:16px;padding:0 24px 0 84px;border-top:.5px solid #e4e4e4;background:var(--bg);position:relative;z-index:8}
.wbar .qbi{margin:0}
.qb-rem{margin-left:auto;background:none;border:0;padding:6px 8px;font:inherit;font-size:12.5px;color:#777;cursor:pointer;border-radius:3px}.qb-rem:hover{background:#f4f4f2;color:var(--strong)}
:root[data-theme=dark] .wbar{border-top-color:var(--hair)}:root[data-theme=dark] .qb-rem:hover{background:#18212e}
@media(max-width:640px){.wbar{display:none}}

/* sign-in page: white, with a fading dot grid (the same idea as the Northfalk closing band) */
body.loginpg{background:#fff}
.ldots{position:fixed;inset:0;z-index:0;pointer-events:none;background:radial-gradient(circle,#1e47d1 1.1px,transparent 1.5px) 0 0/11px 11px;-webkit-mask-image:radial-gradient(120% 95% at 100% 40%,#000 0%,rgba(0,0,0,.55) 38%,transparent 78%);mask-image:radial-gradient(120% 95% at 100% 40%,#000 0%,rgba(0,0,0,.55) 38%,transparent 78%);opacity:.5}
.ldots::after{content:"";position:absolute;inset:0;background:radial-gradient(circle,#8d939b 1px,transparent 1.4px) 5px 5px/11px 11px;-webkit-mask-image:linear-gradient(200deg,transparent 30%,#000 100%);mask-image:linear-gradient(200deg,transparent 30%,#000 100%);opacity:.22}
.login{position:relative;z-index:1}
.login .lmark{width:56px;height:56px;border-radius:14px;margin:0 auto 22px;background:linear-gradient(150deg,#3a62ea,#1a3fc0);display:grid;place-items:center;box-shadow:0 14px 30px -12px #1e47d199}
.login .lmark svg.logo{width:28px;height:28px;stroke:#fff;fill:none}
:root[data-theme=dark] body.loginpg{background:#0d121a}:root[data-theme=dark] .ldots{opacity:.35}
@media(prefers-reduced-motion:reduce){.ldots{opacity:.4}}