/* Legal Desire Press Desk
   The DealDatabase system (mono chrome, hairline panels, fact grids, tables)
   re-keyed to Legal Desire: its orange for action, its purple for figures,
   its pale lime for hover, DM Sans for reading. */
:root {
  --bg:#ffffff; --surf:#f6f4f0; --surf2:#fbfaf8; --chrome:#f1eee8;
  --line:#d9d3c8; --line2:#e9e4dc;
  --ink:#1d1b17; --ink2:#3d3930; --dim:#6b6457; --dim2:#958d7f;
  --acc:#c7421f; --acc-fill:#d8492a; --acc-bg:#fdf0ec; --acc-line:#f0bfae;
  --amb:#6a3bd0; --amb-bg:#f3effd; --amb-line:#d3c6f5;
  --hl:#eeffc2; --hl-ink:#1d1b17;
  --ok:#1f7a4d; --ok-bg:#eaf6ef; --warn:#a1450f; --warn-bg:#fdf1e6; --bad:#b42318; --bad-bg:#fdecea;
  --mono:'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, monospace;
  --sans:'DM Sans', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --wrap:1240px; --r:4px;
  --shadow:0 1px 2px rgba(29,27,23,.05), 0 12px 32px -20px rgba(29,27,23,.28);
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg:#121110; --surf:#1a1917; --surf2:#1e1c1a; --chrome:#191816;
    --line:#35322d; --line2:#27251f;
    --ink:#efebe4; --ink2:#d3cdc2; --dim:#a79f92; --dim2:#7b7468;
    --acc:#ff8a6b; --acc-fill:#e0552f; --acc-bg:#2c1811; --acc-line:#6a3222;
    --amb:#b9a2ff; --amb-bg:#211a36; --amb-line:#45397a;
    --hl:#3a4a14; --hl-ink:#f2ffd6;
    --ok:#6fd49e; --ok-bg:#12281c; --warn:#f0a36b; --warn-bg:#2b1c0f; --bad:#ff8f86; --bad-bg:#2e1413;
    --shadow:0 1px 2px rgba(0,0,0,.5), 0 12px 32px -20px rgba(0,0,0,.8);
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --bg:#121110; --surf:#1a1917; --surf2:#1e1c1a; --chrome:#191816;
  --line:#35322d; --line2:#27251f;
  --ink:#efebe4; --ink2:#d3cdc2; --dim:#a79f92; --dim2:#7b7468;
  --acc:#ff8a6b; --acc-fill:#e0552f; --acc-bg:#2c1811; --acc-line:#6a3222;
  --amb:#b9a2ff; --amb-bg:#211a36; --amb-line:#45397a;
  --hl:#3a4a14; --hl-ink:#f2ffd6;
  --ok:#6fd49e; --ok-bg:#12281c; --warn:#f0a36b; --warn-bg:#2b1c0f; --bad:#ff8f86; --bad-bg:#2e1413;
  --shadow:0 1px 2px rgba(0,0,0,.5), 0 12px 32px -20px rgba(0,0,0,.8);
  color-scheme: dark;
}

*,*::before,*::after { box-sizing:border-box }
html { -webkit-text-size-adjust:100% }
body { margin:0; background:var(--bg); color:var(--ink); font-family:var(--sans); font-size:15px; line-height:1.6; -webkit-font-smoothing:antialiased }
[hidden] { display:none !important }
@media (prefers-reduced-motion: reduce) { *,*::before,*::after { transition-duration:.01ms !important; animation-duration:.01ms !important } }
h1,h2,h3,h4 { margin:0; font-weight:700; letter-spacing:-.015em; line-height:1.15; text-wrap:balance }
h1 { font-size:clamp(1.9rem, 1.3rem + 2.6vw, 3.1rem) }
h2 { font-size:clamp(1.3rem, 1.1rem + .9vw, 1.8rem) }
h3 { font-size:1.08rem }
p { margin:0 0 1em }
a { color:inherit; text-underline-offset:3px; text-decoration-color:color-mix(in oklab, currentColor 35%, transparent) }
a:hover { color:var(--acc); text-decoration-color:currentColor }
:focus-visible { outline:2px solid var(--acc); outline-offset:2px }
img { max-width:100% }

