/* Berlin Patten Ebling — black slate, brushed silver, white: the same tokens as the
   Assignment Desk and the staff directory. --slate and --silver dress the sidebar and
   the sign-in backdrop. --accent is the firm's black, so text on it is --accent-ink.
   Green, amber and red are status colours; they carry meaning and are not brand. */
:root {
  color-scheme: light;
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", sans-serif;
  font-synthesis: none;
  font-size: 15px;
  --canvas: #f3f3f4;
  --surface: rgba(255, 255, 255, .86);
  --surface-solid: #fff;
  --ink: #17171a;
  --muted: #5f636a;
  --line: #dfe0e3;
  --slate: #0f0f11;
  --silver: #c4c6ca;
  --trim: #7d8087;
  --accent: #1b1b1e;
  --accent-ink: #fff;
  --chip: #ececef;
  --teal: var(--accent);
  --nav: var(--slate);
  --green: #27704f;
  --red: #a2463c;
  --slate-fill:
    radial-gradient(120% 90% at 0% 0%, rgba(255,255,255,.10), transparent 55%),
    radial-gradient(90% 70% at 100% 100%, rgba(255,255,255,.05), transparent 60%),
    linear-gradient(180deg, #1d1d20, #0c0c0e);
  --silver-rule: #5f6165, #f2f2f2 50%, #5f6165;
  --serif: Georgia, "Times New Roman", "Palatino Linotype", serif;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, .05), 0 6px 20px rgba(0, 0, 0, .05);
  --shadow-md: 0 18px 55px rgba(0, 0, 0, .14), 0 2px 8px rgba(0, 0, 0, .06);
  --radius: 18px;
}
* { box-sizing: border-box; }
html { min-height: 100%; background: var(--canvas); }
body { margin: 0; min-width: 320px; color: var(--ink); background: var(--canvas); line-height: 1.5; }
body, button, input, select, textarea { font: inherit; }
button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; opacity: .45; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible { outline: 3px solid rgba(132, 134, 138, .42); outline-offset: 3px; }
[hidden] { display: none !important; }
.sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.ambient { position: fixed; border-radius: 50%; filter: blur(2px); pointer-events: none; opacity: .28; }
.ambient-one { width: 480px; height: 480px; top: -270px; right: -130px; background: radial-gradient(circle, #dbdde1, transparent 69%); }
.ambient-two { width: 420px; height: 420px; left: 10%; bottom: -320px; background: radial-gradient(circle, #e0e2e6, transparent 70%); }

/* Application shell */
.sidebar { position: fixed; z-index: 20; inset: 0 auto 0 0; width: 248px; display: flex; flex-direction: column; padding: 30px 18px 22px; color: #dfe1e5; background: radial-gradient(circle at 14% 3%, rgba(114, 116, 120, .3), transparent 26%), linear-gradient(180deg, #26282c 0%, #1e2024 100%); border-right: 1px solid rgba(255,255,255,.04); }
/* The firm's own emblem and wordmark, as supplied; never redrawn. */
.brand { display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 0 4px 20px; border-bottom: 1px solid rgba(255,255,255,.13); color: inherit; text-decoration: none; }
.brand-emblem { display: block; width: 66px; height: 66px; }
.brand-wordmark { display: block; width: 100%; max-width: 204px; height: auto; }
.brand .app-name { color: var(--silver); font-size: 9.5px; letter-spacing: .26em; text-transform: uppercase; white-space: nowrap; }
.nav-label { margin: 24px 12px 10px; color: #8f9299; font-size: 9px; font-weight: 700; letter-spacing: 1.6px; }
.sidebar nav { display: flex; flex-direction: column; gap: 5px; }
.nav { position: relative; display: flex; align-items: center; gap: 12px; width: 100%; padding: 12px 13px; border: 0; border-radius: 11px; color: #b8babe; background: transparent; text-align: left; font-size: 13px; font-weight: 560; transition: color .16s, background .16s, transform .16s; }
.nav:hover { color: #fff; background: rgba(255,255,255,.055); }
.nav.active { color: #fff; background: linear-gradient(135deg, rgba(124, 126, 130, .27), rgba(255,255,255,.07)); box-shadow: inset 0 0 0 1px rgba(188, 190, 194,.12), 0 7px 18px rgba(0,0,0,.08); }
.nav.active::before { content: ""; position: absolute; left: 0; width: 3px; height: 22px; border-radius: 3px; background: #c0c2c6; }
.nav-icon { display: grid; place-items: center; width: 25px; height: 25px; color: #a7a9ad; font-size: 20px; font-weight: 400; }
.nav.active .nav-icon { color: #d2d4d8; }
.command-hint { display: flex; align-items: center; justify-content: space-between; width: calc(100% - 8px); margin: 22px 4px 0; padding: 10px 11px; border: 1px solid rgba(255,255,255,.08); border-radius: 10px; color: #a1a3a7; background: rgba(255,255,255,.03); font-size: 11px; }
.command-hint:hover { color: #e6e8ec; border-color: rgba(255,255,255,.14); background: rgba(255,255,255,.06); }
kbd { display: inline-grid; min-width: 22px; height: 21px; place-items: center; padding: 0 5px; border: 1px solid rgba(85, 87, 91,.16); border-radius: 5px; color: #74767a; background: rgba(255,255,255,.75); box-shadow: 0 1px 1px rgba(0,0,0,.04); font: 10px/1 ui-sans-serif, sans-serif; }
.command-hint kbd { border-color: rgba(255,255,255,.12); color: #a2a4a8; background: rgba(255,255,255,.06); }
.sidebar-spacer { flex: 1; min-height: 36px; }
.sidebar-note { margin: 0 11px 24px; color: #c4c6ca; font-size: 10px; }
.sidebar-note > span { display: flex; align-items: center; gap: 8px; color: #dddfe3; font-weight: 600; }
.sidebar-note p { max-width: 175px; margin: 10px 0 0; color: #8d8f93; line-height: 1.75; }
.status-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: #8fd0ae; box-shadow: 0 0 0 4px rgba(143,208,174,.08); }
.profile { display: flex; align-items: center; gap: 11px; padding: 17px 9px 2px; border-top: 1px solid rgba(255,255,255,.08); color: #e8eaee; font-size: 11px; }
.profile strong { display: block; max-width: 155px; overflow: hidden; text-overflow: ellipsis; font-weight: 600; white-space: nowrap; }
.profile small { display: block; margin-top: 3px; color: #8c8e92; font-size: 9px; }
.avatar { display: grid; flex: 0 0 auto; width: 34px; height: 34px; place-items: center; border: 1px solid rgba(255,255,255,.35); border-radius: 50%; color: #17171a; background: linear-gradient(160deg, #f4f4f5, #8e9095); font-size: 10px; font-weight: 700; }
main { min-height: 100vh; margin-left: 248px; }
.topbar { position: sticky; z-index: 12; top: 0; display: grid; grid-template-columns: 1fr minmax(250px, 360px) 1fr; align-items: center; height: 70px; padding: 0 38px; border-bottom: 1px solid var(--line); background: rgba(250,251,252,.76); backdrop-filter: saturate(160%) blur(24px); -webkit-backdrop-filter: saturate(160%) blur(24px); }
.topbar-context { display: flex; align-items: center; color: var(--muted); font-size: 12px; }
.topbar-context strong { color: #484a4e; font-weight: 620; }
.breadcrumb-muted { color: #9b9da1; }
.slash { margin: 0 11px; color: #c2c4c8; }
.top-search { display: flex; align-items: center; gap: 9px; justify-self: center; width: 100%; padding: 9px 10px; border: 1px solid rgba(59, 61, 65,.1); border-radius: 10px; color: #909296; background: rgba(255,255,255,.72); box-shadow: 0 1px 2px rgba(0,0,0,.02); font-size: 11px; text-align: left; }
.top-search:hover { border-color: rgba(59, 61, 65,.18); background: #fff; }
.top-search > span:nth-child(2) { flex: 1; }
.top-search > span:first-child { font-size: 18px; color: #75777b; }
.pill { display: inline-flex; align-items: center; gap: 7px; justify-self: end; padding: 6px 9px; border: 1px solid rgba(151,118,54,.22); border-radius: 999px; color: #7a6339; background: rgba(255,252,241,.78); font-size: 8px; font-weight: 750; letter-spacing: 1.1px; }
.pill i { width: 5px; height: 5px; border-radius: 50%; background: #c29a51; }
.menu-button { display: none; width: 35px; height: 35px; margin-right: 9px; border: 0; border-radius: 9px; color: var(--ink); background: transparent; }
.demo-banner { display: flex; align-items: center; justify-content: space-between; min-height: 42px; padding: 8px 38px; border-bottom: 1px solid rgba(172,142,76,.16); color: #725e39; background: linear-gradient(90deg, #faf5e9, #f7f2e7 70%, #f8f4eb); font-size: 11px; }
.demo-banner strong { margin-right: 12px; color: #614d2d; }
.demo-banner button { border: 0; color: #735a2e; background: transparent; font-size: 10px; font-weight: 650; }
.demo-banner button span { margin-left: 8px; }
.content { position: relative; z-index: 1; width: min(100%, 1480px); margin: 0 auto; padding: 48px clamp(28px, 4vw, 64px) 70px; }

/* Type and page furniture */
.eyebrow { margin-bottom: 14px; color: var(--muted); font-size: 9px; font-weight: 760; letter-spacing: 1.8px; }
h1 { margin: 0; font-size: clamp(35px, 4.2vw, 58px); font-weight: 650; line-height: .99; letter-spacing: -2.6px; }
h2, h3 { letter-spacing: -.25px; }
p { line-height: 1.65; }
.intro { max-width: 660px; margin: 18px 0 0; color: var(--muted); font-size: 14px; line-height: 1.75; }
.hero { display: grid; grid-template-columns: minmax(0, 1fr) 180px; align-items: center; gap: 32px; min-height: 190px; }
.hero-orb { position: relative; display: grid; justify-self: end; width: 128px; height: 128px; place-items: center; border: 1px solid rgba(92, 94, 98,.12); border-radius: 38px; color: #636569; background: linear-gradient(145deg, rgba(255,255,255,.9), rgba(236, 236, 237,.65)); box-shadow: 0 25px 50px rgba(74, 76, 80,.09), inset 0 1px 0 #fff; transform: rotate(3deg); }
.hero-orb::before { content: ""; position: absolute; inset: 13px; border: 1px solid rgba(92, 94, 98,.1); border-radius: 29px; }
.hero-orb span { font-size: 55px; font-weight: 200; transform: rotate(-3deg) translateY(-3px); }
.hero-orb i { position: absolute; right: 19px; bottom: 18px; width: 12px; height: 12px; border: 3px solid #f6f6f7; border-radius: 50%; background: #94969a; box-shadow: 0 0 0 2px rgba(117, 119, 123,.12); }
.page-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 25px; margin-bottom: 34px; }
.page-heading h1 { font-size: clamp(34px, 4vw, 48px); line-height: 1.05; }
.page-symbol { display: grid; width: 62px; height: 62px; place-items: center; border: 1px solid var(--line); border-radius: 18px; color: #66686c; background: rgba(255,255,255,.76); box-shadow: var(--shadow-sm); font-size: 28px; }

/* Metrics and search */
.stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 30px 0; }
.stat { position: relative; min-height: 102px; padding: 20px 21px; overflow: hidden; border: 1px solid var(--line); border-radius: 15px; background: var(--surface); box-shadow: var(--shadow-sm); backdrop-filter: blur(12px); }
.stat::after { content: ""; position: absolute; width: 64px; height: 64px; right: -30px; bottom: -30px; border-radius: 50%; background: rgba(124, 126, 130,.07); }
.stat strong { display: block; color: #303236; font-size: 28px; font-weight: 650; font-variant-numeric: tabular-nums; letter-spacing: -1px; }
.stat small { display: flex; align-items: center; gap: 6px; margin-top: 8px; color: var(--muted); font-size: 10px; }
.stat small::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: #9b9da1; }
.search-card, .admin-card, .coverage-card { border: 1px solid var(--line); background: var(--surface); box-shadow: var(--shadow-sm); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }
.search-card { padding: 26px; border-radius: var(--radius); }
.search-card-heading { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 18px; }
.search-card-heading h2 { margin: 4px 0 0; font-size: 18px; }
.search-kicker { color: #888a8e; font-size: 8px; font-weight: 750; letter-spacing: 1.4px; }
.privacy-note { display: inline-flex; align-items: center; gap: 7px; color: #7c7e82; font-size: 9px; }
.privacy-note i { width: 6px; height: 6px; border-radius: 50%; background: #65a785; box-shadow: 0 0 0 4px rgba(101,167,133,.09); }
.search-input { display: flex; align-items: center; gap: 8px; min-height: 58px; padding: 5px; border: 1px solid #c6c8cc; border-radius: 13px; background: #fff; box-shadow: 0 1px 0 rgba(255,255,255,.7), inset 0 1px 2px rgba(49, 51, 55,.025); transition: border .16s, box-shadow .16s; }
.search-input:focus-within { border-color: var(--accent); box-shadow: 0 0 0 4px rgba(27,27,30,.1); }
.search-input input { flex: 1; min-width: 0; padding: 12px 5px; border: 0; outline: 0; color: var(--ink); background: transparent; font-size: 15px; }
.search-input input::placeholder { color: #a0a2a6; }
.search-glyph { padding-left: 11px; color: #797b7f; font-size: 25px; }
.key-hint { display: grid; width: 23px; height: 23px; place-items: center; border: 1px solid #e2e4e8; border-radius: 5px; color: #9d9fa3; background: #f7f8f9; font-size: 10px; }
.primary, .secondary { min-height: 40px; padding: 10px 15px; border-radius: 9px; font-size: 11px; font-weight: 650; transition: transform .16s, border .16s, background .16s, box-shadow .16s; }
.primary { border: 1px solid var(--accent); color: var(--accent-ink); background: var(--accent); box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 1px 2px rgba(0,0,0,.18); }
.primary:hover:not(:disabled) { transform: translateY(-1px); background: #303035; box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 3px 10px rgba(0,0,0,.2); }
.primary span { margin-left: 12px; }
.secondary { border: 1px solid #cfd0d4; color: var(--ink); background: #fff; }
.secondary:hover:not(:disabled) { transform: translateY(-1px); border-color: var(--trim); background: #fff; box-shadow: 0 5px 14px rgba(0,0,0,.07); }
.search-controls { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; padding-top: 18px; }
.segmented { display: inline-flex; padding: 3px; border: 1px solid rgba(66, 68, 72,.1); border-radius: 10px; background: #f0f3f4; }
.segmented label { cursor: pointer; }
.segmented input { position: absolute; opacity: 0; pointer-events: none; }
.segmented span { display: block; padding: 8px 11px; border-radius: 7px; color: #7c7e82; font-size: 10px; transition: .15s; }
.segmented input:checked + span { color: #45474b; background: #fff; box-shadow: 0 1px 5px rgba(47, 49, 53,.09); font-weight: 650; }
.search-filters { display: flex; gap: 10px; }
.search-filters label { color: #8c8e92; font-size: 9px; font-weight: 650; }
.search-filters label > span { display: block; margin: 0 0 5px 3px; }
select, .field input, .field textarea, .field select, .workspace-input { width: 100%; padding: 10px 11px; border: 1px solid #d3d5d9; border-radius: 8px; color: var(--ink); background: #fff; }
.search-filters select { min-width: 125px; padding: 8px 30px 8px 9px; font-size: 10px; }
.try { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; margin-top: 19px; padding-top: 16px; border-top: 1px solid #edf0f1; }
.try > span { margin-right: 3px; color: #9c9ea2; font-size: 9px; }
.try button { padding: 5px 9px; border: 1px solid transparent; border-radius: 7px; color: #77797d; background: #f0f4f2; font-size: 9px; }
.try button:hover { border-color: #dfe1e5; background: #efeff0; }
.search-tools { display: flex; flex-wrap: wrap; gap: 9px; margin: 16px 0 11px; }
.search-tools .secondary { min-height: 36px; padding: 8px 12px; font-size: 10px; }
.search-tools .ai-button { color: #5a5c60; border-color: #d5d7db; background: #f8f5fb; }
.source-note { display: flex; align-items: flex-start; gap: 10px; padding: 12px 14px; border: 1px solid rgba(92, 94, 98,.08); border-radius: 10px; color: #717377; background: rgba(240, 240, 241,.74); font-size: 10px; }
.source-note strong { color: #57595d; }
.source-note > span:first-child { color: #6e7074; font-size: 13px; }

/* Results, tables and empty states */
.empty { padding: 42px 20px; color: var(--muted); text-align: center; }
.empty-welcome { margin-top: 18px; padding: 50px 20px; border: 1px dashed rgba(72, 74, 78,.16); border-radius: 16px; background: rgba(255,255,255,.37); }
.empty-icon { display: grid; width: 48px; height: 48px; margin: 0 auto; place-items: center; border: 1px solid rgba(88, 90, 94,.12); border-radius: 15px; color: #77797d; background: linear-gradient(145deg,#fff,#f1f1f2); font-size: 30px; box-shadow: 0 9px 23px rgba(73, 75, 79,.07); }
.empty h2 { margin: 17px 0 5px; color: #4f5155; font-size: 15px; font-weight: 620; }
.empty p { margin: 0; color: #8d8f93; font-size: 11px; }
.empty-steps { display: flex; align-items: center; justify-content: center; gap: 10px; margin-top: 24px; color: #8b8d91; font-size: 9px; }
.empty-steps span { display: flex; align-items: center; gap: 6px; }
.empty-steps b { display: grid; width: 20px; height: 20px; place-items: center; border: 1px solid #dee0e4; border-radius: 50%; color: #787a7e; background: #fff; }
.empty-steps i { width: 24px; height: 1px; background: #e0e2e6; }
.results-heading { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin: 30px 0 12px; }
.results-heading h2, .section-heading { margin: 0; color: #383a3e; font-size: 16px; }
.results-heading span { color: #8b8d91; font-size: 8px; font-weight: 700; letter-spacing: .8px; }
.section-heading { margin: 25px 0 12px; }
.result { position: relative; display: flex; align-items: flex-start; justify-content: space-between; gap: 22px; margin-bottom: 9px; padding: 19px 20px 19px 23px; overflow: hidden; border: 1px solid var(--line); border-radius: 13px; background: rgba(255,255,255,.82); box-shadow: 0 2px 8px rgba(41, 43, 47,.025); transition: transform .16s, border .16s, box-shadow .16s; }
.result::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 3px; background: #94969a; }
.result:hover { transform: translateY(-1px); border-color: rgba(72, 74, 78,.2); box-shadow: 0 9px 24px rgba(41, 43, 47,.07); }
.result > div { min-width: 0; flex: 1; }
.result h3 { margin: 0 0 8px; color: #323438; font-size: 14px; }
.result p { margin: 5px 0; color: #787a7e; overflow-wrap: anywhere; font-size: 11px; }
.tag { display: inline-flex; align-items: center; margin: 0 5px 3px 0; padding: 4px 7px; border-radius: 6px; color: #5e6064; background: #f0f0f1; font-size: 8px; font-weight: 650; }
.tag.warn { color: #866323; background: #faf0da; }
.history-result::before { background: #a6a8ac; }
.live-result::before { background: #6d6f73; }
.new-client { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 28px; padding: 22px 3px; border-top: 1px solid var(--line); }
.new-client h3 { margin: 0 0 4px; font-size: 12px; }
.new-client p { margin: 0; color: var(--muted); font-size: 10px; }
.footnote { margin-top: 17px; color: #929498; font-size: 9px; }
.register-search { max-width: 850px; margin-bottom: 24px; }
.register-search > label { display: block; margin-bottom: 10px; font-size: 11px; font-weight: 650; }
.table-wrap { overflow: auto; border: 1px solid var(--line); border-radius: 13px; background: rgba(255,255,255,.82); box-shadow: var(--shadow-sm); }
table { width: 100%; border-collapse: collapse; font-size: 10px; }
th { color: #77797d; background: #f2f2f3; font-size: 8px; font-weight: 700; letter-spacing: .35px; text-align: left; text-transform: uppercase; }
td, th { padding: 14px 15px; border-bottom: 1px solid #e7e9ed; }
tbody tr:hover { background: rgba(241, 241, 242,.55); }
td small { display: block; margin-top: 4px; color: #8b8d91; }
td:first-child { white-space: nowrap; font-variant-numeric: tabular-nums; }
.error { margin: 13px 0; padding: 13px 14px; border: 1px solid rgba(162,70,60,.12); border-radius: 9px; color: var(--red); background: #fbecea; font-size: 11px; }
.skeleton { position: relative; overflow: hidden; color: transparent !important; background: #e9edef !important; }
.skeleton::after { content: ""; position: absolute; inset: 0; transform: translateX(-100%); background: linear-gradient(90deg,transparent,rgba(255,255,255,.65),transparent); animation: shimmer 1.15s infinite; }
@keyframes shimmer { to { transform: translateX(100%); } }

/* Workspace dashboard */
.coverage-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; margin: 28px 0 20px; }
.coverage-card { min-height: 190px; padding: 22px; border-radius: 15px; }
.coverage-card h3 { margin: 24px 0 3px; color: #5b5d61; font-size: 11px; }
.coverage-card > strong { color: #323438; font-size: 32px; font-weight: 650; font-variant-numeric: tabular-nums; letter-spacing: -1.2px; }
.coverage-card p { margin: 7px 0 0; color: var(--muted); font-size: 10px; }
.source-logo { display: grid; width: 35px; height: 35px; place-items: center; border: 1px solid rgba(76, 78, 82,.1); border-radius: 10px; color: #5c5e62; background: linear-gradient(145deg,#fefeff,#e9ebef); font-weight: 700; }
.recent-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(220px,1fr)); gap: 10px; }
.recent-card { padding: 17px; border: 1px solid var(--line); border-radius: 11px; color: var(--ink); background: rgba(255,255,255,.77); text-align: left; transition: .15s; }
.recent-card:hover { transform: translateY(-1px); border-color: #cfd1d5; box-shadow: var(--shadow-sm); }
.recent-card span { display: block; margin-top: 6px; color: var(--muted); font-size: 9px; }
.saved-title { margin-top: 18px; color: #65676b; font-size: 10px; font-weight: 650; }
.saved-title small { margin-left: 6px; color: #939599; font-weight: 400; }
.saved-list { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 8px; }
.saved-item { display: flex; overflow: hidden; border: 1px solid #dee0e4; border-radius: 8px; background: rgba(255,255,255,.8); }
.saved-item button { padding: 7px 10px; border: 0; color: #65676b; background: transparent; font-size: 9px; }
.saved-item button + button { border-left: 1px solid #e9ebef; color: #94969a; }

/* Settings and operations */
.admin-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,285px),1fr)); gap: 14px; }
.admin-card { margin: 0 0 17px; padding: 22px; border-radius: 15px; }
.admin-card h2 { margin: 0 0 10px; font-size: 17px; }
.admin-card h3 { font-size: 12px; }
.admin-card p { color: var(--muted); font-size: 10px; }
.admin-card pre, .raw-record { max-height: 280px; padding: 13px; overflow: auto; border-radius: 8px; white-space: pre-wrap; overflow-wrap: anywhere; color: #636569; background: #f0f3f4; font-size: 9px; }
.admin-card .actions { flex-wrap: wrap; justify-content: flex-start; }
.admin-card details { margin-top: 15px; padding-top: 3px; }
.admin-card summary { cursor: pointer; color: #55575b; font-size: 10px; font-weight: 650; }
.settings-layout { display: grid; grid-template-columns: 205px minmax(0,1fr); gap: 25px; margin-top: 23px; }
.settings-nav { position: sticky; top: 91px; align-self: start; display: flex; flex-direction: column; gap: 4px; padding: 8px; border: 1px solid var(--line); border-radius: 13px; background: rgba(255,255,255,.54); }
.settings-nav button { padding: 10px 11px; border: 0; border-radius: 8px; color: #717377; background: transparent; font-size: 10px; text-align: left; }
.settings-nav button:hover { background: rgba(233, 235, 239,.6); }
.settings-nav button[aria-selected=true] { color: var(--ink); background: var(--chip); font-weight: 700; box-shadow: inset 3px 0 0 var(--accent); }
.settings-panels { min-width: 0; }
.provider-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 13px; }
.provider-card { padding: 19px; border: 1px solid var(--line); border-radius: 12px; background: #f8fafb; }
.provider-card h3 { margin: 0; font-size: 15px; }
.test-result { min-height: 54px; margin-top: 13px; padding: 11px; border-radius: 8px; color: #74767a; background: #edf1f3; font-size: 9px; }
.test-pass { color: var(--green); background: #e7f3ec; }
.test-fail { color: var(--red); background: #faeae7; }
.metric-strip { display: flex; flex-wrap: wrap; gap: 25px; margin: 18px 0; padding: 16px 0; border-block: 1px solid #e8eaee; }
.metric-strip span { color: #7b7d81; font-size: 9px; }
.metric-strip strong { display: block; color: #383a3e; font-size: 15px; }
.toggle-row { display: flex; flex-wrap: wrap; gap: 18px; padding: 12px 0; }
.toggle-row label { font-size: 10px; }
.workflow { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 16px; }
.workflow span { flex: 1; min-width: 120px; padding: 11px; border-radius: 7px; color: #5a5c60; background: #f0f0f1; font-size: 9px; font-weight: 650; }
.activity-title { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.activity-title h2, .activity-title h3 { margin: 0; }
.job-card { margin: 10px 0 0; padding: 16px; overflow-wrap: anywhere; border: 1px solid var(--line); border-radius: 11px; background: #f8fafb; }
.job-failed { border-left: 3px solid #b96448; }
.job-step { min-height: 34px; }
.job-numbers { color: #707276; font-size: 9px; }
.job-numbers strong { color: #3e4044; font-size: 22px; font-variant-numeric: tabular-nums; }
.job-card small { color: var(--muted); font-size: 9px; }
progress { display: block; width: 100%; height: 7px; margin: 13px 0; accent-color: var(--teal); }
.field { display: block; margin: 15px 0; color: #4e5054; font-size: 10px; font-weight: 650; }
.field input, .field textarea, .field select { display: block; margin-top: 6px; font-weight: 400; }
.field textarea { min-height: 82px; resize: vertical; }
.field input[type=checkbox] { display: inline; width: auto; margin-right: 5px; }
.staff-row { display: flex; align-items: center; flex-wrap: wrap; gap: 14px; padding: 15px 0; border-top: 1px solid #e6e8ec; }
.staff-row > div { flex: 1; min-width: 200px; }
.staff-row small { display: block; margin-top: 4px; color: var(--muted); }
.connection-state, .data-label { color: #856c42; font-size: 9px; }
.text-button { padding: 6px 0; border: 0; color: #54565a; background: none; font-size: 10px; }
.save-hint { margin-left: 10px; color: #898b8f; font-size: 9px; }

/* Dialogs */
dialog { width: min(700px, calc(100% - 30px)); max-height: 90vh; padding: 28px; overflow: auto; border: 1px solid rgba(66, 68, 72,.14); border-radius: 20px; color: var(--ink); background: rgba(255,255,255,.94); box-shadow: var(--shadow-md); backdrop-filter: blur(26px); }
dialog::backdrop { background: rgba(23, 23, 24,.42); backdrop-filter: blur(7px); }
dialog h2 { margin: 5px 0 12px; font-size: 24px; letter-spacing: -.7px; }
dialog p { color: var(--muted); font-size: 11px; }
.dialog-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.close { display: grid; width: 31px; height: 31px; place-items: center; padding: 0; border: 0; border-radius: 50%; color: #7a7c80; background: #edf1f2; font-size: 18px; }
.actions { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 22px; }
.preview { padding: 12px 14px; border-radius: 9px; color: #6a6c70; background: #f1f1f2; font-size: 10px; }
.number-card { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 12px 0; padding: 18px; border: 1px solid #dadce0; border-radius: 11px; background: #f3f3f4; }
.number-card small { display: block; margin-bottom: 6px; color: #808286; font-size: 8px; }
.number-card strong { color: #414347; font-size: 23px; font-weight: 650; font-variant-numeric: tabular-nums; }
.history { max-height: 220px; padding: 9px 13px; overflow: auto; border-radius: 9px; background: #f0f4f5; }
.history p { margin: 7px 0; font-size: 10px; }
.contact-dialog { max-width: 900px; }
.contact-title { display: flex; align-items: center; gap: 15px; margin: 14px 0; }
.contact-title h2 { margin: 0 0 5px; }
.contact-avatar { display: grid; width: 58px; height: 58px; place-items: center; border-radius: 16px; color: #535559; background: #ececed; font-size: 24px; }
.contact-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin: 23px 0; }
.contact-facts > div { padding-bottom: 11px; overflow-wrap: anywhere; border-bottom: 1px solid #e9ebef; }
.contact-facts h3 { color: #8c8e92; font-size: 9px; letter-spacing: .6px; text-transform: uppercase; }
.contact-facts p { margin: 4px 0; }
.contact-files { max-height: 300px; margin-top: 12px; overflow: auto; }
.linked-file { padding: 13px 7px; border-bottom: 1px solid #e8eaee; }
.linked-file p { margin: 4px 0; }
#toast { position: fixed; z-index: 100; left: 50%; bottom: 24px; transform: translateX(-50%); padding: 11px 18px; border: 1px solid rgba(255,255,255,.09); border-radius: 999px; color: #fff; background: rgba(36, 38, 42,.93); box-shadow: 0 12px 35px rgba(0,0,0,.2); backdrop-filter: blur(15px); font-size: 10px; }

/* Consultation and client number workflows */
.number-workflows { display: grid; grid-template-columns: 1.15fr 1fr; gap: 22px; align-items: start; }
.number-workflow { padding: 28px; border: 1px solid var(--line); border-radius: 18px; background: #fff; box-shadow: var(--shadow-sm); }
.number-workflow h2 { margin: 20px 0 8px; font-size: 24px; }
.number-workflow p, #numbers-page > p { font-size: 13px; color: var(--muted); }
.number-workflow .field { font-size: 13px; }
.number-workflow input, .number-workflow textarea, .number-workflow select { font-size: 14px; }
.number-workflow .primary { font-size: 13px; }
.number-workflow .preview { font-size: 12px; }
.consultation-number { display: block; margin: 8px 0; color: #4c4e52; font-size: 29px; font-variant-numeric: tabular-nums; }
.workflow-note { margin-top: 28px; padding: 20px; border-radius: 12px; background: #f0f5f6; font-size: 14px; }
.mapping-list { margin-top: 20px; }
.mapping-item { margin: 10px 0; padding: 18px 22px; border: 1px solid var(--line); border-radius: 12px; background: #fff; font-size: 13px; }
.mapping-item summary { display: flex; justify-content: space-between; align-items: center; gap: 16px; cursor: pointer; }
.mapping-item summary small { display: block; margin-top: 4px; color: var(--muted); }
.mapping-item .tag { font-size: 11px; }
.mapping-item .field, .mapping-item .history p { font-size: 12px; }
.mapping-error { color: var(--red); margin-top: 10px; }
@media(max-width:900px) { .number-workflows { grid-template-columns: 1fr; } .number-workflow { padding: 22px; } }

/* Command palette */
.command-dialog { width: min(640px,calc(100% - 28px)); max-height: 75vh; margin-top: 12vh; padding: 0; overflow: hidden; border-radius: 18px; }
.command-box { background: rgba(255,255,255,.96); }
.command-input { display: flex; align-items: center; gap: 10px; padding: 13px 15px; border-bottom: 1px solid var(--line); }
.command-input > span { color: #696b6f; font-size: 25px; }
.command-input input { flex: 1; min-width: 0; padding: 9px 0; border: 0; outline: 0; color: var(--ink); background: transparent; font-size: 15px; }
.command-input input::placeholder { color: #a2a4a8; }
.command-section-label { padding: 13px 17px 7px; color: #a0a2a6; font-size: 8px; font-weight: 750; letter-spacing: 1.2px; }
.command-results { max-height: 340px; padding: 0 7px 8px; overflow: auto; }
.command-action { display: flex; align-items: center; gap: 12px; width: 100%; padding: 10px; border: 0; border-radius: 10px; color: #46484c; background: transparent; text-align: left; }
.command-action:hover, .command-action.selected { background: #f0f0f1; }
.command-action-icon { display: grid; width: 34px; height: 34px; place-items: center; border: 1px solid #e0e2e6; border-radius: 9px; color: #6a6c70; background: #fff; font-size: 16px; }
.command-action-text { flex: 1; }
.command-action strong { display: block; font-size: 11px; }
.command-action small { display: block; margin-top: 2px; color: #8d8f93; font-size: 9px; }
.command-action > kbd { opacity: .8; }
.command-footer { display: flex; align-items: center; gap: 16px; padding: 10px 15px; border-top: 1px solid var(--line); color: #929498; background: #f5f7f8; font-size: 8px; }
.command-footer span:last-child { margin-left: auto; }
.command-footer kbd { min-width: 18px; height: 17px; margin-right: 2px; font-size: 8px; }

/* Login */
/* Sign-in: the firm's lockup on black slate, as on the Assignment Desk. */
.login-wrap { min-height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 30px; margin: 0; padding: 32px 16px; background: radial-gradient(80% 60% at 18% 0%, rgba(255,255,255,.11), transparent 60%), radial-gradient(70% 60% at 86% 100%, rgba(255,255,255,.06), transparent 60%), linear-gradient(160deg, #202023, #09090b); background-color: var(--slate); }
.login-logo { display: block; width: min(460px, 88vw); height: auto; }
.login-wrap .search-card { width: min(470px, 100%); padding: 34px 32px 30px; border: 0; border-radius: 4px; background: linear-gradient(90deg, #77797e, #ececed 50%, #77797e) top / 100% 3px no-repeat, #fff; box-shadow: 0 24px 70px rgba(0,0,0,.5); backdrop-filter: none; -webkit-backdrop-filter: none; }
.login-wrap h1 { font-family: var(--serif); font-size: 25px; font-weight: 600; line-height: 1.2; letter-spacing: .03em; text-align: center; }
.login-wrap #login-intro { margin: 8px 0 22px; color: var(--muted); text-align: center; }
.login-wrap .primary { display: inline-flex; align-items: center; justify-content: center; width: 100%; text-decoration: none; }

@media (max-width: 1120px) {
  .sidebar { width: 218px; }
  main { margin-left: 218px; }
  .topbar { grid-template-columns: 1fr minmax(220px,320px) auto; padding: 0 25px; }
  .content { padding-inline: 28px; }
  .settings-layout { grid-template-columns: 170px minmax(0,1fr); gap: 16px; }
  .coverage-card { padding: 18px; }
}
@media (max-width: 800px) {
  .sidebar { width: 270px; transform: translateX(-105%); transition: transform .22s ease; box-shadow: 18px 0 55px rgba(20, 20, 21,.24); }
  body.sidebar-open { overflow: hidden; }
  body.sidebar-open .sidebar { transform: translateX(0); }
  .sidebar-backdrop { position: fixed; z-index: 19; inset: 0; width: 100%; border: 0; background: rgba(21, 21, 22,.38); backdrop-filter: blur(3px); }
  main { margin-left: 0; }
  .menu-button { display: grid; place-items: center; }
  .topbar { grid-template-columns: 1fr auto; height: 60px; padding: 0 16px; }
  .top-search { width: 36px; height: 36px; padding: 0; justify-content: center; border-radius: 9px; }
  .top-search > span:nth-child(2), .top-search kbd { display: none; }
  .pill { margin-left: 8px; }
  .demo-banner { padding: 9px 18px; }
  .demo-banner button { display: none; }
  .content { padding: 35px 18px 55px; }
  .hero { grid-template-columns: 1fr; min-height: auto; }
  .hero-orb { display: none; }
  h1 { font-size: 40px; letter-spacing: -1.9px; }
  .search-controls { align-items: stretch; flex-direction: column; }
  .segmented { align-self: flex-start; }
  .search-filters select { min-width: 0; }
  .settings-layout { display: block; }
  .settings-nav { position: static; flex-direction: row; margin-bottom: 15px; overflow-x: auto; }
  .settings-nav button { min-width: max-content; }
  .provider-grid, .coverage-grid { grid-template-columns: 1fr; }
  .coverage-card { min-height: 150px; }
  .coverage-card h3 { margin-top: 18px; }
}
@media (max-width: 560px) {
  .breadcrumb-muted, .slash { display: none; }
  .demo-banner span { display: block; margin-top: 2px; }
  .stats { grid-template-columns: 1fr; gap: 8px; }
  .stat { min-height: 82px; padding: 15px 18px; }
  .stat strong { font-size: 23px; }
  .search-card { padding: 18px; }
  .search-card-heading { align-items: flex-start; }
  .privacy-note { display: none; }
  .search-input { flex-wrap: wrap; padding: 7px; }
  .search-input input { width: calc(100% - 45px); }
  .search-input .primary { width: 100%; }
  .key-hint { display: none; }
  .segmented { width: 100%; }
  .segmented label { flex: 1; }
  .segmented span { text-align: center; }
  .search-filters { width: 100%; }
  .search-filters label { flex: 1; }
  .result, .new-client, .page-heading { align-items: stretch; flex-direction: column; }
  .result .secondary, .new-client .secondary, .page-heading .primary { width: 100%; }
  .page-symbol { display: none; }
  .empty-steps { gap: 5px; }
  .empty-steps i { width: 10px; }
  dialog { padding: 21px; }
  .command-dialog { padding: 0; }
  .command-footer span:last-child { display: none; }
  .contact-facts { grid-template-columns: 1fr; }
  .number-card strong { font-size: 19px; }
  .login-wrap { gap: 22px; padding: 22px 12px; }
  .login-wrap .search-card { padding: 26px 22px; }
}
/* Search workspace: readable rows, progressive detail, bounded result pages. */
.search-title .eyebrow { margin-bottom: 10px; }
#search-page.has-searched .try { display: none; }
#search-page .stats { display: flex; gap: 24px; margin: 24px 0; }
#search-page .stat { display: flex; align-items: baseline; gap: 8px; min-height: 0; padding: 0; border: 0; background: none; box-shadow: none; backdrop-filter: none; }
#search-page .stat::after, #search-page .stat small::before { display: none; }
#search-page .stat strong { font-size: 17px; letter-spacing: -.4px; }
#search-page .stat small { margin: 0; font-size: 12px; }
.segmented input:focus-visible + span { outline: 3px solid var(--accent); outline-offset: 2px; }
.search-utilities { display: flex; align-items: flex-start; gap: 18px; margin: 12px 2px 20px; }
.search-utilities .text-button { font-size: 12px; padding: 0; }
.search-more { margin-left: auto; max-width: 350px; text-align: right; font-size: 12px; color: #6a6c70; }
.search-more summary, .search-coverage summary { cursor: pointer; }
.search-more p { font-size: 12px; }
.search-more .search-tools { justify-content: flex-end; }
#saved-searches:not(:empty) { margin-bottom: 24px; }
#search-results { scroll-margin-top: 88px; }
.search-result-heading { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; margin: 28px 0 20px; }
.search-result-heading h2 { margin: 0; font-size: 21px; letter-spacing: -.5px; overflow-wrap: anywhere; }
.search-result-heading p { margin: 4px 0 0; font-size: 12px; color: var(--muted); }
.search-coverage { flex: 0 0 auto; position: relative; color: #65676b; font-size: 12px; padding-top: 6px; }
.search-coverage > div { position: absolute; z-index: 5; top: 34px; right: 0; width: min(350px,80vw); padding: 18px; border: 1px solid var(--line); border-radius: 12px; background: #fff; box-shadow: var(--shadow-md); }
.search-coverage > div p + p { margin-top: 10px; }
.result-filters { display: flex; gap: 5px; overflow-x: auto; border-bottom: 1px solid #e1e3e7; }
.result-filters button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; flex: 0 0 auto; min-height: 46px; padding: 10px 15px; border: 0; border-bottom: 2px solid transparent; color: #6e7074; background: transparent; font-size: 13px; }
.result-filters button[aria-pressed=true] { color: var(--ink); border-bottom-color: var(--accent); font-weight: 650; }
.result-filters button:hover { background: #efeff0; }
.result-filters button span { min-width: 24px; padding: 1px 6px; border-radius: 6px; color: #6e7074; background: #ececed; font-size: 11px; font-variant-numeric: tabular-nums; }
.result-filters button[aria-pressed=true] span { color: #4e5054; background: #e6e8ec; }
.result-explanation { margin: 12px 0 18px; font-size: 12px; color: #6f7175; }
.search-notice, .coverage-warning { padding: 10px 14px; border-radius: 8px; background: #fbf3e4; color: #795e2c; font-size: 12px; }
.search-result-list { overflow: hidden; border: 1px solid #e3e5e9; border-radius: 14px; background: #fff; box-shadow: 0 3px 12px #292b2f03; }
.search-row { display: grid; grid-template-columns: 36px minmax(0,1fr) 150px 155px 32px; align-items: center; gap: 14px; min-height: 88px; padding: 17px 20px; border-top: 1px solid #edf0f2; }
.search-row:hover { background: #f7fafb; }
.result-columns { display: grid; grid-template-columns: minmax(0,1fr) 150px 201px; gap: 14px; padding: 12px 20px 12px 70px; color: #7e8084; background: #fafbfc; font-size: 11px; font-weight: 550; }
.result-avatar { display: grid; place-items: center; width: 36px; height: 36px; border: 1px solid #e5e7eb; border-radius: 11px; background: #f3f3f4; color: #787a7e; font-size: 12px; font-weight: 650; }
.owner-avatar { color: #5a5c60; background: #eaf4ef; border-color: #d7e8df; font-size: 18px; }
.result-person { min-width: 0; }
.result-name { max-width: 100%; padding: 2px 0; border: 0; background: transparent; color: #37393d; font-size: 14px; font-weight: 620; text-align: left; overflow-wrap: anywhere; }
.result-name:hover { color: #57595d; text-decoration: underline; text-underline-offset: 3px; }
.result-person p { margin: 3px 0 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #7d7f83; font-size: 12px; }
.result-classification, .result-number { display: flex; flex-direction: column; gap: 5px; color: #7d7f83; font-size: 11px; min-width: 0; }
.result-kind { width: fit-content; color: #67696d; font-size: 11px; font-weight: 550; }
.result-kind.confirmed { color: #277153; }
.result-kind.confirmed::before { content: '✓ '; }
.result-number strong { color: #636569; font-size: 12px; font-weight: 500; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.result-number > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.result-open { width: 32px; height: 32px; padding: 0; border: 1px solid transparent; border-radius: 8px; color: #8f9195; background: transparent; font-size: 19px; }
.result-open:hover { border-color: #dee0e4; color: #4d4f53; background: #fff; }
.result-pagination { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin: 16px 0; color: #7d7f83; font-size: 12px; }
.result-pagination > div { display: flex; align-items: center; gap: 12px; }
.result-pagination .secondary { min-height: 34px; padding: 7px 11px; }
.search-guide { display: grid; grid-template-columns: repeat(3,1fr); gap: 24px; max-width: 750px; margin: 30px auto 0; }
.search-guide span { color: #828488; font-size: 12px; }
.search-guide b { display: block; margin-bottom: 5px; color: #595b5f; font-weight: 600; }
#search-page .empty p { font-size: 13px; max-width: 570px; margin: 0 auto; }
.search-empty { padding-block: 42px; }
.search-loading { padding: 40px; text-align: center; color: var(--muted); }
.search-loading h2 { font-size: 18px; }
.search-loading p { font-size: 13px; }
#search-page .new-client { margin-top: 24px; padding: 20px; border: 1px solid #e3e5e9; border-radius: 12px; background: #eef3f3; }
#search-page .new-client h3 { font-size: 14px; }
#search-page .new-client p { font-size: 12px; }
#search-page .footnote { font-size: 11px; }
.contact-dialog p, .contact-dialog .linked-file { font-size: 13px; }
.contact-dialog .tag, .contact-dialog .contact-facts h3 { font-size: 11px; }
@media (max-width: 1180px) {
  .search-row { grid-template-columns: 32px minmax(0,1fr) 125px 115px 28px; gap: 10px; padding-inline: 15px; }
  .result-columns { grid-template-columns: minmax(0,1fr) 125px 153px; gap: 10px; padding-inline: 57px 15px; }
}
@media (max-width: 700px) {
  #search-page .stats { flex-wrap: wrap; gap: 8px 18px; margin-block: 18px; }
  #search-page .stat strong { font-size: 15px; }
  #search-page .stat small { font-size: 11px; }
  .search-result-heading { flex-direction: column; gap: 6px; }
  .search-coverage > div { left: 0; right: auto; }
  .search-row { grid-template-columns: 34px minmax(0,1fr) 30px; gap: 7px 12px; padding: 16px; }
  .result-person { grid-column: 2; }
  .result-open { grid-column: 3; grid-row: 1; }
  .result-classification { grid-column: 2 / 4; flex-direction: row; flex-wrap: wrap; gap: 8px; }
  .result-number { grid-column: 2 / 4; flex-direction: row; flex-wrap: wrap; }
  .result-columns { display: none; }
  .search-row:first-child { border-top: 0; }
  .result-filters { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); overflow: visible; gap: 0; }
  .result-filters button { padding-inline: 10px; font-size: 12px; }
  .result-pagination { flex-wrap: wrap; justify-content: center; }
  .result-pagination > div { gap: 8px; }
  .search-guide { grid-template-columns: 1fr; gap: 15px; }
  #search-page .new-client { align-items: stretch; flex-direction: column; }
  #search-page .new-client .secondary { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .001ms !important; animation-duration: .001ms !important; animation-iteration-count: 1 !important; }
}
.test-mode .topbar{border-top:4px solid #af7225}
.test-mode .demo-banner{background:#fff1d9;border-bottom:1px solid #e3ba76;align-items:center;gap:16px}
.test-mode .demo-banner strong{color:#794c12}
.demo-controls{display:flex;flex-wrap:wrap;gap:8px;flex-shrink:0}
.demo-controls .secondary{font-size:12px;padding:10px 14px;text-decoration:none}
@media(max-width:800px){.test-mode .demo-banner{align-items:flex-start;flex-direction:column}.demo-controls{width:100%}}

/* Guided staff workflow: readable type, predictable next actions and quiet chrome. */
body {font-size:17px;color:var(--ink);background:var(--canvas)}
.ambient,.command-hint,.top-search,.key-hint,.search-title .eyebrow,.search-guide {display:none}
.sidebar {background:linear-gradient(180deg,var(--silver-rule)) right / 1px 100% no-repeat,var(--slate-fill);background-color:var(--slate);border-right:0;box-shadow:none}
.sidebar .nav {font-size:17px;min-height:50px}
.topbar {background:#fff}
.content {max-width:1150px}
h1 {font-size:34px;letter-spacing:-.035em}
h2 {font-size:23px}
.intro {font-size:18px;line-height:1.6}
button.primary,button.secondary {min-height:48px;font-size:17px;padding:12px 20px;border-radius:8px}
input,select,textarea {font-size:18px;min-height:48px}
label.field {font-size:17px}
.field input,.field select,.field textarea {margin-top:8px}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible {outline:3px solid var(--accent);outline-offset:3px}
.sidebar :is(a,button):focus-visible {outline-color:#e9e9eb}
.flow-steps {display:flex;gap:22px;list-style:none;margin:24px 0 30px;padding:0;color:#6e7074;flex-wrap:wrap}
.flow-steps li {display:flex;align-items:center;gap:10px;font-weight:600}
.flow-steps li span {display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#ececed;color:#484a4e}
.flow-steps [aria-current] {color:var(--ink)}
.flow-steps [aria-current] span {background:var(--accent);color:var(--accent-ink)}
.guided-panel {background:#fff;border:1px solid #e0e2e6;border-radius:12px;padding:30px;box-shadow:0 3px 12px #2d2f3305}
.guided-panel h2 {margin-top:0}
.guided-client {display:flex;align-items:center;justify-content:space-between;gap:24px;padding:22px 0;border-bottom:1px solid #e7e9ed;flex-wrap:wrap}
.guided-client>div {flex:1;min-width:190px}
.guided-client h3 {font-size:20px;margin:0 0 4px}
.guided-client p {margin:4px 0;line-height:1.5}
.guided-client small {font-size:15px;color:#66686c}
.guided-client button {flex-shrink:0}
.guided-alternative {display:flex;align-items:center;justify-content:space-between;gap:20px;padding:28px 4px;flex-wrap:wrap}
.guided-alternative h2 {font-size:20px;margin:0 0 5px}
.guided-alternative p {margin:0;color:#66686c}
#stats {display:none}
.search-controls {margin-top:16px}
.search-utilities {font-size:15px}
#search-page>.new-client {display:none}
#search-page .result-name {font-size:18px}
#search-page .result-person p,#search-page .result-classification,#search-page .result-number {font-size:15px}
#search-page .search-row {min-height:88px}
#search-page .search-result-list {max-height:none}
#numbers-page .number-workflows {display:block;max-width:780px}
#numbers-page .number-workflow:nth-child(2) {display:none}
#numbers-page .source-logo {display:none}
#numbers-page .number-workflow h2 {display:none}
dialog {border-radius:12px;max-width:min(720px,calc(100vw - 32px))}
dialog .actions {gap:14px}
.number-card strong {font-size:29px;overflow-wrap:anywhere}
@media(max-width:650px){body{font-size:16px}.content{padding:20px}h1{font-size:28px}.guided-panel{padding:20px}.flow-steps{gap:12px;font-size:14px}.flow-steps li{gap:5px}.flow-steps li span{width:28px;height:28px}.guided-client{gap:14px}.guided-client button{width:100%}.number-card{flex-wrap:wrap;gap:12px}.number-card strong{font-size:24px}.result-columns{display:none}}
.sidebar,.profile,.sidebar-note>span {color:#ececee}
.sidebar-note,.sidebar-note p,.profile small {color:#a9abb1;font-size:13px}
.sidebar .nav {color:#c9cacf}
.sidebar .nav:hover {color:#fff;background:rgba(255,255,255,.09)}
.sidebar .nav.active {color:#fff;background:rgba(255,255,255,.13);box-shadow:inset 3px 0 0 var(--silver)}
.sidebar .nav.active::before {display:none}
.sidebar .nav-icon {color:inherit}
.sidebar .nav.active .nav-icon {color:inherit}
.profile {border-top:1px solid rgba(255,255,255,.13);font-size:14px}
.demo-banner button {display:none}
.search-options {margin-top:18px}
.search-options summary {font-size:16px;color:#56585c}
.search-utilities {display:none}
#search-page #stats {display:none}

/* Brand finish: headings take the serif of the firm's wordmark. */
h1,h2 {font-family:var(--serif);font-weight:600;letter-spacing:.005em}
.topbar {border-bottom:1px solid var(--line)}

/* Launch preparation: workbook drop zone and the Qualia/Clio link report. */
.launch-card h2 {margin:0}
.launch-card>p {font-size:14px}
.launch-step {margin:26px 2px 10px}
.dropzone {display:flex;flex-direction:column;align-items:center;gap:6px;margin:16px 0 12px;padding:34px 20px;border:2px dashed #b9bbc0;border-radius:14px;background:#fafafb;color:var(--muted);text-align:center;cursor:pointer;transition:border-color .15s,background .15s}
.dropzone:hover,.dropzone:focus-visible,.dropzone.is-over {border-color:var(--accent);background:#f1f1f3}
.dropzone.is-over {border-style:solid}
.dropzone.is-busy {cursor:progress;border-style:solid;border-color:var(--trim)}
.dropzone strong {color:var(--ink);font-size:18px}
.dropzone span {font-size:14px}
.dropzone-icon {display:grid;place-items:center;width:46px;height:46px;border-radius:50%;color:var(--accent-ink);background:var(--accent);font-size:20px}
#launch-import-status p {font-size:14px}
.launch-tiles {grid-template-columns:repeat(4,minmax(0,1fr));margin:14px 0 0}
.launch-tile {min-height:0;padding:16px 18px}
.launch-tile strong {font-size:26px}
.launch-tile small {font-size:12.5px;line-height:1.4}
.launch-tile.good {border-color:#bfd9c9;background:#f3f9f5}
.launch-tile.warn {border-color:#e3ba76;background:#fdf8ee}
.launch-card details {margin-top:14px}
.launch-card details p {font-size:13.5px}
.launch-card td,.launch-card th {font-size:13px}
@media(max-width:900px){.launch-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Readability pass: Settings, Review and dialogs were set in 9–10px type. */
.sidebar .nav {gap:10px;padding:11px 12px}
.sidebar .nav-icon {width:24px;height:24px;font-size:17px;flex:none}
.launch-tile small::before,.launch-tile::after {display:none}
.admin-card h2 {font-size:20px}
.admin-card h3 {font-size:16px}
.admin-card p,.admin-card li {font-size:14px;line-height:1.6}
.admin-card summary {font-size:14.5px}
.admin-card pre,.raw-record {font-size:12.5px}
.settings-nav button {padding:11px 13px;font-size:14.5px}
.job-card strong {font-size:15.5px}
.job-card p,.job-card small,.job-numbers {font-size:13.5px}
.tag {padding:4px 9px;font-size:11px;letter-spacing:.04em}
.eyebrow {font-size:11px}
table {font-size:14px}
th {font-size:11.5px}
td small {font-size:12.5px}
.field,.toggle-row label,.staff-row,.metric-strip span,.connection-state,.data-label,.save-hint,.test-result {font-size:14px}
.metric-strip strong {font-size:17px}
.stat small {font-size:12.5px}
.text-button {font-size:14px}
.footnote {font-size:13px}
.error {font-size:14px}
dialog p {font-size:15px}
.preview {font-size:14.5px}
.history p,.number-card small {font-size:13.5px}
#toast {font-size:14px}
.pill {font-size:10px}
.demo-banner {font-size:13.5px}
.topbar-context {font-size:14px}
.sidebar-note>span,.profile strong {font-size:13.5px}
.profile small {font-size:12px}
.provider-card p,.provider-card small {font-size:13.5px}
.workflow span {font-size:13px}

/* The admin preview control stays visible in both modes. */
.preview-option{display:flex;gap:10px;align-items:flex-start;margin:14px 16px;padding:12px;border:1px solid var(--trim);border-radius:8px;cursor:pointer;font-size:13px;line-height:1.4}
.preview-option input{flex:none;width:18px;height:18px;margin:2px 0;accent-color:#835a0d}
.preview-option strong,.preview-option small{display:block}
.preview-option small{margin-top:4px;color:var(--muted)}
.preview-mode .demo-banner{background:#fff5db;color:#513b11;border-color:#b98622}
.preview-mode .pill{background:#fff5db;color:#513b11}
.preview-mode .preview-option{background:#fff5db;color:#513b11;border-color:#b98622}

/* Task-based administration. Fixed section IDs, independent forms and readable tables. */
.settings-production{grid-template-columns:245px minmax(0,1fr);align-items:start}
.settings-sidebar{position:sticky;top:85px;max-height:calc(100vh - 105px);overflow:auto;padding:16px;border:1px solid var(--line);border-radius:14px;background:var(--surface,#fff)}
.settings-sidebar .field{margin:0 0 14px}
.settings-sidebar input{width:100%;min-width:0}
.settings-production .settings-nav{position:static;border:0;padding:0;background:transparent}
.settings-production .settings-nav button{display:block;width:100%;padding:12px;text-align:left}
.settings-production .settings-nav button[hidden]{display:none}
.settings-nav strong,.settings-nav small{display:block}
.settings-nav small{font-size:11px;line-height:1.4;color:var(--muted);margin-top:3px;font-weight:400}
.settings-section-title{padding:0 2px 16px}
.settings-section-title h2{font-size:26px;margin:0 0 5px}
.settings-section-title p{margin:0;color:var(--muted)}
.settings-draft-note{font-size:12px;line-height:1.5;margin:18px 4px 0;color:var(--muted)}
.settings-shortcuts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:22px 0}
.settings-shortcuts button{text-align:left;background:var(--canvas);border:1px solid var(--line);border-radius:10px;padding:18px;position:relative;color:var(--ink)}
.settings-shortcuts strong,.settings-shortcuts small{display:block;padding-right:18px}
.settings-shortcuts strong{font-size:15px}
.settings-shortcuts small{font-size:12px;margin-top:8px;color:var(--muted)}
.settings-shortcuts button>span{position:absolute;right:16px;top:18px}
.settings-add-user{padding:18px;background:var(--canvas);border:1px solid var(--line);border-radius:10px;margin:20px 0}
.settings-add-user summary{font-size:16px;font-weight:700;cursor:pointer}
.settings-form-feedback{margin-top:12px;font-size:14px;line-height:1.5}
.settings-form-feedback:not(.error){color:var(--muted)}
.settings-pagination{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:15px 0}
.settings-pagination>span{margin-right:auto;color:var(--muted);font-size:13px}
.settings-users-table td{vertical-align:middle}
.audit-detail{white-space:pre-wrap;overflow-wrap:anywhere;max-width:520px;max-height:400px;overflow:auto;font-size:12px;padding:12px;background:var(--canvas)}
#settings-user-dialog{max-width:560px}
#settings-user-dialog select{width:100%}
.request-profile{display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.request-profile .avatar{flex:none;width:52px;height:52px;font-size:19px}
.request-profile h2{margin:0 0 5px}
.request-profile p{margin:0;overflow-wrap:anywhere}
.request-profile .tag{margin-left:auto}
.request-account-details{margin-top:16px}
.request-account-details summary,.request-filter-details summary,.request-scope summary{cursor:pointer;font-weight:600}
.request-filter-details .admin-grid{margin-top:16px}
#my-request-filters{padding:18px 22px}
#my-request-filters>.field{margin-top:0}
#my-request-filters .actions{margin-top:14px}
.request-stats{margin-top:22px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.request-scope{padding:0 4px;margin:24px 0;color:var(--muted);line-height:1.6}
.request-scope strong{color:var(--ink)}
.request-scope p{margin-top:5px;max-width:900px}
.request-list-heading{margin:28px 0 16px}
.request-list-heading h2{margin-bottom:5px}
.request-list-heading p{color:var(--muted)}
.request-list{display:grid;gap:12px}
.request-row{display:flex;gap:24px;justify-content:space-between;padding:22px;background:var(--surface,#fff);border:1px solid var(--line);border-radius:12px}
.request-row-main{min-width:0;overflow-wrap:anywhere}
.request-row-main h3{margin:12px 0 6px}
.request-row-main h3 button{font:inherit;text-align:left;padding:0}
.request-row-main p{margin:0 0 12px}
.request-row small{color:var(--muted);font-size:13px;line-height:1.5}
.request-row-number{min-width:190px;display:flex;flex-direction:column;align-items:flex-end;gap:6px;justify-content:center}
.request-row-number .secondary{margin-top:8px}
#my-request-dialog{max-width:680px}
#my-request-content>p{overflow-wrap:anywhere;white-space:pre-wrap}
@media(max-width:760px){.request-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.request-row{flex-direction:column;gap:16px}.request-row-number{align-items:flex-start;min-width:0}.request-profile .tag{margin-left:0}.request-profile>div{min-width:0;max-width:100%}}
.density-compact .table-wrap td,.density-compact .table-wrap th{padding-top:7px;padding-bottom:7px}
@media(max-width:1100px){.settings-production{grid-template-columns:210px minmax(0,1fr);gap:16px}.settings-shortcuts{grid-template-columns:1fr}}
@media(max-width:760px){.settings-production{display:block}.settings-sidebar{position:static;max-height:none;margin-bottom:20px}.settings-production .settings-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));overflow:visible}.settings-production .settings-nav button{min-width:0}.settings-nav small{display:none}.settings-shortcuts{grid-template-columns:1fr}.settings-section-title h2{font-size:23px}}

/* ───────────────────────────────────────────────────────────────────────────────────────
   Finding a client: Get a number and Name Search.
   One search bar, one client card and one matter table serve both pages. Nothing here is
   set smaller than 12px, and no rule is scoped to one page unless the page truly differs.
   ─────────────────────────────────────────────────────────────────────────────────────── */
.topbar .pill {grid-column:-2}
/* These two pages carry a six-column table, so they may use a little more of a wide screen. */
.content:has(> :is(#guided-page,#search-page):not([hidden])) {max-width:1290px}
#guided-page,#search-page {max-width:1160px;margin-inline:auto}

/* Page heading, with the three steps beside it on Get a number. */
.finder-heading {align-items:flex-end;flex-wrap:wrap;gap:18px 40px;margin-bottom:22px}
.finder-heading h1 {font-size:32px;line-height:1.15}
.finder-heading .intro {max-width:620px;margin-top:8px;font-size:16px;line-height:1.55}
.flow-steps {align-items:center;flex-wrap:wrap;gap:8px 0;margin:0 0 4px;font-size:14px}
.flow-steps li {gap:8px;white-space:nowrap}
.flow-steps li+li::before {content:"";width:26px;height:1px;margin:0 10px 0 4px;background:#c6c8cc}
.flow-steps li span {width:26px;height:26px;font-size:13px}

/* The search bar. */
.finder {padding:20px 22px;border:1px solid var(--line);border-radius:16px;background:#fff;box-shadow:var(--shadow-sm)}
.finder-label {display:block;margin-bottom:10px;font-size:15px;font-weight:650}
.finder .search-input {min-height:60px;padding:6px 6px 6px 4px;border-radius:12px}
.finder .search-input input {min-height:46px;padding:8px 6px;font-size:18px}
.finder .search-input input::placeholder {color:#8b8d91}
.finder .search-glyph {padding-left:12px;font-size:26px;line-height:1}
.finder .search-input .primary {flex:none;min-height:46px;padding:10px 22px;font-size:16px;border-radius:9px}
.finder-hint {margin:12px 2px 0;color:var(--muted);font-size:13.5px;line-height:1.5}
.finder .search-controls {display:flex;flex-direction:row;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px 20px;margin-top:14px;padding-top:0}
.finder .segmented {padding:3px;border:0;border-radius:10px;background:var(--chip)}
.finder .segmented span {padding:7px 16px;border-radius:8px;color:var(--muted);font-size:14px}
.finder .segmented input:checked + span {color:var(--ink);background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.14);font-weight:650}
.finder .search-filters {display:flex;flex-wrap:wrap;gap:10px 20px}
.finder .search-filters label {display:flex;align-items:center;gap:8px;color:var(--muted);font-size:13.5px;font-weight:550}
.finder .search-filters label > span {margin:0}
.finder .search-filters select {width:auto;min-width:0;min-height:38px;padding:6px 30px 6px 11px;border-radius:8px;font-size:14px}
.finder .try {margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}
.finder .try > span {color:var(--muted);font-size:13.5px}
.finder .try button {padding:5px 12px;border:1px solid var(--line);border-radius:999px;color:var(--ink);background:#fff;font-size:13.5px}
.finder .try button:hover {border-color:var(--trim);background:#fff}
#search-page.has-searched .finder .try {display:none}

/* Results heading: what was found, in numbers. */
#guided-results:not(:empty),#search-results {margin-top:26px}
.people-heading,.search-result-heading {display:flex;align-items:flex-end;justify-content:space-between;flex-wrap:wrap;gap:8px 20px;margin:0 0 14px}
.people-heading h2,.search-result-heading h2 {margin:0;font-size:23px;letter-spacing:0;overflow-wrap:anywhere}
.people-heading p {margin:0;color:var(--muted);font-size:14.5px}
.result-tally {display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 0;padding:0;list-style:none}
.result-tally li {padding:3px 11px;border:1px solid var(--line);border-radius:999px;color:var(--muted);background:#fff;font-size:13.5px;line-height:1.5}
.result-tally strong {color:var(--ink);font-variant-numeric:tabular-nums}
.result-tally .tally-conflict {border-color:#e6cf9c;color:#6b4f1d;background:#fbf3e4}
.result-tally .tally-conflict strong {color:inherit}
.search-coverage {padding-top:0;font-size:13.5px}
.search-coverage > summary {display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:0 12px;border:1px solid var(--line);border-radius:8px;color:var(--ink);background:#fff;font-weight:550;list-style:none}
.search-coverage > summary::-webkit-details-marker {display:none}
.search-coverage > summary::before {content:"";width:8px;height:8px;border-radius:50%;background:#2f8a61}
.search-coverage.coverage-incomplete > summary::before {background:#c29a51}
.search-coverage > summary:hover {border-color:var(--trim)}
.search-coverage > div {top:44px;width:min(380px,84vw)}
.search-coverage > div p {margin:0;font-size:13.5px;line-height:1.55}
.search-views {margin-top:6px}
.search-views button {min-height:48px;font-size:15px}
.result-filters button span {font-size:12.5px}
.result-subfilters {margin-top:14px;padding:3px;border-bottom:0;border-radius:10px;background:var(--chip)}
.result-subfilters button {min-height:38px;border-bottom:0;border-radius:8px;font-size:14px}
.result-subfilters button[aria-pressed=true] {background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.14)}
#search-page .result-explanation {margin:14px 0 16px;color:var(--muted);font-size:14px}
#search-page .search-notice,#search-page .coverage-warning {font-size:14px}
#search-page .result-columns,#search-page .result-kind,#search-page .result-pagination {font-size:13.5px}
#search-page .empty h2 {font-size:20px}
#search-page .empty p {font-size:15px}
.empty-welcome {margin-top:0;padding:44px 20px;border-radius:16px}
.search-empty .secondary {margin-top:14px}
#search-page .footnote {margin-top:20px;font-size:13px}

/* One client: who they are, their number, what to do next. */
.person-card {container-type:inline-size;margin:14px 0 0;overflow:hidden;border:1px solid var(--line);border-radius:14px;background:#fff;box-shadow:var(--shadow-sm)}
.search-cards .person-card:first-child {margin-top:0}
.person-head {display:flex;align-items:center;flex-wrap:wrap;gap:14px 16px;padding:20px 22px 0}
.person-head:last-child {padding-bottom:20px}
.person-avatar {display:grid;flex:none;place-items:center;align-self:flex-start;width:48px;height:48px;border-radius:50%;color:#3a3c40;background:var(--chip);font-size:15px;font-weight:700;letter-spacing:.02em}
.decision-use .person-avatar {color:var(--accent-ink);background:var(--accent)}
.person-title {flex:1 1 280px;min-width:0}
.person-title h3 {margin:0;font-family:var(--serif);font-size:22px;font-weight:600;line-height:1.25;letter-spacing:0;overflow-wrap:anywhere}
.person-meta {display:flex;flex-wrap:wrap;margin:4px 0 0;color:var(--muted);font-size:14.5px;line-height:1.5}
.person-meta span:not(:last-child)::after {content:"·";margin:0 8px;color:#b4b6ba}
.person-badges {display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:10px}
.badge,.src {display:inline-flex;align-items:center;gap:6px;min-height:24px;padding:0 10px;border-radius:999px;font-size:12.5px;font-weight:650;line-height:1.4;white-space:nowrap}
.badge-use {color:#1f5c41;background:#e7f3ec}
.badge-use::before {content:"✓";font-weight:700}
.badge-admin {color:#6b4f1d;background:#fbf3e4}
.badge-admin::before {content:"!";font-weight:800}
.badge-none,.badge-possible {color:#484a4e;background:var(--chip)}
.src {border:1px solid var(--line);color:var(--muted);background:#fff;font-weight:550}
.clio-count {margin-left:4px;color:var(--muted);font-size:12.5px;white-space:nowrap}
.clio-count::before {content:"↗ ";color:var(--trim)}
.client-number {display:flex;flex:none;flex-direction:column;gap:3px;min-width:118px;padding-left:20px;border-left:1px solid var(--line)}
.client-number small {color:var(--muted);font-size:12px;font-weight:650;letter-spacing:.02em}
.client-number strong {font-size:27px;font-weight:700;line-height:1.1;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.client-number i {color:#b4b6ba;font-style:normal;font-weight:400}
.client-number-none strong {color:var(--muted);font-size:15px;font-weight:550;line-height:1.95;letter-spacing:0}
.person-action {flex:none}
.person-action button {min-height:46px;padding:10px 18px;font-size:16px;white-space:nowrap}
.person-reason {margin:14px 22px 0;color:var(--muted);font-size:14.5px;line-height:1.5}
.person-reason:last-child,.person-facts:last-child {margin-bottom:20px}
.person-reason.reason-admin {display:flex;gap:10px;padding:11px 14px;border:1px solid #e6cf9c;border-radius:10px;color:#6b4f1d;background:#fbf3e4}
.person-reason.reason-admin::before {content:"!";display:grid;flex:none;place-items:center;width:20px;height:20px;margin-top:1px;border-radius:50%;color:#fff;background:#a8782a;font-size:13px;font-weight:800;line-height:1}
.person-facts {display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px 24px;margin:16px 22px 0;padding:14px 16px;border-radius:10px;background:#f7f7f8}
.person-facts dt {color:var(--muted);font-size:12px;font-weight:650;letter-spacing:.02em}
.person-facts dd {margin:2px 0 0;font-size:15px;line-height:1.5;overflow-wrap:anywhere}
.person-new {border-style:dashed;border-color:#c6c8cc;background:rgba(255,255,255,.55);box-shadow:none}
.person-new .person-avatar {border:1px dashed #9b9da1;color:var(--muted);background:#fff;font-size:20px;font-weight:400}
.person-new .person-meta {display:block;max-width:560px}

/* A card's files: its own, then the ones it only appears on. */
.person-section {margin-top:18px;border-top:1px solid var(--line)}
.person-section + .person-section {margin-top:0}
.person-section > summary {display:flex;align-items:center;flex-wrap:wrap;gap:6px 10px;padding:13px 22px;cursor:pointer;list-style:none;font-size:15.5px;font-weight:650;-webkit-user-select:none;user-select:none}
.person-section > summary::-webkit-details-marker {display:none}
.person-section > summary:hover {background:#fafafb}
.person-section > summary:focus-visible {outline-offset:-3px}
.section-count {min-width:26px;padding:1px 8px;border-radius:999px;color:#484a4e;background:var(--chip);font-size:12.5px;font-weight:650;text-align:center;font-variant-numeric:tabular-nums}
.section-note {color:var(--muted);font-size:13.5px;font-weight:450}
.section-toggle {flex:none;width:9px;height:9px;margin:0 5px 4px auto;border-right:2px solid var(--trim);border-bottom:2px solid var(--trim);transform:rotate(45deg);transition:transform .15s}
.person-section[open] > summary .section-toggle {margin-bottom:-4px;transform:rotate(-135deg)}
.person-conflict .section-title {color:#6b4f1d}
.person-conflict .section-count {color:#6b4f1d;background:#fbf3e4}
.person-section .table-wrap {margin:0;overflow-x:auto;border:0;border-top:1px solid var(--line);border-radius:0;background:transparent;box-shadow:none}
.matter-table {table-layout:fixed;font-size:14.5px}
.matter-table th {padding:9px 12px;color:var(--muted);background:#f7f7f8;border-bottom:1px solid var(--line);font-size:12px;font-weight:650;letter-spacing:.02em;text-transform:none}
.matter-table td {padding:13px 12px;vertical-align:top;border-bottom:1px solid #eceef1;overflow-wrap:anywhere}
.matter-table tbody tr:last-child td {border-bottom:0}
.matter-table :is(th,td):first-child {padding-left:22px}
.matter-table :is(th,td):last-child {padding-right:22px}
.matter-table tbody tr:hover td {background:#fafafb}
.matter-table .c-number {width:168px}
.matter-table .c-who {width:142px}
.matter-table-other .c-who {width:210px}
.matter-table .c-date {width:110px}
.matter-table .c-status {width:116px}
.matter-table .c-open {width:192px}
.matter-number {display:flex;flex-direction:column;gap:2px;width:fit-content;border-radius:6px;color:var(--ink);text-decoration:none;outline-offset:3px}
.matter-table .m-number strong {font-weight:650;font-variant-numeric:tabular-nums}
.matter-table .m-number small {margin-top:2px;color:var(--muted);font-size:12.5px;font-variant-numeric:tabular-nums}
.matter-number strong,.matter-number-alt small {text-decoration:underline;text-decoration-color:#c6c8cc;text-decoration-thickness:1px;text-underline-offset:4px}
.matter-number:hover strong,.matter-number:focus-visible strong,.matter-number-alt:hover small,.matter-number-alt:focus-visible small {color:var(--ink);text-decoration-color:var(--ink)}
.m-title {font-weight:550}
.m-title-none {color:var(--muted);font-weight:400}
.matter-table td small {margin-top:3px;color:var(--muted);font-size:13px;line-height:1.45}
.matter-table td small.m-found {color:#8b8d91;font-size:12.5px}
.m-client span {font-weight:550}
.m-client .m-title-none {color:var(--muted);font-weight:400}
.m-date {white-space:nowrap}
.status {display:inline-flex;align-items:center;gap:7px;font-size:13.5px;font-weight:600;white-space:nowrap}
.status::before {content:"";flex:none;width:8px;height:8px;border-radius:50%;background:#b4b6ba}
.status-open::before {background:#2f8a61}
.status-wait::before {background:#c29a51}
.status-bad {color:var(--red)}
.status-bad::before {background:var(--red)}
.status-closed {color:var(--muted)}
.open-links {display:flex;flex-wrap:wrap;gap:6px}
.open-link {display:inline-flex;align-items:center;gap:5px;min-height:30px;padding:0 10px;border:1px solid #cfd0d4;border-radius:7px;color:var(--ink);background:#fff;font-size:13px;font-weight:650;text-decoration:none;white-space:nowrap;transition:background .15s,color .15s,border-color .15s}
.open-link:hover,.open-link:focus-visible {border-color:var(--accent);color:var(--accent-ink);background:var(--accent)}
.open-none {color:#8b8d91;font-size:13px}
.density-compact .matter-table td {padding-top:8px;padding-bottom:8px}

/* The table needs about 980px. In a smaller window (beside Qualia, say) each file becomes a
   three-part row instead: number, what it is, and where it stands. Nothing scrolls sideways. */
@container (max-width:980px) {
  .matter-table,.matter-table tbody,.matter-table td {display:block}
  .matter-table thead {display:none}
  .matter-table tr {display:grid;grid-template-columns:158px minmax(0,1fr) auto;align-items:start;gap:5px 18px;padding:14px 22px;border-bottom:1px solid #eceef1}
  .matter-table tbody tr:last-child {border-bottom:0}
  .matter-table tbody tr:hover td {background:none}
  .matter-table tbody tr:hover {background:#fafafb}
  .matter-table td,.matter-table :is(th,td):first-child,.matter-table :is(th,td):last-child {padding:0;border:0}
  .matter-table td.m-number {grid-column:1;grid-row:1 / span 3}
  .matter-table td.m-matter {grid-column:2;grid-row:1}
  .matter-table :is(td.m-role,td.m-client) {grid-column:2;grid-row:2}
  .matter-table td.m-date {grid-column:2;grid-row:3}
  .matter-table td.m-status {grid-column:3;grid-row:1;justify-self:end}
  .matter-table td.open-cell {grid-column:3;grid-row:2 / span 2;justify-self:end}
  .matter-table :is(td.m-role,td.m-client,td.m-date) {font-size:14px}
  .matter-table :is(td.m-role,td.m-client,td.m-date)::before {content:attr(data-label);display:inline-block;width:136px;color:var(--muted);font-size:13px}
  .matter-table td.m-client small {margin-left:136px}
  .open-links {justify-content:flex-end}
}
@container (max-width:780px) {
  .person-title {flex-basis:calc(100% - 64px)}
  .client-number {flex:1 1 auto;margin-left:64px;padding-left:0;border-left:0}
}
@container (max-width:560px) {
  .person-head {padding:18px 16px 0}
  .person-reason,.person-facts {margin-inline:16px}
  .person-section > summary {padding-inline:16px}
  .section-note {flex-basis:100%;order:3}
  .client-number {margin-left:0}
  .person-action,.person-action button {width:100%}
  .person-meta {flex-direction:column}
  .person-meta span::after {display:none}
  .matter-table tr {grid-template-columns:minmax(0,1fr) auto;gap:8px 14px;padding:14px 16px}
  .matter-table td.m-number {grid-row:1}
  .matter-table td.m-status {grid-column:2}
  .matter-table :is(td.m-matter,td.m-role,td.m-client,td.m-date,td.open-cell) {grid-column:1 / -1;grid-row:auto;justify-self:stretch}
  .matter-table :is(td.m-role,td.m-client,td.m-date)::before {width:auto;margin-right:8px}
  .matter-table td.m-client small {margin-left:0}
  .open-links {justify-content:flex-start}
}

/* While a search runs. */
.cards-loading > p {margin:0;color:var(--muted);font-size:15px}
.card-ghost {display:grid;grid-template-columns:48px minmax(0,1fr) minmax(0,190px);align-items:center;gap:10px 16px;margin-top:14px;padding:20px 22px;border:1px solid var(--line);border-radius:14px;background:#fff}
.card-ghost :is(i,span,b) {display:block;border-radius:7px}
.card-ghost i {grid-row:1 / 3;width:48px;height:48px;border-radius:50%}
.card-ghost span {width:min(280px,90%);height:18px}
.card-ghost span + span {grid-column:2;width:min(440px,100%);height:13px}
.card-ghost b {grid-column:3;grid-row:1 / 3;height:44px}

/* The other way to a number, kept below the client search. */
.guided-alternative {margin-top:28px;padding:18px 22px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.55)}
.guided-alternative h2 {margin:0 0 3px;font-size:18px}
.guided-alternative p {font-size:14.5px}
.guided-alternative button.secondary {min-height:44px;font-size:15px}

@media (max-width:650px) {
  .finder {padding:16px}
  .finder-heading h1 {font-size:27px}
  .finder .search-glyph {display:none}
  .finder .search-input input {padding-left:10px;font-size:16px}
  .finder .search-input .primary {padding-inline:16px}
  .flow-steps {gap:8px 16px}
  .flow-steps li + li::before {display:none}
  .card-ghost {grid-template-columns:48px minmax(0,1fr)}
  .card-ghost b {display:none}
  .search-views button {flex:1}
}