/* Viñas & DeLuca firm app – navy #0A1430, gold #C18A48, Montserrat */
/* The app is a light design: a Mac or phone in dark mode (or a viewer that asks for dark) must not turn the boxes black */
html:root { color-scheme: light only !important; }
:where(input, textarea, select) { color: #0f1830; }
:where(input:not([type=checkbox], [type=radio], [type=range]), textarea) { background-color: #fff; }
:root {
  --navy: #0A1430; --navy-2: #13204a; --gold: #C18A48; --gold-2: #8a5a22;   /* darker so small gold text meets WCAG AA contrast (4.5:1) */ --gold-soft: #f6ede2;
  --ink: #0f1830; --muted: #5b6480; --line: #dfe2ea; --bg: #f4f5f8; --card: #ffffff;
  --ok: #1d7a46; --ok-soft: #e4f4ea; --warn: #9a5b00; --warn-soft: #fdf1dc; --bad: #b3261e; --bad-soft: #fbe9e7;
  --r: 14px; --shadow: 0 1px 2px rgba(10,20,48,.06), 0 6px 20px -10px rgba(10,20,48,.25);
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--bg); color: var(--ink); font: 16px/1.45 Montserrat, system-ui, -apple-system, "Segoe UI", sans-serif; }
button, input, select, textarea { font: inherit; color: inherit; }
a { color: var(--navy); }
.hidden { display: none !important; }

/* top bar */
.top { position: sticky; top: 0; z-index: 20; background: var(--navy); color: #fff; padding: calc(10px + env(safe-area-inset-top)) 16px 10px; display: flex; align-items: center; gap: 12px; border-bottom: 3px solid var(--gold); }
.top .logo { height: 30px; width: auto; display: block; }
.top .logo-btn { background: none; border: 0; padding: 0; cursor: pointer; }
.top .sp { flex: 1; }
.top .who { font-size: 13px; color: #c3c9da; text-align: right; line-height: 1.2; }
.top .who b { display: block; color: #fff; font-weight: 600; font-size: 14px; }
.top .menu { white-space: nowrap; background: transparent; border: 1px solid rgba(255,255,255,.25); color: #fff; border-radius: 10px; padding: 7px 10px; font-size: 13px; cursor: pointer; }
@media (max-width: 420px) { .top .who span { display: none; } .top .logo { height: 26px; } }

main { max-width: 760px; margin: 0 auto; padding: 20px 16px calc(40px + env(safe-area-inset-bottom)); }
h1 { font-size: 24px; line-height: 1.2; margin: 6px 0 4px; letter-spacing: -.01em; }
h2 { font-size: 13px; letter-spacing: .14em; text-transform: uppercase; color: var(--gold-2); margin: 26px 0 10px; font-weight: 700; }
.lead { color: var(--muted); margin: 0 0 6px; }
.back { display: inline-flex; align-items: center; gap: 6px; background: none; border: 0; color: var(--muted); font-size: 14px; font-weight: 600; padding: 6px 0; cursor: pointer; }
.back:hover { color: var(--navy); }

/* home tiles */
.tiles { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 520px) { .tiles { grid-template-columns: 1fr; } }
.tile { position: relative; display: flex; gap: 14px; align-items: flex-start; text-align: left; background: var(--card); border: 1px solid var(--line); border-radius: var(--r); padding: 18px 16px; cursor: pointer; box-shadow: var(--shadow); min-height: 92px; transition: transform .08s, border-color .15s; }
.tile:hover { border-color: var(--gold); }
.tile:active { transform: scale(.99); }
.tile .ic { flex: 0 0 44px; height: 44px; border-radius: 12px; background: var(--navy); display: grid; place-items: center; }
.tile .ic svg { width: 22px; height: 22px; stroke: var(--gold); fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.tile b { display: block; font-size: 16px; margin: 1px 0 3px; }
.tile small { color: var(--muted); font-size: 13.5px; line-height: 1.35; display: block; }
.tile.hero { grid-column: 1 / -1; background: var(--navy); border-color: var(--navy); color: #fff; }
.tile.hero:hover { border-color: var(--gold); }
.tile.hero .ic { background: var(--gold); }
.tile.hero .ic svg { stroke: var(--navy); }
.tile.hero small { color: rgba(255,255,255,.78); }
.badge { position: absolute; top: 12px; right: 12px; background: var(--gold); color: #fff; font-size: 12px; font-weight: 700; border-radius: 999px; padding: 2px 8px; }

/* cards & fields */
.card { background: var(--card); border: 1px solid var(--line); border-radius: var(--r); padding: 18px 16px; box-shadow: var(--shadow); margin: 12px 0; }
.card h3 { margin: 0 0 12px; font-size: 16px; display: flex; align-items: center; gap: 10px; }
.card h3 .n { width: 26px; height: 26px; border-radius: 50%; background: var(--navy); color: var(--gold); font-size: 13px; display: inline-grid; place-items: center; flex: 0 0 26px; }
.grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 12px; }
.grid .full { grid-column: 1 / -1; }
@media (max-width: 420px) { .grid { grid-template-columns: 1fr; } }
label.f { display: block; font-size: 13px; font-weight: 600; color: var(--ink); }
label.f input, label.f select, label.f textarea { display: block; width: 100%; margin-top: 5px; border: 1px solid #c9cedb; border-radius: 10px; padding: 11px 12px; font-size: 16px; background: #fff; }
label.f textarea { min-height: 92px; resize: vertical; }
label.f input:focus, label.f select:focus, label.f textarea:focus { outline: 2px solid var(--gold); outline-offset: 1px; border-color: var(--gold); }
.hint { color: var(--muted); font-size: 13px; margin: 6px 0 0; }
.err { color: var(--bad); font-size: 13.5px; margin: 8px 0 0; font-weight: 600; }
.seg { display: inline-flex; border: 1px solid #c9cedb; border-radius: 10px; overflow: hidden; margin-top: 5px; }
.seg button { border: 0; background: #fff; padding: 9px 16px; font-size: 14px; font-weight: 600; cursor: pointer; }
.seg button[aria-pressed="true"] { background: var(--navy); color: #fff; }

/* buttons */
.btns { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; border-radius: 11px; padding: 12px 18px; font-weight: 700; font-size: 15px; cursor: pointer; border: 1px solid transparent; min-height: 46px; text-decoration: none; }
.btn svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.btn.pri { background: var(--navy); color: #fff; border-bottom: 3px solid var(--gold); }
.btn.pri:hover { background: var(--navy-2); }
.btn.sec { background: #fff; color: var(--navy); border-color: #c9cedb; }
.btn.sec:hover { border-color: var(--navy); }
.btn.link { background: none; color: var(--navy); padding: 8px 4px; min-height: 0; text-decoration: underline; font-weight: 600; }
.btn[disabled] { opacity: .55; cursor: default; }
.btn.wide { width: 100%; }
@media (max-width: 520px) { .btns .btn { flex: 1 1 100%; } }

/* chips (recent clients) */
.chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 2px; }
.chip { border: 1px solid #c9cedb; background: #fff; border-radius: 999px; padding: 7px 12px; font-size: 13.5px; cursor: pointer; font-weight: 600; }
.chip:hover { border-color: var(--gold); background: var(--gold-soft); }
.chip small { color: var(--muted); font-weight: 500; margin-left: 4px; }

/* people rows */
.person { border: 1px solid var(--line); border-radius: 12px; padding: 12px; margin: 10px 0; background: #fbfbfd; }
.person .ph { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; font-size: 12.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--gold-2); font-weight: 700; }
.person .ph button { background: none; border: 0; color: var(--muted); font-size: 13px; text-decoration: underline; cursor: pointer; text-transform: none; letter-spacing: 0; }

/* check rows (attorneys, documents) */
.checks { display: grid; gap: 8px; }
.check { display: flex; gap: 12px; align-items: flex-start; border: 1px solid var(--line); border-radius: 12px; padding: 12px; cursor: pointer; background: #fff; }
.check:hover { border-color: var(--gold); }
.check input { width: 20px; height: 20px; margin: 1px 0 0; accent-color: var(--navy); flex: 0 0 20px; }
.check b { display: block; font-size: 15px; font-weight: 600; }
.check small { color: var(--muted); font-size: 13px; }
.check.on { border-color: var(--navy); background: #f3f5fb; }
.tag { display: inline-block; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; background: var(--gold-soft); color: var(--gold-2); border-radius: 6px; padding: 2px 6px; margin-left: 6px; vertical-align: 1px; }

/* status list */
.doc { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 14px; margin: 10px 0; box-shadow: var(--shadow); }
.doc .t { font-weight: 700; font-size: 15px; margin-bottom: 4px; overflow-wrap: anywhere; }
.doc .m { color: var(--muted); font-size: 13px; }
.doc ul { list-style: none; margin: 10px 0 0; padding: 0; display: grid; gap: 4px; }
.doc li { font-size: 14px; display: flex; gap: 8px; align-items: center; }
.dot { width: 18px; height: 18px; border-radius: 50%; display: inline-grid; place-items: center; font-size: 11px; font-weight: 700; flex: 0 0 18px; }
.dot.y { background: var(--ok); color: #fff; } .dot.n { border: 2px solid #c9cedb; }
.pill { display: inline-block; font-size: 12px; font-weight: 700; border-radius: 999px; padding: 3px 10px; margin-left: 6px; vertical-align: 1px; }
.pill.ok { background: var(--ok-soft); color: var(--ok); } .pill.wait { background: var(--warn-soft); color: var(--warn); } .pill.bad { background: var(--bad-soft); color: var(--bad); }
.row { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; }

/* notices */
.note { border-radius: 12px; padding: 12px 14px; font-size: 14px; margin: 12px 0; background: var(--gold-soft); border: 1px solid #ecd9c1; }
.note.ok { background: var(--ok-soft); border-color: #bfe3cc; }
.note.bad { background: var(--bad-soft); border-color: #f3c7c2; }
.done { text-align: center; padding: 28px 16px; }
.done .seal { width: 62px; height: 62px; border-radius: 50%; background: var(--ok); display: grid; place-items: center; margin: 0 auto 14px; }
.done .seal svg { width: 30px; height: 30px; stroke: #fff; fill: none; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.linkbox { display: flex; gap: 8px; margin-top: 12px; }
.linkbox input { flex: 1; min-width: 0; border: 1px solid #c9cedb; border-radius: 10px; padding: 10px 12px; font-size: 14px; background: #f7f8fb; }
.spin { width: 18px; height: 18px; border: 2.5px solid rgba(255,255,255,.4); border-top-color: #fff; border-radius: 50%; animation: sp .8s linear infinite; }
.btn.sec .spin { border-color: rgba(10,20,48,.2); border-top-color: var(--navy); }
@keyframes sp { to { transform: rotate(360deg); } }
.empty { color: var(--muted); text-align: center; padding: 26px 10px; }
.foot { text-align: center; color: var(--muted); font-size: 12.5px; margin-top: 30px; }

/* intake form inside the app */
#fillWrap .vdi { margin-top: 6px; }
.demo-banner { background: var(--gold); color: var(--navy); text-align: center; font-size: 13px; font-weight: 700; padding: 6px 12px; }
.demo-banner label { margin-left: 10px; white-space: nowrap; } .demo-banner select { font: inherit; font-weight: 700; border: 1px solid rgba(10,20,48,.35); border-radius: 6px; padding: 1px 4px; background: #fff; color: var(--navy); }

/* firm cases */
body.wide main { max-width: 1180px; }
.chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0; }
.chip { border: 1px solid var(--line); background: #fff; border-radius: 999px; padding: 6px 12px; font-size: 13px; cursor: pointer; }
.chip b { color: var(--muted); font-weight: 700; margin-left: 2px; }
.chip.on { background: var(--navy); border-color: var(--navy); color: #fff; }
.chip.on b { color: var(--gold); }
.filters { display: grid; grid-template-columns: 2fr repeat(4, 1fr); gap: 8px; margin: 6px 0 10px; }
.filters input, .filters select { width: 100%; border: 1px solid #c9cedb; border-radius: 10px; padding: 10px 12px; background: #fff; font-size: 14px; min-height: 42px; }
@media (max-width: 900px) { .filters { grid-template-columns: 1fr 1fr; } .filters input { grid-column: 1 / -1; } }
.spill { display: inline-block; font-size: 12px; font-weight: 700; border-radius: 999px; padding: 3px 10px; white-space: nowrap; background: #eef0f5; color: var(--navy); }
.spill.s-new { background: #e8eefb; color: #1f3f8a; } .spill.s-wait { background: var(--warn-soft); color: var(--warn); } .spill.s-ok { background: var(--ok-soft); color: var(--ok); }
.spill.s-lit { background: #f1e8fb; color: #5a2a8a; } .spill.s-done { background: #eef0f5; color: var(--muted); }
/* one color per case status */
.spill.st1 { background: #DC2626; color: #FFFFFF; } .spill.st2 { background: #F04438; color: #FFFFFF; } .spill.st3 { background: #FA6514; color: #FFFFFF; }
.spill.st4 { background: #FF8C00; color: #FFFFFF; } .spill.st5 { background: #FFB300; color: #FFFFFF; } .spill.st6 { background: #FFD700; color: #FFFFFF; }
.spill.st7 { background: #8ACC19; color: #FFFFFF; } .spill.st8 { background: #009447; color: #FFFFFF; } .spill.st9 { background: #292929; color: #FFFFFF; }
/* tags that aren't case statuses */
.spill.tg-un { background: #eceff3; color: #44505f; } .spill.tg-prior { background: #fff1d6; color: #8a5300; } .spill.tg-partner { background: #efe5ff; color: #5b2ea6; }
.spill.s-bad { background: var(--bad-soft); color: var(--bad); }
.ctable { width: 100%; border-collapse: separate; border-spacing: 0; background: #fff; border: 1px solid var(--line); border-radius: var(--r); overflow: hidden; box-shadow: var(--shadow); font-size: 14px; }
.ctable th { text-align: left; font-size: 12px; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); background: #f8f9fb; padding: 10px 12px; border-bottom: 1px solid var(--line); }
.ctable td { padding: 11px 12px; border-bottom: 1px solid #eef0f4; vertical-align: top; }
.ctable tr:last-child td { border-bottom: 0; }
.ctable tbody tr { cursor: pointer; } .ctable tbody tr:hover, .ctable tbody tr:focus { background: #f6f7fb; outline: none; }
.ccards { display: none; }
.ccard { display: grid; gap: 3px; width: 100%; text-align: left; background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px; margin: 8px 0; box-shadow: var(--shadow); cursor: pointer; }
.ccard .t { display: flex; justify-content: space-between; align-items: center; gap: 8px; } .ccard .m { color: var(--muted); font-size: 13px; }
@media (max-width: 760px) { .ctable { display: none; } .ccards { display: block; } }
.chead { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin: 4px 0 6px; }
.chead .spill { font-size: 13px; padding: 5px 12px; margin-top: 8px; }
.cgrid { display: grid; grid-template-columns: 1.4fr 1fr; gap: 0 16px; align-items: start; }
@media (max-width: 900px) { .cgrid { grid-template-columns: 1fr; } }
.cgrid select, .cgrid textarea { width: 100%; border: 1px solid #c9cedb; border-radius: 10px; padding: 10px 12px; background: #fff; font-size: 15px; }
.facts { display: grid; grid-template-columns: minmax(110px, 34%) 1fr; gap: 6px 12px; margin: 14px 0 0; font-size: 14px; }
.facts dt { color: var(--muted); } .facts dd { margin: 0; overflow-wrap: anywhere; } .facts .m, .log .m { color: var(--muted); font-size: 12.5px; }
.files { margin: 14px 0 0; font-size: 14px; font-weight: 600; }
.isec { border-top: 1px solid #eef0f4; padding: 8px 0; } .isec:first-of-type { border-top: 0; }
.isec summary { cursor: pointer; font-weight: 700; font-size: 14px; color: var(--navy); padding: 4px 0; }
.isec .facts { margin: 6px 0 4px; }
.log { list-style: none; margin: 12px 0 0; padding: 0; display: grid; gap: 10px; font-size: 14px; }
.log li { display: grid; gap: 2px; border-left: 3px solid var(--line); padding-left: 10px; }
.log li > span:last-child { white-space: pre-wrap; overflow-wrap: anywhere; }   /* a note's own line breaks */

/* search: where a match was found */
.why { font-size: 12.5px; color: var(--muted); margin-top: 3px; font-weight: 400; overflow-wrap: anywhere; }
.ctable .m, .dtable .m { color: var(--muted); font-size: 12.5px; }
.m.soon, td.soon b { color: var(--warn); } td.past b { color: var(--bad); }
.ccard b.warn { color: var(--warn); } .ccard b.bad { color: var(--bad); }
.badge.warn { background: var(--warn); }

/* SOL and deadlines on the case page */
.sol { border-bottom: 1px solid #eef0f4; padding-bottom: 12px; margin-bottom: 8px; font-size: 14.5px; }
.sol .k { display: block; color: var(--muted); font-size: 12px; text-transform: uppercase; letter-spacing: .06em; font-weight: 700; margin-bottom: 2px; }
.sol b { font-size: 17px; }
.solwarn { background: var(--warn-soft); border: 1px solid #f1d9ad; border-radius: 12px; padding: 12px 14px; line-height: 1.45; }
.solwarn b { font-size: 15px; } .solwarn.bad { background: var(--bad-soft); border-color: #f3c7c2; }
.solwarn .btns { margin: 10px 0 0; }
.solform { display: flex; flex-wrap: wrap; gap: 8px; align-items: end; margin-top: 10px; }
.solform input { border: 1px solid #c9cedb; border-radius: 10px; padding: 9px 10px; background: #fff; }
.btn.link.inl { padding: 0; min-height: 0; font-size: 13px; }
.dls { list-style: none; margin: 4px 0; padding: 0; display: grid; gap: 6px; }
.dls li { display: flex; align-items: center; justify-content: space-between; gap: 8px; border: 1px solid var(--line); border-radius: 10px; padding: 8px 10px; }
.dls li.soon { border-color: #f1d9ad; background: #fffaf1; } .dls li.past { border-color: #f3c7c2; background: #fff6f5; } .dls li.done { opacity: .6; }
.dls label { display: flex; gap: 10px; align-items: flex-start; cursor: pointer; font-size: 14px; }
.dls input { width: 18px; height: 18px; margin-top: 2px; accent-color: var(--navy); }
.dls .m { display: block; color: var(--muted); font-size: 12.5px; }
.dls .x { border: 0; background: none; font-size: 20px; color: var(--muted); cursor: pointer; padding: 0 6px; min-height: 32px; }
.dladd { display: grid; grid-template-columns: 1fr auto auto; gap: 8px; margin-top: 10px; }
.dladd input { border: 1px solid #c9cedb; border-radius: 10px; padding: 9px 10px; background: #fff; min-width: 0; }
@media (max-width: 520px) { .dladd { grid-template-columns: 1fr 1fr; } .dladd input:first-child { grid-column: 1 / -1; } }

/* letters */
#cv-letters .f { display: block; margin-bottom: 8px; }
#cv-letters input, #cv-letters textarea { width: 100%; border: 1px solid #c9cedb; border-radius: 10px; padding: 9px 10px; background: #fff; font-size: 14.5px; }
.more { margin: 2px 0 8px; } .more summary { cursor: pointer; font-weight: 600; font-size: 14px; color: var(--navy); padding: 4px 0; }
h4.sub { font-size: 13px; margin: 16px 0 6px; color: var(--muted); text-transform: uppercase; letter-spacing: .06em; }
.flist { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; font-size: 14px; } .flist a { overflow-wrap: anywhere; }
.lprev { background: #fff; border: 1px solid var(--line); border-radius: 6px; padding: 28px 30px; font: 13.5px/1.45 "Times New Roman", Times, serif; color: #111; box-shadow: var(--shadow); max-height: 560px; overflow: auto; }
.lprev .lh { text-align: center; margin-bottom: 14px; } .lprev .lh b { font-variant: small-caps; font-size: 17px; letter-spacing: .02em; } .lprev .lh small { display: block; font-size: 10.5px; }
.lprev p { margin: 0 0 10px; } .lprev .ind { text-indent: 36pt; text-align: justify; } .lprev .sig { margin-left: 2.5in; }
.lprev .re { display: grid; grid-template-columns: .55in 1.45in 1fr; font-weight: 700; margin-bottom: 10px; } .lprev .re span { min-height: 1em; }
.lprev .re.subj { font-weight: 400; } .lprev .re.subj .rs { grid-column: 2 / 4; font-weight: 700; } .lprev .re.subj > span:first-child { font-weight: 700; }
.lprev .lnum { margin-left: .5in; padding-left: .25in; text-indent: -.25in; }

/* deadlines page */
.dtable { table-layout: fixed; } .dtable td:first-child { width: 150px; } .dtable td:nth-child(2) { width: 26%; } .dtable td:nth-child(4) { width: 22%; }
@media (max-width: 760px) { .dtable { display: table; font-size: 13px; } .dtable td:first-child { width: 96px; } .dtable td:nth-child(4) { display: none; } } .cnt { color: var(--muted); font-weight: 600; letter-spacing: 0; margin-left: 4px; }

/* reports */
.pselect { border: 1px solid #c9cedb; border-radius: 10px; padding: 9px 12px; background: #fff; font-size: 14px; }
.stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin: 10px 0; }
@media (max-width: 800px) { .stats { grid-template-columns: 1fr 1fr; } }
.stat { background: #fff; border: 1px solid var(--line); border-radius: var(--r); padding: 14px 16px; box-shadow: var(--shadow); }
.stat .sn { display: block; font-size: 30px; font-weight: 700; line-height: 1.1; color: var(--ink); }
.stat .sl { color: var(--muted); font-size: 13px; } .stat.warn .sn { color: var(--warn); }
.cols { display: flex; align-items: flex-end; gap: 2px; height: 190px; padding: 18px 0 0; border-bottom: 1px solid var(--line); }
.col { flex: 1; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; height: 100%; position: relative; cursor: default; min-width: 0; }
.col:hover .cb { background: var(--gold); }
.cb { width: 70%; max-width: 34px; background: var(--navy); border-radius: 4px 4px 0 0; }
.cv { font-size: 12px; font-weight: 700; color: var(--ink); margin-bottom: 3px; min-height: 15px; }
.cx { position: absolute; bottom: -20px; font-size: 11px; color: var(--muted); white-space: nowrap; }
.card .cols { margin-bottom: 26px; }
@media (max-width: 520px) { .cx { font-size: 9.5px; } }
.rgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; } @media (max-width: 800px) { .rgrid { grid-template-columns: 1fr; } }
.blist { display: grid; gap: 7px; }
.brow { display: grid; grid-template-columns: minmax(90px, 38%) 1fr 34px; gap: 10px; align-items: center; font-size: 14px; }
.brow .bl { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bt { height: 12px; background: #f1f3f7; border-radius: 4px; overflow: hidden; display: block; }
.bb { display: block; height: 100%; background: var(--navy); border-radius: 0 4px 4px 0; }
.brow:hover .bb, tr:hover > .bt .bb { background: var(--gold); }
.bn { text-align: right; font-weight: 700; font-variant-numeric: tabular-nums; }
table.mini { width: 100%; border-collapse: collapse; font-size: 14px; }
table.mini th { text-align: left; color: var(--muted); font-size: 12px; text-transform: uppercase; letter-spacing: .05em; padding: 6px 8px; border-bottom: 1px solid var(--line); }
table.mini td { padding: 8px; border-bottom: 1px solid #eef0f4; font-variant-numeric: tabular-nums; }
table.mini tr.click { cursor: pointer; } table.mini tr.click:hover { background: #f6f7fb; }
.srct td.bcell { width: 32%; min-width: 90px; } .srct tr:hover .bb { background: var(--gold); }
.tview { margin-top: 6px; font-size: 14px; } .tview summary { cursor: pointer; color: var(--navy); font-weight: 600; }
.tip { position: absolute; z-index: 50; display: none; background: var(--navy); color: #fff; font-size: 13px; padding: 6px 10px; border-radius: 8px; pointer-events: none; box-shadow: var(--shadow); white-space: nowrap; }
@media (max-width: 520px) {
  .srct td.bcell, .srct th:nth-child(2) { display: none; }
  table.mini { font-size: 13px; } table.mini th, table.mini td { padding: 6px 4px; } table.mini th { font-size: 11px; letter-spacing: .02em; }
}

/* closing statement */
.closing { border-top: 3px solid var(--gold); }
.cgrid2 { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(250px, 1fr); gap: 18px; align-items: start; margin-top: 8px; }
@media (max-width: 980px) { .cgrid2 { grid-template-columns: 1fr; } }
.csec { border-top: 1px solid #eef0f4; padding: 12px 0 6px; } .csec:first-child { border-top: 0; padding-top: 0; }
.csec h4 { margin: 0 0 8px; font-size: 13px; text-transform: uppercase; letter-spacing: .06em; color: var(--navy); }
.csec h4.sub2 { margin-top: 12px; color: var(--muted); font-size: 12px; }
.crow { display: flex; gap: 8px; align-items: center; margin-bottom: 7px; flex-wrap: wrap; }
.crow input { flex: 1 1 140px; min-width: 0; border: 1px solid #c9cedb; border-radius: 10px; padding: 9px 10px; background: #fff; font-size: 14.5px; }
.crow input.money { flex: 0 1 130px; text-align: right; font-variant-numeric: tabular-nums; }
.crow input.pct { flex: 0 0 80px; text-align: right; }
.crow input[type=date] { flex: 0 0 auto; }
.crow .x { border: 0; background: none; font-size: 20px; color: var(--muted); cursor: pointer; padding: 0 4px; min-height: 36px; }
.crow .rd { font-size: 12.5px; color: var(--ok); min-width: 92px; text-align: right; font-variant-numeric: tabular-nums; }
.crow .chip { padding: 6px 10px; }
.seg.mini { margin-top: 0; } .seg.mini button { padding: 7px 11px; font-size: 13px; }
label.inl { display: inline-flex; gap: 8px; align-items: center; font-size: 13px; font-weight: 600; }
.ctot { position: sticky; top: 76px; background: #f8f9fb; border: 1px solid var(--line); border-radius: 12px; padding: 14px; }
.ctot .tl { display: flex; justify-content: space-between; gap: 10px; padding: 5px 0; font-size: 14px; font-variant-numeric: tabular-nums; }
.ctot .tl.sub { padding: 1px 0 1px 12px; color: var(--muted); font-size: 13px; }
.ctot .tl.big b { font-size: 16px; }
.csprior { margin-top: 14px; padding-top: 10px; border-top: 1px solid var(--line, rgba(0,0,0,.08)); }
.csprior h4 { margin: 0 0 6px; font-size: 13px; }
.csprior .tl { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; padding: 3px 0; font-size: 13px; color: var(--muted); font-variant-numeric: tabular-nums; }
.ctot .tl.net { border-top: 2px solid var(--navy); margin-top: 8px; padding-top: 10px; font-size: 16px; }
.ctot .tl.net b { font-size: 21px; color: var(--navy); }
.ctot .btns { flex-direction: column; margin-top: 12px; } .ctot .btns .btn { width: 100%; }
/* fees page */
.stats.five { grid-template-columns: repeat(5, 1fr); } @media (max-width: 1000px) { .stats.five { grid-template-columns: 1fr 1fr; } }
.stats.five .sn { font-size: 22px; } .stat.hi { border-color: var(--gold); background: #fffaf1; }
table.fees th.r, table.fees td.r, table.costt th.r, table.costt td.r, .ctable td.r, .ctable th.r { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
table.fees td { vertical-align: top; } table.fees .m { color: var(--muted); font-size: 12.5px; }
table.fees tfoot td { border-top: 2px solid var(--navy); background: #f8f9fb; }
.lprev .cl { display: grid; grid-template-columns: 1fr 120px 130px; } .lprev .cl span:nth-child(2), .lprev .cl span:nth-child(3) { text-align: right; }
.lprev .cl.netl { background: #ff0; text-decoration: underline; margin-top: 10px; }
.lprev .lien { font-variant: small-caps; text-decoration: underline; margin: 16px 1.4in 0 .5in; text-align: justify; }

#cs-out { margin-top: 14px; } #cs-out .lprev { max-width: 760px; margin: 10px auto 0; }
.chead2 { display: flex; gap: 8px; font-size: 11.5px; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; margin: 0 0 4px; padding-right: 130px; } .chead2 span:first-child { flex: 1 1 140px; } .chead2 span { flex: 0 1 130px; text-align: right; } .chead2 span:first-child { text-align: left; }
@media (max-width: 600px) { .chead2 { display: none; } }

/* sortable case lists */
.tscroll { overflow-x: auto; border-radius: var(--r); box-shadow: var(--shadow); }
.tscroll .ctable { box-shadow: none; min-width: 980px; }
.sorth { background: none; border: 0; padding: 0; font: inherit; font-size: 12px; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); font-weight: 700; cursor: pointer; display: inline-flex; gap: 4px; align-items: center; white-space: nowrap; }
.sorth:hover, .sorth.on { color: var(--navy); }
.sorth .arr { font-size: 10px; opacity: .45; } .sorth.on .arr { opacity: 1; color: var(--gold-2); }
th.r .sorth { justify-content: flex-end; width: 100%; }
.phone-only { display: none; }
.filters.closedf { grid-template-columns: 2fr 1fr 1fr 1fr; }
@media (max-width: 760px) { .phone-only { display: block; } .tscroll { display: none; } .filters.closedf { grid-template-columns: 1fr 1fr; } }
.filters { grid-template-columns: 2fr 1fr 1fr 1fr; }
@media (max-width: 900px) { .filters { grid-template-columns: 1fr 1fr; } }
/* closing statement: who signs */
.signp { border: 1px solid var(--gold); background: #fffaf1; border-radius: 12px; padding: 14px; margin-top: 14px; }
.signp h4 { margin: 0 0 4px; font-size: 13px; text-transform: uppercase; letter-spacing: .06em; color: var(--navy); }
.signp .who { flex: 0 0 220px; font-weight: 600; font-size: 14px; } @media (max-width: 600px) { .signp .who { flex-basis: 100%; } }
.signp select { border: 1px solid #c9cedb; border-radius: 10px; padding: 9px 10px; background: #fff; font-size: 14.5px; }

/* ---- two-step buttons, Excel export, date range */
.armed { background: var(--bad) !important; color: #fff !important; text-decoration: none !important; }
.btn.bad { background: #fff; color: var(--bad); border: 1px solid #f0b8b2; }
.row .seg { margin-top: 0; }
.drange { display: inline-flex; align-items: center; gap: 6px; }
.drange input { border: 1px solid #c9cedb; border-radius: 10px; padding: 8px 10px; background: #fff; font-size: 14px; }
tr.tot td { border-top: 2px solid var(--navy); }
.foot .btn.link.inl { font-size: 13px; padding: 0; }

/* ---- to-dos */
.tgrid { grid-template-columns: 1.5fr 1fr; }
.todos { list-style: none; margin: 0 0 6px; padding: 0; }
.todo { display: flex; gap: 10px; padding: 10px 4px; border-bottom: 1px solid #edf0f5; align-items: flex-start; }
.todo:last-child { border-bottom: 0; }
.tchk input { width: 20px; height: 20px; margin-top: 2px; accent-color: var(--navy); cursor: pointer; }
.tbody { flex: 1; min-width: 0; }
.ttl { all: unset; cursor: pointer; font-weight: 650; font-size: 15px; line-height: 1.35; display: block; }
.ttl:hover { text-decoration: underline; }
.todo .m { font-size: 13px; margin-top: 2px; }
.todo .m a { color: var(--navy); }
.todo.done .ttl { text-decoration: line-through; color: var(--muted); font-weight: 500; }
.todo.past .due { color: var(--bad); font-weight: 700; } .todo.soon .due { color: var(--warn); font-weight: 700; }
.tmore { margin-top: 8px; padding: 10px 12px; background: #f6f8fb; border-radius: 10px; }
.tdet { margin: 0 0 8px; white-space: pre-wrap; font-size: 14px; }
.tcm, .tact { display: flex; gap: 8px; align-items: center; margin-top: 8px; flex-wrap: wrap; font-size: 13.5px; }
.tcm input { flex: 1; min-width: 160px; border: 1px solid #c9cedb; border-radius: 9px; padding: 8px 10px; font-size: 14px; }
.tact select, .tact input { border: 1px solid #c9cedb; border-radius: 9px; padding: 6px 8px; font-size: 13.5px; background: #fff; margin-left: 4px; }
.tform { display: grid; gap: 8px; margin: 8px 0 4px; }
.tform input, .tform select, .tform textarea { width: 100%; border: 1px solid #c9cedb; border-radius: 10px; padding: 10px 12px; background: #fff; font-size: 15px; font-family: inherit; }
.trow { display: grid; grid-template-columns: 1.2fr 1fr auto; gap: 8px; align-items: center; }
.trow .hp { display: flex; gap: 6px; align-items: center; font-size: 14px; white-space: nowrap; }
.trow .hp input { width: auto; }
@media (max-width: 600px) { .trow { grid-template-columns: 1fr 1fr; } .trow .hp { grid-column: 1 / -1; } }

/* ---- admin */
.adm td { vertical-align: top; padding: 12px 10px; }
.adm .acts { text-align: right; white-space: nowrap; }
.adm .acts .btn { margin: 2px 0 2px 6px; min-height: 0; padding: 7px 11px; font-size: 13.5px; }
@media (max-width: 700px) { .adm .acts { white-space: normal; text-align: left; } .adm .acts .btn { margin: 4px 6px 0 0; } }
ul.tips { margin: 0; padding-left: 18px; font-size: 14px; line-height: 1.5; } ul.tips li { margin-bottom: 6px; }
.srct.fees td:first-child { min-width: 190px; } .srct.fees .bcell { width: 22%; min-width: 90px; }

/* ---- To-dos button in the top bar */
.top .tdbtn { display: inline-flex; align-items: center; gap: 6px; margin-right: 8px; }
.top .tdbtn svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.top .tdbtn .cnt { background: #fff; color: var(--navy); border-radius: 999px; font-weight: 800; font-size: 11.5px; min-width: 19px; padding: 1px 6px; text-align: center; }
.top .tdbtn .cnt.late { background: #e5484d; color: #fff; }
@media (max-width: 520px) { .top .tdbtn .lbl { display: none; } }

/* ---- To-dos, laid out like Microsoft To Do: lists | tasks | details */
body.wide main:has(.tdapp) { max-width: 1400px; }
.tdapp { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 0; min-height: calc(100vh - 140px); background: #f6f7f9; border: 1px solid #e3e6ec; border-radius: 14px; overflow: hidden; }
.tdapp.withdet { grid-template-columns: 230px minmax(0, 1fr) 340px; }
.tdapp svg, #cv-todos svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.tdside { background: #fff; border-right: 1px solid #e3e6ec; padding: 10px 8px; overflow-y: auto; }
.tdhome { all: unset; display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--muted); padding: 6px 10px 12px; cursor: pointer; }
.tdl { all: unset; box-sizing: border-box; display: flex; align-items: center; gap: 10px; width: 100%; padding: 9px 10px; border-radius: 8px; cursor: pointer; font-size: 14px; color: var(--ink, #1b2233); }
.tdl span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tdl b { font-weight: 600; font-size: 12.5px; color: var(--muted); }
.tdl:hover { background: #f1f3f7; } .tdl.on { background: #e8edf8; font-weight: 700; } .tdl.on svg { color: var(--navy); }
.tdl:focus-visible, .tdr:focus-visible { outline: 2px solid var(--navy); outline-offset: -2px; }
.tdsh { font-size: 11.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); padding: 16px 10px 6px; border-top: 1px solid #edf0f5; margin-top: 8px; }
.tdnew { display: flex; align-items: center; gap: 8px; padding: 8px 10px; color: var(--navy); font-size: 14px; }
.tdnew select { flex: 1; min-width: 0; border: 0; background: transparent; color: var(--navy); font-size: 14px; font-weight: 600; cursor: pointer; }
.tdmain { padding: 22px 26px 30px; overflow-y: auto; min-width: 0; }
.tdhead h1 { margin: 0; font-size: 24px; } .tdsub { margin: 2px 0 14px; color: var(--muted); font-size: 13px; }
.tdhead { position: relative; } .tdhead .tdcase { position: absolute; right: 0; top: 6px; }
.tdcase { color: var(--navy); font-size: 13.5px; font-weight: 600; }
#td-lists { width: 100%; margin-bottom: 10px; border: 1px solid #c9cedb; border-radius: 10px; padding: 9px 10px; font-size: 15px; background: #fff; }
.tdadd { background: #fff; border-radius: 10px; box-shadow: 0 1px 2px rgba(16,24,40,.08); margin-bottom: 14px; }
.tdai { display: flex; align-items: center; gap: 12px; padding: 0 14px; color: var(--navy); }
.tdai input { flex: 1; border: 0; outline: 0; padding: 14px 0; font-size: 15px; background: transparent; }
.tdai input::placeholder { color: var(--navy); opacity: .85; }
.tdaopts { display: none; align-items: center; gap: 8px; flex-wrap: wrap; padding: 8px 12px; border-top: 1px solid #edf0f5; background: #fafbfc; border-radius: 0 0 10px 10px; }
.tdadd.open .tdaopts { display: flex; }
.tdaopts label { display: flex; align-items: center; gap: 4px; color: var(--muted); }
.tdaopts select, .tdaopts input { border: 1px solid #d6dae3; border-radius: 8px; padding: 6px 8px; font-size: 13.5px; background: #fff; max-width: 210px; }
.tdaopts .btn { margin-left: auto; min-height: 0; padding: 7px 16px; }
.tdadd .err { padding: 0 14px 10px; }
.tdlist { display: flex; flex-direction: column; gap: 3px; }
.tdg { margin-bottom: 14px; }
.tdgh { display: flex; align-items: center; justify-content: space-between; padding: 4px 4px 6px; font-size: 13px; font-weight: 700; color: #3c4557; }
.tdgh span, .tdgl { display: flex; align-items: center; gap: 7px; } .tdgh b { font-weight: 600; color: var(--muted); }
.tdgl { all: unset; display: flex; align-items: center; gap: 7px; cursor: pointer; } .tdgl:hover { text-decoration: underline; }
.tdr { display: flex; align-items: center; gap: 12px; background: #fff; border-radius: 8px; padding: 10px 12px; box-shadow: 0 1px 2px rgba(16,24,40,.07); cursor: pointer; }
.tdg .tdr { margin-bottom: 3px; }
.tdr:hover { background: #f9fafc; } .tdr.sel { background: #e8edf8; }
.tdc { all: unset; cursor: pointer; color: var(--navy); display: flex; border-radius: 50%; }
.tdc svg { width: 22px; height: 22px; } .tdc.sm svg { width: 18px; height: 18px; }
.tdc .ck { opacity: 0; } .tdc:hover .ck { opacity: .55; }
.done > .tdc .ck, .tdr.done .tdc .ck, .tddtop.done .tdc .ck, .tdstep.done .tdc .ck { opacity: 1; }
.tdr.done .tdc svg circle, .tddtop.done .tdc svg circle, .tdstep.done .tdc svg circle { fill: var(--navy); }
.tdr.done .tdc .ck, .tddtop.done .tdc .ck, .tdstep.done .tdc .ck { stroke: #fff; }
.tdc[disabled] { cursor: default; opacity: .5; }
.tdx { flex: 1; min-width: 0; }
.tdt { font-size: 14.5px; line-height: 1.35; }
.tdr.done .tdt { text-decoration: line-through; color: var(--muted); }
.tdm { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 6px; font-size: 12.5px; color: var(--muted); margin-top: 2px; }
.tdm span { display: inline-flex; align-items: center; gap: 3px; } .tdm svg { width: 13px; height: 13px; } .tdm i { font-style: normal; opacity: .6; }
.tdue.late { color: #c4314b; font-weight: 600; } .tdue.today { color: var(--navy); font-weight: 600; }
.tds { all: unset; cursor: pointer; color: #9aa3b5; display: flex; }
.tds.on { color: var(--navy); } .tds.on svg { fill: var(--navy); } .tds:hover { color: var(--navy); } .tds[disabled] { cursor: default; }
.tdempty { padding: 26px; text-align: center; color: var(--muted); background: #fff; border-radius: 8px; }
.tddone { all: unset; cursor: pointer; display: inline-flex; gap: 6px; align-items: center; margin: 16px 0 8px; padding: 6px 10px; background: #e9ecf2; border-radius: 6px; font-size: 13.5px; font-weight: 600; }
.tddet { background: #f6f7f9; border-left: 1px solid #e3e6ec; padding: 12px; overflow-y: auto; display: none; }
.tdapp.withdet .tddet { display: block; }
.tddbar { display: flex; justify-content: flex-end; }
.tdx2 { all: unset; cursor: pointer; color: var(--muted); display: flex; padding: 4px; border-radius: 6px; } .tdx2:hover { background: #e7eaf0; color: var(--ink, #1b2233); }
.tdx2.sm svg { width: 14px; height: 14px; }
.tddcard { background: #fff; border-radius: 8px; padding: 12px; margin-bottom: 10px; box-shadow: 0 1px 2px rgba(16,24,40,.06); }
.tddtop { display: flex; gap: 10px; align-items: flex-start; }
.tddtop textarea { flex: 1; border: 0; resize: none; font-size: 17px; font-weight: 700; font-family: inherit; line-height: 1.3; outline: 0; overflow: hidden; padding: 0; }
.tddtop.done textarea { text-decoration: line-through; color: var(--muted); }
.tdsteps { margin-top: 10px; }
.tdstep { display: flex; align-items: center; gap: 10px; padding: 7px 2px; border-top: 1px solid #f0f2f6; font-size: 14px; }
.tdstep span { flex: 1; } .tdstep.done span { text-decoration: line-through; color: var(--muted); }
.tdstep.add { color: var(--navy); } .tdstep.add input { flex: 1; border: 0; outline: 0; font-size: 14px; } .tdstep.add input::placeholder { color: var(--navy); }
.tddf label { display: flex; align-items: center; gap: 10px; padding: 7px 0; font-size: 14px; color: #3c4557; border-bottom: 1px solid #f0f2f6; }
.tddf label span { width: 38px; color: var(--muted); }
.tddf select, .tddf input { flex: 1; min-width: 0; border: 1px solid transparent; border-radius: 7px; padding: 6px 6px; font-size: 14px; background: transparent; }
.tddf select:hover, .tddf input:hover { border-color: #d6dae3; }
.tddf .tdcase { display: inline-block; margin-top: 8px; }
#tdd-note { width: 100%; border: 0; resize: vertical; font-family: inherit; font-size: 14px; outline: 0; }
.tddsub { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); margin-bottom: 4px; }
.tddfoot { display: flex; justify-content: space-between; align-items: center; gap: 10px; font-size: 12.5px; color: var(--muted); padding: 6px 4px; }
.tddfoot .armed { padding: 4px 10px; border-radius: 6px; font-weight: 700; }
#cv-todos .tdadd { margin: 10px 0; box-shadow: none; border: 1px solid #e3e6ec; }
#cv-todos .tdr { box-shadow: none; border: 1px solid #edf0f5; }
#cv-todos .tdaopts { display: none; } #cv-todos .tdadd.open .tdaopts { display: flex; }
@media (max-width: 1100px) { .tdapp.withdet { grid-template-columns: 200px minmax(0, 1fr) 300px; } .tdapp { grid-template-columns: 200px minmax(0, 1fr); } }
@media (max-width: 860px) {
  .tdapp, .tdapp.withdet { grid-template-columns: 1fr; border-radius: 0; border: 0; background: transparent; min-height: 0; }
  .tdside { display: none; } .tdmain { padding: 4px 0 20px; }
  .tdhead .tdcase { position: static; display: inline-block; margin-top: 4px; }
  .tdapp.withdet .tddet { position: fixed; inset: 0; z-index: 50; border: 0; padding: calc(12px + env(safe-area-inset-top)) 14px calc(30px + env(safe-area-inset-bottom)); overscroll-behavior: contain; }
}
@media (min-width: 861px) { #td-lists { display: none; } }
.tdstep span { text-align: left; }
@media (max-width: 520px) { .top .who { display: none; } }
#cv-todos .tdm svg { width: 13px; height: 13px; } #cv-todos .tdc svg { width: 22px; height: 22px; }

/* ---- medical bills and health insurance liens (case page) */
.msub { margin: 14px 0 6px; font-size: 13px; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); }
.mtable { border: 1px solid #e3e6ec; border-radius: 10px; overflow: hidden; margin-bottom: 6px; }
.mrow { all: unset; box-sizing: border-box; display: grid; grid-template-columns: minmax(0, 1fr) 100px 100px 104px; gap: 8px; width: 100%; padding: 9px 12px; border-top: 1px solid #edf0f5; font-size: 14px; align-items: start; }
button.mrow { cursor: pointer; } button.mrow:hover { background: #f6f8fb; } button.mrow:focus-visible { outline: 2px solid var(--navy); outline-offset: -2px; }
.mrow.mh { border-top: 0; background: #f3f5f9; font-size: 12px; font-weight: 700; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; padding: 7px 12px; }
.mrow .r { text-align: right; font-variant-numeric: tabular-nums; } .mrow .b { font-weight: 700; }
.mrow small { display: block; color: var(--muted); font-size: 12.5px; margin-top: 2px; } .mrow small.mnote { font-style: italic; }
.mrow .spill { font-size: 11px; padding: 1px 7px; vertical-align: 1px; }
.mrow.mx > span:not(:first-child) { color: #8a93a3; }
.mrow.mt { background: #f6f8fb; font-weight: 700; border-top: 2px solid #d9dee7; } .mrow.mt2 { font-size: 13px; color: #3c4557; }
.mform { border: 1px solid #c9d3e8; background: #f8faff; border-radius: 10px; padding: 12px; margin: 6px 0; }
.mgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 10px; }
.mform input, .mform textarea { width: 100%; border: 1px solid #c9cedb; border-radius: 9px; padding: 9px 10px; font-size: 15px; font-family: inherit; background: #fff; box-sizing: border-box; }
.mrel { display: flex; flex-wrap: wrap; gap: 6px 16px; margin: 8px 0 4px; font-size: 14px; } .mrel label { display: flex; align-items: center; gap: 6px; cursor: pointer; } .mrel input { width: auto; accent-color: var(--navy); }
.mamt { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0 10px; }
.mamt input { text-align: right; font-variant-numeric: tabular-nums; }
@media (max-width: 640px) {
  .mgrid { grid-template-columns: 1fr; }
  .mrow { grid-template-columns: 1fr 1fr 1fr; } .mrow > span:first-child { grid-column: 1 / -1; }
  .mrow.mh { display: none; } .mrow .r::before { content: attr(data-l); display: block; font-size: 11px; color: var(--muted); font-weight: 600; }
  .mrow.mt2 > span:nth-child(2), .mrow.mt2 > span:nth-child(3) { display: none; }
}
.ctot.locked { position: static; max-width: 560px; margin: 8px 0 10px; }
.csout { margin-top: 10px; } .csout .inl input { border: 1px solid #c9cedb; border-radius: 8px; padding: 6px 8px; }

/* =====================================================================
   Refresh (Oct 2026): Montserrat stays the brand face (logo, headings);
   Inter for working text and figures. Tighter, flatter screens on a
   computer; phones keep the larger touch targets.
   ===================================================================== */
:root { --line: #e1e4eb; --muted: #5a6378; --r: 12px; --shadow: 0 1px 2px rgba(10,20,48,.05); --f-head: Montserrat, Inter, system-ui, sans-serif; }
body { font: 15px/1.45 Inter, system-ui, -apple-system, "Segoe UI", sans-serif; font-feature-settings: "cv11", "ss01"; -webkit-font-smoothing: antialiased; }
h1, .card h3, .tile b, .top .who b, .chd h1, .tdhead h1, .stat .sn { font-family: var(--f-head); }
h1 { font-size: 25px; font-weight: 700; letter-spacing: -.015em; }
h2 { color: var(--muted); letter-spacing: .12em; font-size: 11.5px; }
.card { box-shadow: none; padding: 16px; }
.card h3 { font-size: 15px; font-weight: 700; }
.tile { box-shadow: none; padding: 14px; border-radius: 12px; transition: border-color .15s, background .15s; }
.tile:hover { border-color: #b9c1d3; background: #fbfcfe; }
.tile .ic { flex-basis: 38px; height: 38px; border-radius: 10px; }
.tile .ic svg { width: 19px; height: 19px; }
.tile b { font-size: 15px; font-weight: 600; }
.tile small { font-size: 13px; }
.tile.hero { padding: 16px; }
.tile.hero:hover { background: var(--navy-2); }
.badge { background: #e8edf8; color: var(--navy); font-weight: 700; }
.badge.warn { background: var(--warn-soft); color: var(--warn); }
.ctable { box-shadow: none; font-variant-numeric: tabular-nums; }
.spill { font-weight: 600; }
.stats .stat, .stat { box-shadow: none !important; }
body.wide main { max-width: 1360px; }
.foot { margin-top: 26px; }
.filters.closedf { grid-template-columns: 2fr repeat(4, 1fr); }
@media (min-width: 761px) {
  .btn { min-height: 40px; padding: 8px 15px; font-size: 14px; border-radius: 9px; }
  label.f input, label.f select, label.f textarea { font-size: 14.5px; padding: 9px 11px; border-radius: 9px; }
  .filters input, .filters select { min-height: 40px; padding: 8px 11px; font-size: 14px; border-radius: 9px; }
  .ctable { font-size: 14px; }
  .ctable th { font-size: 11px; padding: 9px 11px; }
  .ctable td { padding: 9px 11px; }
  .ctable td:not(:first-child):not(:nth-child(8)) { white-space: nowrap; }
  .tiles { gap: 10px; }
}

/* attention strip on Home */
.attn { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 14px 0 4px; }
.att { all: unset; box-sizing: border-box; cursor: pointer; background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 14px 18px; display: flex; flex-direction: column; gap: 1px; }
.att b { font-family: var(--f-head); font-size: 26px; line-height: 1.15; color: var(--navy); font-variant-numeric: tabular-nums; }
.att span { font-size: 14px; color: var(--muted); }
.att:hover { border-color: #b9c1d3; } .att:focus-visible { outline: 2px solid var(--navy); }
.att.hot { background: #fff5f5; border-color: #f2c9c6; } .att.hot b { color: var(--bad); }
@media (max-width: 640px) { .attn { grid-template-columns: 1fr 1fr; } }

/* case page: header band and tabs */
.chd { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 16px 18px 12px; margin: 6px 0 0; }
.chd-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.chd h1 { margin: 0; font-size: 24px; }
.chd-sub { margin: 2px 0 0; color: var(--muted); font-size: 14px; }
.chd-st { display: flex; flex-direction: column; align-items: flex-end; gap: 3px; font-size: 12.5px; }
.chd-st .spill { font-size: 12.5px; padding: 4px 11px; }
.chd-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 10px 14px; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--line); align-items: start; }
.chd-grid label.f { margin: 0; font-size: 12px; font-weight: 600; color: var(--muted); text-transform: uppercase; letter-spacing: .05em; }
.chd-grid label.f select { margin-top: 4px; text-transform: none; letter-spacing: 0; color: var(--ink); font-weight: 500; }
.chd-grid .fl { display: block; font-size: 12px; font-weight: 600; color: var(--muted); text-transform: uppercase; letter-spacing: .05em; margin-bottom: 6px; }
.chd-grid .fv { font-size: 14px; line-height: 1.4; overflow-wrap: anywhere; }
.chd-msg { min-height: 0; } #cv-saved { color: var(--ok); font-weight: 600; font-size: 13.5px; } #cv-saved:not(:empty) { display: block; margin-top: 8px; }
.closeq { margin-top: 12px; background: #fff8ee; border: 1px solid #f0d9b5; border-radius: 10px; padding: 12px 14px; }
.closeq .reasons { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 8px 0 4px; font-size: 14px; } .closeq label { display: flex; gap: 6px; align-items: center; cursor: pointer; }
.closeq label.f { display: block; margin: 10px 0 2px; cursor: default; } .closeq label.f input { display: block; width: 100%; margin-top: 5px; }
.ctabs { display: flex; gap: 2px; margin: 14px 0 10px; border-bottom: 1px solid var(--line); overflow-x: auto; scrollbar-width: none; }
.ctabs::-webkit-scrollbar { display: none; }
.ctabs button { all: unset; cursor: pointer; padding: 10px 14px; font-size: 14px; font-weight: 600; color: var(--muted); border-bottom: 2.5px solid transparent; margin-bottom: -1px; white-space: nowrap; }
.ctabs button b { font-size: 11.5px; background: #eef1f6; color: var(--muted); border-radius: 999px; padding: 1px 7px; margin-left: 4px; }
.ctabs button:hover { color: var(--ink); }
.ctabs button[aria-selected="true"] { color: var(--navy); border-bottom-color: var(--gold); }
.ctabs button:focus-visible { outline: 2px solid var(--navy); outline-offset: -2px; }
.tabp { display: none; } .tabp.on { display: block; }
.tabp > .card:first-child, .tabp .cgrid > div > .card:first-child { margin-top: 0; }
.cgrid.ins { grid-template-columns: 1fr 1fr; gap: 0 16px; } .cgrid.ins > .card { margin-top: 0; }
@media (max-width: 900px) { .cgrid.ins { grid-template-columns: 1fr; } .chd-st { display: none; } }

/* insurance */
.ilist { display: flex; flex-direction: column; gap: 8px; margin-bottom: 6px; }
.irow { all: unset; box-sizing: border-box; cursor: pointer; display: grid; grid-template-columns: 1fr auto; gap: 1px 10px; border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; }
.irow:hover { background: #f8f9fc; } .irow:focus-visible { outline: 2px solid var(--navy); }
.irow .ik { grid-column: 1 / -1; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.irow b { font-size: 15px; } .irow .ilim { text-align: right; font-weight: 600; font-variant-numeric: tabular-nums; font-size: 14px; }
.irow small { grid-column: 1 / -1; color: var(--muted); font-size: 12.5px; } .irow small.mnote { font-style: italic; }
label.chk { display: flex; gap: 8px; align-items: center; font-size: 14px; margin: 8px 0; cursor: pointer; } label.chk input { width: auto; accent-color: var(--navy); }

/* negotiation */
.nsum { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 10px; }
.nsum > div { background: #f6f8fb; border-radius: 10px; padding: 9px 11px; } .nsum span { display: block; font-size: 11.5px; color: var(--muted); font-weight: 600; text-transform: uppercase; letter-spacing: .05em; }
.nsum b { font-family: var(--f-head); font-size: 17px; font-variant-numeric: tabular-nums; } .nsum small { display: block; color: var(--muted); font-size: 12px; }
.nlog { border: 1px solid var(--line); border-radius: 10px; overflow: hidden; margin-bottom: 6px; }
.nrow { all: unset; box-sizing: border-box; cursor: pointer; display: grid; grid-template-columns: 96px 120px 1fr auto; gap: 8px; width: 100%; padding: 9px 12px; border-top: 1px solid #eef0f4; font-size: 14px; align-items: start; }
.nrow:first-child { border-top: 0; } .nrow:hover { background: #f8f9fc; }
.nrow .nd { color: var(--muted); font-variant-numeric: tabular-nums; } .nrow .na { font-weight: 700; font-variant-numeric: tabular-nums; text-align: right; }
.nrow .nt { font-weight: 600; } .nrow small { display: block; color: var(--muted); font-size: 12.5px; }
.nrow.t-demand .nt, .nrow.t-counter .nt { color: var(--navy); } .nrow.t-offer .nt { color: #2f6b12; } .nrow.t-tender .nt { color: #5b2ea6; }
.ngrid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 10px; } .ngrid input, .ngrid select { width: 100%; }
/* costs ledger: Charged, then Paid; a disputed bill stands out */
.klog .krow, .klog .khead { grid-template-columns: 96px 1fr 110px 110px; }
.klog .khead { display: grid; gap: 8px; padding: 7px 12px; background: #f6f8fb; font-size: 11.5px; font-weight: 600; color: var(--muted); text-transform: uppercase; letter-spacing: .03em; }
.klog .khead .r { text-align: right; }
.klog .khead .ksort { all: unset; cursor: pointer; font: inherit; color: inherit; text-transform: inherit; letter-spacing: inherit; border-radius: 4px; }
.klog .khead .ksort.r { text-align: right; } .klog .khead .ksort.on { color: #5b2bd6; } .klog .khead .ksort:hover { color: var(--ink); } .klog .khead .ksort:focus-visible { outline: 2px solid #8a3ffc; outline-offset: 2px; }
.kbar { display: flex; flex-wrap: wrap; gap: 8px 16px; margin: 0 0 10px; } .kbar label { display: flex; align-items: center; gap: 8px; font-size: 13.5px; color: var(--muted); font-weight: 600; } .kbar .pselect { min-width: 0; }
.kempty { padding: 10px 0; }
.klog .krow .na { white-space: nowrap; } .klog .ktot .na { text-align: right; font-weight: 700; white-space: nowrap; font-variant-numeric: tabular-nums; } .klog .krow .kl { display: none; }
.klog .krow .np b { font-weight: 600; }
.klog .ktot { display: grid; gap: 8px; padding: 9px 12px; border-top: 2px solid var(--line); background: #fbfcfe; }
.ktag { display: inline-block; font-size: 11px; font-weight: 600; padding: 1px 7px; border-radius: 999px; background: #eef0f5; color: #4b5563; vertical-align: 1px; }
.ktag.d { background: #fcefdc; color: #87520a; }
.ksum .kopen b { color: #87520a; }
.kgrid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 10px; } .kgrid .kwide { grid-column: span 2; } .kgrid input, .kgrid select { width: 100%; }
.kchk { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 0 0 8px; } .kchk label { display: flex; align-items: center; gap: 7px; font-size: 14.5px; min-height: 32px; cursor: pointer; }
.kchk input { width: 18px; height: 18px; accent-color: #8a3ffc; }
@media (max-width: 900px) { .kgrid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) {
  .klog .khead { display: none; }
  .kbar label { flex: 1 1 100%; } .kbar .pselect { flex: 1; }
  .klog .krow, .klog .ktot { grid-template-columns: 1fr auto auto; row-gap: 2px; }
  .klog .krow .nd { grid-column: 1 / -1; grid-row: 1; font-size: 12.5px; } .klog .krow .np { grid-column: 1 / -1; grid-row: 2; }
  .klog .krow .kc { grid-column: 2; grid-row: 3; } .klog .krow .kp { grid-column: 3; grid-row: 3; } .klog .krow .kl { display: inline; font-weight: 500; color: var(--muted); font-size: 12px; }
  .klog .ktot .nd { display: none; } .klog .ktot .np { grid-column: 1; } .klog .ktot .kc { grid-column: 2; } .klog .ktot .kp { grid-column: 3; }
  .kgrid .kwide { grid-column: 1 / -1; }
}
@media (max-width: 640px) { .nrow { grid-template-columns: 1fr auto; } .nrow .nd { grid-column: 1 / -1; font-size: 12.5px; } }

/* medical: provider rows, records chips */
div.mrow[role="button"] { cursor: pointer; } div.mrow[role="button"]:hover { background: #f6f8fb; } div.mrow[role="button"]:focus-visible { outline: 2px solid var(--navy); outline-offset: -2px; }
.rec { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.rchip { all: unset; cursor: pointer; font-size: 12px; font-weight: 600; border: 1px solid #cfd5e2; color: var(--muted); border-radius: 999px; padding: 2px 10px; background: #fff; }
.rchip:hover { border-color: var(--navy); color: var(--navy); }
.rchip.on { background: #e4f4ea; border-color: #b8dfc6; color: #1d7a46; } .rchip.on.late { background: #fbe9e7; border-color: #f0c2bd; color: var(--bad); }
.rchip:focus-visible { outline: 2px solid var(--navy); }

/* closed reason in lists */
.rsn { font-size: 12.5px; font-weight: 600; } .rsn.r-settled { color: #1d7a46; } .rsn.r-declined { color: #8a5300; } .rsn.r-lost { color: var(--bad); }
.attn { margin-bottom: 14px; }
@media (max-width: 640px) {
  .chd { padding: 14px 14px 10px; }
  .chd-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .chd-grid > .f:last-child { grid-column: 1 / -1; }
  .chd-grid label.f select { font-size: 16px; padding: 9px 10px; }
  .chd h1 { font-size: 22px; }
}

/* ---- records requests from a provider */
.rchip.rq { display: inline-flex; align-items: center; gap: 5px; border-style: dashed; color: var(--violet-ink, #3d2fb3); }
.rchip.rq svg { width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.lready { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; margin-top: 8px; padding: 7px 10px; background: #f3f1ff; border: 1px solid #d9d4fb; border-radius: 9px; font-size: 13px; color: #2c2370; }
.lready svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.lready a { color: #3d2fb3; font-weight: 600; }
.btn.sm { min-height: 0; padding: 5px 11px; font-size: 13px; border-radius: 8px; }
.lnote { display: block; font-size: 12.5px; color: var(--muted); margin: 8px 0 4px; } .mrow .lprev { max-height: 420px; cursor: default; margin-bottom: 4px; }
.rqp { grid-column: 1 / -1; margin: 0 12px 10px; padding: 12px 14px; background: #f8f7ff; border: 1px solid #d9d4fb; border-radius: 10px; font-size: 14px; }
.rqp .mrel { margin: 8px 0 6px; } .rqp .inl input { border: 1px solid #c9cedb; border-radius: 8px; padding: 6px 8px; margin-left: 6px; }

/* =====================================================================
   Website colors: deep indigo #16143A and violet #6C5CE7 alongside the
   firm's navy #0A1430 and gold #C18A48. Indigo for the main surfaces,
   violet for what's interactive or selected, gold kept for the brand.
   ===================================================================== */
:root { --indigo: #16143a; --indigo-2: #221d5c; --violet: #6c5ce7; --violet-2: #5a49d8; --violet-ink: #3d2fb3; --violet-soft: #efedfd; }
.top { background: linear-gradient(100deg, #0a1430 0%, #16143a 48%, #2a2373 100%); }
.tile .ic { background: var(--indigo); }
.tile:hover { border-color: #c9c2f6; background: #fcfbff; }
.tile.hero { background: linear-gradient(120deg, #16143a 0%, #241e63 60%, #3a2f8f 100%); border-color: #16143a; }
.tile.hero:hover { background: linear-gradient(120deg, #1b1847 0%, #2b2473 60%, #4436a3 100%); }
.btn.pri { background: var(--indigo); }
.btn.pri:hover { background: var(--violet-2); }
.btn.sec:hover { border-color: var(--violet); color: var(--violet-ink); }
.btn.link { color: var(--violet-ink); }
a { color: var(--violet-ink); }
.seg button[aria-pressed="true"] { background: var(--indigo); }
.badge { background: var(--violet-soft); color: var(--violet-ink); }
.att b { color: var(--indigo); } .att:hover { border-color: #c9c2f6; }
.chd { border-top: 3px solid var(--violet); }
.ctabs button[aria-selected="true"] { color: var(--indigo); border-bottom-color: var(--violet); }
.ctabs button[aria-selected="true"] b { background: var(--violet-soft); color: var(--violet-ink); }
.sorth.on, .sorth.on .arr { color: var(--violet-ink); }
label.f input:focus, label.f select:focus, label.f textarea:focus, .filters input:focus, .filters select:focus { outline: 2px solid var(--violet); outline-offset: 1px; border-color: var(--violet); }
.ctable tbody tr:hover, .ctable tbody tr:focus { background: #f7f6ff; }
input[type="checkbox"], input[type="radio"] { accent-color: var(--violet); }
/* to-dos */
.tdl.on { background: var(--violet-soft); } .tdl.on svg { color: var(--violet); }
.tdc { color: var(--violet); } .tdr.done .tdc svg circle, .tddtop.done .tdc svg circle, .tdstep.done .tdc svg circle { fill: var(--violet); }
.tds.on { color: var(--violet); } .tds.on svg { fill: var(--violet); } .tds:hover { color: var(--violet); }
.tdr.sel { background: var(--violet-soft); } .tdai { color: var(--violet-ink); } .tdai input::placeholder { color: var(--violet-ink); }
.top .tdbtn .cnt { color: var(--indigo); }

/* ---- medical totals at a glance (Medical tab and Overview) */
.msum { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; margin: 12px 0 4px; }
.msum > div { background: #f6f7fb; border-radius: 10px; padding: 9px 11px; min-width: 0; }
.msum span { display: block; font-size: 11px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--muted); }
.msum b { display: block; font-family: var(--f-head); font-size: 16.5px; font-variant-numeric: tabular-nums; margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.msum small { display: block; font-size: 11.5px; color: var(--muted); }
.msum .hi { background: var(--indigo, #16143a); } .msum .hi span { color: #c9c2f6; } .msum .hi b { color: #fff; }
.msum .bad { background: #fff3f2; } .msum .bad b, .msum .bad small { color: var(--bad); }
.medsum .msum { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 1100px) { .msum { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 520px) { .msum, .medsum .msum { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Admin: attorney signatures for letters */
#sigs .sigrow { border-top: 1px solid var(--line); padding: 12px 0; }
#sigs .sigrow:first-of-type { border-top: 0; }
#sigs .sighd { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: baseline; margin-bottom: 8px; }
#sigs .sigbox { height: 74px; border: 1px dashed #cfd5e2; border-radius: 10px; background: #fff; display: flex; align-items: center; justify-content: flex-start; padding: 6px 14px; max-width: 360px; }
#sigs .sigbox img { max-height: 60px; max-width: 100%; }
#sigs .sigbox.empty { background: #f7f8fb; }
#sigs .sigact { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-top: 8px; }
#sigs .sigact .btn { min-height: 36px; padding: 7px 12px; font-size: 13.5px; }
#sigs .bar { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--muted); margin-left: auto; }
#sigs .bar input { width: 110px; min-height: 36px; padding: 6px 10px; }
#sigs .sigprev { margin-top: 10px; padding: 10px; background: #f6f5ff; border-radius: 10px; }
#sigs .sigprev .btns { margin-top: 8px; } #sigs .sigprev .btn { min-height: 36px; padding: 7px 12px; font-size: 13.5px; }
@media (max-width: 640px) { #sigs .bar { margin-left: 0; } }

/* contract details on the send screen; defendants on the case */
.cdet { margin-top: 14px; padding: 14px; border-radius: 12px; background: #f6f5ff; border: 1px solid #e4e0fb; }
.cdet h4 { margin: 0 0 4px; font-size: 14px; }
.cdet .cdblank { color: #8a5300; margin-bottom: 0; }
.cdet .m { font-weight: 400; }
.dflist { margin: 8px 0 0; padding-left: 18px; } .dflist li { margin: 3px 0; }
.dfrow { margin-top: 10px; } .dfmain { display: flex; gap: 8px; align-items: center; } .dfmain input { flex: 1; }
.dfc { margin: 6px 0 0 2px; } .dfc summary { cursor: pointer; font-size: 13px; color: var(--violet, #4f46e5); font-weight: 600; }
.dfc .two { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; } .dfc label { display: block; font-size: 12.5px; font-weight: 600; color: var(--muted); margin-top: 6px; }
.dfmain input, .dfc input, .dfc textarea { display: block; width: 100%; margin-top: 3px; border: 1px solid #c9cedb; border-radius: 9px; padding: 8px 10px; font: inherit; font-size: 14px; background: #fff; }
@media (max-width: 640px) { .dfc .two { grid-template-columns: 1fr; } .dfc input, .dfc textarea { font-size: 16px; } }
.dflist .m { font-size: 12.5px; }
.dfmain input:focus, .dfc input:focus, .dfc textarea:focus { outline: 2px solid var(--violet); outline-offset: 1px; border-color: var(--violet); }
.dfmain input { padding: 9px 11px; font-size: 15px; }

/* closing: other bills not being paid */
.csec .qtxt { flex: 1; font-size: 14px; }

/* Reports: attorney pace */
.pace td, .pace th { white-space: nowrap; }
.pace .m { font-size: 11.5px; }
.warnc { color: #a31c1c; font-weight: 700; }
#slowc .row { gap: 10px; flex-wrap: wrap; }
.hscroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* SOL suggestion: what it assumes */
.solnote { font-size: 12.5px; color: var(--muted); margin: 8px 0 0; line-height: 1.45; }
.solnote.bad { color: #a31c1c; }

/* Fees: filters */
.filters.fef { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1.2fr 1fr auto; gap: 8px; margin-bottom: 12px; align-items: center; }
@media (max-width: 900px) { .filters.fef { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .stats.five .sn { font-size: 17px; overflow-wrap: anywhere; } .stats.five .stat { min-width: 0; } }

/* History: file log */
.hlog { display: grid; grid-template-columns: 200px 160px 1fr auto; gap: 10px; align-items: end; }
.hlog .btn { margin-bottom: 2px; }
@media (max-width: 760px) { .hlog { grid-template-columns: 1fr 1fr; } .hlog .hl-t { grid-column: 1 / -1; } }
.chips { display: flex; flex-wrap: wrap; gap: 6px; }
.chips .chip { padding: 4px 11px; font-size: 12.5px; }
.ltag { display: inline-block; font-size: 11px; font-weight: 700; background: #eef0f5; color: var(--navy, #0a1430); border-radius: 4px; padding: 1px 6px; margin-right: 6px; }
.hlist { margin-top: 10px; }

/* close (X) on a letter just made */
.lout { position: relative; padding-right: 40px; }
.xbtn { border: 0; background: transparent; font-size: 22px; line-height: 1; width: 32px; height: 32px; border-radius: 6px; cursor: pointer; color: var(--muted); }
.xbtn:hover { background: rgba(0,0,0,.06); color: var(--ink); }
.lout .xbtn { position: absolute; top: 6px; right: 6px; }
.lready .xbtn { margin-left: 4px; }

/* intake uploads waiting to be cleaned up */
.upbox { display: flex; gap: 12px; align-items: center; justify-content: space-between; background: #f6f7fa; border: 1px solid var(--line); border-radius: 8px; padding: 10px 12px; margin: 10px 0 4px; font-size: 13.5px; }
.upbox.old { background: var(--warn-soft); border-color: #f0c98a; }
@media (max-width: 600px) { .upbox { flex-direction: column; align-items: flex-start; } }

/* medical bills: export / print choices */
.mxp { border: 1px solid var(--line); background: #f8f9fb; border-radius: 8px; padding: 12px; margin: 10px 0; }
.mxp .mrel { display: flex; flex-direction: column; gap: 6px; }
.mxlist { display: flex; flex-direction: column; gap: 5px; max-height: 260px; overflow-y: auto; background: #fff; border: 1px solid var(--line); border-radius: 6px; padding: 8px 10px; }

/* closing: Florida fee schedule working and referral suggestion */
.tiers { margin: 6px 0 0; font-size: 13px; max-width: 360px; }
.tiers div { display: flex; justify-content: space-between; padding: 2px 0; color: var(--muted); }
.tiers .tt { border-top: 1px solid var(--line); color: var(--ink); font-weight: 700; }
.warnh { color: var(--warn); }
.refsug { background: var(--gold-soft, #fffaf1); border: 1px solid #ecd9b0; border-radius: 8px; padding: 8px 10px; margin: 4px 0 8px; font-size: 13.5px; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.cgrid > * { min-width: 0; } .ilist > * { min-width: 0; overflow-wrap: anywhere; }
@media (max-width: 520px) { .nsum { grid-template-columns: repeat(3, minmax(0, 1fr)); } .nsum b { font-size: 14px; overflow-wrap: anywhere; } .nsum > div { padding: 8px; } }

/* Calendar tab */
.cmonth { margin-top: 12px; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }
.cmhead { display: flex; align-items: center; gap: 6px; padding: 8px 10px; border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.cmhead b { min-width: 140px; text-align: center; }
.cmhead .btn.link { font-size: 18px; padding: 2px 8px; }
.cmhead #ca-today { font-size: 13px; }
.clegend { margin-left: auto; display: flex; gap: 10px; font-size: 12px; color: var(--muted); }
.clegend span::before { content: ''; display: inline-block; width: 9px; height: 9px; border-radius: 3px; margin-right: 4px; vertical-align: -1px; }
.clegend .k-sol::before, .cchip.k-sol { background: #DC2626; } .clegend .k-dl::before, .cchip.k-dl { background: #FA6514; } .clegend .k-ev::before, .cchip.k-ev { background: var(--navy); }
.cgridm { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.cdow { font-size: 11.5px; font-weight: 700; color: var(--muted); text-transform: uppercase; padding: 6px 8px; background: #f6f7fa; border-bottom: 1px solid var(--line); }
.cday { min-height: 92px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 4px; cursor: pointer; display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.cday:nth-child(7n) { border-right: 0; } .cday.out { background: #fafbfc; cursor: default; }
.cday:hover:not(.out) { background: #fbf8f1; }
.cday .dn { font-size: 12.5px; font-weight: 600; color: var(--muted); }
.cday.today .dn { background: var(--navy); color: #fff; border-radius: 999px; width: 22px; height: 22px; display: inline-flex; align-items: center; justify-content: center; }
.cchip { border: 0; color: #fff; border-radius: 5px; font: inherit; font-size: 11.5px; line-height: 1.25; text-align: left; padding: 2px 5px; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.cchip i { font-style: normal; opacity: .85; } .cchip.done { opacity: .45; text-decoration: line-through; }
.clist { list-style: none; margin: 8px 0 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.clist li button { width: 100%; display: grid; grid-template-columns: 130px minmax(0, 1fr) auto; gap: 10px; align-items: start; text-align: left; background: #fff; border: 1px solid var(--line); border-left: 4px solid var(--navy); border-radius: 8px; padding: 8px 10px; font: inherit; cursor: pointer; color: inherit; }
.clist li.k-sol button { border-left-color: #DC2626; } .clist li.k-dl button { border-left-color: #FA6514; } .clist li.done button { opacity: .55; }
.clist small { display: block; color: var(--muted); font-size: 12.5px; }
.ceform { border: 1px solid var(--line); background: #f8f9fb; border-radius: 8px; padding: 12px; margin: 10px 0; }
.ceform .two { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; } .ceform .two label { display: flex; flex-direction: column; gap: 4px; font-size: 13px; font-weight: 600; }
.syncp { border: 1px solid #ecd9b0; background: #fffaf1; border-radius: 8px; padding: 12px; margin: 10px 0; }
.syncp .mrel { display: flex; flex-direction: column; gap: 4px; }
.sbtn { display: flex; gap: 8px; flex-wrap: wrap; margin: 10px 0 4px; }
.mono { font-family: ui-monospace, Menlo, monospace; font-size: 12px; width: 100%; }
@media (max-width: 700px) {
  .cday { min-height: 54px; padding: 3px; } .cchip { font-size: 0; height: 7px; padding: 0; border-radius: 4px; pointer-events: none; }   /* a tap on a phone opens the whole day */
  .cdow { padding: 4px 2px; text-align: center; font-size: 10.5px; }
  .clegend { margin-left: 0; width: 100%; }
  .clist li button { grid-template-columns: 1fr; gap: 2px; }
  .ceform .grid { grid-template-columns: 1fr; }
}

/* document previews as printed pages, shrunk to fit (phones show the whole page width) */
.pgwrap { width: 100%; max-width: 816px; margin: 10px auto 0; overflow: hidden; position: relative; }
.lprev.page { width: 816px; min-height: 1056px; padding: 96px; box-sizing: border-box; font-size: 16px; line-height: 1.25; max-height: none; overflow: visible; transform-origin: top left; border-radius: 2px; box-shadow: 0 1px 4px rgba(10,20,48,.18); margin: 0; }
.mrow .pgwrap .lprev.page, #cs-out .pgwrap .lprev.page { max-height: none; max-width: none; margin: 0; }

/* firm calendar, all-day, files, Outlook */
.fcf { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; margin-bottom: 10px; } .fcf select { max-width: 260px; }
.fcshow { display: flex; gap: 12px; flex-wrap: wrap; font-size: 13.5px; }
.chk { display: inline-flex; gap: 6px; align-items: center; font-size: 13.5px; font-weight: 600; cursor: pointer; }
.clegend .k-outlook::before, .cchip.k-outlook { background: #0F6CBD; } .clist li.k-outlook button { border-left-color: #0F6CBD; }
.cchip.k-ev { background: var(--navy); }
.cmore { font-size: 11px; color: var(--muted); padding-left: 3px; }
.clist li { position: relative; } .clist .olhide { position: absolute; right: 10px; bottom: 6px; font-size: 12px; }
.cefiles { margin: 4px 0 6px; } .ceform .fl { display: block; font-size: 13px; font-weight: 600; margin-bottom: 4px; }
.ceform .chk { margin: 2px 0 6px; }
.cmhead .btn.link[id$="-today"] { font-size: 13px; }
.invl { display: flex; flex-wrap: wrap; gap: 6px 16px; margin: 2px 0 4px; }
.ceform .two input { height: 44px; border: 1px solid #c9cedb; border-radius: 10px; padding: 0 10px; font: inherit; background: #fff; width: 100%; box-sizing: border-box; }

.invq { display: flex; flex-wrap: wrap; gap: 6px; margin: 2px 0 8px; } .invq .chip { padding: 4px 10px; font-size: 12.5px; }
.invo { display: flex; gap: 8px; margin: 8px 0 4px; } .invo input { flex: 1; min-width: 0; }
.invchips { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0; }
.ochip { display: inline-flex; align-items: center; gap: 4px; background: #eef0f5; border-radius: 999px; padding: 3px 4px 3px 10px; font-size: 12.5px; }
.ochip button { border: 0; background: transparent; cursor: pointer; font-size: 15px; line-height: 1; padding: 0 4px; color: var(--muted); }
.ceimp { margin: -2px 0 4px; } .ce-dl { margin: 2px 0 6px; font-weight: 600; }
.ce-dl .mrel.inl { display: flex; flex-wrap: wrap; gap: 6px 22px; flex-direction: row; } .ce-dl .req { font-size: 11px; font-weight: 700; color: var(--bad); margin-left: 6px; text-transform: uppercase; letter-spacing: .04em; }
.ce-dl.need { outline: 2px solid var(--bad); outline-offset: 4px; border-radius: 6px; }

/* hiding / cancelling calendar entries */
.clist.withhide li button[data-ci] { padding-right: 86px; }
.hidebox { position: absolute; right: 10px; top: 10px; display: inline-flex; gap: 5px; align-items: center; font-size: 12.5px; color: var(--muted); cursor: pointer; background: #fff; padding: 2px 4px; border-radius: 6px; }
.hidebar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 8px 0; font-size: 13px; color: var(--muted); }
.hidebar.on { background: #fffaf1; border: 1px solid #ecd9b0; border-radius: 8px; padding: 8px 10px; color: var(--ink); font-weight: 600; }
.hidlist { margin: 10px 0; } .hidlist summary { cursor: pointer; font-weight: 600; font-size: 13.5px; color: var(--muted); }
.clist li.hid .hrow { display: grid; grid-template-columns: 130px minmax(0, 1fr) auto; gap: 10px; align-items: center; background: #f6f7f9; border: 1px dashed var(--line); border-radius: 8px; padding: 8px 10px; opacity: .85; }
.clist li.hid b { text-decoration: none; }
@media (max-width: 700px) { .clist li.hid .hrow { grid-template-columns: 1fr; } .clist.withhide li button[data-ci] { padding-right: 10px; padding-top: 30px; } }
.tdanote { display: none; font-size: 12px; color: var(--muted); margin: 6px 2px 0; } .tdadd.open .tdanote { display: block; }

/* calendar entry editor: a pop-up over the page, so nothing on the page moves */
.cemodal { position: fixed; inset: 0; z-index: 60; background: rgba(10,20,48,.45); display: flex; align-items: flex-start; justify-content: center; padding: 4vh 16px; overflow-y: auto; }
.cemodal-in { position: relative; width: 100%; max-width: 760px; background: #fff; border-radius: 12px; box-shadow: 0 20px 60px rgba(10,20,48,.35); }
.cemodal-in .ceform { margin: 0; border: 0; background: #fff; padding: 18px 20px 16px; }
.cemodal-in .ceinfo { padding: 20px; } .cemodal-in .ceinfo p { margin: 6px 0; }
.cemx { position: absolute; top: 8px; right: 8px; z-index: 2; }
body.modal-open { overflow: hidden; }
body.modal-pin { position: fixed; left: 0; right: 0; width: 100%; }   /* phones: the page is pinned where it was (top set by app.js modalLock) */
.cemodal { overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }   /* scrolling the form never scrolls the page behind it */
@media (max-width: 600px) {   /* on a phone the form fills the screen and scrolls on its own */
  .cemodal { padding: 0; align-items: stretch; height: 100%; height: 100dvh; }
  .cemodal-in { max-width: none; min-height: 100%; border-radius: 0; box-shadow: none; padding-bottom: env(safe-area-inset-bottom); }
}
@media (max-width: 600px) { .cemodal { padding: 0; } .cemodal-in { border-radius: 0; min-height: 100%; } }
.mrow .pgwrap, .mrow .lnote { grid-column: 1 / -1; width: 100%; } .mrow .pgwrap { max-width: 816px; }
/* every calendar item names its case: bold case name first on chips, a case line in the editor */
.cchip .ccase { font-weight: 700; }
.cecase { margin: 2px 0 8px; color: var(--muted, #555); font-weight: 600; display: flex; align-items: center; gap: 6px; }
.cecase svg { width: 15px; height: 15px; }
/* firm calendar: labeled filters, unsigned contracts (purple), the timeline below the month */
.fsel { display: inline-flex; flex-direction: column; gap: 2px; font-size: 12px; font-weight: 600; color: var(--muted, #555); }
.fsel select { font-size: 14px; min-width: 150px; }
.fcf #fc-clear { align-self: flex-end; margin-bottom: 6px; }
.fcshow { flex-basis: 100%; }
.clegend .k-contract::before, .cchip.k-contract { background: #7C3AED; } .clist li.k-contract button { border-left-color: #7C3AED; }
.fcwait { margin-top: 16px; } .fcwait h3 { margin: 0 0 4px; } .fcwait .clist { margin-top: 6px; }
.tlhead { margin-top: 20px; align-items: flex-end; gap: 12px; flex-wrap: wrap; } .tlhead h2 { margin: 0; }
.timeline h3.tlm { margin: 18px 0 2px; font-size: 15px; color: var(--navy); border-bottom: 1px solid #e3e6ec; padding-bottom: 4px; }
@media (max-width: 640px) { .fsel { flex: 1 1 45%; } .fsel select { min-width: 0; width: 100%; max-width: none; } }
.fcshow input[type=checkbox] { width: auto; min-height: 0; padding: 0; }
.tlhead .fsel select { border: 1px solid #c9cedb; border-radius: 10px; padding: 8px 11px; background: #fff; font-size: 14px; min-height: 40px; }
.tlhead .fsel select:focus { outline: 2px solid var(--violet); outline-offset: 1px; border-color: var(--violet); }
/* closing statement bills and liens: a fixed grid so each heading sits centered over its box, whether or not "reduced from" shows */
.crow[data-k="medical"], .chead2.med { display: grid; grid-template-columns: minmax(0, 1fr) 130px 130px 132px 28px; gap: 8px; align-items: center; }
.chead2.med { padding-right: 0; } .chead2.med span, .chead2.med span:first-child { text-align: center; } .chead2.med span:first-child { text-align: left; padding-left: 2px; }
.crow[data-k="medical"] input { width: 100%; }
.crow[data-k="medical"] .rd { min-width: 0; text-align: left; }
@media (max-width: 600px) {
  .crow[data-k="medical"] { grid-template-columns: 1fr 1fr 28px; }
  .crow[data-k="medical"] input[data-f="name"] { grid-column: 1 / 3; }
  .crow[data-k="medical"] .rd { grid-column: 1 / 3; grid-row: 3; }
  .crow[data-k="medical"] .x { grid-column: 3; grid-row: 1; }
  .crow[data-k="medical"] .cin { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
  .crow[data-k="medical"] .cin::before { content: attr(data-l); font-size: 11.5px; font-weight: 600; color: var(--muted); padding-left: 2px; }
}
.cin { display: contents; }   /* (desktop) the label wrapper takes no space; the heading row above names the columns */
/* the "save a draft?" question: a small centered box, also on a phone */
/* export buttons: Excel and PDF side by side */
.xgrp { display: inline-flex; gap: 6px; flex-wrap: nowrap; }
/* intake answers edited in place on the Overview */
.iaedit { border: 1px solid var(--line); border-radius: 10px; padding: 8px 12px 4px; margin: 0 0 10px; display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; }
.iaedit legend { font-weight: 700; font-size: 13px; color: var(--navy); padding: 0 4px; }
.iaedit label.f:has(textarea) { grid-column: 1 / -1; }
@media (max-width: 640px) { .iaedit { grid-template-columns: 1fr; } }
/* a calendar entry to read (Edit opens the form) */
.ceview { padding: 18px 22px 16px; } .ceview .cecase { padding-right: 34px; }
.ceview .cvt { margin: 2px 0 6px; font-size: 20px; line-height: 1.25; color: var(--ink); }
.ceview .cvtags { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; font-size: 13px; color: var(--muted); margin-bottom: 10px; }
.ceview .cvrow { display: flex; gap: 12px; align-items: flex-start; padding: 10px 0; border-top: 1px solid var(--line); font-size: 15px; line-height: 1.45; }
.ceview .cvrow > svg { width: 18px; height: 18px; flex: 0 0 18px; margin-top: 2px; fill: none; stroke: var(--muted); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.ceview .cvnotes { white-space: pre-wrap; }
.ceview .btns { margin-top: 14px; }
.ceview.k-dl .cvt { color: #b4470a; } .ceview.k-sol .cvt { color: #b42318; }
.csauto { text-align: center; margin: 4px 0 0; }

@media (max-width: 600px) { .ceview { padding: 16px 16px 20px; } .ceview .cvt { font-size: 19px; } }
/* firm calendar: Month / Week switch, the week view, and the pop-ups */
.fcviews { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin: 0 0 10px; } .fcviews .hint { margin: 0; }
.wgrid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); border-top: 1px solid var(--line); }
.wday { border-right: 1px solid var(--line); min-height: 260px; padding: 6px 5px 10px; cursor: pointer; display: flex; flex-direction: column; gap: 5px; }
.wday:last-child { border-right: 0; } .wday:hover { background: #fafbfd; }
.wday.today .wdh b { background: var(--navy); color: #fff; border-radius: 999px; padding: 0 7px; }
.wdh { display: flex; align-items: baseline; gap: 6px; font-size: 12px; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; padding: 2px 2px 6px; }
.wdh b { font-size: 17px; color: var(--ink); letter-spacing: 0; }
.witem { border: 0; border-left: 4px solid var(--navy); background: #eef1f8; border-radius: 6px; padding: 5px 6px; text-align: left; font: inherit; font-size: 12.5px; line-height: 1.3; color: var(--ink); cursor: pointer; overflow-wrap: anywhere; }
.witem i { display: block; font-style: normal; font-size: 11.5px; color: var(--muted); } .witem b { font-weight: 700; }
.witem.k-dl { border-left-color: #FA6514; background: #fff1e8; } .witem.k-sol { border-left-color: #DC2626; background: #fdecec; }
.witem.k-contract { border-left-color: #7C3AED; background: #f3edff; } .witem.k-outlook { border-left-color: #0F6CBD; background: #e8f1fb; }
.witem.done { opacity: .5; text-decoration: line-through; } .witem:hover { filter: brightness(.97); }
.wnone { font-size: 12px; color: #a0a7b8; padding: 2px; }
@media (max-width: 760px) {
  .wgrid { grid-template-columns: 1fr; } .wday { border-right: 0; border-bottom: 1px solid var(--line); min-height: 0; }
  .wdh { font-size: 13px; } .witem { font-size: 14px; padding: 8px 10px; }
}
.fcpop { align-items: flex-start; } .fcpop .cemodal-in { max-width: 560px; }
.fpday { padding: 18px 20px 16px; } .fpdh { display: flex; align-items: center; gap: 10px; margin: 0 34px 12px 0; } .fpdh b { flex: 1; text-align: center; font-size: 16px; }
.fpday .clist { margin: 0; }
@media (max-width: 600px) { .fcpop .cemodal-in { min-height: 0; border-radius: 14px; margin-top: 8vh; } .fcpop { padding: 12px !important; } }
/* the client's name stands out on every calendar item */
.cchip .ccase { font-weight: 800; letter-spacing: .01em; } .cchip .clab { opacity: .88; }
.clist .cl .ccl { display: block; font-size: 14.5px; font-weight: 800; color: var(--navy); margin-bottom: 1px; } .clist .cl .ccl em { font-style: normal; font-weight: 500; color: var(--muted); font-size: 13px; }
.witem .wcl { display: block; font-size: 13.5px; font-weight: 800; color: var(--ink); margin-bottom: 1px; }
.ceview .cecase { font-size: 15.5px; font-weight: 800; color: var(--navy); }
.ceview .cecase svg { width: 17px; height: 17px; }
/* phone month view (Apple Calendar style): months scroll up and down inside the calendar, a dot per kind of item */
.msc { height: 440px; overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; background: #fff; border: 1px solid var(--line); border-radius: 14px; position: relative; }
.mdow { position: sticky; top: 0; z-index: 2; display: grid; grid-template-columns: repeat(7, 1fr); background: rgba(255,255,255,.96); border-bottom: 1px solid var(--line); padding: 6px 4px; font-size: 11.5px; font-weight: 700; color: var(--muted); text-align: center; }
.msec { padding: 10px 4px 6px; }
.msec h3 { margin: 4px 10px 8px; font-size: 22px; font-weight: 800; color: var(--ink); } .msec h3 span { color: var(--muted); font-weight: 600; }
.mcal7 { display: grid; grid-template-columns: repeat(7, 1fr); row-gap: 2px; }
.md { border: 0; background: none; font: inherit; height: 52px; display: flex; flex-direction: column; align-items: center; justify-content: flex-start; gap: 3px; padding: 4px 0 0; border-top: 1px solid #eef0f4; cursor: pointer; color: var(--ink); }
.md.out { border-top-color: transparent; cursor: default; }
.md span { font-size: 17px; line-height: 28px; width: 30px; height: 30px; border-radius: 999px; font-variant-numeric: tabular-nums; }
.md.today span { background: #DC2626; color: #fff; font-weight: 700; }
.md:active span { background: #e7eaf2; } .md.today:active span { background: #b91c1c; }
.mdots { display: flex; gap: 3px; align-items: center; height: 7px; font-style: normal; }
.mdots b { width: 6px; height: 6px; border-radius: 999px; background: var(--navy); }
.mdots b.k-dl { background: #FA6514; } .mdots b.k-sol { background: #DC2626; } .mdots b.k-contract { background: #7C3AED; } .mdots b.k-outlook { background: #0F6CBD; }
.mdots em { font-style: normal; font-size: 9.5px; color: var(--muted); font-weight: 700; }
/* on a phone, pop-ups come up from the bottom like a sheet */
@media (max-width: 600px) {
  .fcpop { align-items: flex-end !important; padding: 0 !important; }
  .fcpop .cemodal-in { margin: 0 !important; width: 100%; max-width: none; border-radius: 16px 16px 0 0 !important; max-height: 86vh; overflow-y: auto; padding-top: 6px; }
  .fcpop .cemodal-in::before { content: ''; display: block; width: 38px; height: 5px; border-radius: 999px; background: #d4d8e1; margin: 2px auto 0; }
}
/* filters fold away on a phone (tap "Filters"); always open on a computer */
.fcfwrap > summary { display: none; }
@media (max-width: 760px) {
  .fcfwrap > summary { display: inline-flex; gap: 6px; align-items: center; font-weight: 700; font-size: 14px; color: var(--navy); cursor: pointer; padding: 6px 0 10px; list-style: none; }
  .fcfwrap > summary::before { content: '▸'; } .fcfwrap[open] > summary::before { content: '▾'; }
  .fcfwrap > summary span { color: var(--muted); font-weight: 600; }
  .fchint { display: none; }
  .fcviews { margin-bottom: 8px; }
}
/* one month at a time: each month fills the calendar and scrolling stops on the next month (like turning a page) */
.msc { scroll-snap-type: y mandatory; }
.msec { scroll-snap-align: start; scroll-snap-stop: always; scroll-margin-top: 30px; box-sizing: border-box; }
.mdow { height: 30px; box-sizing: border-box; }
/* phone: the bills-and-liens headings are hidden (each box says what it is), so the grid can't widen the page */
@media (max-width: 600px) { .chead2.med { display: none; } }
/* Admin: the action buttons wrap inside the table instead of running off its right edge */
.adm .acts { white-space: normal; text-align: left; min-width: 0; }
.adm .acts { display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; }
.adm .acts .btn { margin: 0; }
.adm td:nth-child(3) { min-width: 120px; }
@media (max-width: 700px) { .adm .acts { justify-content: flex-start; } }
/* Touch screens: bigger hit areas for the small controls, same look */
@media (pointer: coarse), (max-width: 600px) {
  .tdc, .tds { padding: 11px; margin: -11px; box-sizing: content-box; }
  .tdc.sm { padding: 13px; margin: -13px; }
  .tdgl { padding: 12px 0; margin: -12px 0; }
  .sorth { padding: 14px 0; margin: -14px 0; }
}
/* Stage pills: same colors; dark text where white text was hard to read (WCAG AA 4.5:1) */
.spill.st2, .spill.st3, .spill.st4, .spill.st5, .spill.st6, .spill.st7, .spill.st8 { color: #1B1B1B; }
/* scrollable report tables can be reached and scrolled with the keyboard */
.hscroll:focus-visible { outline: 2px solid var(--navy); outline-offset: 2px; }
.spill.st8 { background: #00843F; color: #FFFFFF; }
/* Deadline chips: a deeper orange so the white text stays readable (was 2.7:1, now ~5:1); legend and dots match */
.cchip.k-dl, .clegend .k-dl::before, .mdots b.k-dl { background: #C2410C; }
.clist li.k-dl button, .witem.k-dl { border-left-color: #C2410C; }
.cchip .clab { opacity: 1; }
/* referral share: a % box */
.pctin { display: flex; align-items: center; gap: 6px; } .pctin input { flex: 1; min-width: 0; } .pctin span { font-weight: 600; color: var(--muted); }
.cdet .cdref { margin-top: 8px; }
/* Negotiation on phones: amounts never break mid-number; each row reads date + amount, then type, then party and notes */
@media (max-width: 640px) {
  .nrow { grid-template-columns: 1fr auto; row-gap: 2px; }
  .nrow .nd { grid-column: 1; grid-row: 1; } .nrow .na { grid-column: 2; grid-row: 1 / span 2; align-self: center; white-space: nowrap; }
  .nrow .nt { grid-column: 1; grid-row: 2; } .nrow .np { grid-column: 1 / -1; grid-row: 3; text-align: left; }
}
@media (max-width: 520px) {
  .nsum { grid-template-columns: 1fr 1fr; } .nsum > div:nth-child(3) { grid-column: 1 / -1; display: flex; align-items: baseline; justify-content: space-between; }
  .nsum b { font-size: 16px; overflow-wrap: normal; white-space: nowrap; }
}
.tag.rec { background: #e7f0fb; color: #1f3f8a; }
/* letter preview: the firm's letterhead (as in Letterhead.docx) */
.lprev .lh2 { display: grid; grid-template-columns: 1fr 1.7fr 1fr; gap: 10px; align-items: start; color: #6b6b6b; font-size: 10.5px; line-height: 1.35; margin-bottom: 22px; }
.lprev .lh2 .sc { font-variant: small-caps; letter-spacing: .02em; display: block; margin-bottom: 9px; font-size: 11.5px; }
.lprev .lh2 .lhr { text-align: right; } .lprev .lh2 .lhr span:not(.sc) { display: block; margin-bottom: 7px; }
.lprev .lh2 .lhc { text-align: center; } .lprev .lh2 .lhc img { width: 100%; max-width: 300px; display: block; margin: 0 auto 8px; }
.lprev .ldate { text-align: center; }
.lprev .lfoot { margin-top: 26px; text-align: center; font-variant: small-caps; font-size: 10.5px; color: #6b6b6b; } .lprev .lfoot small { display: block; font-size: 9px; }
@media (max-width: 560px) { .lprev .lh2 { grid-template-columns: 1fr 1fr; } .lprev .lh2 .lhc { grid-column: 1 / -1; order: -1; } .lprev .lh2 .lhc img { max-width: 240px; } }
/* standalone sign-in */
.signin { max-width: 440px; margin: 40px auto; } .signin h1 { margin-top: 0; } .signin .f { display: block; margin-top: 12px; } .signin input { width: 100%; }
#si-code { letter-spacing: .3em; font-size: 20px; font-variant-numeric: tabular-nums; }
/* client uploads page */
.fl-head { display: flex; justify-content: space-between; gap: 16px; align-items: flex-start; flex-wrap: wrap; } .fl-head h2 { margin: 0 0 4px; }
.fl-exp { text-align: right; } .fl-exp b { display: block; font-size: 18px; } .fl-exp span { color: var(--muted); font-size: 13px; } .fl-exp.soon b { color: var(--bad); }
.fl-list { list-style: none; margin: 14px 0 0; padding: 0; } .fl-list li { display: flex; align-items: center; gap: 12px; padding: 10px 0; border-top: 1px solid #eef0f4; }
.fl-k { font-size: 11px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; border-radius: 6px; padding: 3px 7px; background: #eef0f5; color: var(--navy); min-width: 44px; text-align: center; }
.fl-k.k-video { background: #f1e8fb; color: #5a2a8a; } .fl-k.k-pdf { background: #fdecec; color: #9b1c1c; }
.fl-n { flex: 1; min-width: 0; overflow-wrap: anywhere; } .fl-n small { display: block; color: var(--muted); }
.fl-log { margin: 0; padding-left: 18px; } .fl-log li { margin: 4px 0; }

/* Face ID / Touch ID offer on the home screen (standalone mode) */
.pkoffer { margin-top: 18px; }
.pkoffer p { margin: 4px 0 10px; color: var(--muted, #5B6577); }

/* Time and date boxes on iPhone: Safari sizes them by their own content and ignores the column width, so Start and
   End could run into each other. Let the columns shrink, turn off Safari's own sizing, and stack them on narrow phones. */
.ceform .two { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.ceform .two label { min-width: 0; }
label.f input[type="time"], label.f input[type="date"], .ceform input[type="time"], .ceform input[type="date"] { min-width: 0; max-width: 100%; min-height: 44px; box-sizing: border-box; -webkit-appearance: none; appearance: none; display: block; }
label.f input[type="time"]::-webkit-date-and-time-value, label.f input[type="date"]::-webkit-date-and-time-value, .ceform input::-webkit-date-and-time-value { text-align: left; margin: 0; }
@media (max-width: 400px) { .ceform .two { grid-template-columns: minmax(0, 1fr); gap: 10px; } }

/* Never let one long word, menu option or file box push a form or pop-up wider than the screen (narrow phones,
   larger text settings): grid columns may shrink below their content, and fields stay inside their box. */
.grid > *, .tiles > *, .filters > *, .two > *, .rgrid > *, .stats > *, .trow > *, .dladd > *, .ceform .grid > * { min-width: 0; }
.ceform .grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 700px) { .ceform .grid { grid-template-columns: minmax(0, 1fr); } }
select, textarea, input:not([type="checkbox"]):not([type="radio"]) { max-width: 100%; }
input[type="file"] { width: 100%; overflow: hidden; text-overflow: ellipsis; }

/* Phones and tablets: typing boxes at 16px or more, so iPhone doesn't zoom the page when one is tapped */
@media (pointer: coarse) {
  html:root body :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), select, textarea),
  #view :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), select, textarea) { font-size: max(16px, 1em) !important; }
}

/* letter preview: details the case doesn't have, highlighted for whoever drafts the letter (as in the Word file) */
.lprev mark.lmiss { background: #ffef3a; color: inherit; padding: 0 1px; }

/* ---- Home: the counts in one row; Quick actions (the sign-up packet, then four buttons) */
.attn.att4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.attn.att4 .att span { font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }   /* each label on one line */
/* a phone: still one row of four, smaller, the count over its label */
@media (max-width: 820px) {
  .attn.att4 { gap: 8px; } .attn.att4 .att { padding: 10px 6px; text-align: center; min-height: 0; border-radius: 14px; }
  body.th-glass .attn.att4 .att b, .attn.att4 .att b { font-size: 22px; display: block; }
  .attn.att4 .att span { font-size: 11.5px; line-height: 1.25; white-space: normal; overflow: visible; text-overflow: clip; }
  .attn.att4 .att > span { display: block; }
}
.card.qa { padding: 14px; }
.card.qa .tile.hero { width: 100%; box-sizing: border-box; margin: 0 0 12px; }
.qa-btns { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.qa-btns.n3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.qa-btns .btn { position: relative; overflow: visible; display: inline-flex; align-items: center; justify-content: center; gap: 8px; width: 100%; margin: 0; white-space: nowrap; min-height: 44px; }
.qa-btns .btn svg { width: 17px; height: 17px; flex: 0 0 17px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.qa-btns .btn .badge { position: absolute; top: -9px; right: -4px; margin: 0; font-size: 11px; padding: 2px 7px; box-shadow: 0 0 0 2px var(--card, #fff); }
@media (max-width: 760px) { .qa-btns, .qa-btns.n3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .qa-btns .btn { padding-left: 8px; padding-right: 8px; } }
.qa-sub { margin: 12px 2px 0; font-size: 14px; }
.qa-sub .badge { position: static; margin-left: 4px; }

/* ---- Request files */
.rq-ch .chip { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; font-size: 14px; font-weight: 600; cursor: pointer; min-height: 40px; }
.rq-ch .chip svg, .rq-lock svg { width: 16px; height: 16px; flex: 0 0 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.rq-lock { display: flex; gap: 8px; align-items: flex-start; }
.rq-lock svg { margin-top: 2px; }
.rq-rows { padding-top: 4px; padding-bottom: 4px; }
.rq-row { padding: 12px 0; border-top: 1px solid var(--line); }
.rq-row:first-child { border-top: 0; }
.rq-row .rq-nm { font-size: 15px; }
.rq-row .m { font-size: 13px; color: var(--muted); margin-top: 2px; overflow-wrap: anywhere; }
.rq-acts { display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: center; margin-top: 8px; }
.rq-acts .btn.link.sm { padding-left: 2px; padding-right: 2px; }
.rq-row .hint { margin-top: 6px; overflow-wrap: anywhere; }

/* Closed cases on a phone: the search on its own line, then the five menus two by two (the year across the top),
   like the open list (a later rule put all five in one row, squeezing them to "Al…") */
@media (max-width: 900px) {
  .filters.closedf { grid-template-columns: 1fr 1fr; }
  .filters.closedf > input { grid-column: 1 / -1; }
  .filters.closedf > #cs-at { grid-column: 1 / -1; }
}
/* phones: menus whose choices are long get a line of their own, so nothing is cut off */
@media (max-width: 640px) { .fsel:has(#fc-who) { flex-basis: 100%; } }
@media (max-width: 900px) { .filters.fef > #fe-src { grid-column: 1 / -1; } }
/* the case team, under the status and leads */
.chd-team { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; margin-top: 10px; }
.chd-team .fl { font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); margin-right: 4px; }
.chd-team .ochip em { font-style: normal; font-size: 11px; }
.chd-team label.f { margin: 0; }
.chd-team label.f select { width: auto; margin-top: 0; min-height: 34px; padding: 6px 30px 6px 11px; font-size: 13.5px; }
@media (max-width: 640px) { .chd-team label.f { flex: 1 1 200px; } .chd-team label.f select { width: 100%; font-size: 16px; } }
.chd-team details.help { margin: 0; }
.invl label.chk.onteam { opacity: .55; }
.invl label.chk.onteam input { accent-color: #9aa0b4; }
/* a small yes/no question */
.cfm { position: fixed; inset: 0; z-index: 80; background: rgba(10,20,48,.45); display: flex; align-items: center; justify-content: center; padding: 16px; }
.cfm-in { width: 100%; max-width: 440px; background: #fff; border-radius: 14px; padding: 20px 20px 16px; box-shadow: 0 20px 60px rgba(10,20,48,.35); }
.cfm-in b { display: block; font-size: 17px; margin-bottom: 6px; }
.cfm-in p { margin: 0 0 14px; color: var(--muted); font-size: 14.5px; line-height: 1.45; }
.cfm-in .btns { margin: 0; }
/* the four calendars to add to a phone or Outlook */
.calpick { margin: 12px 0; }
.calpick > b { display: block; font-size: 16px; }
.calpk { display: grid; gap: 8px; margin: 10px 0 4px; }
.calpk-r { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 12px; }
.calpk-r b { display: block; } .calpk-r .m { font-size: 13px; }
.calpk-r .btn { flex: none; }
.calpk-r .btn.on { border-color: var(--violet); color: var(--violet); }
@media (max-width: 640px) { .calpk-r { flex-direction: column; align-items: stretch; } .calpk-r .btn { width: 100%; justify-content: center; } }
/* "Notify me of all events" on the Calendar page */
label.chk.fcnot { display: flex; align-items: flex-start; gap: 9px; margin: 2px 0 12px; font-size: 14px; }
label.chk.fcnot input { margin-top: 3px; flex: none; align-self: flex-start; }
.fcnot small { display: block; font-size: 12.5px; margin-top: 1px; max-width: 640px; }

/* the × on a chip (case team, outside invitees): a big enough target for a finger */
@media (pointer: coarse), (max-width: 760px) { .ochip button { min-width: 32px; min-height: 32px; display: inline-flex; align-items: center; justify-content: center; margin: -6px -4px -6px 0; } }
/* Reports: the costs card's filters */
.rpf { flex-wrap: wrap; align-items: center; gap: 8px; }
.rpchk { display: flex; align-items: center; gap: 7px; font-size: 14px; min-height: 36px; cursor: pointer; white-space: nowrap; } .rpchk input { width: 17px; height: 17px; accent-color: #8a3ffc; }
.costt td.kopen { color: #87520a; font-weight: 600; } .costt td .m { font-weight: 500; font-size: 12px; }
@media (max-width: 640px) { #rp-costs > .row { flex-direction: column; align-items: stretch; gap: 8px; } #rp-costs .rpf { width: 100%; } #rp-costs .rpf .pselect { flex: 1 1 40%; min-width: 0; } #rp-costs .rpchk { flex-basis: 100%; } }
/* contacts: suggestions as you type (under the box), and the Contacts page */
.ctsug { position: fixed; z-index: 1200; background: #fff; border: 1px solid #d9dcef; border-radius: 12px; box-shadow: 0 12px 34px rgba(20, 20, 50, .22); padding: 4px; max-height: 320px; overflow-y: auto; }
.ctopt { display: flex; flex-direction: column; gap: 1px; padding: 8px 10px; border-radius: 8px; cursor: pointer; min-height: 40px; justify-content: center; }
.ctopt:hover, .ctopt[aria-selected="true"] { background: rgba(124, 92, 255, .10); }
.ctopt .ctn { font-size: 14.5px; color: var(--ink); } .ctopt .ctn b { font-weight: 700; } .ctopt .cts { font-size: 12px; color: var(--muted); } .ctopt .cta { font-size: 12.5px; color: #3d3f5c; } .ctopt .cta.m { color: var(--muted); font-style: italic; }
.ctbar { display: flex; gap: 8px; margin: 0 0 12px; } .ctbar input { flex: 1; min-width: 0; border: 1px solid #c9cedb; border-radius: 10px; padding: 9px 12px; font-size: 15px; background: #fff; }
.ctdup summary { cursor: pointer; display: flex; align-items: center; gap: 8px; } .ctdup .cnt { background: #fcefdc; color: #87520a; border-radius: 999px; padding: 1px 8px; font-size: 12.5px; font-weight: 700; }
.ctdrow { padding: 12px 0; border-top: 1px solid var(--line); } .ctdrow .btns { margin: 8px 0 0; }
.ctdk { font-size: 12px; font-weight: 600; color: var(--muted); text-transform: uppercase; letter-spacing: .03em; margin-bottom: 6px; }
.ctdpair { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ctdc { border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; background: #fbfcfe; min-width: 0; } .ctdc > b { display: block; }
.ctdd { font-size: 13.5px; margin-top: 4px; overflow-wrap: anywhere; } .ctdn { font-size: 12px; color: var(--muted); margin-top: 6px; }
.mgopt .ctdc { flex: 1; background: transparent; border: 0; padding: 0; }
.ctl { padding: 0; overflow: hidden; }
.cthead, .ctmain { display: grid; grid-template-columns: minmax(0, 1.3fr) 160px minmax(0, 1.6fr) 70px; gap: 12px; padding: 10px 16px; }
.cthead { background: #f6f8fb; font-size: 11.5px; font-weight: 600; color: var(--muted); text-transform: uppercase; letter-spacing: .03em; } .cthead .r { text-align: right; }
.ctrow { border-top: 1px solid var(--line); } .ctrow.on { background: #fbfaff; }
.ctmain { box-sizing: border-box; display: grid; grid-template-columns: minmax(0, 1.3fr) 160px minmax(0, 1.6fr) 70px; gap: 12px; padding: 11px 16px; width: 100%; cursor: pointer; }
.ctmain:hover { background: #f8f9fc; }
.ctmain .ctn, .ctmain .ctc { all: unset; box-sizing: border-box; cursor: pointer; min-width: 0; } .ctmain .ctn:focus-visible, .ctmain .ctc:focus-visible { outline: 2px solid #8a3ffc; outline-offset: 2px; border-radius: 4px; }
.ctmain .ctn b { display: block; } .ctmain .ctd a { color: #5b2bd6; text-decoration: none; font-weight: 500; } .ctmain .ctd a:hover { text-decoration: underline; }
.ctlet { padding: 6px 16px; background: #f3f1fd; color: #5b2bd6; font-weight: 700; font-size: 13px; border-top: 1px solid var(--line); scroll-margin-top: 70px; }
.ctaz { display: none; } .ctmain .ctcl { display: none; }
.ctmain .ctn small { display: block; color: var(--muted); font-size: 12px; } .ctmain .ctk { color: var(--muted); font-size: 13.5px; } .ctmain .ctd { font-size: 13.5px; overflow-wrap: anywhere; }
.ctmain .ctc { text-align: right; font-weight: 700; font-variant-numeric: tabular-nums; }
.ctcases { list-style: none; margin: 0; padding: 0 16px 12px; display: flex; flex-wrap: wrap; gap: 6px 16px; } .ctcases li { display: flex; align-items: center; gap: 6px; }
.mgopt { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; margin: 0 0 8px; cursor: pointer; } .mgopt small { display: block; color: var(--muted); font-size: 12px; } .mgopt input { width: 18px; height: 18px; accent-color: #8a3ffc; }
@media (max-width: 760px) {
  .cthead { display: none; }
  .ctmain { grid-template-columns: 1fr auto; row-gap: 3px; }
  .ctmain .ctn { grid-column: 1; } .ctmain .ctc { grid-column: 2; grid-row: 1; } .ctmain .ctcl { display: inline; font-weight: 500; color: var(--muted); font-size: 12px; }
  .ctmain .ctk { grid-column: 1 / -1; } .ctmain .ctd { grid-column: 1 / -1; }
  .ctmain .ctd a { display: inline-block; padding: 6px 0; font-size: 15px; }   /* big enough to tap */
  .ctl { margin-right: 22px; }
  .ctaz { display: flex; flex-direction: column; align-items: center; position: fixed; right: 2px; top: 50%; transform: translateY(-50%); z-index: 30; padding: 4px 0; border-radius: 10px; touch-action: none; user-select: none; -webkit-user-select: none; }
  .ctaz.on { background: rgba(124, 92, 255, .10); }
  .ctaz button { all: unset; font-size: 11px; font-weight: 700; line-height: 1; padding: 2px 5px; color: #5b2bd6; cursor: pointer; }
  .ctaz button.off { color: #b9b4dd; }
  .ctdpair { grid-template-columns: 1fr; } .ctdrow .btns { flex-direction: column; } .ctdrow .btn { width: 100%; min-height: 44px; justify-content: center; }
}

/* the demo's closing statement page 1, as it prints: letter size, the net proceeds at the foot of the page */
.lprev.page .cs1 { min-height: 864px; display: flex; flex-direction: column; }
.lprev.page .cs1f { margin-top: auto; padding-top: 18px; }
.lprev.page .cs1f .cl.netl { margin-top: 0; border-top: 1px solid #111; padding-top: 4px; }
.lprev .cs1n { text-align: center; margin: 14px 0 0; font-size: 13px; }
.lprev .cspb, .lprev .cs2 { border-top: 2px dashed #c9cedb; margin: 40px -96px 0; padding: 14px 96px 0; text-align: center; color: #666; font-size: 14px; }
.lprev .cspb { color: #888; font-size: 12px; text-transform: uppercase; letter-spacing: .08em; margin-bottom: 14px; }

.ledbar .lederr { display: inline !important; color: #b42318 !important; font-size: 13.5px !important; }

/* Home on a computer: its sections on the left, the person's own work on the right (a phone shows only the left) */
.hcols { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 44px; row-gap: 22px; align-items: start; }   /* (room between the columns, so it doesn't look busy) */
.hcols .hleft .qa-btns { grid-template-columns: 1fr 1fr; }
.hright h2 { margin-top: 26px; }   /* the same as the left column's headings, so Quick actions and Needs attention line up */
.hright .hrcard { margin-top: 12px; }
.hrcard { background: rgba(255,255,255,.9); border: 1px solid #e6e3f6; border-radius: 18px; padding: 4px 16px 2px; }
.hrgrp { font: 700 11px var(--f-body, Inter), sans-serif; letter-spacing: .08em; text-transform: uppercase; color: #55577a; padding: 10px 0 2px; display: flex; gap: 8px; align-items: center; }
.hrgrp .n { font-size: 11px; border-radius: 999px; padding: 1px 7px; background: #ecebfb; color: #4b3fd0; letter-spacing: 0; }
.hrgrp.late { color: #a11d33; } .hrgrp.late .n { background: #fde2e4; color: #a11d33; }
.hrrow { display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 9px 0; border-top: 1px solid #f0eef8; cursor: pointer; border-radius: 8px; }
.hrcard > .hrrow:first-child, .hrgrp + .hrrow { border-top: 0; }
.hrrow:hover .t b { color: #4b3fd0; } .hrrow:focus-visible { outline: 2px solid #8a3ffc; outline-offset: 2px; }
.hrrow .t { min-width: 0; } .hrrow .t b { display: block; font-size: 14.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hrrow .t small { display: block; color: #55577a; font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hrrow .d { font-size: 12.5px; font-weight: 600; color: #4b4970; white-space: nowrap; } .hrrow .d.late { color: #a11d33; } .hrrow .d.today { color: #4b3fd0; }
.hrw svg { width: 17px; height: 17px; fill: none; stroke: #b4590a; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; display: block; }
.hrc svg { width: 16px; height: 16px; fill: none; stroke: #6b6890; stroke-width: 1.8; display: block; }
.hrtick { width: 18px; height: 18px; border: 2px solid #b9b4dd; border-radius: 6px; background: #fff; padding: 0; cursor: pointer; }
.hrtick:hover { border-color: #8a3ffc; } .hrtick.on { background: #8a3ffc; border-color: #8a3ffc; } .hrtick:focus-visible { outline: 2px solid #8a3ffc; outline-offset: 2px; }
.hrrow.hrdl { grid-template-columns: 62px minmax(0, 1fr); } .hrrow.hrtd { grid-template-columns: 62px minmax(0, 1fr) 22px; } .hrrow.hrdl .d { text-align: left; white-space: normal; line-height: 1.25; }   /* (a date in another year wraps under the day) */
.hright:empty { display: none; } .hcols.hone { grid-template-columns: minmax(0, 1fr); }
.hrmore { display: block; text-align: right; font-size: 13.5px; font-weight: 600; color: #4b3fd0; padding: 8px 0 10px; border-top: 1px solid #f0eef8; cursor: pointer; }
.hrcard > .hrmore:first-child { border-top: 0; }
/* a phone or narrow screen: one column; the person's own work sits under Calendar, above Partners */
@media (max-width: 1000px) { .hcols { display: block; } .hright:empty { display: none; } .hcols .hleft .qa-btns { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 760px) { .hcols .hleft .qa-btns { grid-template-columns: 1fr 1fr; } }