.wrap { width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:16px }
@media (min-width:780px){ .wrap { padding-inline:28px } }
.mono { font-family:var(--mono) }
.eyebrow { font-family:var(--mono); font-size:.68rem; letter-spacing:.15em; text-transform:uppercase; color:var(--dim2); font-weight:500 }
.lede { font-size:1.08rem; color:var(--ink2); line-height:1.62; max-width:62ch }
.muted { color:var(--dim) } .dim { color:var(--dim2) }
.num { font-variant-numeric:tabular-nums }
.row { display:flex; align-items:center; gap:10px; flex-wrap:wrap }
.between { justify-content:space-between }
.stack { display:flex; flex-direction:column; gap:12px }
.hair { border:0; border-top:1px solid var(--line); margin:0 }
.small { font-size:.86rem }
.xs { font-size:.76rem }

/* masthead */
.mast { position:sticky; top:0; z-index:40; background:var(--chrome); border-bottom:1px solid var(--line) }
.mast-in { display:flex; align-items:stretch; height:52px; max-width:var(--wrap); margin-inline:auto; padding-inline:16px; font-family:var(--mono); font-size:.76rem }
@media (min-width:780px){ .mast-in { padding-inline:28px } }
.brand { display:flex; align-items:center; gap:10px; padding-right:16px; border-right:1px solid var(--line); text-decoration:none; color:var(--ink) }
.brand img { height:26px; width:auto; display:block }
:root[data-theme="dark"] .brand img, .footlogo.dark-inv { filter:invert(1) }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .brand img { filter:invert(1) } }
.brand span { font-weight:600; letter-spacing:.02em; white-space:nowrap }
.brand span b { color:var(--acc); font-weight:600 }
.mnav { display:none }
@media (min-width:980px){ .mnav { display:flex } }
.mnav a { display:flex; align-items:center; padding:0 14px; color:var(--dim); text-decoration:none; border-right:1px solid var(--line2) }
.mnav a:hover { background:var(--hl); color:var(--hl-ink) }
.mnav a[aria-current="page"] { color:var(--acc); box-shadow:inset 0 -2px 0 var(--acc) }
.mact { margin-left:auto; display:flex; align-items:center; gap:8px; padding-left:12px }

/* controls */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:7px; font-family:var(--mono); font-size:.78rem; font-weight:500; line-height:1; padding:10px 14px; border:1px solid var(--line); border-radius:var(--r); background:var(--bg); color:var(--ink); text-decoration:none; cursor:pointer; white-space:nowrap; transition:background .14s, border-color .14s, color .14s }
.btn:hover { border-color:var(--ink); background:var(--hl); color:var(--hl-ink) }
.btn-primary { background:var(--acc-fill); border-color:var(--acc-fill); color:#fff }
.btn-primary:hover { background:#1d1b17; border-color:#1d1b17; color:#fff }
.btn-quiet { border-color:transparent; background:transparent; color:var(--dim) }
.btn-danger { color:var(--bad); border-color:color-mix(in oklab, var(--bad) 40%, transparent) }
.btn-sm { font-size:.72rem; padding:7px 10px }
.btn-lg { font-size:.86rem; padding:13px 18px }
.btn[disabled] { opacity:.5; cursor:not-allowed }
.icon-btn { width:32px; height:30px; padding:0 }
.tag { display:inline-block; font-family:var(--mono); font-size:.68rem; line-height:1.5; padding:2px 7px; border:1px solid var(--line); border-radius:var(--r); color:var(--dim); white-space:nowrap }
.tag-acc { color:var(--acc); background:var(--acc-bg); border-color:var(--acc-line) }
.tag-amb { color:var(--amb); background:var(--amb-bg); border-color:var(--amb-line) }
.tag-ok { color:var(--ok); background:var(--ok-bg); border-color:color-mix(in oklab, var(--ok) 35%, transparent) }
.tag-warn { color:var(--warn); background:var(--warn-bg); border-color:color-mix(in oklab, var(--warn) 35%, transparent) }
.tag-bad { color:var(--bad); background:var(--bad-bg); border-color:color-mix(in oklab, var(--bad) 35%, transparent) }

/* panels, facts, tables */
.panel { border:1px solid var(--line); border-radius:var(--r); background:var(--surf); padding:18px }
.card { border:1px solid var(--line); border-radius:6px; background:var(--bg); padding:20px }
.facts { display:grid; gap:1px; background:var(--line2); border:1px solid var(--line); border-radius:var(--r); overflow:hidden; grid-template-columns:repeat(2,1fr) }
@media (min-width:640px){ .facts-4 { grid-template-columns:repeat(4,1fr) } }
.fact { background:var(--surf2); padding:14px 15px }
.fact dt { font-family:var(--mono); font-size:.62rem; letter-spacing:.13em; text-transform:uppercase; color:var(--dim2); margin-bottom:5px }
.fact dd { margin:0; font-family:var(--mono); font-size:1.45rem; color:var(--amb); font-variant-numeric:tabular-nums; line-height:1.1 }
.fact dd small { display:block; font-family:var(--sans); font-size:.8rem; color:var(--dim); margin-top:5px; line-height:1.4 }
.tblwrap { border:1px solid var(--line); border-radius:var(--r); background:var(--bg); overflow-x:auto }
table.tbl { width:100%; border-collapse:collapse; font-size:.86rem }
table.tbl th { font-family:var(--mono); font-size:.62rem; letter-spacing:.13em; text-transform:uppercase; color:var(--dim2); text-align:left; padding:9px 13px; border-bottom:1px solid var(--line); background:var(--chrome); font-weight:500; white-space:nowrap }
table.tbl td { padding:11px 13px; border-bottom:1px solid var(--line2); vertical-align:top }
table.tbl tbody tr:last-child td { border-bottom:0 }
table.tbl tbody tr:hover td { background:var(--surf2) }
table.tbl .mn { font-family:var(--mono); font-size:.76rem; color:var(--dim); white-space:nowrap; font-variant-numeric:tabular-nums }
.empty { padding:26px; text-align:center; color:var(--dim); font-size:.92rem }

/* forms */
.field { display:block; margin-bottom:15px }
.field > span { display:block; font-family:var(--mono); font-size:.66rem; letter-spacing:.1em; text-transform:uppercase; color:var(--dim); margin-bottom:6px }
.field > span i { font-style:normal; text-transform:none; letter-spacing:0; color:var(--dim2) }
.field input, .field select, .field textarea { width:100%; font:inherit; font-size:.95rem; color:var(--ink); background:var(--surf2); border:1px solid var(--line); border-radius:var(--r); padding:10px 12px }
.field textarea { min-height:96px; resize:vertical }
.field input:focus, .field select:focus, .field textarea:focus { outline:none; border-color:var(--acc); box-shadow:0 0 0 3px color-mix(in oklab, var(--acc) 16%, transparent) }
.field small { display:block; color:var(--dim2); font-size:.8rem; margin-top:5px }
.grid2 { display:grid; gap:0 16px }
@media (min-width:680px){ .grid2 { grid-template-columns:1fr 1fr } }
.choice { display:grid; gap:10px; grid-template-columns:1fr 1fr }
@media (min-width:760px){ .choice { grid-template-columns:repeat(4,1fr) } }
.choice label { border:1px solid var(--line); border-radius:6px; padding:14px; cursor:pointer; background:var(--bg); display:block }
.choice label:hover { background:var(--hl); color:var(--hl-ink) }
.choice input { position:absolute; opacity:0; pointer-events:none }
.choice label:has(input:checked) { border-color:var(--acc); box-shadow:0 0 0 1px var(--acc) inset; background:var(--acc-bg) }
.choice b { display:block; font-size:.98rem; margin-bottom:3px }
.choice span { font-size:.8rem; color:var(--dim); line-height:1.4; display:block }
.checks { display:grid; gap:4px 14px; grid-template-columns:1fr }
@media (min-width:640px){ .checks { grid-template-columns:1fr 1fr } }
.checks label { display:flex; gap:8px; align-items:center; font-size:.88rem; padding:3px 0 }
.checks input { accent-color:var(--acc-fill) }
.checks h5 { grid-column:1/-1; margin:10px 0 2px; font-family:var(--mono); font-size:.62rem; letter-spacing:.13em; text-transform:uppercase; color:var(--dim2); font-weight:500 }
.note { border-left:3px solid var(--acc); background:var(--surf); padding:11px 14px; border-radius:0 var(--r) var(--r) 0; font-size:.9rem; color:var(--ink2) }
.note-amb { border-left-color:var(--amb) }
.err { color:var(--bad); font-size:.88rem; min-height:1.2em; margin:6px 0 }
.okmsg { color:var(--ok); font-size:.88rem }

/* landing */
.hero { padding:clamp(34px,6vw,70px) 0 clamp(26px,4vw,44px); border-bottom:1px solid var(--line) }
.hero-grid { display:grid; gap:34px; align-items:end }
@media (min-width:980px){ .hero-grid { grid-template-columns:1.25fr 1fr } }
.hero h1 em { font-style:normal; background:linear-gradient(transparent 62%, var(--hl) 62%); padding:0 .06em }
.cta-row { display:flex; gap:10px; flex-wrap:wrap; margin-top:22px }
.section { padding-block:clamp(34px,5vw,60px) }
.sechead { display:flex; align-items:baseline; justify-content:space-between; gap:14px; margin-bottom:20px; flex-wrap:wrap }
.sechead p { margin:0; max-width:56ch; color:var(--dim) }
.kinds { display:grid; gap:14px }
@media (min-width:880px){ .kinds { grid-template-columns:repeat(3,1fr) } }
.kind { border:1px solid var(--line); border-radius:6px; padding:20px; background:var(--bg); display:flex; flex-direction:column; gap:8px }
.kind h3 { font-size:1.12rem }
.kind p { margin:0; color:var(--ink2); font-size:.93rem }
.kind .who { margin-top:auto; padding-top:10px }
.steps { counter-reset:s; display:grid; gap:0; border:1px solid var(--line); border-radius:var(--r); overflow:hidden }
@media (min-width:900px){ .steps { grid-template-columns:repeat(3,1fr) } }
.step { counter-increment:s; padding:18px; border-bottom:1px solid var(--line2); background:var(--surf2) }
@media (min-width:900px){ .step { border-right:1px solid var(--line2) } .step:nth-child(3n){ border-right:0 } .step:nth-last-child(-n+3){ border-bottom:0 } }
.step::before { content:counter(s, decimal-leading-zero); font-family:var(--mono); font-size:.72rem; color:var(--acc); display:block; margin-bottom:8px }
.step h3 { font-size:1rem; margin-bottom:5px }
.step p { margin:0; font-size:.88rem; color:var(--dim) }
.plans { display:grid; gap:14px }
@media (min-width:900px){ .plans { grid-template-columns:repeat(3,1fr) } }
.plan { border:1px solid var(--line); border-radius:6px; padding:22px 20px; display:flex; flex-direction:column; gap:12px; background:var(--bg) }
.plan-hot { border-color:var(--acc-fill); box-shadow:0 0 0 1px var(--acc-fill) inset }
.plan-name { font-family:var(--mono); font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; color:var(--dim) }
.plan-price { font-size:2.1rem; font-weight:700; line-height:1; letter-spacing:-.02em }
.plan-price small { font-size:.85rem; font-weight:400; color:var(--dim); letter-spacing:0 }
.plan ul { list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:8px; font-size:.9rem; color:var(--ink2) }
.plan li { padding-left:20px; position:relative; line-height:1.45 }
.plan li::before { content:""; position:absolute; left:2px; top:.5em; width:9px; height:5px; border-left:2px solid var(--acc-fill); border-bottom:2px solid var(--acc-fill); transform:rotate(-45deg) }
.plan .btn { margin-top:auto }
.band { background:var(--surf); border-block:1px solid var(--line) }
.dd-callout { display:grid; gap:20px; align-items:center }
@media (min-width:880px){ .dd-callout { grid-template-columns:1.3fr 1fr } }
.faq details { border-bottom:1px solid var(--line2); padding:15px 0 }
.faq summary { cursor:pointer; font-weight:600; font-size:1rem; list-style:none }
.faq summary::-webkit-details-marker { display:none }
.faq summary::after { content:"+"; float:right; color:var(--dim); font-family:var(--mono) }
.faq details[open] summary::after { content:"\2013" }
.faq details p { margin:10px 0 0; color:var(--ink2); max-width:74ch }
.foot { border-top:1px solid var(--line); background:var(--surf); margin-top:40px; font-size:.84rem }
.foot-in { display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; padding-block:24px; color:var(--dim) }
.foot a { color:var(--dim) }

/* app */
.app { padding-block:26px 50px }
.apphead { display:flex; justify-content:space-between; align-items:flex-end; gap:14px; flex-wrap:wrap; margin-bottom:18px }
.banner { border:1px solid var(--line); border-radius:6px; padding:14px 16px; margin-bottom:18px; display:flex; gap:12px; align-items:flex-start; justify-content:space-between; flex-wrap:wrap }
.banner-warn { background:var(--warn-bg); border-color:color-mix(in oklab, var(--warn) 35%, transparent) }
.banner-ok { background:var(--ok-bg); border-color:color-mix(in oklab, var(--ok) 35%, transparent) }
.banner-acc { background:var(--acc-bg); border-color:var(--acc-line) }
.meter { height:6px; background:var(--line2); border-radius:3px; overflow:hidden; margin-top:8px }
.meter > i { display:block; height:100%; background:var(--amb) }
.tabs { display:flex; gap:0; border-bottom:1px solid var(--line); margin-bottom:18px; overflow-x:auto; font-family:var(--mono); font-size:.76rem }
.tabs a { padding:10px 14px; text-decoration:none; color:var(--dim); white-space:nowrap }
.tabs a:hover { background:var(--hl); color:var(--hl-ink) }
.tabs a[aria-current="page"] { color:var(--acc); box-shadow:inset 0 -2px 0 var(--acc) }
.tabs a b { font-weight:500; color:var(--amb); margin-left:5px }
.editor-grid { display:grid; gap:20px }
@media (min-width:1080px){ .editor-grid { grid-template-columns:minmax(0,1fr) 340px } }
.side { display:flex; flex-direction:column; gap:14px }
.ql-toolbar.ql-snow, .ql-container.ql-snow { border-color:var(--line) !important }
.ql-toolbar.ql-snow { background:var(--chrome); border-radius:var(--r) var(--r) 0 0 }
.ql-container.ql-snow { background:var(--bg); border-radius:0 0 var(--r) var(--r); font-family:var(--sans); font-size:1rem }
.ql-editor { min-height:380px; line-height:1.7; color:var(--ink) }
.ql-editor.ql-blank::before { color:var(--dim2) !important; font-style:normal !important }
.ql-snow .ql-stroke { stroke:var(--ink2) } .ql-snow .ql-fill { fill:var(--ink2) } .ql-snow .ql-picker { color:var(--ink2) }
.ql-snow .ql-picker-options { background:var(--bg) }
.thumb { width:100%; aspect-ratio:16/9; object-fit:cover; border-radius:var(--r); border:1px solid var(--line); background:var(--surf) }
.headshot { width:64px; height:64px; border-radius:50%; object-fit:cover; border:1px solid var(--line) }
.preview { border:1px solid var(--line); border-radius:6px; padding:22px; background:var(--bg); font-size:1rem; line-height:1.7; color:var(--ink2) }
.preview h1 { font-size:1.6rem; margin-bottom:12px; color:var(--ink) }
.preview img { height:auto; border-radius:var(--r) }
.preview table { border-collapse:collapse }
.toast { position:fixed; left:50%; bottom:22px; transform:translateX(-50%); background:#1d1b17; color:#fff; font-family:var(--mono); font-size:.8rem; padding:11px 16px; border-radius:var(--r); z-index:90; box-shadow:var(--shadow); max-width:92vw }
.login-card { max-width:460px; margin:clamp(24px,6vw,70px) auto; }
.overdue td { background:color-mix(in oklab, var(--bad-bg) 70%, transparent) }
.kpis { display:grid; gap:1px; background:var(--line2); border:1px solid var(--line); border-radius:var(--r); overflow:hidden; grid-template-columns:repeat(2,1fr); margin-bottom:18px }
@media (min-width:760px){ .kpis { grid-template-columns:repeat(4,1fr) } }
.kpi { background:var(--surf2); padding:12px 14px }
.kpi b { display:block; font-family:var(--mono); font-size:1.35rem; color:var(--amb); font-weight:500 }
.kpi span { font-family:var(--mono); font-size:.62rem; letter-spacing:.12em; text-transform:uppercase; color:var(--dim2) }
.spinner { display:inline-block; width:14px; height:14px; border:2px solid currentColor; border-right-color:transparent; border-radius:50%; animation:spin .7s linear infinite; vertical-align:-2px }
@keyframes spin { to { transform:rotate(360deg) } }
.ql-container.ql-snow { height:auto }

.subnav { display:flex; overflow-x:auto; border-top:1px solid var(--line2); font-family:var(--mono); font-size:.74rem; background:var(--chrome) }
.subnav a { padding:10px 14px; color:var(--dim); text-decoration:none; white-space:nowrap }
.subnav a[aria-current="page"] { color:var(--acc); box-shadow:inset 0 -2px 0 var(--acc) }
@media (min-width:980px){ .subnav { display:none !important } }
@media (max-width:480px){ .brand span { display:none } .mact .btn-sm { padding:7px 8px } }
