:root {
  color-scheme: light;
  --ink: #111827;
  --ink-soft: #5b6472;
  --paper: #f5f6f8;
  --porcelain: #ffffff;
  --rule: #e3e6ea;
  --rule-strong: #d0d5dd;
  --tide: #0e5a6b;
  --tide-deep: #0a4655;
  --tide-pale: #e7f2f4;
  --amber: #8a4b06;
  --amber-pale: #fdf3e3;
  --red: #b42318;
  --red-pale: #fdecea;
  --green: #0f6b45;
  --green-pale: #e8f6ef;
  --tide-mist: #eef0f3;
  --shadow-card: none;
  --shadow-float: 0 24px 64px rgba(16, 24, 40, 0.2), 0 2px 6px rgba(16, 24, 40, 0.06);
  --shadow-segment: 0 1px 2px rgba(16, 24, 40, 0.12);
  --shadow-action: none;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

* {
  box-sizing: border-box;
}

html {
  min-width: 20rem;
  background: var(--porcelain);
}

.demo-line {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1000;
  height: 3px;
  background: var(--red);
  pointer-events: none;
}

body {
  display: grid;
  grid-template-columns: 14.5rem minmax(0, 1fr);
  min-height: 100vh;
  margin: 0;
  color: var(--ink);
  background: var(--porcelain);
  font-size: 0.875rem;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

body:has(.sidebar-menu:not([open])) {
  grid-template-columns: 4.25rem minmax(0, 1fr);
}

a {
  color: var(--tide-deep);
  text-underline-offset: 0.2em;
}

button,
input,
select {
  font: inherit;
}

button,
select {
  cursor: pointer;
}

.skip-link {
  position: absolute;
  top: 0.5rem;
  left: -100vw;
  z-index: 10;
  padding: 0.65rem 1rem;
  border-radius: 0.5rem;
  color: var(--tide-deep);
  background: var(--porcelain);
  font-weight: 650;
}

.skip-link:focus {
  left: 0.5rem;
  outline: 3px solid var(--tide);
  outline-offset: 2px;
}

.app-header {
  border-right: 1px solid var(--rule);
  background: var(--porcelain);
}

/* Layered above the page, so the firm switcher's menu, which is wider than the sidebar, is drawn over the content. */
.app-header__inner {
  display: flex;
  position: sticky;
  top: 0;
  z-index: 7;
  height: 100vh;
  min-height: 26rem;
  padding: 1.5rem 0.75rem;
  flex-direction: column;
}

/* The toggle sits in the brand row and the account menu at the foot of the sidebar. Both are
   placed against .app-header__inner because a <details> element does not stretch its content
   to fill a flex column, so margin-top: auto inside it cannot reach the bottom. */
.sidebar-menu { display: flex; min-height: 0; flex: 1; flex-direction: column; }
.sidebar-menu > summary { position: absolute; top: 1.5rem; right: 0.75rem; display: grid; width: 2.75rem; height: 2.75rem; place-items: center; border-radius: 0.5rem; color: var(--ink-soft); list-style: none; cursor: pointer; }
.sidebar-menu > summary::-webkit-details-marker { display: none; }
.sidebar-menu > summary:hover { color: var(--tide-deep); background: var(--tide-pale); }
.sidebar-menu > summary:focus-visible { outline: 3px solid var(--tide); outline-offset: 2px; }
.sidebar-menu__toggle svg { width: 1.2rem; height: 1.2rem; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.sidebar-menu__content { display: flex; min-height: 0; flex: 1; flex-direction: column; }
.sidebar-menu:not([open]) > .sidebar-menu__content { display: none; }
.sidebar-menu__content > .brand { padding-right: 2.75rem; }
/* A collapsed sidebar keeps its icons: the closed details element's content stays rendered where
   the browser supports styling it, and the toggle alone remains where it does not. */
@media (min-width: 52.0625rem) {
  @supports selector(::details-content) {
    .sidebar-menu:not([open])::details-content { display: block; flex: 1; min-height: 0; content-visibility: visible; }
    .sidebar-menu:not([open]) > .sidebar-menu__content { display: flex; }
    .sidebar-menu:not([open]) .brand { visibility: hidden; }
    .sidebar-menu:not([open]) .nav-link__label,
    .sidebar-menu:not([open]) .account-menu__name,
    .sidebar-menu:not([open]) .account-menu__chevron,
    .sidebar-menu:not([open]) .firm-switcher__text,
    .sidebar-menu:not([open]) .firm-switcher__chevron { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
    .sidebar-menu:not([open]) .firm-switcher--static,
    .sidebar-menu:not([open]) .firm-switcher__toggle { width: 2.75rem; justify-content: center; padding-right: 0; padding-left: 0; }
    .sidebar-menu:not([open]) .primary-nav .nav-link,
    .sidebar-menu:not([open]) .account-menu > summary { justify-content: center; padding-right: 0; padding-left: 0; }
  }
}

.brand {
  display: inline-flex;
  min-height: 2.75rem;
  padding: 0 0.65rem;
  align-items: center;
  color: var(--tide-deep);
  font-size: 1.125rem;
}

.wordmark {
  display: inline-flex;
  align-items: center;
  color: inherit;
  font-weight: 650;
  letter-spacing: -0.04em;
  white-space: nowrap;
}

.brand__home { color: inherit; text-decoration: none; }
.brand-star-button { display: grid; width: 1.65rem; height: 2.75rem; margin-right: 0.1em; padding: 0; place-items: center; border: 0; border-radius: 0.35rem; background: none; cursor: pointer; }
.brand-star { display: block; width: 1.05rem; height: 1.05rem; color: #a7834e; }
.brand-star-button:focus-visible { outline: 3px solid var(--tide); outline-offset: 2px; }
.auth-page__wordmark .brand-star-button { width: 1.12em; height: 1.12em; margin-right: 0; }
.auth-page__wordmark .brand-star { width: 1.12em; height: 1.12em; }
@media (prefers-reduced-motion: reduce) {
  .brand-star path { transform: none !important; }
  .brand-star animateTransform { display: none; }
}

.primary-nav {
  display: grid;
  margin-top: 1.25rem;
  gap: 0.25rem;
}

.nav-link,
.nav-action {
  position: relative;
  display: inline-flex;
  min-height: 2.75rem;
  padding: 0.5rem 0.625rem;
  align-items: center;
  justify-content: flex-start;
  gap: 0.625rem;
  border: 0;
  border-radius: 0.5rem;
  color: #374151;
  background: transparent;
  font-weight: 500;
  text-decoration: none;
}

.nav-link:hover,
.nav-action:hover {
  color: var(--ink);
  background: var(--paper);
}

.nav-link[aria-current="page"] {
  color: #0b4a59;
  background: var(--tide-pale);
  font-weight: 600;
}

.nav-link__icon {
  width: 18px;
  height: 18px;
  flex: none;
}


.account-menu {
  position: absolute;
  right: 0.75rem;
  bottom: 1.5rem;
  left: 0.75rem;
  font-size: 0.875rem;
}
.account-menu > summary {
  min-height: 2.75rem;
  display: flex;
  align-items: center;
  gap: 0.625rem;
  padding: 0.5rem 0.625rem;
  border-radius: 0.625rem;
  color: var(--ink);
  background: transparent;
  font-weight: 500;
  cursor: pointer;
  list-style: none;
}
.account-menu > summary:hover,
.account-menu[open] > summary { background: var(--paper); }
.account-menu__avatar {
  display: grid;
  width: 1.75rem;
  height: 1.75rem;
  flex: none;
  place-items: center;
  border-radius: 50%;
  color: var(--ink);
  background: var(--tide-mist);
  font-size: 0.75rem;
  font-weight: 600;
}
.account-menu__name { min-width: 0; overflow: hidden; overflow-wrap: anywhere; line-height: 1.25; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; }
.account-menu > summary::-webkit-details-marker { display: none; }
.account-menu__chevron {
  display: inline-grid;
  width: 1rem;
  height: 1rem;
  margin-left: auto;
  padding-left: 0.5rem;
  flex: none;
  place-items: center;
}
/* Points up: the menu opens above the name. */
.account-menu__chevron::before {
  content: "";
  width: 0.4rem;
  height: 0.4rem;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: translateY(0.12rem) rotate(-135deg);
}
.account-menu[open] .account-menu__chevron::before { transform: translateY(-0.12rem) rotate(45deg); }
.account-menu__items {
  position: absolute;
  bottom: calc(100% + 0.25rem);
  left: 0;
  z-index: 5;
  min-width: 10rem;
  padding: 0.25rem;
  border: 1px solid var(--rule);
  border-radius: 0.625rem;
  background: var(--porcelain);
  box-shadow: 0 8px 24px rgba(16, 24, 40, 0.12);
}
.account-menu__items .nav-link,
.account-menu__items .nav-action { width: 100%; justify-content: flex-start; border-radius: 0.4rem; color: var(--ink); }
.account-menu__items form { margin: 0; }

/* The working firm under the wordmark: a disclosure listing the member's firms, or a static label for a member of
   one firm. The tile is decoration; the firm's name is the text. */
.firm-tile { display: grid; width: 1.75rem; height: 1.75rem; flex: none; place-items: center; border-radius: 0.4375rem; color: var(--ink); background: var(--tide-mist); font-size: 0.75rem; font-weight: 650; line-height: 1; }
.firm-tile--demo { color: var(--red); background: var(--red-pale); }
.firm-tile--large { width: 2rem; height: 2rem; border-radius: 0.5rem; }
.firm-switcher { position: relative; margin-top: 0.5rem; }
.firm-switcher--static,
.firm-switcher__toggle { display: flex; min-height: 3rem; padding: 0.375rem 0.625rem; align-items: center; gap: 0.625rem; }
.firm-switcher__toggle { border: 1px solid var(--rule); border-radius: 0.625rem; color: var(--ink); background: var(--porcelain); list-style: none; cursor: pointer; }
.firm-switcher__toggle::-webkit-details-marker { display: none; }
.firm-switcher__toggle:hover { background: var(--paper); }
.firm-switcher[open] > .firm-switcher__toggle { border-color: var(--rule-strong); background: var(--paper); }
.firm-switcher__text { display: flex; min-width: 0; flex: 1; flex-direction: column; }
.firm-switcher__name { overflow: hidden; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.firm-switcher__tag { color: var(--red); font-size: 0.75rem; font-weight: 600; }
.firm-switcher__chevron { flex: none; color: var(--ink-soft); }
.firm-switcher__menu { position: absolute; top: calc(100% + 0.25rem); left: 0; z-index: 6; display: grid; width: 18rem; margin: 0; padding: 0.375rem; border: 1px solid var(--rule); border-radius: 0.75rem; background: var(--porcelain); box-shadow: var(--shadow-float); }
.firm-option { display: flex; width: 100%; min-height: 3rem; padding: 0.5rem 0.625rem; align-items: center; gap: 0.625rem; border: 0; border-radius: 0.5rem; color: var(--ink); background: transparent; font-weight: 500; text-align: left; }
.firm-option:hover { background: var(--paper); }
.firm-option[aria-current="true"] { color: #0b4a59; background: var(--tide-pale); font-weight: 600; }
.firm-option:focus-visible { outline: 3px solid var(--tide); outline-offset: -3px; }
.firm-option__name { min-width: 0; flex: 1; }
.firm-option__pill { margin-left: 0.25rem; padding: 0.0625rem 0.375rem; border-radius: 999px; color: var(--red); background: var(--red-pale); font-size: 0.6875rem; font-weight: 650; }
.firm-option__check { flex: none; }

/* After sign-in, a member of several firms chooses one. */
.firm-chooser { display: flex; width: 100%; max-width: 25rem; margin: 6rem auto 0; padding: 0 1rem; flex-direction: column; gap: 1.25rem; }
.firm-chooser__wordmark { display: flex; margin: 0; justify-content: center; color: var(--tide-deep); font-size: 1.625rem; }
.firm-chooser h1 { margin: 0.5rem 0 0; font-size: 1.25rem; font-weight: 650; text-align: center; }
.firm-chooser__list { display: grid; margin: 0; gap: 0.5rem; }
.firm-choice { display: flex; min-height: 3.5rem; padding: 0.625rem 0.875rem; align-items: center; gap: 0.75rem; border: 1px solid var(--rule); border-radius: 0.75rem; color: var(--ink); background: var(--porcelain); text-align: left; }
.firm-choice:hover { background: var(--paper); }
.firm-choice:focus-visible { outline: 3px solid var(--tide); outline-offset: 2px; }
.firm-choice__name { flex: 1; font-weight: 600; }

/* A form opened in one firm and posted after a switch to another. */
.stale-form { display: flex; max-width: 30rem; margin: 4rem auto 0; padding: 1.75rem; flex-direction: column; gap: 1rem; border: 1px solid #f2c4bf; border-radius: 0.875rem; background: var(--red-pale); }
.stale-form h1 { margin: 0; font-size: 1.25rem; font-weight: 650; }
.stale-form p { margin: 0; }
.stale-form__actions { display: flex; margin: 0; flex-wrap: wrap; align-items: center; gap: 0.75rem; }
.stale-form__stay { display: inline-flex; min-height: 2.75rem; padding: 0 0.375rem; align-items: center; font-weight: 500; }
summary:focus-visible { outline: 3px solid var(--tide); outline-offset: 2px; }

.record-menu { position: relative; flex: none; }
.record-menu > summary { display: flex; width: 2.75rem; min-height: 2.75rem; align-items: center; justify-content: center; border-radius: 0.35rem; color: var(--ink-soft); font-size: 1.4rem; line-height: 1; list-style: none; cursor: pointer; }
.record-menu__dots { display: block; width: 1.2rem; height: 1.2rem; fill: currentColor; }
.record-menu > summary::-webkit-details-marker { display: none; }
.record-menu > summary:hover, .record-menu[open] > summary { color: var(--tide-deep); background: var(--tide-pale); }
.record-menu__body { position: absolute; top: calc(100% + 0.25rem); right: 0; z-index: 6; width: min(24rem, calc(100vw - 3rem)); max-height: 70vh; overflow-y: auto; padding: 1rem; border: 1px solid var(--rule); border-radius: 0.5rem; background: var(--porcelain); box-shadow: 0 8px 24px rgba(16, 24, 40, 0.1); font-size: 0.9rem; }
.record-menu__body form { margin: 0; }
.record-menu__body > form + form, .record-menu__body > form + details { margin-top: 0.75rem; }
.record-menu__body .action-form { padding: 0; border: 0; }
.record-menu__body .form-actions { justify-content: flex-start; }
.record-menu__body > a { display: flex; min-height: 2.75rem; align-items: center; }
/* A header's actions menu: links and buttons alike read as one list of plain items. */
.record-menu__body--list { width: max-content; min-width: 12rem; padding: 0.4rem; }
.record-menu__body--list > form + form, .record-menu__body--list > a + form, .record-menu__body--list > form + a { margin-top: 0; }
.record-menu__body--list > a, .record-menu__body--list > form > button { display: flex; width: 100%; min-height: 2.75rem; padding: 0 0.75rem; align-items: center; border: 0; border-radius: 0.4rem; color: var(--ink); background: none; font: inherit; font-weight: 400; text-align: left; text-decoration: none; }
.record-menu__body--list > a:hover, .record-menu__body--list > a:focus-visible, .record-menu__body--list > form > button:hover, .record-menu__body--list > form > button:focus-visible { color: var(--tide-deep); background: var(--tide-pale); }
.record-menu__body--list > a.record-menu__danger { color: var(--red); }
.record-menu__body--list > a.record-menu__danger:hover, .record-menu__body--list > a.record-menu__danger:focus-visible { background: var(--red-pale); }
.record-menu__divider { height: 1px; margin: 0.3rem 0.4rem; background: var(--rule); }
.doc-form .ssa827-date { display: none; }
.doc-form:has(select[name=kind] option[value=ssa_827]:checked) .ssa827-date { display: block; }
.section-disclosure { min-width: 0; border-bottom: 1px solid var(--rule); }
.section-disclosure > summary { display: flex; min-height: 3.25rem; align-items: center; gap: 0.7rem; padding: 0.75rem 0; font-weight: 650; list-style: none; cursor: pointer; }
.section-disclosure > summary::-webkit-details-marker { display: none; }
.section-disclosure > summary::before { content: ""; width: 0.5rem; height: 0.5rem; margin: 0 0.25rem; flex: none; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(-45deg); transform-origin: center; }
.section-disclosure[open] > summary::before { transform: rotate(45deg); }
.section-disclosure > summary:hover { color: var(--tide-deep); }
.section-disclosure > summary h2, .section-disclosure > summary h3 { margin: 0; font-size: inherit; }
.section-disclosure > summary .summary-hint { margin-left: auto; color: var(--ink-soft); font-size: 0.82rem; font-weight: 400; }
.section-disclosure[open] { padding-bottom: 1.25rem; }
.note-reader { max-width: 42rem; margin: 0; padding: 0.5rem 0 3rem; }
.note-reader__breadcrumb { display: flex; flex-wrap: wrap; gap: 0.5rem; margin: 0 0 3rem; color: var(--ink-soft); font-size: 0.88rem; }
.note-reader__breadcrumb a { text-decoration: none; }
.contact-editor { max-width: 42rem; margin: 0 auto; }
.contact-editor--wide { max-width: none; margin: 0; }
.contact-editor .action-form { padding: 0; border: 0; }
.contact-editor .form-actions { justify-content: flex-start; align-items: center; flex-wrap: wrap; gap: 1rem; }
.contact-editor .section-disclosure { margin: 0.75rem 0; }
.contact-editor .field-grid > :is(fieldset, p, button, .field:has(textarea)) { grid-column: 1 / -1; }
.contact-editor .field-grid > :is(p, button) { justify-self: start; }
.contact-editor dl.detail-grid { align-items: baseline; }
.intake-phone-offer { display: flex; margin: 0 0 1.25rem; flex-wrap: wrap; align-items: center; gap: 0.5rem 1rem; }
.intake-phone-offer p { margin: 0; }
.profile-section { min-width: 0; margin: 0 0 1.5rem; padding: 0; border: 0; display: grid; gap: 1.25rem; }
.profile-section > legend { padding: 0; margin-bottom: 0.25rem; color: var(--ink); font-size: 1rem; font-weight: 600; }
.profile-section__actions { display: flex; flex-wrap: wrap; gap: 0.75rem; }
.profile-entry { min-width: 0; margin: 0; padding: 0.75rem 1rem 1rem; border: 1px solid var(--rule); border-radius: 0.5rem; display: grid; gap: 1.25rem; }
.profile-entry > legend { padding: 0 0.25rem; color: var(--ink-soft); font-size: 0.85rem; font-weight: 600; }
.profile-entry__actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.25rem 1.5rem; }
.profile-section > .field, .profile-entry > .field { margin-bottom: 0; }
.section-disclosure > .profile-section { margin-bottom: 0; }
.profile-entry__preferred { display: inline-flex; min-height: 2.75rem; align-items: center; gap: 0.5rem; color: var(--ink); font-size: 0.875rem; font-weight: 500; }
.text-action { display: inline-flex; min-height: 2.75rem; padding: 0.5rem 0; align-items: center; border: 0; background: transparent; color: var(--tide-deep); font: inherit; cursor: pointer; text-decoration: underline; text-underline-offset: 0.2em; }
.text-action:focus-visible { outline: 3px solid var(--tide); outline-offset: 2px; }
.text-action[hidden] { display: none; }
.record-notes { display: grid; gap: 0.35rem; margin: 0.75rem 0 0; padding: 0; list-style: none; }
.record-notes__meta { color: var(--ink-soft); font-size: 0.85rem; overflow-wrap: anywhere; }
.record-notes__meta time { font-size: inherit; }
.note-reader__body { font-size: 1rem; line-height: 1.8; white-space: pre-wrap; overflow-wrap: anywhere; }
.note-reader__body p { margin: 0; }
.muted { color: var(--ink-soft); }
.link-row { display: flex; margin: 0.5rem 0; flex-wrap: wrap; align-items: center; gap: 0.25rem 1.5rem; }
.link-row a { display: inline-flex; min-height: 2.75rem; align-items: center; }

.queue-filters, .pagination {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
  margin: 1.5rem 0;
}
.queue-filters a, .pagination a {
  display: inline-flex;
  align-items: center;
  min-height: 2.75rem;
  padding: 0.5rem 0.85rem;
  border-radius: 0.45rem;
  color: var(--ink-soft);
  text-decoration: none;
}
.queue-filters a[aria-current="page"] { color: var(--tide-deep); background: var(--tide-pale); }
.queue-filters a:hover, .pagination a:hover { background: var(--tide-pale); }
.attorney-list { margin: 0 0 0.75rem; padding: 0; list-style: none; }
.attorney-list li { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; padding: 0.25rem 0; }
.list-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem 1.5rem;
  margin: 1.5rem 0;
}
.list-controls .queue-filters { margin: 0; }
.task-optional > summary { min-height: 2.75rem; padding-block: 0.625rem; cursor: pointer; }
.task-optional__body { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr)); gap: 0.75rem 1rem; }
.task-warning { color: var(--amber); }
.status-line { margin: 0 0 1.5rem; padding: 0.75rem 1rem; border-radius: 0.5rem; background: var(--tide-pale); }
.status-line > h3 { margin: 0 0 0.25rem; color: var(--ink-soft); font-size: 0.8rem; font-weight: 600; }
.status-line__headline { margin: 0; }
details.status-line { padding: 0; }
details.status-line > summary { display: flex; padding: 0.75rem 1rem; flex-wrap: wrap; align-items: baseline; gap: 0.25rem 0.75rem; list-style: none; cursor: pointer; }
details.status-line > summary::-webkit-details-marker { display: none; }
.status-line__label { color: var(--ink-soft); font-size: 0.8rem; font-weight: 600; }
details.status-line > .status-line__items { margin: 0; padding: 0 1rem 0.75rem 2.25rem; }
.status-line__items { margin: 0.5rem 0 0; padding-left: 1.25rem; }
.client-preview { padding: 0.75rem 1rem; border: 1px solid var(--rule-strong); border-radius: 0.5rem; background: var(--porcelain); }
.client-preview p { margin: 0 0 0.25rem; }
.client-preview__heading { font-weight: 700; }
.deadlines { margin: 2.5rem 0 0; }
.deadline-form { display: grid; max-width: 40rem; gap: 1.25rem; padding: 1.5rem; border: 1px solid var(--rule); border-radius: 0.75rem; background: var(--porcelain); box-shadow: var(--shadow-card); }
.deadline-form .field { margin-bottom: 0; }
.field-grid--pair { grid-template-columns: repeat(auto-fit, minmax(min(14rem, 100%), 1fr)); gap: 1.25rem; }
.deadline-form__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem; }
.deadline-form__cancel { display: inline-flex; min-height: 2.75rem; align-items: center; padding: 0 1rem; font-weight: 600; }
.deadline-action { margin: 0.75rem 0; }
.deadline-action > summary { display: flex; min-height: 2.75rem; align-items: center; font-weight: 600; cursor: pointer; }
.deadline-action > summary::-webkit-details-marker { display: none; }
.deadline-action > summary::before { content: ""; width: 0.5rem; height: 0.5rem; margin: 0 0.5rem 0 0.25rem; flex: none; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(-45deg); transform-origin: center; }
.deadline-action[open] > summary::before { transform: rotate(45deg); }
.deadline-facts { display: grid; grid-template-columns: max-content 1fr; gap: 0.25rem 1rem; }
.deadline-facts dt { color: var(--ink-soft); }
.deadline-facts dd { margin: 0; }
.matter-table td:first-child { white-space: nowrap; }
.lead-list { padding: 0; margin: 0; list-style: none; }
.lead-list__row {
  margin-bottom: 0.25rem;
}
.lead-list__link {
  display: grid;
  min-height: 4.75rem;
  padding: 0.8rem 1rem;
  gap: 0.2rem 1.25rem;
  align-items: center;
  border-radius: 0.55rem;
  color: var(--ink);
  text-decoration: none;
}
.lead-list__link:hover { background: var(--tide-pale); }
.lead-list__link:focus-visible { outline-offset: -3px; }
.lead-list__identity { min-width: 0; overflow-wrap: anywhere; grid-column: 1 / -1; }
.lead-list__identity strong { font-size: 1rem; font-weight: 650; color: var(--ink); }
.lead-list__facts { display: flex; grid-column: 1 / -1; flex-wrap: wrap; gap: 0.15rem 1.25rem; color: var(--ink); font-size: 0.85rem; }
.lead-list__fact { min-width: 0; overflow-wrap: anywhere; }
.lead-list__label { margin-right: 0.25rem; color: var(--ink-soft); font-weight: 600; }

.app-main {
  width: 100%;
  min-width: 0;
  margin: 0 auto;
  padding: 1.75rem 2.5rem 3rem;
}

.app-main--workspace {
  width: min(100%, 84rem);
}

.page-intro {
  display: flex;
  margin-bottom: 2rem;
  align-items: end;
  justify-content: space-between;
  gap: 2rem;
}

.page-intro__copy {
  max-width: 48rem;
}

.page-intro__actions {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.eyebrow {
  margin: 0 0 0.45rem;
  color: var(--tide);
  font-size: 0.7rem;
  font-weight: 650;
  letter-spacing: 0;
  text-transform: none;
}

h1,
h2,
p {
  margin-top: 0;
}

h1 {
  margin-bottom: 0.5rem;
  font-size: 1.5rem;
  font-weight: 700;
  letter-spacing: -0.015em;
  line-height: 1.25;
}

h2 {
  margin-bottom: 0;
  font-size: 1.05rem;
  font-weight: 750;
  letter-spacing: -0.012em;
}

.lede {
  max-width: 44rem;
  margin-bottom: 0;
  color: var(--ink-soft);
  font-size: 1rem;
}

.panel {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--rule);
  border-radius: 0.75rem;
  background: var(--porcelain);
  box-shadow: var(--shadow-card);
}

form > .panel + .panel {
  margin-top: 1rem;
}

.panel__heading {
  display: flex;
  min-height: 3rem;
  padding: 0.75rem 1.125rem;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  border-bottom: 1px solid var(--tide-mist);
}

.panel__heading h2,
.panel__heading h3 {
  margin: 0;
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0;
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

.table-wrap {
  width: 100%;
  overflow-x: auto;
  border: 1px solid var(--rule);
  border-radius: 0.75rem;
  background: var(--porcelain);
  box-shadow: var(--shadow-card);
}

.panel .table-wrap {
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

table {
  width: 100%;
  border-collapse: collapse;
  background: var(--porcelain);
}

th,
td {
  padding: 0.75rem 1.125rem;
  border-bottom: 1px solid #eef0f3;
  text-align: left;
  vertical-align: middle;
}

th {
  color: var(--ink-soft);
  background: var(--paper);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  white-space: nowrap;
}

td > time { white-space: nowrap; }

tbody tr:last-child td {
  border-bottom: 0;
}

tbody tr:hover {
  background: var(--paper);
}

.data-id,
time {
  font-family: inherit;
  font-size: 0.76rem;
  font-variant-numeric: tabular-nums;
}

.data-id {
  color: var(--ink-soft);
  background: transparent;
  white-space: nowrap;
}

.status-badge,
.category-badge {
  display: inline-flex;
  min-height: 1.4rem;
  padding: 0.125rem 0.5625rem;
  align-items: center;
  border: 1px solid transparent;
  border-radius: 999px;
  color: var(--tide-deep);
  background: var(--tide-pale);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 1.2;
}

.category-badge {
  border-color: var(--rule-strong);
  color: var(--ink-soft);
  background: var(--paper);
}

.empty-state {
  margin: 1rem 1.25rem 1.25rem;
  padding: 1.35rem;
  border: 0;
  border-radius: 0.35rem;
  color: var(--ink-soft);
  background: var(--paper);
}

.empty-state p {
  margin-bottom: 0;
}

.field-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.25rem;
}

.field,
.field--wide {
  display: grid;
  min-width: 0;
  gap: 0.375rem;
  color: var(--ink);
  font-size: 0.8125rem;
  font-weight: 600;
}

.field--wide {
  grid-column: 1 / -1;
}

/* A fieldset used as a field (a radio group) drops the browser's border, padding and margin so
   its legend reads exactly like a sibling field's label. */
fieldset.field {
  min-width: 0;
  padding: 0;
  border: 0;
  margin: 0;
}

fieldset.field > legend {
  padding: 0;
  margin-bottom: 0.375rem;
  color: var(--ink);
  font-size: 0.78rem;
  font-weight: 600;
}

fieldset.field > .radio-options {
  margin-top: 0;
}

/* checkboxField (form-fields.ts) nests its checkbox input inside the label element, the one
   field shape where the label wraps a control rather than sitting beside it: the box and its
   own text sit on one line with a small gap, instead of stacking the way a textField or
   selectField's label and its own separate control do. */
.field > label:has(input[type="checkbox"]) {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

input,
select {
  width: 100%;
  min-height: 2.75rem;
  padding: 0.5625rem 0.75rem;
  border: 1px solid var(--rule-strong);
  border-radius: 0.5rem;
  color: var(--ink);
  background: var(--porcelain);
  font-weight: 500;
  outline: none;
}

/* A checkbox or radio is a fixed-size control, never a full-width one: the rule above sizes
   every other input and select, including a checkbox or radio without this override. */
input[type="checkbox"],
input[type="radio"] {
  width: auto;
  min-height: auto;
}

input:hover,
select:hover {
  border-color: var(--ink-soft);
}

input:focus,
select:focus {
  border-color: var(--tide);
  box-shadow: 0 0 0 3px rgba(14, 90, 107, 0.18);
}

.form-actions {
  display: flex;
  margin-top: 1rem;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.75rem;
}

.primary-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  min-height: 2.75rem;
  padding: 0.5rem 0.875rem;
  border: 1px solid var(--tide);
  border-radius: 0.5rem;
  color: #ffffff;
  background: var(--tide);
  box-shadow: var(--shadow-action);
  font-weight: 600;
}

.primary-action:hover {
  border-color: var(--tide-deep);
  background: var(--tide-deep);
}

.notice {
  margin: 0 0 1.25rem;
  padding: 0.85rem 1rem;
  border: 1px solid #b6dcc7;
  border-radius: 0.5rem;
  color: var(--green);
  background: var(--green-pale);
  font-weight: 600;
}

.notice--denied,
.notice--invalid_request {
  border-color: #f1b8b2;
  color: var(--red);
  background: var(--red-pale);
}

.notice--conflict {
  border-color: #ecd0a0;
  color: var(--amber);
  background: var(--amber-pale);
}

.nav-link:focus-visible,
.nav-action:focus-visible,
.primary-action:focus-visible,
a:focus-visible {
  border-radius: 0.2rem;
  outline: 3px solid var(--tide);
  outline-offset: 2px;
}

.row-action {
  min-height: 2.75rem;
  padding: 0.4rem 0.65rem;
  border: 1px solid var(--rule-strong);
  border-radius: 0.28rem;
  color: var(--ink);
  background: var(--porcelain);
  font-size: 0.76rem;
  font-weight: 600;
  white-space: nowrap;
}

.row-action:hover {
  border-color: var(--tide);
  color: var(--tide-deep);
  background: var(--tide-pale);
}

.row-action--danger {
  border-color: #f1b8b2;
  color: var(--red);
}

.row-action--danger:hover {
  border-color: var(--red);
  color: #ffffff;
  background: var(--red);
}

.row-action--go {
  border-color: var(--rule-strong);
  color: var(--tide-deep);
  background: var(--tide-pale);
}

.row-action--go:hover {
  color: #ffffff;
  background: var(--tide);
}

.row-action:focus-visible {
  border-radius: 0.2rem;
  outline: 3px solid var(--tide);
  outline-offset: 2px;
}

/* An in-row expander holding the one or two fields an action needs (change email, reissue). */
details.row-form {
  display: inline-block;
}

details.row-form > summary {
  display: inline-flex;
  min-height: 2.75rem;
  padding: 0.4rem 0.65rem;
  align-items: center;
  border: 1px solid var(--rule-strong);
  border-radius: 0.28rem;
  background: var(--porcelain);
  font-size: 0.76rem;
  font-weight: 600;
  list-style: none;
  cursor: pointer;
  white-space: nowrap;
}

details.row-form > summary::-webkit-details-marker {
  display: none;
}

details.row-form > summary:hover {
  border-color: var(--tide);
  color: var(--tide-deep);
  background: var(--tide-pale);
}

details.row-form[open] > summary {
  border-color: var(--tide);
  color: var(--tide-deep);
  background: var(--tide-pale);
}

details.row-form > summary:focus-visible {
  outline: 3px solid var(--tide);
  outline-offset: 2px;
}

.row-form__body {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: 0.5rem;
  margin-top: 0.5rem;
  padding: 0.7rem;
  border: 1px solid var(--rule);
  border-radius: 0.3rem;
  background: var(--paper);
  white-space: normal;
}

.row-form__body label {
  display: grid;
  gap: 0.25rem;
  font-size: 0.72rem;
  font-weight: 600;
}

.row-form__body input,
.row-form__body select {
  min-height: 2.2rem;
  min-width: 12rem;
  padding: 0.4rem 0.55rem;
  font-size: 0.82rem;
}

.row-form__body button {
  min-height: 2.2rem;
  padding: 0.4rem 0.8rem;
  font-size: 0.78rem;
}

/* The Access page: a heading naming the firm, its actions, link tabs, and one list. The heading
   is a wrapping row; an open disclosure in it takes a full-width line of its own below the
   others, so its body pushes the page down rather than covering it. */
.access-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 0.5rem 0.75rem;
  margin-bottom: 1.25rem;
}

.access-head h1 {
  min-height: 2.75rem;
  margin: 0;
  overflow-wrap: anywhere;
}

.access-head__firm {
  color: var(--ink-soft);
  font-weight: 500;
}

.access-head__gap {
  flex: 1 1 0;
}

.access-head > details {
  min-width: 0;
  max-width: 100%;
}

.access-head > details[open] {
  order: 1;
  flex-basis: 100%;
}

details.access-head__change > summary {
  display: inline-flex;
  min-height: 2.75rem;
  align-items: center;
  color: var(--tide);
  font-weight: 650;
  list-style: none;
  cursor: pointer;
}

details.access-head__change > summary::-webkit-details-marker {
  display: none;
}

details.access-head__change > summary:focus-visible {
  outline: 3px solid var(--tide);
  outline-offset: 2px;
}

.access-head__panel {
  margin-top: 0.5rem;
  padding: 0.75rem 1rem;
  border: 1px solid var(--rule);
  border-radius: 0.75rem;
  background: var(--porcelain);
  box-shadow: var(--shadow-card);
}

details.access-action > summary {
  display: inline-flex;
  min-height: 2.75rem;
  padding: 0.5rem 0.875rem;
  align-items: center;
  gap: 0.5rem;
  border: 1px solid var(--tide);
  border-radius: 0.5rem;
  color: #ffffff;
  background: var(--tide);
  font-weight: 600;
  list-style: none;
  cursor: pointer;
  white-space: nowrap;
}

details.access-action > summary::-webkit-details-marker {
  display: none;
}

details.access-action > summary::before {
  content: "+";
  font-size: 1.15rem;
  line-height: 1;
}

details.access-action[open] > summary::before {
  content: "\2212";
}

details.access-action > summary:hover {
  background: var(--tide-deep);
}

details.access-action > summary:focus-visible {
  outline: 3px solid var(--tide);
  outline-offset: 2px;
}

details.access-action--quiet > summary {
  color: var(--tide-deep);
  background: var(--porcelain);
}

details.access-action--quiet > summary:hover {
  color: #ffffff;
}

.access-action__form {
  margin-top: 1rem;
  padding: 1.25rem;
  border: 1px solid var(--rule);
  border-radius: 0.75rem;
  background: var(--porcelain);
  box-shadow: var(--shadow-card);
}

.access-tabs {
  display: flex;
  margin: 0 0 1.25rem;
  gap: 1.75rem;
  overflow-x: auto;
  overflow-y: hidden;
  border-bottom: 1px solid var(--rule);
}

.access-tabs a {
  display: inline-flex;
  min-height: 2.75rem;
  margin-bottom: -1px;
  padding: 0.6rem 0.15rem;
  align-items: center;
  border-bottom: 2px solid transparent;
  color: var(--ink-soft);
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
}

.access-tabs a:hover {
  color: var(--tide-deep);
}

.access-tabs a[aria-current="page"] {
  border-bottom-color: var(--tide);
  color: var(--ink);
  font-weight: 700;
}

/* The Firms tab: a link action beside the heading, the firm list, a firm's page and its form. */
.access-head__action {
  position: absolute;
  top: 0;
  right: 0;
}

.firm-badges { display: inline-flex; flex-wrap: wrap; gap: 0.375rem; }
.firm-table__name { font-weight: 600; }
.firm-page { display: flex; max-width: 47.5rem; flex-direction: column; gap: 1.5rem; }
.firm-page > .back-nav { margin-bottom: -1.125rem; }
.firm-head { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem; }
.firm-head h1 { margin: 0; }
.firm-head__edit { margin-left: auto; }
.firm-activation h2, .firm-details h2 { margin: 0; font-size: 1rem; font-weight: 650; }
.firm-details h2 { margin-bottom: 0.5rem; }
.firm-checks { margin: 0; padding: 0; list-style: none; }
.firm-check { display: flex; flex-wrap: wrap; gap: 0.25rem 1rem; padding: 0.625rem 0; border-bottom: 1px solid var(--rule); }
.firm-check:last-child { border-bottom: 0; }
.firm-check__label { flex: 1 1 12.5rem; }
.firm-check__value { color: var(--ink-soft); }
.firm-check__state { flex: 0 0 7.5rem; font-weight: 600; }
.firm-check__state--ok { color: var(--green); }
.firm-check__state--missing { color: var(--red); }
.firm-actions { display: flex; flex-wrap: wrap; gap: 0.625rem; }
.firm-actions form { margin: 0; }
.firm-actions .primary-action:disabled { border-color: var(--rule-strong); color: var(--ink-soft); background: var(--rule); box-shadow: none; cursor: not-allowed; }
.firm-disclosure > .table-wrap, .firm-disclosure > form { margin-top: 0.625rem; }
.firm-page .numeric { text-align: right; font-variant-numeric: tabular-nums; }
.firm-form { display: flex; max-width: 35rem; flex-direction: column; gap: 1.125rem; }
.firm-form h1 { margin: 0; }
.firm-form .back-nav { margin-bottom: -0.75rem; }
.firm-form .field { margin-bottom: 0; }
.firm-form input[readonly] { color: var(--ink-soft); background: var(--paper); }
.firm-form__pair { display: grid; }
.firm-form__actions { justify-content: flex-start; margin-top: 0; }

.access-list {
  overflow: hidden;
  border: 1px solid var(--rule);
  border-radius: 0.75rem;
  background: var(--porcelain);
  box-shadow: var(--shadow-card);
}

.access-list__head,
.access-row__summary,
.screen-row {
  display: grid;
  grid-template-columns: minmax(0, 4fr) minmax(0, 5fr) 6.5rem;
  gap: 1rem;
  align-items: center;
  padding: 0.85rem 1.25rem;
}

.access-list--screens .access-list__head,
.screen-row {
  grid-template-columns: minmax(0, 3fr) minmax(0, 2fr) minmax(0, 3fr) 6.5rem;
}

.access-list__head {
  padding-top: 0.6rem;
  padding-bottom: 0.6rem;
  color: var(--ink-soft);
  background: var(--paper);
  font-size: 0.72rem;
  font-weight: 650;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.access-row,
.screen-row {
  border-top: 1px solid var(--rule);
}

.access-list--firm > :first-child {
  border-top: 0;
}

.access-list__group {
  margin: 0;
  padding: 0.6rem 1.25rem;
  border-top: 1px solid var(--rule);
  color: var(--ink-soft);
  background: var(--paper);
  font-size: 0.72rem;
  font-weight: 650;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.access-waiting {
  margin-bottom: 1rem;
  overflow: hidden;
  border: 1px solid #ecd0a0;
  border-radius: 0.75rem;
  background: var(--porcelain);
  box-shadow: var(--shadow-card);
}

.access-waiting__heading {
  margin: 0;
  padding: 0.6rem 1.25rem 0.2rem;
  color: var(--amber);
  background: var(--amber-pale);
  font-size: 0.72rem;
  font-weight: 650;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.access-waiting__note {
  margin: 0;
  padding: 0 1.25rem 0.6rem;
  color: var(--ink-soft);
  background: var(--amber-pale);
  font-size: 0.82rem;
}

/* An invited row spans the full width. Its Extend and Fix… controls follow it, stacked below; on wider screens they
   sit at the top right on the summary line, which keeps room for them. An open Fix… returns them to the flow below
   the row, so its form never covers the row or its panel. */
.access-invite {
  position: relative;
  border-top: 1px solid var(--rule);
}

.access-invite > .access-row {
  border-top: 0;
}

.access-invite__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 0.5rem;
  padding: 0 1.25rem 0.85rem;
}

.access-invite__actions form {
  margin: 0;
}

.access-invite__actions > details[open] {
  flex: 1 1 auto;
  min-width: 0;
}

@media not all and (max-width: 46rem) {
  .access-invite > .access-row > .access-row__summary {
    padding-right: 13.5rem;
  }

  .access-invite__actions {
    position: absolute;
    top: 0.85rem;
    right: 1.25rem;
    flex-wrap: nowrap;
    padding: 0;
  }

  .access-invite:has(> .access-invite__actions > details[open]) > .access-invite__actions {
    position: static;
    flex-wrap: wrap;
    padding: 0 1.25rem 0.85rem;
  }
}

.access-row__expiry {
  color: var(--ink-soft);
}

.access-row--static > .access-row__summary {
  cursor: default;
}

.access-row--static > .access-row__summary:hover {
  background: none;
}

.access-row__summary {
  list-style: none;
  cursor: pointer;
}

.access-row__summary::-webkit-details-marker {
  display: none;
}

.access-row__summary:hover,
.access-row[open] > .access-row__summary {
  background: var(--paper);
}

.access-row__summary:focus-visible {
  outline: 3px solid var(--tide);
  outline-offset: -3px;
}

.access-row--marked > .access-row__summary {
  background: var(--green-pale);
  box-shadow: inset 3px 0 0 var(--green);
}

.access-row__person {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 0.1rem;
}

.access-row__who {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
}

.access-row__name {
  font-weight: 650;
  overflow-wrap: anywhere;
}

.access-row__you {
  color: var(--ink-soft);
  font-weight: 400;
}

.access-row__email {
  color: var(--ink-soft);
  font-size: 0.82rem;
  overflow-wrap: anywhere;
}

.access-row__detail {
  display: flex;
  min-width: 0;
  flex-wrap: wrap;
  gap: 0.4rem;
}

.access-row__none {
  color: var(--ink-soft);
}

.access-row__manage {
  display: inline-flex;
  justify-self: end;
  align-items: center;
  gap: 0.4rem;
  color: var(--tide);
  font-size: 0.88rem;
  font-weight: 650;
}

.access-row__manage::after {
  content: "";
  width: 0.45rem;
  height: 0.45rem;
  border-right: 1.6px solid currentColor;
  border-bottom: 1.6px solid currentColor;
  transform: rotate(-45deg);
}

.access-row[open] .access-row__manage::after {
  transform: rotate(45deg);
}

.chip {
  display: inline-flex;
  padding: 0.15rem 0.55rem;
  align-items: center;
  gap: 0.3rem;
  border: 1px solid transparent;
  border-radius: 0.35rem;
  font-size: 0.8rem;
  font-weight: 600;
  white-space: nowrap;
}

.chip--role {
  color: var(--tide-deep);
  background: var(--tide-pale);
}

.chip--admin {
  border-color: var(--rule);
  color: var(--ink);
  background: var(--porcelain);
  font-weight: 500;
}

.chip__icon {
  flex: none;
  color: var(--ink-soft);
}

.access-panel {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.75rem;
  padding: 1.1rem 1.25rem 1.4rem;
  border-top: 1px dashed var(--rule);
  background: var(--paper);
}

.access-panel__part {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 0.6rem;
}

.access-panel__part:only-child {
  grid-column: 1 / -1;
}

.access-panel__part--wide {
  grid-column: 1 / -1;
}

.access-panel--self {
  margin-bottom: 1.25rem;
  border: 1px solid var(--rule);
}

.professional-details-form {
  display: grid;
  gap: 1rem;
}

.field-grid--name {
  grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 2fr);
}

.access-panel__heading {
  margin: 0;
  color: var(--ink-soft);
  font-size: 0.72rem;
  font-weight: 650;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.access-panel__fields,
.access-panel__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 0.5rem;
}

.access-panel form,
.access-list form {
  margin: 0;
}

.switches {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.5rem;
}

.switch {
  display: flex;
  width: 100%;
  min-height: 3rem;
  padding: 0.6rem 0.75rem;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  border: 1px solid var(--rule);
  border-radius: 0.5rem;
  color: var(--ink);
  background: var(--porcelain);
  font-size: 0.88rem;
  font-weight: 600;
  text-align: left;
}

.switch:hover:not(:disabled) {
  border-color: var(--tide);
}

.switch:focus-visible {
  outline: 3px solid var(--tide);
  outline-offset: 2px;
}

.switch:disabled {
  color: var(--ink-soft);
  cursor: default;
}

.switch__track {
  position: relative;
  width: 2.25rem;
  height: 1.25rem;
  flex: none;
  border-radius: 999px;
  background: var(--rule-strong);
}

.switch__track::after {
  content: "";
  position: absolute;
  top: 0.125rem;
  left: 0.125rem;
  width: 1rem;
  height: 1rem;
  border-radius: 50%;
  background: #ffffff;
}

.switch[aria-pressed="true"] .switch__track {
  background: var(--tide);
}

.switch[aria-pressed="true"] .switch__track::after {
  left: 1.125rem;
}

.switch:disabled .switch__track {
  opacity: 0.55;
}

.switches--stack {
  grid-template-columns: minmax(0, 1fr);
}

.chip--firm {
  color: var(--ink);
  background: var(--paper);
  font-weight: 500;
}

/* A row's one disclosure for everything but the selected firm's roles and the person-wide authorities. */
details.access-panel__more {
  grid-column: 1 / -1;
  padding-top: 0.9rem;
  border-top: 1px solid var(--rule);
}

details.access-panel__more > summary {
  display: inline-flex;
  min-height: 2.75rem;
  padding: 0.4rem 0.75rem;
  align-items: center;
  border: 1px solid var(--rule-strong);
  border-radius: 0.375rem;
  background: var(--porcelain);
  font-size: 0.85rem;
  font-weight: 600;
  list-style: none;
  cursor: pointer;
}

details.access-panel__more > summary::-webkit-details-marker {
  display: none;
}

details.access-panel__more > summary:hover,
details.access-panel__more[open] > summary {
  border-color: var(--tide);
  color: var(--tide-deep);
}

details.access-panel__more > summary:focus-visible {
  outline: 3px solid var(--tide);
  outline-offset: 2px;
}

.access-panel__more-body {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.75rem;
  padding-top: 1rem;
}

.access-holders {
  display: flex;
  margin: 0;
  padding: 0;
  flex-direction: column;
  gap: 0.5rem;
  list-style: none;
}

.access-holders li {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}

details.access-more {
  margin-left: auto;
}

details.access-more > summary {
  display: inline-flex;
  min-height: 2.75rem;
  padding: 0.4rem 0.25rem;
  align-items: center;
  color: var(--red);
  font-size: 0.85rem;
  font-weight: 650;
  list-style: none;
  cursor: pointer;
}

details.access-more > summary::-webkit-details-marker {
  display: none;
}

details.access-more > summary:focus-visible {
  outline: 3px solid var(--tide);
  outline-offset: 2px;
}

.access-more__body {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.5rem;
  padding-top: 0.4rem;
}

.access-counts {
  flex-basis: 100%;
  margin: 0;
  color: var(--ink-soft);
  font-size: 0.85rem;
}

.access-departure {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.85rem;
}

.access-departure > details.access-more {
  margin-left: 0;
}

.access-list__more {
  display: block;
  padding: 0.75rem 1.25rem;
  border-top: 1px solid var(--rule);
  color: var(--ink-soft);
  background: var(--paper);
  font-size: 0.85rem;
  text-decoration: none;
}

.access-list__more:hover {
  color: var(--tide-deep);
  text-decoration: underline;
}

.screen-row__matter {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 0.15rem;
}

.screen-row__matter .data-id {
  white-space: normal;
  overflow-wrap: anywhere;
}

.screen-row__reason,
.screen-row__lifted {
  color: var(--ink-soft);
  font-size: 0.82rem;
}

.screen-row__lifted {
  display: block;
}

.screen-row__cell {
  min-width: 0;
  overflow-wrap: anywhere;
}

.screen-row__action {
  justify-self: end;
  text-align: right;
}

/* A screen row's column names, read by assistive technology on a wide screen, where the list
   head shows them, and shown above each value on a narrow one, where it does not. */
.access-cell__label {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

@media (max-width: 46rem) {
  .access-list__head {
    display: none;
  }

  .access-list > .access-list__head + .access-row,
  .access-list > .access-list__head + .screen-row {
    border-top: 0;
  }

  .access-row__summary {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.5rem 1rem;
    padding: 0.85rem 1rem;
  }

  .access-row__manage {
    grid-row: 1;
    grid-column: 2;
  }

  .access-row__detail {
    grid-column: 1 / -1;
  }

  .access-invite__actions {
    padding: 0 1rem 0.85rem;
  }

  .access-panel,
  .access-panel__more-body,
  .switches {
    grid-template-columns: minmax(0, 1fr);
  }

  .access-panel {
    padding: 1rem;
  }

  .screen-row {
    grid-template-columns: minmax(0, 1fr);
    gap: 0.5rem;
    padding: 0.85rem 1rem;
  }

  .screen-row__action {
    justify-self: start;
    text-align: left;
  }

  .access-cell__label {
    position: static;
    display: block;
    width: auto;
    height: auto;
    overflow: visible;
    clip-path: none;
    color: var(--ink-soft);
    font-size: 0.72rem;
    font-weight: 650;
    letter-spacing: 0.04em;
    text-transform: uppercase;
  }

  details.access-more {
    margin-left: 0;
  }

  .access-more__body {
    justify-content: flex-start;
  }
}

/* Standalone control forms, collapsed by default. */
details.control-disclosure {
  border: 1px solid var(--rule);
  border-radius: 0.4rem;
  background: var(--porcelain);
}

details.control-disclosure > summary {
  display: flex;
  min-height: 3.25rem;
  padding: 0.85rem 1.25rem;
  align-items: center;
  gap: 0.6rem;
  font-weight: 750;
  list-style: none;
  cursor: pointer;
}

details.control-disclosure > summary::-webkit-details-marker {
  display: none;
}

details.control-disclosure > summary::before {
  content: "";
  width: 0.5rem;
  height: 0.5rem;
  margin: 0 0.25rem;
  flex: none;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(-45deg);
  transform-origin: center;
}

details.control-disclosure[open] > summary::before {
  transform: rotate(45deg);
}

details.control-disclosure[open] > summary {
  border-bottom: 1px solid var(--rule);
}

details.control-disclosure > summary:hover {
  color: var(--tide-deep);
}

details.control-disclosure > summary:focus-visible {
  outline: 3px solid var(--tide);
  outline-offset: -3px;
}

details.control-disclosure form {
  padding: 1rem 1.25rem 1.25rem;
}

.summary-hint {
  margin-left: auto;
  color: var(--ink-soft);
  font-size: 0.78rem;
  font-weight: 500;
}

/* A finding: something true that somebody should act on. */
.finding {
  margin: 0 0 1rem;
  padding: 0.75rem 1rem;
  border: 1px solid #ecd0a0;
  border-radius: 0.5rem;
  background: var(--amber-pale);
  color: var(--amber);
  font-size: 0.88rem;
  font-weight: 600;
}

.finding b {
  font-weight: 650;
}

.notice p {
  margin: 0;
}

#inputs-changed { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 0.25rem 1rem; }
#inputs-changed > p { grid-column: 1; }
#inputs-changed > details { grid-column: 1; font-weight: 500; }
#inputs-changed > .action-form { grid-column: 2; grid-row: 1 / span 2; }

.notice .notice-detail {
  margin-top: 0.3rem;
  font-size: 0.82rem;
  font-weight: 500;
  opacity: 0.9;
}

.status-badge--active {
  border-color: #b6dcc7;
  color: var(--green);
  background: var(--green-pale);
}

.status-badge--invited,
.status-badge--expired {
  border-color: #ecd0a0;
  color: var(--amber);
  background: var(--amber-pale);
}

.status-badge--disabled {
  border-color: #f1b8b2;
  color: var(--red);
  background: var(--red-pale);
}

.status-badge--retired {
  border-color: var(--rule-strong);
  color: var(--ink-soft);
  background: var(--paper);
}

/* Small inline timing/status text in a cell. */
.cell-note {
  display: block;
  color: var(--ink-soft);
  font-size: 0.76rem;
}

/* A page's restricted-access note: what the reader's permissions leave out. */
.restricted-note {
  margin: 0 0 1.5rem;
  padding: 0.9rem 1.1rem;
  border-radius: 0.5rem;
  background: var(--tide-pale);
  color: var(--ink-soft);
  font-size: 0.88rem;
}

@media (max-width: 46rem) {
  .page-intro {
    display: block;
  }

  /* A flex-container child (desktop) blockifies on its own; once .page-intro drops to
     block here, .primary-action reverts to its default inline display, and an inline
     element ignores min-height/padding, so it lands short of where its own box implies
     and overlaps the paragraph above it. Stated explicitly so it flows below the lede
     with its own spacing instead. */
  .page-intro .primary-action {
    display: inline-block;
    margin-top: 1rem;
  }

  .page-intro__actions {
    margin-top: 1rem;
  }

  .page-intro .page-intro__actions .primary-action {
    margin-top: 0;
  }

  h1 {
    font-size: 1.5rem;
  }

  .field-grid {
    grid-template-columns: 1fr;
  }

  .field--wide {
    grid-column: auto;
  }

  table {
    min-width: 43rem;
  }

  .panel__heading,
  th,
  td {
    padding-right: 1rem;
    padding-left: 1rem;
  }
}

/* Form validation: a summary at the top of the form, and one static message beside each
   offending field. */
.error-summary {
  margin: 0 0 1.25rem;
  padding: 0.85rem 1rem;
  border: 1px solid #f1b8b2;
  border-radius: 0.5rem;
  background: var(--red-pale);
  color: var(--red);
}

.error-summary p {
  margin: 0 0 0.4rem;
  font-weight: 750;
}

.error-summary ul {
  margin: 0;
  padding-left: 1.2rem;
}

.field-hint {
  margin: 0.25rem 0 0.5rem;
  color: var(--ink-soft);
  font-size: 0.8rem;
}

.invite-lifetime {
  display: flex;
  grid-column: 1 / -1;
  align-items: center;
  gap: 0.5rem;
  color: var(--ink-soft);
  font-size: 0.85rem;
}

.invite-lifetime select {
  width: auto;
  font-size: 0.85rem;
}

details.field-disclosure > summary {
  display: inline-flex;
  min-height: 2.75rem;
  align-items: center;
  color: var(--tide-deep);
  font-size: 0.85rem;
  font-weight: 650;
  cursor: pointer;
}

details.field-disclosure > summary:focus-visible {
  outline: 3px solid var(--tide);
  outline-offset: 2px;
}

.field-disclosure__body {
  display: flex;
  margin: 0;
  flex-direction: column;
  gap: 0.35rem;
}

.field-disclosure__body dt {
  font-weight: 650;
}

.field-disclosure__body dd {
  margin: 0 0 0.35rem;
  color: var(--ink-soft);
  font-size: 0.85rem;
}

.field-error {
  display: block;
  margin-top: 0.2rem;
  color: var(--red);
  font-size: 0.78rem;
  font-weight: 650;
}

.field--invalid input,
.field--invalid select,
.field--invalid textarea {
  border-color: var(--red);
}

textarea {
  width: 100%;
  padding: 0.5625rem 0.75rem;
  border: 1px solid var(--rule-strong);
  border-radius: 0.5rem;
  color: var(--ink);
  background: var(--porcelain);
  font: inherit;
  resize: vertical;
}

textarea:focus {
  border-color: var(--tide);
  box-shadow: 0 0 0 3px rgba(14, 90, 107, 0.18);
}

/* A dictated textarea: the box anchors the round microphone button in its bottom-right corner,
   left of the textarea's own resize handle, and the bottom padding keeps text from sitting under it. */
.dictate-box {
  position: relative;
}

.dictate-box textarea {
  display: block;
  padding-bottom: 3.4rem;
}

/* A dictated rich editor: the box wraps the editing surface, and the pending partial transcript
   shows in the surface as muted italic text that is not part of the document. */
.dictate-box .prose-writing {
  padding-bottom: 3.4rem;
}

.dictation-pending {
  color: var(--ink-soft);
  font-style: italic;
  white-space: pre-wrap;
}

.dictate-button {
  position: absolute;
  right: 1.25rem;
  bottom: 0.4rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.75rem;
  height: 2.75rem;
  padding: 0;
  border: 1px solid var(--rule-strong);
  border-radius: 50%;
  color: var(--ink);
  background: var(--porcelain);
  cursor: pointer;
}

.dictate-button:hover {
  border-color: var(--tide);
  color: var(--tide-deep);
  background: var(--tide-pale);
}

.dictate-button svg {
  width: 1.4rem;
  height: 1.4rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Pressed means dictating: a filled button showing a stop square instead of the microphone, so
   the state does not rest on colour alone. */
.dictate-button[aria-pressed="true"] {
  border-color: var(--tide-deep);
  color: var(--porcelain);
  background: var(--tide-deep);
}

.dictate-button[aria-pressed="true"] svg {
  fill: currentColor;
}

.dictate-button:disabled {
  opacity: 0.55;
  cursor: default;
}

/* One question, as a fieldset of radio options -- the phone-entry form's own accessible
   grouping (a <legend> names the question; each option is a labeled radio). */
.question-set {
  display: grid;
  gap: 1.5rem;
}

.question-fieldset {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.question-fieldset legend {
  padding: 0;
  font-weight: 750;
}

@supports selector(:has(*)) {
  .question-fieldset--conditional:not(.field--invalid) { display: none; }
  .question-set:has(input[name="q_claim_status"][value="denied"]:checked) .question-fieldset--conditional { display: block; }
}

.data-panel > .section-disclosure {
  padding: 0 1.25rem;
  border-bottom: 0;
}

.data-panel > .section-disclosure[open] {
  padding-bottom: 1.25rem;
}

.radio-options {
  display: grid;
  gap: 0.5rem;
  margin-top: 0.5rem;
}

.radio-option {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
  font-weight: 500;
}

.radio-option input {
  width: auto;
  min-height: auto;
}

/* A secondary action alongside a primary one (e.g. a form the caller may or may not submit). */
.secondary-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  min-height: 2.75rem;
  padding: 0.5rem 0.875rem;
  border: 1px solid var(--rule-strong);
  border-radius: 0.5rem;
  color: var(--ink);
  background: var(--porcelain);
  font-weight: 500;
}

.secondary-action:hover {
  border-color: var(--rule-strong);
  color: var(--ink);
  background: var(--paper);
}

/* One small self-contained form (a row's own action, e.g. "Show note" or "Show contact
   details" on a matter page). */
.action-form {
  min-width: 0;
}

.action-form .field {
  margin-bottom: 1.25rem;
}

.action-form .field:last-child {
  margin-bottom: 0;
}

.action-form .field:has(+ .form-actions) {
  margin-bottom: 0.25rem;
}

/* A container that already spaces its fields with a gap must not add the field margin on top. */
.action-form .field-grid > .field,
.action-form .field-grid > .field--wide {
  margin-bottom: 0;
}

/* A panel section's own body padding, for a section with no table or form to carry padding
   of its own (a definition list, or a plain wrapping div around a sub-section) and whose
   content sits flush against every edge otherwise. It is not an inline style: the CSP
   forbids style-src-attr, so any per-element spacing lives here instead. */
.panel__body--loose {
  padding: 1.25rem;
}

/* A static refusal, not-found, or conflict page: one centered panel, no table, no form. */
.static-page {
  max-width: 34rem;
  margin: 0 auto;
  padding: 2rem;
  border: 1px solid var(--rule);
  border-radius: 0.75rem;
  background: var(--porcelain);
  box-shadow: var(--shadow-card);
  text-align: left;
}

.static-page h1 {
  font-size: 1.5rem;
}

.static-page .back-link {
  display: inline-block;
  margin-top: 1rem;
}

.back-nav {
  margin-bottom: 1.25rem;
}

.back-nav a {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  color: var(--ink-soft);
  font-size: 0.82rem;
  font-weight: 650;
  text-decoration: none;
}

.back-nav a:hover {
  color: var(--tide-deep);
}

.primary-action--danger {
  border-color: var(--red);
  background: var(--red);
}

.primary-action--danger:hover {
  border-color: #912018;
  background: #912018;
}

/* Disposition history: one card per entry, newest first. */
.disposition-card {
  padding: 0.85rem 1rem;
  border: 1px solid var(--rule);
  border-radius: 0.35rem;
  background: var(--porcelain);
}

dl.detail-grid {
  display: grid;
  grid-template-columns: minmax(0, max-content) 1fr;
  gap: 0.4rem 1rem;
  margin: 0;
}

dl.detail-grid dt {
  color: var(--ink-soft);
  font-size: 0.78rem;
  font-weight: 600;
}

dl.detail-grid dd {
  margin: 0;
}

/* Placed after the rule above so it wins at an equal selector weight (cascade order, not
   specificity, decides between two rules of the same weight): a long question label
   otherwise wraps within an unchanged max-content column that is still wide enough to push
   the value column off a narrow viewport. Below this breakpoint the label stacks over
   its value instead. */
@media (max-width: 46rem) {
  dl.detail-grid {
    grid-template-columns: 1fr;
  }
}

/* Record sections use whitespace and rules; secondary work stays in disclosures. */

.matter-header {
  position: relative;
  display: flex;
  margin-bottom: 1.75rem;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1.5rem;
}

/* Below about 24rem of copy beside the actions, the actions move to their own row. */
.matter-header > .page-intro__copy { min-width: 0; flex: 1 1 24rem; }

.matter-header .lede { font-size: 0.9rem; }
/* The actions keep their width and every label stays on one line, so the copy beside them is what
   wraps. A line too narrow for every action moves whole actions to a second row. */
.matter-header__actions { display: flex; max-width: 100%; margin-left: auto; flex: none; flex-wrap: wrap; align-items: center; gap: 0.5rem; }
.matter-header__actions > .primary-action, .matter-header__actions > .secondary-action { white-space: nowrap; }

.matter-page { margin: 0 auto; }

.matter-needed { margin: 0 0 1.75rem; padding: 1rem 1.25rem; border-radius: 0.65rem; background: var(--tide-pale); }
.matter-needed > h2 { margin: 0; }
.matter-needed__list { margin: 0; padding: 0.35rem 0 0; list-style: none; }
.matter-needed__row + .matter-needed__row { margin-top: 0.35rem; }
.matter-needed__item { display: flex; min-height: 3.5rem; padding: 0.5rem 0; flex-wrap: wrap; align-items: center; gap: 0.35rem 1rem; }
details.matter-needed__item { display: block; padding: 0; }
details.matter-needed__item > summary { display: flex; min-height: 3.5rem; padding: 0.5rem 0; align-items: center; gap: 0.35rem 1rem; list-style: none; cursor: pointer; }
details.matter-needed__item > summary::-webkit-details-marker { display: none; }
.matter-needed__label { color: var(--ink); font-weight: 750; }
.matter-needed__action { display: inline-flex; margin-left: auto; align-items: center; gap: 0.55rem; color: var(--tide-deep); text-decoration: underline; text-underline-offset: 0.2em; }
.matter-needed__actions { display: flex; flex: 1 1 auto; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 0.5rem 0.75rem; }
.verification-mark { width: 1.15rem; height: 1.15rem; flex: none; color: var(--amber); }
.verification-action { display: inline-flex; align-items: center; gap: 0.55rem; }
.verification-action .text-action { min-height: 2.25rem; }
.matter-needed__actions form { margin: 0; }
.matter-needed__suggestion { margin: 0; color: var(--ink-soft); text-align: left; overflow-wrap: anywhere; }
.matter-needed__item:has(.matter-needed__collected) { display: grid; grid-template-columns: minmax(10rem, 14rem) minmax(0, 1fr); align-items: start; gap: 0.35rem 1rem; }
.matter-needed__item:has(.matter-needed__collected) .matter-needed__actions { justify-content: flex-start; }
.matter-needed__collected { display: grid; min-width: 0; gap: 0.5rem; }
.matter-needed__meta { display: flex; margin: 0; flex-wrap: wrap; align-items: center; gap: 0.35rem 0.6rem; }
.matter-needed__pill { display: inline-flex; padding: 0.1rem 0.6rem; border: 1px solid var(--amber); border-radius: 999px; color: var(--amber); background: var(--amber-pale); font-size: 0.8125rem; font-weight: 750; }
.matter-needed__caption { color: var(--ink-soft); font-size: 0.8125rem; }
.matter-needed__buttons { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.75rem; }
.matter-needed__form { padding: 0.25rem 0 1rem; }
.matter-needed__form .action-form { max-width: 42rem; }

/* Matter tabs */

.matter-header__title { display: flex; margin-bottom: 0.35rem; flex-wrap: wrap; align-items: center; gap: 0.35rem 0.75rem; }
.matter-header__title h1 { margin: 0; }
.matter-deadline { display: inline-flex; min-height: 2.75rem; max-width: 100%; padding: 0.5rem 0.875rem; flex-wrap: wrap; align-items: center; gap: 0.25rem 0.625rem; border: 1px solid #b9d9df; border-radius: 0.625rem; color: #0b4a59; background: var(--tide-pale); text-decoration: none; }
.matter-deadline svg { flex: none; }
.matter-deadline__label, .matter-deadline__due { font-size: 0.82rem; font-weight: 600; }
.matter-deadline__what { font-weight: 700; overflow-wrap: anywhere; }
.matter-deadline__due--late { color: var(--red); }
.matter-deadline:hover { border-color: var(--tide); }
.matter-deadline:focus-visible { outline: 3px solid var(--tide); outline-offset: 2px; }
.matter-nav { display: flex; margin: 0 0 1.75rem; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 0.5rem 1.5rem; border-bottom: 1px solid var(--rule); }
/* A record page's header and tab row form one white band across the content column; the page's
   own content follows in a column of at most 70rem. */
.app-main:has(.matter-header) { --main-x: 2.5rem; --main-top: 1.75rem; padding: var(--main-top) var(--main-x) 3rem; }
.app-main:has(.matter-header) > :not(.matter-header, .matter-nav, :has(.matter-header)), .app-main .matter-body__main { max-width: 70rem; }
.app-main .matter-header, .app-main .matter-nav { margin-right: calc(-1 * var(--main-x)); margin-left: calc(-1 * var(--main-x)); padding-right: var(--main-x); padding-left: var(--main-x); background: var(--porcelain); }
.app-main .matter-header { margin-top: calc(-1 * var(--main-top)); margin-bottom: 0; padding-top: 1.25rem; padding-bottom: 0.5rem; }
.app-main .matter-nav { margin-bottom: 2rem; }
@media (max-width: 52rem) {
  .app-main:has(.matter-header) { --main-x: 1.25rem; --main-top: 2rem; }
}
@media (max-width: 46rem) {
  .app-main:has(.matter-header) { --main-x: 1rem; --main-top: 0.5rem; }
}
.matter-tabs { display: flex; min-width: 0; overflow-x: auto; overflow-y: hidden; }
.matter-tabs__list { display: flex; margin: 0; padding: 0; gap: 0.25rem; list-style: none; }
.matter-tabs__list a {
  display: inline-flex;
  min-height: 2.75rem;
  margin-bottom: -1px;
  padding: 0.625rem 0.75rem;
  align-items: center;
  border-bottom: 2px solid transparent;
  color: var(--ink-soft);
  font-weight: 500;
  text-decoration: none;
  white-space: nowrap;
}
.matter-tabs__chip { display: inline-block; margin-left: 0.4rem; padding: 0.125rem 0.5625rem; border-radius: 999px; background: var(--amber-pale); color: var(--amber); font-size: 0.75rem; font-weight: 600; line-height: 1.2; }
.matter-tabs__count { display: inline-block; min-width: 1.25rem; margin-left: 0.4rem; padding: 0.125rem 0.5625rem; border-radius: 999px; background: var(--tide-mist); color: var(--ink-soft); font-size: 0.75rem; font-weight: 600; line-height: 1.2; text-align: center; }
.matter-tabs__list a:hover { color: var(--ink); }
.matter-tabs__list a[aria-current="page"] { border-bottom-color: var(--tide); color: var(--ink); font-weight: 600; }

.matter-work { padding-bottom: 0.45rem; }
.matter-work__list { display: flex; margin: 0; padding: 0; flex-wrap: wrap; gap: 0.5rem; list-style: none; }
.matter-work__link { display: inline-flex; min-height: 2.5rem; padding: 0 0.85rem; align-items: center; gap: 0.45rem; border: 1px solid #e3d3b5; border-radius: 999px; color: #6b5128; background: #fbf6ec; font-size: 0.9rem; font-weight: 600; text-decoration: none; white-space: nowrap; }
.matter-work__link:hover { border-color: #a7834e; color: #4f3b1b; }
.matter-work__link[aria-current="page"] { border-color: #a7834e; color: #4f3b1b; background: #f3e6cc; }
.matter-work__star { display: block; width: 0.85rem; height: 0.85rem; flex: none; color: #a7834e; }
.matter-work__status { color: #6f5a38; font-size: 0.8rem; font-weight: 500; }
.matter-work__status::before { content: "\00b7"; margin-right: 0.45rem; }

.matter-summary__row { display: flex; margin: 0.6rem 0 0; flex-wrap: wrap; align-items: baseline; gap: 0.25rem 1.5rem; font-size: 0.9rem; }
.matter-summary__person { font-weight: 600; }
.matter-summary { display: flex; margin: 0; flex-wrap: wrap; gap: 0.25rem 1.5rem; font-size: 0.9rem; }
.matter-summary div { display: flex; gap: 0.4rem; }
.matter-summary dt { color: var(--ink-soft); font-weight: 600; }
.matter-summary dd { margin: 0; overflow-wrap: anywhere; }

.matter-section {
  padding: 1.25rem 0;
}
.matter-body__main > .matter-section:first-child, .matter-page > .matter-section:first-of-type { padding-top: 0; }
.matter-section > .matter-section__heading:has(+ .cell-note) { margin-bottom: 0.25rem; }
.matter-section.section-disclosure { padding: 0; }
.matter-page .section-disclosure { border-bottom: 0; }
.matter-section.section-disclosure[open] { padding-bottom: 1.25rem; }
.matter-section__heading { display: flex; align-items: baseline; gap: 0.75rem; }
.matter-section__heading h2 { margin: 0; }
.matter-section__heading .summary-hint { color: var(--ink-soft); font-size: 0.85rem; }
.matter-section .empty-state { margin: 1rem 0; padding: 1rem 0; background: none; }

.matter-section > header {
  margin-bottom: 1rem;
}

.matter-section > header p {
  max-width: 44rem;
  margin: 0.3rem 0 0;
  color: var(--ink-soft);
  font-size: 0.86rem;
}

.matter-question-group {
  min-width: 0;
  margin: 1.25rem 0 0;
  padding: 1rem 0 0;
  border: 0;
  border-top: 1px solid var(--rule);
}

.matter-question-group legend {
  padding: 0 0.5rem 0 0;
  color: var(--ink);
  font-size: 0.9rem;
  font-weight: 750;
}

.matter-answer-list {
  display: grid;
  gap: 1.25rem;
}

.matter-answer-record {
  padding-bottom: 1.25rem;
  border-bottom: 1px solid var(--rule);
}

.matter-answer-record > header {
  display: flex;
  margin-bottom: 0.75rem;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
}

.matter-answer-record h4 { margin: 0; font-size: 0.92rem; }
.matter-answer-record header p { margin: 0.2rem 0 0; color: var(--ink-soft); font-size: 0.8rem; }
.matter-answer-record__disclosure { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--rule); }
.matter-answer-record__disclosure > .action-form { padding: 0; border: 0; }
.matter-answer-record__disclosure > .action-form .form-actions { justify-content: flex-start; }
.matter-qualification-answers { margin: 0; }
.matter-qualification-answers dt { color: var(--ink-soft); font-size: 0.8rem; font-weight: 650; }
.matter-qualification-answers dd { margin: 0 0 0.8rem; font-weight: 600; }
.matter-qualification-answers dd:last-child { margin-bottom: 0; }

/* ---------- client conversation (routes/client-conversation.ts) ---------- */

.conversation-call { display: flex; margin: 0 0 1rem; flex-wrap: wrap; align-items: center; gap: 0.5rem 1rem; }
.conversation-call p { margin: 0; font-weight: 650; }
.conversation-call form { margin: 0; }
.conversation-empty { margin: 0 0 1rem; color: var(--ink-soft); }
.conversation-questions { margin: 0 0 1rem; padding-left: 1.75rem; }
.conversation-questions li { padding: 0.35rem 0; }
.conversation-questions__row { display: grid; grid-template-columns: minmax(0, 1fr) 7rem 10rem; align-items: baseline; gap: 0.25rem 1rem; }
.conversation-questions__meta { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.25rem 0.5rem; }
.conversation-questions__actions { display: flex; justify-content: flex-end; align-items: baseline; gap: 0.75rem; }
@media (max-width: 40rem) {
  .conversation-questions__row { grid-template-columns: minmax(0, 1fr) auto; }
  .conversation-questions__actions { grid-column: 1 / -1; justify-content: flex-start; }
}
.conversation-questions__text { min-width: 0; overflow-wrap: anywhere; }
.conversation-questions__status { color: var(--amber); font-size: 0.82rem; font-weight: 650; }
.conversation-questions__suggested { color: var(--ink-soft); font-size: 0.78rem; font-weight: 650; }
.conversation-sources { margin: 0.25rem 0 0; padding-left: 1.25rem; }
.conversation-suggest { max-width: 42rem; margin-bottom: 1rem; padding: 0; border: 0; }
.conversation-suggest .form-actions { justify-content: flex-start; }
.conversation-questions form { margin: 0; }
.conversation-questions__edit { display: flex; min-width: 0; flex-direction: column; gap: 0.4rem; }
.conversation-questions__edit[hidden] { display: none; }
.conversation-questions__input { width: 100%; box-sizing: border-box; margin: -0.3rem 0 0; padding: 0.3rem 0.45rem; border: 0; border-radius: 0.35rem; color: inherit; background: var(--tide-pale); font: inherit; line-height: inherit; resize: none; overflow: hidden; }
.conversation-questions__input:focus { outline: 2px solid var(--tide); outline-offset: 0; }
.conversation-questions__edit-actions { display: flex; align-items: center; gap: 0.75rem; }
.why-popover { width: min(24rem, calc(100vw - 2rem)); margin: 0; padding: 0.85rem 2.25rem 0.85rem 1rem; border: 1px solid var(--rule); border-radius: 0.5rem; color: var(--ink); background: #fff; box-shadow: 0 8px 24px rgba(16, 24, 40, 0.14); font-size: 0.9rem; line-height: 1.5; }
.why-popover p { margin: 0 0 0.4rem; }
.why-popover__title { margin: 0 0 0.35rem; color: var(--ink-soft); font-size: 0.75rem; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; }
.why-popover .conversation-sources { display: grid; gap: 0.35rem; margin: 0.6rem 0 0; padding: 0.6rem 0 0; border-top: 1px solid var(--rule); list-style: none; }
.why-popover__close { position: absolute; top: 0.35rem; right: 0.35rem; width: 2rem; height: 2rem; padding: 0; border: 0; border-radius: 0.3rem; color: var(--ink-soft); background: none; font-size: 1.2rem; line-height: 1; cursor: pointer; }
.why-popover__close:hover { background: var(--tide-pale); }
.why-popover__close:focus-visible { outline: 3px solid var(--tide); outline-offset: 1px; }
@supports (position-area: bottom) {
  .why-popover { position-area: bottom span-left; margin-top: 0.35rem; position-try-fallbacks: flip-block; }
}
.conversation-answered { margin: 0 0 1.25rem; color: var(--ink-soft); }
.conversation-add { max-width: 42rem; margin-bottom: 1rem; padding: 0; border: 0; }
.conversation-add .form-actions { justify-content: flex-start; }
.conversation-start { margin: 0; }
.call-question { margin: 1.25rem 0 1rem; font-size: 1.5rem; line-height: 1.3; overflow-wrap: anywhere; }
.call-question__number { color: var(--ink-soft); }
.call-form { max-width: 42rem; margin-bottom: 1rem; }
.call-form .form-actions { justify-content: flex-start; flex-wrap: wrap; gap: 0.5rem 1rem; }
#call-summary dl.detail-grid { margin-bottom: 1rem; gap: 0.5rem 1.5rem; }
#call-summary dl.detail-grid dt { font-size: 0.9rem; }
.call-form [data-conflict] { margin-bottom: 0.75rem; }
.call-form [data-conflict][hidden] { display: none; }
.call-form [data-conflict] blockquote { margin: 0.5rem 0; font-weight: 400; }
.secondary-action[hidden] { display: none; }
.save-state { min-height: 1.25rem; margin: 0.25rem 0 0.75rem; color: var(--ink-soft); font-size: 0.85rem; }
.rfc-actions { display: flex; margin: 0 0 1.25rem; flex-wrap: wrap; align-items: center; gap: 0.5rem 1rem; }
.attribution-run { margin: 0 0 1rem; }
.attribution { display: inline-block; margin: 0 0 0.35rem; padding: 0.1rem 0.5rem; border-radius: 999px; color: var(--ink-soft); background: var(--tide-pale); font-size: 0.75rem; font-weight: 650; }
.rfc-actions .action-form { margin: 0; }
.rfc-main { padding-top: 0; }
.rfc-main > .notice { margin-bottom: 1.5rem; padding: 0.75rem 1rem; }
.rfc-main > .matter-section__heading + .cell-note { margin: 0 0 1rem; }
.rfc-main > .rfc-limits { margin-bottom: 1.75rem; }
.rfc-main > article + details { margin-top: 2rem; }
.rfc-info-bar { display: flex; margin: 0 0 1.25rem; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 0.5rem 1rem; }
.rfc-info-bar .rfc-actions { margin: 0; }
.rfc-info { min-width: 0; flex: 1 1 24rem; }
.rfc-info > summary, .rfc-sources > summary { display: flex; min-height: 2.75rem; flex-wrap: wrap; align-items: center; gap: 0.25rem 0.5rem; list-style: none; cursor: pointer; }
.rfc-info > summary::-webkit-details-marker, .rfc-sources > summary::-webkit-details-marker { display: none; }
.rfc-info > summary::before, .rfc-sources > summary::before { content: ""; width: 0.5rem; height: 0.5rem; margin: 0 0.25rem; flex: none; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; color: var(--ink-soft); transform: rotate(-45deg); transform-origin: center; }
.rfc-info[open] > summary::before, .rfc-sources[open] > summary::before { transform: rotate(45deg); }
.rfc-info > summary:hover, .rfc-sources > summary:hover { color: var(--tide-deep); }
.rfc-info > summary:focus-visible, .rfc-sources > summary:focus-visible { outline: 3px solid var(--tide); outline-offset: 2px; }
.rfc-info > summary h2, .rfc-sources > summary h2 { margin: 0; font-size: 1.1rem; }
.rfc-info__tag { display: inline-block; padding: 0.1rem 0.55rem; border: 1px solid var(--rule); border-radius: 999px; color: var(--ink-soft); background: var(--paper); font-size: 0.75rem; font-weight: 650; }
.rfc-info__tag--alert { border-color: #ecd0a0; color: var(--amber); background: var(--amber-pale); }
.rfc-info__body { padding: 0.5rem 0 0 1.25rem; }
.rfc-info__body > .notice { margin: 0 0 1rem; padding: 0.75rem 1rem; }
.rfc-editor__form { --rfc-save-bar: 3.75rem; }
.rfc-editor__toolbar { position: sticky; top: 0; z-index: 3; display: flex; box-sizing: border-box; height: var(--rfc-save-bar); margin: 0 0 1rem; align-items: center; gap: 1rem; overflow-x: auto; border-bottom: 1px solid var(--rule); background: var(--porcelain); }
.rfc-editor__toolbar .form-actions { margin: 0; flex-wrap: nowrap; white-space: nowrap; }
.rfc-editor__toolbar .save-state { min-height: 0; margin: 0; white-space: nowrap; }
.rfc-editor__form .prose-toolbar { top: var(--rfc-save-bar); }
.rfc-editor__form .prose-field > .field > label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.compare { margin: 1rem 0; }
.compare__legend { margin: 0 0 0.5rem; color: var(--ink-soft); font-size: 0.85rem; font-weight: 650; }
.compare > p, .compare > ul, .compare > h4, .compare__same > p, .compare__same > ul, .compare__same > h4 { margin: 0 0 0.75rem; overflow-wrap: anywhere; }
.compare ins { background: var(--green-pale); color: inherit; text-decoration: none; }
.compare del { background: var(--red-pale); color: inherit; text-decoration: line-through; }
.compare del + ins { margin-left: 0.25em; }
.compare__same { margin: 0 0 0.75rem; }
.compare__same > summary { cursor: pointer; color: var(--ink-soft); font-size: 0.85rem; }
.compare__same[open] > summary { margin-bottom: 0.5rem; }

.rfc-layout { display: grid; gap: 1.5rem; grid-template-columns: minmax(0, 1fr); align-items: start; }
.rfc-limits { margin: 0 0 1rem; border: 1px solid #ecd0a0; border-radius: 0.5rem; color: var(--amber); background: var(--amber-pale); }
.rfc-limits > summary { display: flex; align-items: center; gap: 0.5rem; min-height: 44px; padding: 0 1rem; cursor: pointer; list-style: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rfc-limits > summary::-webkit-details-marker { display: none; }
.rfc-limits > summary::before { content: "›"; flex: none; width: 0.75rem; font-size: 1.25rem; line-height: 1; text-align: center; transition: transform 0.15s; }
.rfc-limits[open] > summary::before { transform: rotate(90deg); }
.rfc-limits > summary:focus-visible { border-radius: 0.4rem; outline: 3px solid var(--tide); outline-offset: 2px; }
.rfc-limits__groups { display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: 0.75rem 1.5rem; padding: 0 1rem 1rem 2.25rem; }
.rfc-limits h3 { margin: 0 0 0.25rem; font-size: 0.9rem; }
.rfc-limits ul { margin: 0; padding-left: 1.1rem; }
.rfc-limits p { margin: 0; }
.rfc-panel { padding: 1rem; border: 1px solid var(--rule); border-radius: 0.5rem; background: var(--paper); }
.rfc-panel h2 { margin: 0 0 0.5rem; font-size: 1.1rem; }
.rfc-panel h2:focus { outline: none; }
.rfc-panel__back { display: none; margin: 0 0 0.75rem; }
.rfc-panel__item p { margin: 0 0 0.5rem; }
.rfc-panel__item blockquote { margin: 0 0 0.5rem; }
.rfc-panel__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 1rem; }
.rfc-editor__form { max-width: none; }
.rfc-editor__form textarea { width: 100%; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 0.9rem; line-height: 1.6; }
.rfc-editor__discard { margin: 0; }
.rfc-editor__sources ol { padding-left: 1.5rem; }
.rfc-editor__sources button { text-align: left; }
.history-list { margin: 0; padding: 0; list-style: none; }
.history-row { padding: 0.5rem 0; border-bottom: 1px solid var(--rule); }
.version-banner { margin: 0 0 0.5rem; font-weight: 650; }
.badge { padding: 0.1rem 0.5rem; border-radius: 999px; color: var(--tide-deep); background: var(--tide-pale); font-size: 0.8rem; font-weight: 650; }
@media (min-width: 60rem) {
  .rfc-layout { grid-template-columns: minmax(0, 1fr) 22rem; }
  .rfc-panel { position: sticky; top: 1rem; max-height: calc(100vh - 2rem); overflow-y: auto; }
}
@media (max-width: 59.99rem) {
  .rfc-layout .rfc-panel { display: none; }
  .rfc-layout--panel .rfc-main { display: none; }
  .rfc-layout--panel .rfc-panel { display: block; }
  .rfc-layout--panel .rfc-panel__back { display: inline-block; }
}
.call-questions { margin: 0; padding: 0; list-style: none; }
.call-questions a { display: flex; padding: 0.4rem 0.6rem; flex-wrap: wrap; align-items: baseline; gap: 0.1rem 0.75rem; border-radius: 0.3rem; color: var(--ink); text-decoration: none; }
.call-questions a:hover { background: var(--tide-pale); }
.call-questions a[aria-current="true"] { background: var(--tide-pale); font-weight: 700; }
.call-questions__number { flex: none; color: var(--ink-soft); }
.call-questions__text { flex: 1 1 12rem; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.call-questions__status { flex: none; color: var(--ink-soft); font-size: 0.82rem; }
.call-questions__answer { flex: 1 0 100%; min-width: 0; padding-left: 1.5rem; overflow: hidden; color: var(--ink-soft); font-size: 0.85rem; font-weight: 400; text-overflow: ellipsis; white-space: nowrap; }
.client-answers { margin: 0; padding: 0; list-style: none; display: grid; gap: 1rem; }
.client-answers + details { margin-top: 1rem; }
.client-answer { padding-bottom: 1rem; border-bottom: 1px solid var(--rule); }
.client-answer__question { margin: 0 0 0.2rem; font-weight: 700; overflow-wrap: anywhere; }
.client-answer__meta { margin: 0 0 0.35rem; color: var(--ink-soft); font-size: 0.82rem; }
.client-answer__text { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; }

/* Work: client conversation and RFC analysis */

.conversation-card, .rfc-start { display: flex; flex-direction: column; gap: 1.25rem; }
.conversation-card > *, .rfc-start > * { margin-top: 0; margin-bottom: 0; }
.conversation-card h2, .rfc-start h2 { margin: 0; font-size: 1.3rem; }
.conversation-card__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.75rem 1rem; }
.conversation-card__head p { margin: 0.15rem 0 0; }
.conversation-card .conversation-questions, .conversation-card .conversation-answered { margin: 0; }
.conversation-choices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.75rem; align-items: start; }
.conversation-choices .conversation-suggest { margin: 0; }
.conversation-choice { display: flex; flex-direction: column; justify-content: center; gap: 0.2rem; width: 100%; min-height: 5.5rem; padding: 1rem 1.25rem; border: 1px solid var(--rule-strong); border-radius: 0.75rem; color: var(--ink); background: var(--porcelain); font: inherit; text-align: left; cursor: pointer; list-style: none; }
.conversation-choice::-webkit-details-marker { display: none; }
.conversation-choice:hover { border-color: var(--tide); }
.conversation-choice:focus-visible { outline: 3px solid var(--tide); outline-offset: 2px; }
.conversation-choice--primary { border-color: var(--tide-deep); color: #ffffff; background: var(--tide); }
.conversation-choice--primary:hover { background: var(--tide-deep); }
.conversation-choice--primary:disabled { border-color: var(--rule-strong); color: var(--ink-soft); background: var(--paper); cursor: not-allowed; }
.conversation-choice__title { font-size: 1.1rem; font-weight: 750; }
.conversation-choice__hint { font-size: 0.875rem; opacity: 0.85; }
.conversation-write[open] { grid-column: 1 / -1; }
.conversation-write[open] > .conversation-choice { min-height: 0; margin-bottom: 0.75rem; }
.conversation-write .conversation-add, .conversation-add-more .conversation-add { margin-bottom: 0; }
.conversation-more { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 0.25rem 1.5rem; }
.conversation-more .conversation-add-more { flex: 1 1 100%; }
.conversation-add-more > summary { display: inline-flex; min-height: 2.75rem; align-items: center; color: var(--tide-deep); font-weight: 650; cursor: pointer; }
.conversation-add-more[open] > summary { margin-bottom: 0.5rem; }
.conversation-more .conversation-suggest { margin: 0; }
.conversation-start { display: flex; margin: 0; }
@media (max-width: 40rem) { .conversation-choices { grid-template-columns: minmax(0, 1fr); } }

.rfc-inputs { display: flex; flex-direction: column; gap: 0.6rem; }
.rfc-inputs__title { margin: 0; color: var(--ink-soft); font-size: 0.75rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.rfc-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); gap: 0.65rem; }
.rfc-tile { display: flex; flex-direction: column; gap: 0.1rem; padding: 1rem; border: 1px solid var(--rule); border-radius: 0.65rem; color: var(--ink); background: var(--paper); text-decoration: none; }
.rfc-tile:hover { border-color: var(--tide); }
.rfc-tile__count { font-size: 1.75rem; font-weight: 700; line-height: 1.1; }
.rfc-tile__label { font-size: 0.9rem; font-weight: 650; }
.rfc-tile__detail { color: var(--ink-soft); font-size: 0.8rem; }
.rfc-warning { padding: 0.85rem 1rem; border: 1px solid var(--amber); border-radius: 0.65rem; color: var(--amber); background: var(--amber-pale); }
.rfc-warning p { margin: 0; }
.rfc-start h3 { margin: 0 0 0.4rem; font-size: 1rem; }
.rfc-start ul { margin: 0; }
.rfc-start__footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.75rem 1.25rem; padding-top: 1.25rem; border-top: 1px solid var(--rule); }
.rfc-start__footer form { margin: 0; padding: 0; border: 0; }
.rfc-start__footer p { margin: 0; }
.rfc-start__version { color: var(--ink-soft); font-size: 0.85rem; }

/* ---------- the Documents section (routes/documents.ts) and its own upload page ---------- */

.client-files { display: grid; gap: 1rem; margin: 0 0 1.25rem; }
.client-files__sending { overflow: hidden; padding: 0; border: 1px solid var(--rule); border-radius: 0.75rem; background: var(--porcelain); box-shadow: var(--shadow-card); }
.client-files__heading { margin: 0; padding: 0.75rem 1.125rem; border-bottom: 1px solid var(--tide-mist); font-size: 0.8125rem; font-weight: 600; letter-spacing: 0; }
.client-files__for { margin: 0; padding: 0.75rem 1.125rem 0.5rem; color: var(--ink-soft); font-size: 0.85rem; }
.client-files__rows { display: grid; margin: 0; padding: 0 0.75rem 0.75rem; gap: 0.4rem; list-style: none; }
.client-files__meta { color: var(--ink-soft); font-size: 0.82rem; }
.client-files__item { display: grid; gap: 0.25rem; }
.request-preview__sent-back { margin: 0.6rem 0; padding: 0.6rem 0.75rem; border-left: 3px solid var(--amber); border-radius: 0.4rem; background: var(--amber-pale); font-size: 0.875rem; white-space: pre-line; }

.document-file-list { display: grid; margin: 0; padding: 0; gap: 0.6rem; list-style: none; }
.document-file { padding: 0.6rem 0; }
.document-file__header { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.35rem 0.9rem; }
.document-file__added { color: var(--ink-soft); font-size: 0.82rem; }
.document-file__state { font-weight: 650; }
.document-file__header .secondary-action { margin-left: auto; }
.document-file__reason { margin: 0.3rem 0 0; color: var(--ink-soft); font-size: 0.82rem; }
.document-file--deleted, .document-file--deleted .document-file__state { color: var(--ink-soft); }

.document-list__row--split { position: relative; }
.document-list__open { display: contents; color: inherit; text-decoration: none; }
.document-list__row--split:has(.document-list__open:focus-visible) { outline: 2px solid var(--tide); outline-offset: -2px; }
a.document-state { text-decoration: none; }
a.document-state:hover, a.document-state:focus-visible { text-decoration: underline; }
/* Document upload */
.document-upload-form [hidden] { display: none; }
.document-upload:has(.document-upload__done) .document-view__actions { display: none; }
.document-upload-form .primary-action:disabled { opacity: 0.5; cursor: default; }
.document-upload__alert { display: flex; margin: 0 0 0.75rem; padding: 0.75rem 1rem; align-items: center; gap: 0.6rem; border: 1px solid var(--amber); border-radius: 0.5rem; background: var(--amber-pale); color: var(--amber); font-weight: 650; }
.document-upload__list-heading { margin: 0.5rem 0 0; font-size: 0.95rem; }
.document-upload-form .document-upload__file-list { display: grid; margin: 0 0 0.5rem; padding: 0; gap: 0; list-style: none; }
.document-upload__file { display: flex; padding: 0.6rem 0; flex-wrap: wrap; align-items: flex-start; gap: 0.4rem 0.75rem; border-bottom: 1px solid var(--rule); }
.document-upload__badge { display: inline-flex; flex: none; width: 2.2rem; height: 2.6rem; align-items: flex-end; justify-content: center; padding-bottom: 0.3rem; box-sizing: border-box; border: 1px solid var(--rule); border-radius: 0.3rem; background: var(--paper); color: var(--ink-soft); font-size: 0.6rem; font-weight: 800; }
.document-upload__file-main { display: grid; flex: 1 1 12rem; min-width: 0; gap: 0.2rem; }
.document-upload__file-main input[type="text"] { width: 100%; min-height: 2.25rem; font-weight: 650; }
.document-upload__file > select { flex: 0 0 10.5rem; width: 10.5rem; min-height: 2.25rem; }
.document-upload__file-name { color: var(--ink-soft); font-size: 0.8rem; overflow-wrap: anywhere; }
.document-upload__file-name--solo { color: var(--ink); font-size: 0.95rem; font-weight: 650; }
.document-upload__date { color: var(--ink-soft); font-size: 0.8rem; }
.document-upload__file-error { color: var(--amber); font-size: 0.85rem; }
.document-upload__remove { display: inline-flex; flex: none; width: 2.25rem; height: 2.25rem; padding: 0; align-items: center; justify-content: center; border: 1px solid var(--rule); border-radius: 0.5rem; background: var(--porcelain); color: var(--ink-soft); cursor: pointer; }
.document-upload__remove:hover { border-color: var(--red); color: var(--red); }
.document-upload__remove:focus-visible, .document-upload__list-heading:focus-visible { outline: 3px solid var(--tide); outline-offset: 2px; }
.document-upload__icon { width: 1rem; height: 1rem; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.document-upload__progress-head { display: flex; margin-bottom: 0.75rem; align-items: baseline; justify-content: space-between; gap: 0.75rem; }
.document-upload__progress-heading { margin: 0; font-size: 1.15rem; }
.document-upload__progress-heading:focus-visible { outline: 3px solid var(--tide); outline-offset: 2px; }
.document-upload__progress-count { color: var(--tide-deep); font-weight: 650; }
.document-upload__bar, .document-upload__row-bar { height: 0.6rem; overflow: hidden; border-radius: 0.3rem; background: var(--tide-pale); }
.document-upload__bar-fill { height: 100%; background: var(--tide); transition: width 120ms linear; }
.document-upload__progress-list { display: grid; margin: 0.5rem 0 0; padding: 0; list-style: none; }
.document-upload__progress-row { display: grid; padding: 0.7rem 0; grid-template-columns: 1.5rem minmax(0, 1fr) auto; align-items: center; gap: 0.35rem 0.75rem; border-bottom: 1px solid var(--rule); }
.document-upload__progress-row .document-upload__row-bar { grid-column: 2 / -1; height: 0.25rem; }
.document-upload__progress-row:not([data-phase="active"]) .document-upload__row-bar { display: none; }
.document-upload__progress-names { display: grid; min-width: 0; }
.document-upload__progress-title { font-weight: 650; overflow-wrap: anywhere; }
.document-upload__progress-label { color: var(--ink-soft); font-size: 0.85rem; font-weight: 650; text-align: right; }
.document-upload__status-icon { display: inline-flex; width: 1.5rem; height: 1.5rem; box-sizing: border-box; align-items: center; justify-content: center; border: 2px solid var(--rule); border-radius: 50%; }
.document-upload__progress-row[data-phase="active"] .document-upload__status-icon { border: 3px solid var(--tide-pale); border-top-color: var(--tide); animation: document-upload-spin 0.9s linear infinite; }
.document-upload__progress-row[data-phase="active"] .document-upload__progress-label { color: var(--tide-deep); }
.document-upload__progress-row[data-phase="done"] .document-upload__status-icon { border-color: var(--green); background: var(--green); color: #ffffff; }
.document-upload__progress-row[data-phase="done"] .document-upload__progress-label { color: var(--green); }
.document-upload__progress-row[data-phase="failed"] .document-upload__status-icon { border-color: var(--amber); color: var(--amber); }
.document-upload__progress-row[data-phase="failed"] .document-upload__progress-label { color: var(--amber); }
.document-upload__done { display: grid; margin-bottom: 0.5rem; justify-items: center; gap: 0.6rem; text-align: center; }
.document-upload__done-mark { display: inline-flex; width: 3.5rem; height: 3.5rem; align-items: center; justify-content: center; border-radius: 50%; background: var(--green-pale); color: var(--green); }
.document-upload__done[data-outcome="partial"] .document-upload__done-mark { background: var(--amber-pale); color: var(--amber); }
.document-upload__done-mark .document-upload__icon { width: 1.75rem; height: 1.75rem; }
.document-upload__done-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.6rem; }
@keyframes document-upload-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
  .document-upload__progress-row[data-phase="active"] .document-upload__status-icon { animation: none; }
  .document-upload__bar-fill { transition: none; }
}
/* The document view: the file list, the selected file with its summary, and Run details. */
.document-workspace__body { display: grid; grid-template-columns: 22.5rem minmax(0, 1fr); align-items: start; gap: 1.25rem; }
.document-workspace__body--details { grid-template-columns: minmax(0, 1fr) 30rem; }
.document-view__all-files { display: none; }
.document-list { min-width: 0; padding: 0.75rem; border: 1px solid var(--rule); border-radius: 0.75rem; background: var(--porcelain); box-shadow: var(--shadow-card); }
.document-list__show { margin-bottom: 0.5rem; }
.document-list__show > summary { display: inline-flex; width: auto; min-height: 2.75rem; padding: 0 0.75rem; gap: 0.5rem; border: 1px solid var(--rule); border-radius: 0.5rem; color: var(--ink); font-size: 1rem; font-weight: 600; }
.document-list__show-count { color: var(--ink-soft); font-weight: 500; }
.document-list__chevron { width: 1rem; height: 1rem; flex: none; }
.document-list__show .record-menu__body { right: 0; left: 0; width: auto; padding: 0.4rem; }
.document-list__show .record-menu__body > a { justify-content: space-between; padding: 0 0.75rem; gap: 0.75rem; border-radius: 0.4rem; color: var(--ink); text-decoration: none; }
.document-list__show .record-menu__body > a:hover, .document-list__show .record-menu__body > a[aria-current="page"] { color: var(--tide-deep); background: var(--tide-pale); }
.document-list__show .record-menu__body > a span { color: var(--ink-soft); font-size: 0.82rem; font-weight: 400; }
.document-list ul { margin: 0; padding: 0; list-style: none; }
.document-list__row { display: grid; grid-template-columns: minmax(0, 1fr) auto; min-height: 2.75rem; padding: 0.6rem 0.75rem; align-items: center; column-gap: 0.75rem; border-radius: 0.5rem; color: var(--ink); text-decoration: none; }
.document-list__title { grid-column: 1; display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; font-weight: 650; overflow-wrap: anywhere; white-space: normal; }
.document-list__heading { grid-column: 1; display: flex; min-width: 0; align-items: center; gap: 0.4rem; }
.document-list__heading .twain-ai { flex: none; }
.document-list__meta { grid-column: 1; color: var(--ink-soft); font-size: 0.82rem; }
.document-list__row .document-state { grid-column: 2; grid-row: 1 / span 2; }
.document-list__row--removed { color: var(--ink-soft); }
.document-state { display: inline-flex; align-items: center; gap: 0.35rem; font-size: 0.82rem; font-weight: 600; }
.document-state svg { width: 0.9rem; height: 0.9rem; flex: none; }
.document-state--scanning { color: var(--amber); }
.document-state--unavailable { color: var(--red); }
.document-state--summarizing, .document-state--reading { color: var(--tide-deep); }
.document-state--not-read { color: var(--ink-soft); }
.document-state--checked { color: var(--ink-soft); }
.document-state--interrupted, .document-state--partly-read, .document-state--to-check { color: var(--amber); }
.document-state--summarizing::before, .document-state--reading::before { content: ""; width: 0.5rem; height: 0.5rem; flex: none; border-radius: 50%; background: var(--tide); animation: document-state-pulse 1.6s ease-in-out infinite; }
.document-state--summary { color: var(--ink-soft); }
@keyframes document-state-pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.35; transform: scale(0.7); }
}
@media (prefers-reduced-motion: reduce) {
  .document-state--summarizing::before, .document-state--reading::before { animation: none; }
}
.document-list__row:hover { background: var(--tide-pale); }
.live-changed { background: var(--tide-pale); animation: live-changed 4s ease-in forwards; }
@keyframes live-changed {
  0%, 60% { background-color: var(--tide-pale); }
  100% { background-color: transparent; }
}
@media (prefers-reduced-motion: reduce) {
  .live-changed { animation: none; }
}
.live-progress { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 1rem; padding: 0 0 1rem; border-bottom: 1px solid var(--rule); }
.live-progress__status { margin: 0; font-weight: 650; }
.live-progress__message { margin-left: 0.5rem; color: var(--ink-soft); font-size: 0.82rem; font-weight: 400; }
.live-progress__bar { flex: 1 1 8rem; height: 6px; border: 0; border-radius: 999px; background: var(--rule); accent-color: var(--tide); }
.live-progress__bar::-webkit-progress-bar { border-radius: 999px; background: var(--rule); }
.live-progress__bar::-webkit-progress-value { border-radius: 999px; background: var(--tide); }
.live-progress__bar::-moz-progress-bar { border-radius: 999px; background: var(--tide); }
.live-progress__reload { min-height: 2rem; padding: 0; font-size: 0.82rem; }
.document-list__row[aria-current="page"] { background: var(--tide-pale); }
.document-list__row[aria-current="page"] .document-list__title { color: var(--tide-deep); font-weight: 600; }
.document-list__foot { display: flex; flex-wrap: wrap; padding: 0.25rem 0.75rem 0; gap: 0 1rem; }
.document-view { display: flex; min-width: 0; padding: 1.75rem 2.25rem; flex-direction: column; gap: 1.5rem; border: 1px solid var(--rule); border-radius: 0.75rem; background: var(--porcelain); box-shadow: var(--shadow-card); }
.document-view__header { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 1rem 1.5rem; }
.document-view__header h2 { margin: 0; font-size: 1.5rem; font-weight: 720; letter-spacing: -0.02em; overflow-wrap: anywhere; }
.document-view__meta { margin: 0.3rem 0 0; color: var(--ink-soft); font-size: 0.88rem; }
.document-view__actions { display: flex; flex: none; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.75rem; }
.document-view__actions p { margin: 0; }
.document-view__panel { padding: 1.25rem 1.5rem; border-radius: 0.65rem; background: var(--paper); }
.document-view__panel h3 { margin: 0 0 0.75rem; font-size: 1rem; }
.document-view__panel .action-form { padding: 0; border: 0; background: transparent; }
.document-view__panel .form-actions { justify-content: flex-start; align-items: center; flex-wrap: wrap; gap: 0.5rem 1rem; }
.document-view__panel .restricted-note { margin-bottom: 1rem; }
.record-menu__danger { color: var(--red); }
.summary { display: grid; gap: 1rem; }
.summary__heading { display: flex; flex-wrap: wrap; align-items: center; gap: 0.6rem; }
.summary__heading h3 { margin: 0; font-size: 1.05rem; }
.citation { display: inline-flex; align-items: center; justify-content: center; min-width: 24px; min-height: 24px; margin: 0 2px; padding: 0 0.3rem; border-radius: 0.35rem; background: var(--tide-pale); color: var(--tide-deep); font-size: 0.8rem; font-weight: 650; line-height: 1; text-decoration: none; vertical-align: middle; }
.citation:hover { background: var(--rule); }
.citation[aria-current="true"] { background: var(--tide); color: #fff; }
.summary__caution { margin: 0; color: var(--ink-soft); font-size: 0.88rem; }
.summary__version-note { margin: 0; padding: 0.6rem 0.9rem; border-radius: 0.5rem; background: var(--amber-pale); color: var(--amber); font-size: 0.88rem; }
.summary__progress { padding: 1.5rem 1.75rem; border-radius: 0.75rem; background: var(--paper); }
.summary__heading .action-form, .summary__failed .action-form, .summary__footer .action-form { padding: 0; border: 0; background: transparent; }
.summary__heading .action-form { margin-left: auto; }
.summary__progress { display: grid; gap: 0.8rem; }
.summary__progress p { margin: 0; }
.summary__progress-head { display: flex; align-items: center; gap: 1.1rem; }
.summary__progress-copy { display: grid; min-width: 0; gap: 0.35rem; }
.summary__star { display: flex; width: 3.75rem; height: 3.75rem; flex: none; align-items: center; justify-content: center; border-radius: 50%; background: var(--porcelain); box-shadow: 0 2px 10px rgba(16, 24, 40, 0.08); }
.summary__star svg { width: 2rem; height: 2rem; animation: summary-star-turn 2.4s ease-in-out infinite; }
.summary__progress-title { font-size: 1.05rem; font-weight: 750; }
.summary__progress-foot { display: flex; flex-wrap: wrap; align-items: center; gap: 0 1rem; }
.summary__progress-message { color: var(--ink-soft); font-size: 0.88rem; }
.summary__failed { display: flex; padding: 1.5rem 1.75rem; gap: 1rem; border-radius: 0.75rem; background: var(--red-pale); }
.summary__failed > div { display: grid; min-width: 0; gap: 0.35rem; }
.summary__failed p { margin: 0; }
.summary__failed-icon { width: 1.5rem; height: 1.5rem; flex: none; color: var(--red); }
.summary__failed-title { font-weight: 750; }
.summary__footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0 1rem; }
.summary__footer p { margin: 0; }
.summary-steps { display: grid; margin: 0; padding: 0; gap: 0.8rem; list-style: none; }
.summary-steps__step { display: flex; align-items: center; gap: 0.75rem; }
.summary-steps .cell-note { display: inline; margin-left: 0.4rem; font-weight: 500; }
.summary-steps__step--active { color: var(--tide-deep); font-weight: 750; }
.summary-steps__step--pending { color: var(--ink-soft); }
.summary-steps__step--done { color: var(--ink); font-weight: 600; }
.summary-steps__step--done .summary-steps__icon { color: var(--green); }
.summary-steps__icon { display: none; width: 1.35rem; height: 1.35rem; flex: none; }
.summary-steps__step--done .summary-steps__icon--done, .summary-steps__step--active .summary-steps__icon--active, .summary-steps__step--pending .summary-steps__icon--pending { display: block; }
.summary-steps__icon--active { animation: summary-step-spin 1s linear infinite; }
@keyframes summary-star-turn {
  0% { transform: rotate(0) scale(0.9); }
  45% { transform: rotate(90deg) scale(1.06); }
  70%, 100% { transform: rotate(90deg) scale(0.9); }
}
@keyframes summary-step-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
  .summary__star svg, .summary-steps__icon--active { animation: none; }
}
.summary-list { display: grid; margin: 0; padding: 0; gap: 1.1rem; list-style: none; }
.summary-list__item { display: grid; grid-template-columns: 1.75rem minmax(0, 1fr); }
.summary-list__number { padding-top: 0.15rem; color: var(--ink-soft); font-size: 0.8rem; font-weight: 600; }
.summary-list__statement { margin: 0; font-size: 0.97rem; font-weight: 600; line-height: 1.45; overflow-wrap: anywhere; }
.summary-list__evidence { display: flex; flex-wrap: wrap; margin: 0; align-items: center; color: var(--ink-soft); font-size: 0.88rem; overflow-wrap: anywhere; }
.summary-list__evidence a { display: inline-flex; min-height: 2.75rem; margin-right: 0.5rem; align-items: center; color: var(--tide-deep); font-weight: 600; }
.summary-list .category-badge { margin-left: 0.5rem; }
.testing-action { display: inline-flex; min-height: 2.75rem; margin-left: auto; padding: 0 0.9rem; align-items: center; gap: 0.3rem; border: 1.5px dashed var(--ink-soft); border-radius: 0.5rem; color: #374151; font-size: 0.85rem; font-weight: 600; text-decoration: none; }
.testing-action:hover { background: var(--tide-mist); }
.testing-action__label { color: var(--ink-soft); font-weight: 600; }
.testing-label { display: inline-flex; padding: 0.15rem 0.6rem; border-radius: 999px; background: var(--tide-mist); color: #374151; font-size: 0.75rem; font-weight: 750; }
.run-details { display: flex; min-width: 0; padding: 1.25rem 1.4rem; flex-direction: column; gap: 1rem; border: 1.5px dashed var(--ink-soft); border-radius: 0.65rem; background: var(--porcelain); }
.run-details h2, .run-details h3 { margin: 0; }
.run-details h2 { font-size: 1.05rem; }
.run-details h3 { font-size: 0.95rem; }
.run-details p { margin: 0; }
.run-details__heading { display: flex; align-items: center; gap: 0.6rem; }
.run-details__close { display: inline-flex; width: 2.75rem; height: 2.75rem; margin-left: auto; align-items: center; justify-content: center; border-radius: 0.5rem; color: var(--ink-soft); }
.run-details__close:hover { background: var(--tide-pale); color: var(--tide-deep); }
.run-details__close svg { width: 1.1rem; height: 1.1rem; }
.run-details__facts { display: grid; grid-template-columns: 6.5rem minmax(0, 1fr); margin: 0; gap: 0.55rem 0.9rem; }
.run-details__facts dt { color: var(--ink-soft); font-size: 0.85rem; }
.run-details__facts dd { margin: 0; overflow-wrap: anywhere; }
.run-details__pre { max-height: 16rem; margin: 0; padding: 0.75rem 0.9rem; overflow: auto; border-radius: 0.5rem; background: var(--paper); font: 0.75rem/1.5 ui-monospace, "SF Mono", Menlo, monospace; white-space: pre-wrap; overflow-wrap: anywhere; }
.run-details .section-disclosure[open] { padding-bottom: 0.75rem; }
.run-details .section-disclosure ul { margin: 0 0 0.5rem; }
.run-details__runs { display: grid; margin: 0; padding: 0; gap: 0.15rem; list-style: none; }
.run-details__runs li { display: flex; flex-wrap: wrap; align-items: center; gap: 0.25rem 0.75rem; }
.run-details__runs a { display: inline-flex; min-height: 2.75rem; align-items: center; }
.run-details__runs a[aria-current="page"] { font-weight: 600; }
/* Documents: basic documents and document page */
.documents-tab { display: flex; min-width: 0; flex-direction: column; gap: 1.5rem; }
.basic-documents, .documents-files { display: flex; min-width: 0; padding: 1.5rem; flex-direction: column; gap: 1.1rem; border: 1px solid var(--rule); border-radius: 0.75rem; background: var(--porcelain); box-shadow: var(--shadow-card); }
.basic-documents h2, .documents-files h2 { margin: 0; font-size: 1.2rem; font-weight: 700; }
.basic-documents__head { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem; list-style: none; cursor: pointer; }
.basic-documents__head::-webkit-details-marker { display: none; }
.basic-documents__head::before { content: ""; width: 0.5rem; height: 0.5rem; margin: 0 0.25rem; flex: none; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; color: var(--ink-soft); transform: rotate(-45deg); transform-origin: center; }
.basic-documents[open] > .basic-documents__head::before { transform: rotate(45deg); }
.basic-documents__head:hover h2 { color: var(--tide-deep); }
.basic-documents__head:focus-visible { outline: 3px solid var(--tide); outline-offset: 4px; }
.basic-documents__head .basic-documents__progress { margin-left: auto; }
details.basic-documents { display: block; }
.basic-documents[open] > .basic-documents__slots { margin-top: 1.1rem; }
.basic-documents__progress { display: flex; align-items: center; gap: 0.6rem; }
.basic-documents__segments { display: flex; gap: 0.25rem; }
.basic-documents__segment { width: 1.4rem; height: 0.4rem; border-radius: 0.2rem; background: var(--tide-pale); }
.basic-documents__segment--on { background: var(--green); }
.basic-documents__count { font-size: 0.9rem; font-weight: 600; }
.basic-documents__slots { display: grid; margin: 0; padding: 0; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.75rem; list-style: none; }
@media (max-width: 40rem) { .basic-documents__slots { grid-template-columns: minmax(0, 1fr); } }
.basic-slot { display: flex; min-height: 5.25rem; padding: 1rem; align-items: center; gap: 0.9rem; border: 1px solid var(--rule); border-radius: 0.65rem; background: var(--porcelain); }
.basic-slot--needed { border: 1.5px dashed var(--rule-strong); background: var(--paper); }
.basic-slot__icon { width: 2.5rem; height: 2.5rem; flex: none; padding: 0.6rem; border: 1px solid var(--rule); border-radius: 0.65rem; background: var(--porcelain); color: var(--ink-soft); }
.basic-slot__icon--check { border: 0; border-radius: 50%; background: var(--green-pale); color: var(--green); }
.basic-slot__body { display: flex; min-width: 0; flex: 1; flex-direction: column; gap: 0.2rem; }
.basic-slot__name { font-weight: 700; }
.basic-slot__note, .basic-slot__lapse { color: var(--ink-soft); font-size: 0.82rem; }
.basic-slot__file { color: var(--ink-soft); font-size: 0.82rem; overflow-wrap: anywhere; }
.basic-slot__file a { color: var(--tide-deep); font-weight: 600; }
.basic-slot__state { color: var(--amber); font-size: 0.82rem; font-weight: 600; }
.basic-slot .secondary-action { flex: none; }
.documents-files .document-list { padding: 0; }
.documents-drop { display: flex; padding: 2.75rem 1.5rem; flex-direction: column; align-items: center; justify-content: center; gap: 0.75rem; border: 1.5px dashed var(--rule-strong); border-radius: 0.75rem; background: var(--paper); color: var(--ink); text-align: center; text-decoration: none; }
.documents-drop:hover, .documents-drop:focus-visible { border-color: var(--tide); background: var(--tide-pale); }
.documents-drop__icon { width: 3.5rem; height: 3.5rem; padding: 0.9rem; border-radius: 50%; background: var(--tide-pale); color: var(--tide); }
.documents-drop__title { font-size: 1rem; font-weight: 650; }
.documents-drop__limit { color: var(--ink-soft); font-size: 0.82rem; }
.document-findings { display: flex; padding: 1.25rem 1.5rem; flex-direction: column; gap: 0.9rem; border-radius: 0.75rem; background: var(--paper); }
.document-findings__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.75rem; }
.document-findings__title { display: flex; align-items: baseline; gap: 0.6rem; }
.document-findings h3 { margin: 0; font-size: 1.05rem; }
.document-findings__all { align-self: flex-start; font-weight: 600; }
@media (max-width: 64rem) {
  .document-workspace__body, .document-workspace__body--details { grid-template-columns: minmax(0, 1fr); }
  .document-workspace__body:not(.document-workspace__body--details) .document-list { display: none; }
  .document-workspace__body:not(.document-workspace__body--details) .document-view__all-files { display: inline-flex; }
}
@media (max-width: 36rem) {
  .document-view { padding: 1.25rem 1rem; }
  .document-list__row { grid-template-columns: minmax(0, 1fr); }
  .document-list__row .document-state { grid-column: 1; grid-row: auto; justify-self: start; }
}
.document-upload .document-upload-form { padding: 0; border: 0; }
.document-upload__drop { position: relative; display: flex; margin-bottom: 1rem; padding: 1.5rem; min-height: 9rem; flex-direction: column; align-items: center; justify-content: center; gap: 0.4rem; border: 2px dashed var(--rule-strong); border-radius: 0.75rem; background: var(--paper); text-align: center; }
.document-upload__drop:hover, .document-upload__drop:focus-within { border-color: var(--tide); background: var(--tide-pale); }
.document-upload__drop:focus-within { outline: 3px solid var(--tide); outline-offset: 2px; }
.document-upload__input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.document-upload__drop-label { font-size: 1rem; font-weight: 600; }
.document-upload__choose { color: var(--tide-deep); text-decoration: underline; text-underline-offset: 0.2em; }
.document-upload__drop-hint { margin: 0; color: var(--ink-soft); font-size: 0.85rem; }
.document-upload__drop-icon { width: 1.75rem; height: 1.75rem; color: var(--tide); }
.document-upload__filing { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.75rem; }

/* Lead identity, intake, notes, and activity. */

.lead-queue-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 0.6rem; }

.lead-header { display: flex; margin-top: 0.75rem; margin-bottom: 2rem; align-items: flex-start; justify-content: space-between; gap: 1.5rem; }
.lead-header__title { display: flex; margin-bottom: 0.5rem; flex-wrap: wrap; align-items: center; gap: 0.35rem 0.75rem; }
.lead-header__title h1 { margin: 0; }
.status-badge--client { color: var(--tide-deep); background: var(--tide-pale); }
.lead-header__actions { display: flex; margin-left: auto; align-items: center; flex: none; gap: 0.5rem; }
.lead-header__actions > .primary-action, .lead-header__actions > .secondary-action { white-space: nowrap; }
.lead-meta { margin: 0; color: var(--ink-soft); font-size: 0.88rem; }
.lead-meta time { font-size: inherit; }
.lead-owner-control__action { min-height: 2.75rem; padding: 0.55rem 0.85rem; border: 0; color: var(--tide-deep); background: var(--tide-pale); font-weight: 750; }
.lead-owner-control__action:hover { color: #ffffff; background: var(--tide); }
.lead-owner-control__action:focus-visible { outline: 3px solid var(--tide); outline-offset: -3px; }
.lead-link-button { min-height: 2.75rem; padding: 0 0.25rem; border: 0; background: none; color: var(--tide-deep); font-size: 0.85rem; font-weight: 650; text-decoration: underline; text-underline-offset: 0.2em; }

.lead-page { margin: 0 auto; }
.lead-page .section-disclosure { border-bottom: 0; }
.lead-aside__label { margin: 0 0 0.6rem; color: var(--ink-soft); font-size: 0.75rem; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; }
.lead-contact-line { color: var(--ink); font-size: 1rem; font-weight: 600; overflow-wrap: anywhere; }

.lead-answer-list { display: grid; margin: 0; grid-template-columns: minmax(7rem, 12rem) minmax(0, 1fr); gap: 0.75rem 1.5rem; }
.lead-answer-list dt { color: var(--ink-soft); font-size: 0.9rem; }
.lead-answer-list dd { margin: 0; font-size: 1rem; font-weight: 550; }

.lead-timeline { margin: 0; padding: 0; list-style: none; }
.lead-timeline__entry { padding: 1rem 1.25rem; }
.lead-timeline__entry + .lead-timeline__entry { border-top: 1px solid var(--tide-mist); }
.lead-timeline__head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.2rem 1rem; }
.lead-timeline__text { margin: 0.3rem 0 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.lead-timeline-section h2 { margin: 0 0 1rem; font-size: 1rem; font-weight: 600; }
.lead-asked { margin: 0 0 1rem; color: var(--ink-soft); overflow-wrap: anywhere; }
.status-badge--late { color: var(--red); background: var(--red-pale); }
.lead-timeline__what { display: block; font-weight: 650; }
.lead-timeline__when { display: block; color: var(--ink-soft); font-size: 0.82rem; }
.lead-timeline__when time { font-size: inherit; white-space: nowrap; }

.lead-choice-list { display: grid; margin: 0 0 1rem; padding: 0; gap: 0.4rem; border: 0; }
.lead-choice-list legend { margin-bottom: 0.45rem; padding: 0; font-size: 0.78rem; font-weight: 600; }
.lead-choice { display: flex; min-height: 2.75rem; padding: 0.45rem 0.75rem; align-items: center; gap: 0.6rem; border: 1px solid var(--rule-strong); border-radius: 0.35rem; font-weight: 600; cursor: pointer; }
.lead-choice input { width: auto; min-height: auto; }
.lead-choice:has(input:checked) { border-color: var(--tide); background: var(--tide-pale); }
.lead-stack { display: grid; gap: 0.9rem; }
.lead-choice-list--row { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.lead-choice-list--row .lead-choice { justify-content: center; text-align: center; }
@media (max-width: 40rem) {
  .lead-choice-list--row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lead-choice-list--row .lead-choice:last-of-type:nth-of-type(odd) { grid-column: 1 / -1; }
}
.lead-reveal { display: grid; gap: 0.6rem; }
.lead-outcomes { display: grid; gap: 0.4rem; margin-top: 0.6rem; padding-top: 0.9rem; border-top: 1px solid var(--rule); }
.lead-reveal__fields { display: grid; gap: 0.9rem; padding: 0.4rem 0 0.9rem 1.25rem; }
.lead-reveal__fields .primary-action { justify-self: start; }
@supports selector(:has(*)) {
  .lead-reveal:not(:has(> label > input:checked)) > .lead-reveal__fields { display: none; }
}
.lead-hint { margin: 0; color: var(--ink-soft); font-size: 0.78rem; font-weight: 500; }

@media (max-width: 52rem) {
  .matter-answer-record > header { align-items: flex-start; flex-direction: column; }
  .matter-needed__action { margin-left: 0; }
  .matter-needed__actions { justify-content: flex-start; }
  .matter-needed__item:has(.matter-needed__collected) { grid-template-columns: minmax(0, 1fr); }
  .matter-header, .lead-header { flex-wrap: wrap; gap: 0.75rem; }
  .lead-answer-list { grid-template-columns: minmax(0, 1fr); gap: 0.15rem; }
  .lead-answer-list dd { margin-bottom: 0.75rem; }
  .document-upload__filing { grid-template-columns: minmax(0, 1fr); }
  body { display: block; }
  body:has(.sidebar-menu:not([open])) { display: block; }
  .app-header { border-right: 0; border-bottom: 1px solid var(--rule); }
  .app-header__inner {
    position: relative;
    height: auto;
    min-height: 4rem;
    padding: 0.35rem 1rem;
    flex-direction: row;
    align-items: center;
    gap: 0.5rem;
  }
  .sidebar-menu { flex: 1; flex-direction: row; align-items: center; gap: 0.5rem; }
  .sidebar-menu::details-content { flex: 1; min-width: 0; }
  .sidebar-menu > summary { position: static; flex: none; }
  .sidebar-menu__content { min-width: 0; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 0.5rem; }
  .sidebar-menu__content > .brand { padding-right: 0.65rem; }
  .sidebar-menu:not([open]) { flex: none; }
  .primary-nav { display: flex; min-width: 0; flex: 1; flex-wrap: wrap; margin-top: 0; }
  .account-menu { position: relative; right: auto; bottom: auto; left: auto; margin: 0 0 0 auto; }
  .account-menu__items { top: calc(100% + 0.25rem); right: 0; bottom: auto; left: auto; }
  .account-menu__chevron::before { transform: translateY(-0.12rem) rotate(45deg); }
  .app-main { padding: 2rem 1.25rem 3rem; }
}


.app-main--auth {
  grid-column: 1 / -1;
  width: 100%;
  min-height: 100vh;
  min-height: 100svh;
  padding: 0;
}

.auth-page {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  min-height: 100vh;
  min-height: 100svh;
  place-items: center;
  background: var(--porcelain);
}

.auth-page__content {
  display: grid;
  width: 100%;
  padding: 2rem;
  justify-items: center;
  gap: 2rem;
}

.auth-page__wordmark {
  margin: 0;
  color: var(--ink);
  font-size: clamp(3rem, 10vw, 4.25rem);
  line-height: 0.95;
}

.auth-page__message {
  max-width: 28rem;
  margin: -0.25rem 0 0;
  color: var(--ink-soft);
  text-align: center;
}

.auth-page__form {
  margin: 0;
}

.auth-page__form--dev {
  display: grid;
  gap: 0.65rem;
}

.auth-page__action {
  display: inline-flex;
  min-height: 2.75rem;
  padding: 0.6rem 1.15rem;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--tide-deep);
  border-radius: 0.5rem;
  color: #ffffff;
  background: var(--tide);
  font: inherit;
  font-weight: 600;
  line-height: 1;
  text-decoration: none;
}

.auth-page__action:hover {
  border-color: var(--tide-deep);
  background: var(--tide-deep);
}

.auth-page__action:focus-visible {
  outline: 3px solid var(--tide);
  outline-offset: 3px;
}

@media (max-width: 46rem) {
  .auth-page__content { padding: 1.5rem; }
}

.prose-field { display: flex; flex-direction: column; min-width: 0; width: 100%; }
.prose-field > .field { order: -1; }
.prose-toolbar { position: sticky; top: 0; z-index: 2; display: flex; flex-wrap: wrap; align-items: center; gap: .25rem; padding: .5rem; border: 1px solid var(--rule); border-bottom: 0; border-radius: .5rem .5rem 0 0; background: var(--paper); }
.prose-toolbar[hidden], .prose-surface[hidden] { display: none; }
.prose-toolbar button, .prose-toolbar select { min-width: 2.5rem; min-height: 2.5rem; padding: .4rem .65rem; border: 1px solid transparent; border-radius: .3rem; color: var(--ink); background: transparent; font: inherit; font-size: .875rem; cursor: pointer; }
.prose-toolbar button[data-prose-command="bold"] { font-weight: 750; }
.prose-toolbar button[data-prose-command="italic"] { font-style: italic; }
.prose-toolbar button:hover, .prose-toolbar button[aria-pressed="true"] { background: var(--tide-pale); color: var(--tide-deep); }
.prose-toolbar button:disabled { opacity: .35; cursor: default; }
.prose-toolbar button:focus-visible, .prose-toolbar select:focus-visible { outline: 2px solid var(--tide); outline-offset: 2px; }
.prose-style-label { display: flex; align-items: center; font-size: .75rem; color: var(--ink-soft); }
.prose-surface { border: 1px solid var(--rule); border-radius: 0 0 .5rem .5rem; background: #fff; }
.prose-surface:focus-within { border-color: var(--tide); box-shadow: 0 0 0 1px var(--tide); }
.prose-writing { padding: 1.1rem 1.25rem; min-height: 8rem; outline: none; line-height: 1.7; white-space: pre-wrap; overflow-wrap: anywhere; }
[data-prose-profile="rfc"] .prose-writing { min-height: 30rem; max-width: 78ch; margin-inline: auto; }
.prose-writing > :first-child, .prose-reader > :first-child { margin-top: 0; }
.prose-writing > :last-child, .prose-reader > :last-child { margin-bottom: 0; }
.prose-writing p, .prose-reader p { white-space: pre-wrap; }
.prose-writing h2, .prose-reader h2 { font-size: 1.3rem; line-height: 1.35; margin: 1.5rem 0 .6rem; }
.prose-writing h3, .prose-reader h3 { font-size: 1.1rem; line-height: 1.4; margin: 1.2rem 0 .5rem; }
.prose-writing ul, .prose-writing ol, .prose-reader ul, .prose-reader ol { padding-left: 1.5rem; }
.prose-writing li > p, .prose-reader li > p { margin-block: .35rem; }
.prose-citation { display: inline-block; border-radius: .25rem; padding-inline: .2rem; color: var(--tide-deep); background: var(--tide-pale); font-size: .8em; font-weight: 650; cursor: pointer; user-select: none; }
.prose-citation:focus-visible { outline: 2px solid var(--tide); }
.prose-field:has(.prose-surface:not([hidden])) > .field > label { margin-bottom: .4rem; }
/* On a phone the style choice takes its own row and the buttons share the next, undo and redo at its end. */
@media (max-width: 46rem) { .prose-writing { padding: .85rem; } .prose-toolbar { gap: .15rem; padding: .35rem; } .prose-toolbar button { padding-inline: .5rem; } .prose-style-label { flex-basis: 100%; gap: .5rem; } .prose-toolbar button[data-prose-command="undo"] { margin-left: auto; } }

/* Findings: list, review, treatment history */
.segmented__count { font-weight: 500; opacity: .75; }
.findings-toolbar, .history-toolbar { display: flex; flex-wrap: wrap; gap: .75rem 1.25rem; align-items: center; justify-content: space-between; margin: 1rem 0 1.5rem; }
h2 + .segmented { margin-top: 1rem; }
.empty-card { display: flex; flex-direction: column; align-items: center; gap: .9rem; margin: 1.5rem 0; padding: 3rem 1.5rem; border: 1px solid var(--rule); border-radius: .75rem; text-align: center; background: var(--porcelain); box-shadow: var(--shadow-card); }
.empty-card h2 { margin: 0; font-size: 1.3rem; }
.finding-cards, .visit-line, .history-documents, .visit__entries { margin: 0; padding: 0; list-style: none; }
.finding-cards, .history-documents { display: flex; flex-direction: column; gap: .6rem; }
.finding-card { display: flex; gap: 1rem; align-items: flex-start; padding: 1.1rem 1.25rem; border: 1px solid var(--rule); border-radius: .75rem; background: var(--porcelain); box-shadow: var(--shadow-card); }
.finding-card__body { display: flex; flex: 1; min-width: 0; flex-direction: column; gap: .6rem; }
.finding-card__statement { margin: 0; font-size: 1rem; font-weight: 500; overflow-wrap: anywhere; }
.finding-card__statement a { color: var(--ink); text-decoration: none; }
.finding-card__statement a:hover { color: var(--tide-deep); text-decoration: underline; }
.finding-card__meta { display: flex; flex-wrap: wrap; gap: .5rem .9rem; align-items: center; margin: 0; color: var(--ink-soft); font-size: .82rem; }
.source-chip { display: inline-flex; align-items: center; padding: .2rem .6rem; border: 1px solid var(--rule); border-radius: .4rem; color: var(--tide-deep); background: var(--paper); font-weight: 600; }
.review-bar { display: flex; flex-wrap: wrap; gap: .75rem 1.5rem; align-items: center; margin-bottom: 1rem; padding-bottom: 1rem; border-bottom: 1px solid var(--rule); }
.review-bar h1 { margin: 0; font-size: 1.2rem; }
.review-bar__back { display: inline-flex; min-height: 2.5rem; align-items: center; padding: 0 .85rem; border: 1px solid var(--rule); border-radius: .5rem; color: var(--ink); font-weight: 600; text-decoration: none; }
.review-bar__back::before { content: "‹"; margin-right: .4rem; font-size: 1.2rem; line-height: 1; }
.review-bar__title { display: flex; flex-direction: column; }
.review-bar__client { color: var(--ink-soft); font-size: .8rem; }
.review-bar__progress { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; margin-left: auto; color: var(--ink-soft); font-size: .85rem; }
.review-bar__progress progress { width: 10rem; height: .4rem; border: 0; border-radius: 999px; background: var(--tide-mist); accent-color: var(--tide); }
.review-bar__progress progress::-webkit-progress-bar { border-radius: 999px; background: var(--tide-mist); }
.review-bar__progress progress::-webkit-progress-value { border-radius: 999px; background: var(--tide); }
.review-bar__progress progress::-moz-progress-bar { border-radius: 999px; background: var(--tide); }
.review-panes { display: grid; grid-template-columns: 15rem minmax(20rem, 24rem) minmax(0, 1fr); align-items: start; border: 1px solid var(--rule); border-radius: .75rem; background: var(--porcelain); overflow: clip; }
.review-queue--compact { display: none; }
.review-queue { max-height: 75vh; padding: .5rem 0; overflow-y: auto; border-right: 1px solid var(--rule); }
.review-queue h2 { margin: 0; padding: .6rem 1rem .2rem; font-size: .8rem; font-weight: 700; }
.review-queue ul { margin: 0 0 .4rem; padding: 0; list-style: none; }
.review-queue a { display: flex; min-height: 2.5rem; gap: .6rem; align-items: center; padding: 0 1rem; color: var(--ink); font-size: .82rem; text-decoration: none; }
.review-queue a:hover { background: var(--paper); }
.review-queue a[aria-current="true"] { background: var(--tide-pale); box-shadow: inset 3px 0 0 var(--tide); }
.review-queue__dot { flex: none; width: .5rem; height: .5rem; border-radius: 999px; box-shadow: inset 0 0 0 1.5px #c48a2c; }
.review-queue__text { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.review-queue__page { color: var(--ink-soft); font-size: .72rem; }
.review-finding { display: flex; min-height: 24rem; flex-direction: column; gap: 1.1rem; padding: 1.5rem; border-right: 1px solid var(--rule); }
.review-finding__head { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.review-finding__position { margin-left: auto; color: var(--ink-soft); font-size: .8rem; }
.review-finding__statement { margin: 0; font-size: 1.25rem; font-weight: 650; line-height: 1.4; overflow-wrap: anywhere; }
.review-finding__statement--rejected { color: var(--ink-soft); text-decoration: line-through; text-decoration-color: var(--red); }
.review-finding .detail-grid { margin: 0; }
.review-finding__actions { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; }
.review-finding__form { display: contents; }
.review-finding .action-form { display: flex; flex-direction: column; flex: 1; gap: 1rem; }
.review-finding .action-form .field { margin-bottom: 0; }
.review-finding .action-form .form-actions { margin-top: auto; }
.review-finding__actions .primary-action, .review-finding__actions .secondary-action { display: inline-flex; min-height: 2.75rem; gap: .6rem; align-items: center; margin: 0; }
.review-finding__confirm { border-color: var(--green); background: var(--green); }
.review-finding__confirm:hover { background: #0a5535; }
.review-finding__reject { border-color: #f1b8b2; color: var(--red); }
.review-finding__reject:hover { border-color: var(--red); background: var(--red-pale); }
.review-finding kbd { padding: 0 .35rem; border-radius: .25rem; background: rgba(16, 24, 40, .08); font: inherit; font-size: .72rem; }
.review-finding__confirm kbd { background: rgba(255, 255, 255, .2); }
.review-finding__foot { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; margin-top: auto; padding-top: 1rem; border-top: 1px solid var(--rule); }
.review-finding__foot a { display: inline-flex; min-height: 2.5rem; align-items: center; padding: 0 .85rem; border: 1px solid var(--rule-strong); border-radius: .5rem; color: var(--ink); text-decoration: none; }
.review-finding__foot kbd { margin-left: .4rem; color: var(--ink-soft); font: inherit; font-size: .72rem; }
.review-finding__note { margin-left: auto; }
.review-finding__note > summary { display: inline-flex; min-height: 2.5rem; align-items: center; padding: 0 .5rem; color: var(--tide-deep); cursor: pointer; }
.review-finding__note textarea { width: 16rem; max-width: 100%; }
.review-finding fieldset { display: flex; flex-direction: column; gap: .5rem; margin: 0; padding: 0; border: 0; }
.review-finding legend { margin-bottom: .5rem; font-weight: 600; }
.review-finding__reason { display: flex; min-height: 2.75rem; gap: .6rem; align-items: center; padding: 0 .75rem; border: 1px solid var(--rule-strong); border-radius: .5rem; }
.review-finding__reason:has(input:checked) { border-color: var(--red); background: var(--red-pale); }
.review-source { min-width: 0; }
.review-source__head { display: flex; flex-wrap: wrap; gap: .25rem .75rem; align-items: center; padding: .75rem 1.25rem; border-bottom: 1px solid var(--rule); }
.review-source__head strong { font-weight: 650; }
.review-source__head span { color: var(--ink-soft); }
.review-source__head a { display: inline-flex; min-height: 2.5rem; align-items: center; margin-left: auto; }
.review-source__body { max-height: 75vh; padding: 1.5rem; overflow-y: auto; background: var(--paper); }
.review-source__page { max-width: 42rem; margin: 0 auto; padding: 1.5rem 1.75rem; border: 1px solid var(--rule); border-radius: .75rem; background: var(--porcelain); font-size: .95rem; }
.review-source__page mark { padding: 0 .15rem; border-radius: .2rem; color: var(--ink); background: #ffe9a8; box-shadow: 0 0 0 2px #c48a2c inset; }
.review-source__page a { color: var(--tide-deep); text-decoration: underline dotted; text-underline-offset: .2em; }
.review-done { display: flex; max-width: 47.5rem; flex-direction: column; gap: 1.25rem; margin: 2rem auto; }
.review-done__summary, .review-done__card { border: 1px solid var(--rule); border-radius: .75rem; background: var(--porcelain); }
.review-done__summary { display: flex; flex-wrap: wrap; gap: 1rem 1.5rem; align-items: center; padding: 1.25rem 1.5rem; }
.review-done__summary h2 { flex: 1 1 100%; margin: 0; font-size: 1.15rem; }
.review-done__counts { display: flex; flex-wrap: wrap; gap: 1.5rem; }
.review-done__count { display: flex; flex-direction: column; color: var(--ink-soft); font-size: .8rem; }
.review-done__number { color: var(--ink); font-size: 1.6rem; font-weight: 700; line-height: 1.2; }
.review-done__card { padding: .5rem 0; }
.review-done__card h2 { margin: 0; padding: .75rem 1.5rem .5rem; font-size: 1rem; }
.review-done__card ul { margin: 0; padding: 0; list-style: none; }
.review-done__row { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; padding: .9rem 1.5rem; border-top: 1px solid var(--rule); }
.review-done__dot { flex: none; width: .65rem; height: .65rem; border-radius: 999px; box-shadow: inset 0 0 0 1.5px #c48a2c; }
.review-done__text { display: flex; min-width: 15rem; flex: 1; flex-direction: column; overflow-wrap: anywhere; }
.review-done__text span { color: var(--ink-soft); font-size: .85rem; }
.review-done__row .secondary-action { display: inline-flex; min-height: 2.75rem; align-items: center; margin: 0; }
.review-done__actions { display: flex; flex-wrap: wrap; gap: .6rem; }
.review-done__actions .primary-action, .review-done__actions .secondary-action { display: inline-flex; min-height: 2.75rem; align-items: center; margin: 0; }
@media (max-width: 46rem) {
  .review-panes { display: flex; flex-direction: column; align-items: stretch; }
  .review-queue { display: none; }
  .review-queue--compact { display: block; max-height: none; border-right: 0; border-top: 1px solid var(--rule); }
  .review-queue--compact > summary { display: flex; min-height: 2.75rem; align-items: center; padding: 0 1rem; color: var(--tide-deep); font-weight: 600; cursor: pointer; }
  .review-queue--compact .review-queue { display: block; max-height: 24rem; border: 0; }
  .review-finding { min-height: 0; border-right: 0; border-bottom: 1px solid var(--rule); }
  .review-source__body { max-height: 30rem; }
  .review-bar__progress { margin-left: 0; }
}
.filter-toggle { display: inline-flex; min-height: 2.75rem; align-items: center; gap: .5rem; color: var(--ink); font-weight: 600; text-decoration: none; }
.filter-toggle::before { content: ""; width: 1.1rem; height: 1.1rem; border: 2px solid var(--rule-strong); border-radius: .25rem; background: var(--porcelain); }
.filter-toggle[aria-current="true"]::before { border-color: var(--tide); background: var(--tide); box-shadow: inset 0 0 0 2px var(--porcelain); }
.activity-strip { margin: 0 0 1rem; padding: 1.1rem 1.25rem .9rem; border: 1px solid var(--rule); border-radius: .75rem; background: var(--porcelain); box-shadow: var(--shadow-card); }
.activity-strip__years { display: grid; grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr)); gap: .9rem; }
.activity-year { display: flex; flex-direction: column; gap: .35rem; }
.activity-year__bars { display: flex; height: 2.75rem; align-items: flex-end; gap: 3px; border-bottom: 1px solid var(--rule); }
.activity-year__label { color: var(--ink-soft); font-size: .75rem; font-weight: 700; }
.activity-bar { flex: 1; height: 3px; border-radius: 2px 2px 0 0; background: var(--tide-mist); }
.activity-bar--year { height: 6px; background: var(--rule-strong); }
.activity-bar--1 { height: 25%; background: var(--tide); }
.activity-bar--2 { height: 50%; background: var(--tide); }
.activity-bar--3 { height: 75%; background: var(--tide); }
.activity-bar--4 { height: 100%; background: var(--tide); }
.history-section { display: flex; flex-direction: column; gap: .6rem; margin-bottom: 1.25rem; }
.history-year { display: flex; align-items: baseline; gap: .6rem; margin: .6rem 0 0; color: var(--ink-soft); font-size: .95rem; }
.history-year__count { font-size: .82rem; font-weight: 500; }
.visit-line { display: flex; flex-direction: column; gap: .6rem; margin-left: .4rem; padding-left: 1.4rem; border-left: 2px solid var(--rule); }
.visit-line > li { position: relative; }
.visit-line > li::before { content: ""; position: absolute; top: 1.1rem; left: -1.95rem; width: .75rem; height: .75rem; border: 3px solid var(--tide); border-radius: 50%; background: var(--porcelain); }
.visit { overflow: hidden; border: 1px solid var(--rule); border-radius: .75rem; background: var(--porcelain); box-shadow: var(--shadow-card); }
.visit > summary { display: flex; flex-wrap: wrap; gap: .5rem 1rem; align-items: center; padding: .9rem 1.1rem; list-style: none; cursor: pointer; }
.visit > summary::-webkit-details-marker { display: none; }
.visit > summary::after { content: "⌄"; margin-left: auto; color: var(--ink-soft); transition: transform 150ms; }
.visit[open] > summary::after { transform: rotate(180deg); }
.visit__date { flex: 0 0 7rem; font-weight: 700; }
.visit__main { display: flex; flex: 1 1 16rem; min-width: 0; flex-direction: column; gap: .1rem; }
.visit__title { font-weight: 650; }
.visit__headline { overflow: hidden; color: var(--ink-soft); font-size: .9rem; text-overflow: ellipsis; white-space: nowrap; }
.visit__chips { display: flex; flex-wrap: wrap; gap: .35rem; align-items: center; }
.category-chip { display: inline-flex; align-items: center; padding: .1rem .55rem; border-radius: 999px; color: #374151; background: var(--tide-mist); font-size: .75rem; font-weight: 600; }
.visit__dot { display: inline-block; width: .5rem; height: .5rem; border-radius: 50%; background: #c48a2c; }
.visit__entries { padding: 0 1.1rem .5rem; border-top: 1px solid var(--tide-mist); }
.visit-entry { display: flex; flex-wrap: wrap; gap: .4rem .9rem; align-items: baseline; padding: .75rem 0; border-bottom: 1px solid var(--tide-mist); }
.visit-entry:last-child { border-bottom: 0; }
.visit-entry__category { flex: 0 0 7rem; color: var(--ink-soft); font-size: .72rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.visit-entry__body { display: flex; flex: 1 1 16rem; min-width: 0; flex-direction: column; gap: .2rem; }
.visit-entry__statement { margin: 0; overflow-wrap: anywhere; }
.visit-entry__meta { margin: 0; color: var(--ink-soft); font-size: .82rem; }
@media (prefers-reduced-motion: reduce) { .visit > summary::after { transition: none; } }
@media (max-width: 46rem) {
  .visit__date, .visit-entry__category { flex-basis: 100%; }
  .proposal-review table { min-width: 0; table-layout: fixed; }
  .proposal-review :is(th, td) { padding: 0.75rem 0.5rem; white-space: normal; overflow-wrap: anywhere; }
}

/* The error page a browser gets in place of the JSON envelope; it has no app header. */
.app-main--auth > .static-page { margin-top: 3rem; }

/* Matter close-out: the close record, then each client's notice as its own section. */
.close-out dl.detail-grid { margin-bottom: 1.5rem; }
.close-out dl.detail-grid time { font-size: inherit; }
.close-out__deadlines { margin-bottom: 1.5rem; }
.close-out__notices { margin-top: 2.5rem; padding-top: 1.5rem; border-top: 1px solid var(--rule); }
.close-out__notices > h2 { margin-bottom: 0.5rem; }
.close-out__notice { padding: 1rem 0 0.5rem; }
.close-out__notice + .close-out__notice { border-top: 1px solid var(--rule); }
.close-out__notice > h3 { margin: 0 0 0.75rem; }

/* One finding's review page. */
.finding-review dl.detail-grid { margin: 1rem 0; gap: 0.5rem 1.25rem; }
.finding-review blockquote { margin: 0.5rem 0 1rem; padding: 0.25rem 0 0.25rem 1rem; border-left: 3px solid var(--rule-strong); }
.finding-review__buttons { justify-content: flex-start; }
.finding-review > section { margin-top: 2rem; }
.finding-review > section > h2 { margin-bottom: 0.75rem; }
.finding-review p.muted:has(+ blockquote) { margin: 0; font-size: 0.78rem; font-weight: 600; }

/* After an upload adds a file, the list read with the page is out of date; the link to the current list replaces it. */
.document-workspace__body--uploaded { grid-template-columns: minmax(0, 1fr); }
.document-workspace__body--uploaded .document-list { display: none; }
.document-workspace__body--uploaded .document-view__all-files { display: inline-flex; }

/* Phone width: a list table becomes one card per row, each cell labelled; controls are sized for touch
   and set at 16px so iOS does not zoom into a field. */
@media (max-width: 46rem) {
  .stack-table { min-width: 0; background: none; }
  .stack-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .stack-table tbody, .stack-table tr, .stack-table td { display: block; }
  .stack-table tr { margin-bottom: 0.6rem; padding: 0.75rem 1rem; border-radius: 0.55rem; background: var(--porcelain); }
  .stack-table td, .matter-table.stack-table td:first-child { padding: 0.15rem 0; border: 0; white-space: normal; }
  .stack-table td:first-child { font-weight: 650; }
  .stack-table td:empty { display: none; }
  .stack-table td[data-label]::before { content: attr(data-label); display: inline-block; min-width: 5.5rem; margin-right: 0.5rem; color: var(--ink-soft); font-size: 0.82rem; font-weight: 600; }

  input, select, textarea, .row-form__body input, .row-form__body select, .rfc-editor__form textarea, .prose-toolbar select, .conversation-questions__input, .document-upload__file-main input[type="text"] { font-size: 1rem; }
  input[type="radio"], input[type="checkbox"] { width: 1.25rem; height: 1.25rem; flex: none; }
  .radio-option { min-height: 2.75rem; align-items: center; gap: 0.75rem; }
  .radio-option > label { display: flex; min-height: 2.75rem; flex: 1; align-items: center; }

  .matter-header__actions { margin-top: 1rem; margin-left: 0; }
  .page-intro .matter-header__actions .primary-action { display: inline-flex; margin-top: 0; }
  .matter-nav { display: block; border-bottom: 0; }
  .matter-tabs { overflow-x: visible; border-bottom: 1px solid var(--rule); }
  .matter-tabs__list { flex-wrap: wrap; gap: 0 0.25rem; }
  .matter-work { padding: 0.75rem 0 0; }
}

/* Date tiles and the task page. The phone header renders only at phone width; above it the sidebar stays. */
.task-tile { display: flex; width: 3rem; height: 3.25rem; flex: none; flex-direction: column; align-items: center; justify-content: center; border-radius: 0.75rem; color: var(--ink-soft); background: var(--porcelain); box-shadow: inset 0 0 0 1px var(--rule); line-height: 1; }
.task-tile small { font-size: 0.625rem; font-weight: 800; letter-spacing: 0.08em; }
.task-tile b { margin-top: 0.1875rem; font-size: 1.25rem; font-weight: 700; }
.task-tile--late { color: var(--red); box-shadow: inset 0 0 0 1px #f3c7c2; }
.task-tile--today { color: var(--tide-deep); box-shadow: inset 0 0 0 1px #b9d9df; }
.task-tile--deadline { color: var(--amber); box-shadow: inset 0 0 0 1px #ecd0a0; }

/* The task and deadline rows, the section heads and the cross-matter deadline strip. */
.task-group, .new-task { margin: 0 0 1.5rem; }
.task-section-block, .deadline-strip { margin: 0 0 2.5rem; }
.task-section-block > .task-group { margin-bottom: 1.5rem; }
.task-group { border: 1px solid var(--rule); border-radius: 0.75rem; background: var(--porcelain); box-shadow: var(--shadow-card); }
.task-group > :is(h2, h3) { margin: 0; padding: 0.75rem 1.125rem; border-bottom: 1px solid var(--tide-mist); font-size: 0.8125rem; font-weight: 600; letter-spacing: 0; }
.task-group > h3.task-group__party, .task-group > h4.task-group__party { margin: 0; padding: 0.75rem 1.125rem 0.25rem; border-bottom: 0; color: var(--ink-soft); font-size: 0.8125rem; font-weight: 600; }
.task-count { color: var(--ink-soft); font-size: 0.75rem; font-weight: 600; }
.task-section-head { display: flex; margin: 0 0 1rem; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.5rem 1rem; }
.task-section-head h2 { margin: 0; font-size: 1.25rem; }
.task-section-head__actions { display: flex; align-items: center; gap: 0.5rem; }
.task-rows { display: flex; margin: 0 0 1rem; padding: 0; flex-direction: column; gap: 0.5rem; list-style: none; }
.task-row { position: relative; display: grid; padding: 0.75rem 1rem; grid-template-columns: 3.5rem minmax(0, 1fr) auto; align-items: center; gap: 1rem; border: 1px solid var(--rule); border-radius: 0.625rem; background: var(--porcelain); }
.task-row:has(.task-row__title:focus-visible) { outline: 3px solid var(--tide); outline-offset: 2px; }
.task-group .task-rows { margin: 0; gap: 0; }
.task-group .task-row { border: 0; border-bottom: 1px solid #eef0f3; border-radius: 0; padding: 1rem 1.25rem; }
.task-group .task-row:last-child { border-bottom: 0; border-radius: 0 0 0.75rem 0.75rem; }
.task-group .task-row__title::after { border-radius: 0; }
.task-row--waiting { color: var(--ink-soft); }
.task-row--waiting .task-row__tile, .task-row--waiting .task-row__title { opacity: 0.6; }
.done-tasks { margin: 0 0 1.75rem; }
.done-tasks > summary { display: flex; min-height: 2.75rem; align-items: center; gap: 0.5rem; color: var(--ink-soft); cursor: pointer; list-style: none; }
.done-tasks > summary::-webkit-details-marker { display: none; }
.done-tasks > summary::before { content: ""; width: 0.4rem; height: 0.4rem; margin: 0 0.3rem 0 0.2rem; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(-45deg); transition: transform 0.15s ease; }
.done-tasks[open] > summary::before { transform: rotate(45deg); }
.done-tasks > summary:hover { color: var(--ink); }
.done-tasks:has(> summary:focus-visible) > summary { outline: 3px solid var(--tide); outline-offset: 2px; border-radius: 0.375rem; }
.done-tasks__label { font-weight: 600; }
.done-tasks__count { font-weight: 500; }
.done-tasks[open] > .task-rows { margin-top: 0.5rem; border: 1px solid var(--rule); border-radius: 0.75rem; background: var(--porcelain); box-shadow: var(--shadow-card); gap: 0; }
.done-tasks .task-row { border: 0; border-bottom: 1px solid #eef0f3; border-radius: 0; padding: 0.875rem 1.125rem; }
.done-tasks .task-row:last-child { border-bottom: 0; border-radius: 0 0 0.75rem 0.75rem; }
.done-tasks .task-row__title::after { border-radius: 0; }
.done-tasks__more { margin: 0.75rem 0 0; }
.calm-seas { display: flex; padding: 6rem 1rem 1rem; flex-direction: column; align-items: center; gap: 0.75rem; text-align: center; }
.calm-seas__art { overflow: hidden; }
.calm-seas h2 { margin: 0.5rem 0 0; font-size: 1.125rem; font-weight: 600; }
.calm-seas p { margin: 0; color: var(--ink-soft); }
.calm-seas__boat { transform-box: fill-box; transform-origin: 50% 100%; animation: calm-seas-bob 3.2s ease-in-out infinite; }
.calm-seas__swell-back { animation: calm-seas-swell 7s linear infinite; }
.calm-seas__swell-front { animation: calm-seas-swell 4.5s linear infinite; }
.calm-seas__gull { animation: calm-seas-drift 6s ease-in-out infinite; }
@keyframes calm-seas-bob { 0%, 100% { transform: translateY(0) rotate(-3deg); } 50% { transform: translateY(3px) rotate(3deg); } }
@keyframes calm-seas-swell { from { transform: translateX(0); } to { transform: translateX(-50px); } }
@keyframes calm-seas-drift { 0%, 100% { transform: translate(0, 0); } 50% { transform: translate(10px, -3px); } }
@media (prefers-reduced-motion: reduce) { .calm-seas__boat, .calm-seas__swell-back, .calm-seas__swell-front, .calm-seas__gull { animation: none; } }
.task-row__tile .task-tile { width: 3.5rem; }
.task-row__title { color: var(--ink); font-weight: 650; text-decoration: none; overflow-wrap: anywhere; }
.task-row__title::after { content: ""; position: absolute; inset: 0; border-radius: 0.625rem; }
.task-row__title:focus-visible { outline: none; }
.task-row__meta { margin: 0.2rem 0 0; color: var(--ink-soft); font-size: 0.85rem; overflow-wrap: anywhere; }
.task-row__meta strong { color: var(--amber); }
.task-row__side { position: relative; z-index: 1; display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 0.5rem 0.625rem; }
.twain-ai, .twain-ai-reviewed { display: inline-flex; align-items: center; gap: 0.3rem; min-height: 1.5rem; padding: 0 0.6rem; border-radius: 999px; font-size: 0.75rem; font-weight: 650; line-height: 1.2; white-space: nowrap; vertical-align: middle; }
.twain-ai { color: #5b3fb5; background: #efeafd; }
.twain-ai-reviewed { color: #3f4753; background: var(--tide-mist); font-weight: 600; }
.twain-ai__icon { flex: none; }
.notice-findings__head { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.75rem; margin-bottom: 0.25rem; }
.notice-findings__head h3 { margin: 0; }
.notice-findings__head form { margin: 0 0 0 auto; }
.notice-fact, .notice-deadline { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 0.625rem 1rem; padding: 1rem 0; border-top: 1px solid var(--rule); }
.notice-deadline { margin: 0.5rem 0 0; padding: 1rem 0.75rem; border-top: 0; border-radius: 0.6rem; background: var(--tide-mist); }
.notice-fact__body { flex: 1 1 16rem; min-width: 0; }
.notice-fact__label { margin: 0; color: var(--ink-soft); font-size: 0.8125rem; font-weight: 600; }
.notice-fact__value { margin: 0.1rem 0 0; font-weight: 650; overflow-wrap: anywhere; }
.notice-deadline__date { margin: 0.1rem 0 0; font-size: 1.0625rem; font-weight: 650; }
.notice-deadline__effect { margin: 0.375rem 0 0; color: var(--ink-soft); font-size: 0.8125rem; }
.notice-quote { margin: 0.25rem 0 0; padding: 0.375rem 0.625rem; border-radius: 0.4rem; background: var(--paper); color: var(--ink-soft); font-size: 0.8125rem; overflow-wrap: anywhere; }
.notice-fact__actions { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 0.375rem; }
.notice-fact__actions form { margin: 0; }
.notice-fact__edit > summary { list-style: none; cursor: pointer; }
.notice-fact__edit[open] { flex-basis: 100%; }
.calculated-tag { display: inline-flex; align-items: center; min-height: 1.25rem; padding: 0 0.5rem; border-radius: 999px; color: var(--ink-soft); background: var(--paper); font-size: 0.75rem; font-weight: 650; }
.calculated-tag--passed { color: var(--red); background: var(--red-pale); }
.task-tag { display: inline-flex; min-height: 1.75rem; padding: 0 0.625rem; align-items: center; border-radius: 999px; font-size: 0.8125rem; font-weight: 650; white-space: nowrap; }
.task-tag--deadline { color: var(--amber); background: var(--amber-pale); }
.task-tag--wait { color: var(--ink-soft); background: var(--paper); box-shadow: inset 0 0 0 1px var(--rule); }
.task-tag--warn { color: var(--red); background: var(--red-pale); }
.task-tag--state { color: var(--ink-soft); background: var(--tide-mist); }
.task-row__side form { margin: 0; }
.task-row__more { position: relative; z-index: 1; margin: 0.2rem 0 0; }
.task-row__more > summary { display: inline-block; min-height: 1.5rem; padding: 0; color: var(--ink-soft); font-size: 0.8125rem; list-style: none; cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }
.task-row__more > summary::-webkit-details-marker { display: none; }
.task-row__more > p { margin: 0.2rem 0 0; color: var(--ink-soft); font-size: 0.8125rem; }
.row-menu { position: relative; }
.task-row:has(.row-menu[open]) { z-index: 2; }
.row-menu > summary { display: inline-flex; width: 2.125rem; height: 2.125rem; align-items: center; justify-content: center; border: 1px solid var(--rule-strong); border-radius: 0.5rem; color: var(--ink-soft); background: var(--porcelain); list-style: none; cursor: pointer; }
.row-menu > summary::-webkit-details-marker { display: none; }
.row-menu > summary svg { fill: currentColor; }
.row-menu__panel { position: absolute; top: calc(100% + 0.25rem); right: 0; z-index: 10; min-width: 12rem; padding: 0.75rem; border: 1px solid var(--rule); border-radius: 0.625rem; background: #fff; box-shadow: var(--shadow-float); }
.row-menu__panel > form { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; }
.row-menu__panel > form p { margin: 0; }
.deadline-strip > h2 { margin: 0 0 1rem; color: var(--ink-soft); font-size: 0.8125rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; }
.deadline-strip__cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(16.25rem, 100%), 1fr)); gap: 0.625rem; }
.deadline-card { display: flex; min-height: 2.75rem; padding: 0.875rem 1rem; flex-direction: column; gap: 0.25rem; border: 1px solid var(--rule); border-radius: 0.625rem; color: var(--ink); background: var(--porcelain); text-decoration: none; }
.deadline-card__due { color: var(--amber); font-style: normal; font-weight: 600; }
.deadline-card__due--late { color: var(--red); }
.deadline-card span { color: var(--ink-soft); font-size: 0.85rem; }
.deadline-card:hover { border-color: var(--rule-strong); background: var(--paper); }
.deadline-card:focus-visible { outline: 3px solid var(--tide); outline-offset: 2px; }
.segmented { display: inline-flex; margin: 0; padding: 0.25rem; flex-wrap: wrap; gap: 0.25rem; border-radius: 0.625rem; background: #f1f3f5; }
.segmented a { display: flex; min-height: 2.75rem; padding: 0 0.875rem; align-items: center; gap: 0.35rem; border-radius: 0.5rem; color: var(--ink-soft); font-size: 0.875rem; font-weight: 500; text-decoration: none; }
.segmented a:hover { color: var(--ink); }
.segmented a[aria-current="page"] { color: var(--ink); background: var(--porcelain); box-shadow: var(--shadow-segment); font-weight: 600; }
.segmented a:focus-visible { outline: 3px solid var(--tide); outline-offset: -3px; }
.back-link { margin: 0 0 0.75rem; font-weight: 600; }
.new-task h1 { margin-bottom: 2rem; }
:is(h1, h2, h3, .page-intro, .task-section-head, .segmented, .list-controls, .queue-filters, .status-line) + :is(.notice, .empty-state) { margin-top: 1rem; }
:is(.status-line, .task-section-head, .page-intro, .segmented, .action-form) + :is(.task-rows, .task-group, .panel, .matter-table, .finding-cards, .note-day) { margin-top: 1rem; }
.panel-card { display: flex; padding: 1.5rem; flex-direction: column; gap: 1.25rem; border: 1px solid var(--rule); border-radius: 0.75rem; background: var(--porcelain); box-shadow: var(--shadow-card); }
.new-task { max-width: 40rem; }
.new-task-form .field, .new-task-form .field:has(+ .form-actions) { margin-bottom: 0; }
.new-task-form__pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; }
.new-task-form__date { max-width: 19rem; }
.new-task-form__actions { margin-top: 0; justify-content: flex-start; gap: 1.25rem; }
.matter-picker { position: relative; }
.matter-picker__list { position: absolute; z-index: 5; top: calc(100% + 0.25rem); right: 0; left: 0; max-height: 18rem; overflow-y: auto; padding: 0.25rem; border: 1px solid var(--rule-strong); border-radius: 0.5rem; background: var(--porcelain); box-shadow: var(--shadow-float); }
.matter-picker__group { padding: 0.5rem 0.75rem 0.25rem; color: var(--ink-soft); font-size: 0.75rem; font-weight: 600; }
.matter-picker__option { display: flex; min-height: 44px; padding: 0.375rem 0.75rem; flex-direction: column; justify-content: center; border-radius: 0.375rem; cursor: pointer; }
.matter-picker__option:hover, .matter-picker__option--active { background: var(--paper); }
.matter-picker__option-client { font-weight: 600; }
.matter-picker__option-meta { color: var(--ink-soft); font-size: 0.8125rem; font-weight: 400; }
.matter-picker__empty { padding: 0.75rem; color: var(--ink-soft); font-size: 0.875rem; font-weight: 400; }
.matter-picker__chip { display: flex; min-height: 2.75rem; padding: 0.25rem 0.25rem 0.25rem 0.75rem; align-items: center; justify-content: space-between; gap: 0.75rem; border: 1px solid #9fc8d1; border-radius: 0.5rem; background: var(--tide-pale); }
.matter-picker__chip[hidden] { display: none; }
.matter-picker__chip-text { display: flex; min-width: 0; flex-direction: column; }
.matter-picker__chip-text small { color: var(--ink-soft); font-size: 0.8125rem; font-weight: 400; }
.matter-picker__clear { flex: none; width: 2.75rem; min-height: 2.75rem; border: 0; border-radius: 0.5rem; color: var(--ink-soft); background: transparent; font-size: 1.25rem; line-height: 1; cursor: pointer; }
.matter-picker__clear:hover { color: var(--ink); background: rgba(255, 255, 255, 0.7); }
.matter-picker__clear:focus-visible { outline: 3px solid var(--tide); outline-offset: -3px; }
@media (max-width: 40rem) {
  .new-task-form__pair { grid-template-columns: 1fr; }
}
@media (max-width: 46rem) {
  .page-intro:has(.segmented) { flex-wrap: wrap; align-items: center; gap: 0.75rem 1rem; }
  .task-row { grid-template-columns: 3rem minmax(0, 1fr); gap: 0.75rem; }
  .task-row__tile .task-tile { width: 3rem; }
  .task-row__side { grid-column: 2; justify-content: flex-start; }
  .panel-card { padding: 1rem; }
}
.task-detail__action-icon,
.task-detail__done-icon { display: block; width: 0.875rem; height: 0.875rem; flex: none; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }

/* The task page: its pills, follow-up card, actions and sections look the same at every width.
   The phone rules below only resize them and give the page its phone header. */
.task-detail { display: flex; max-width: 48rem; flex-direction: column; gap: 1rem; }
.task-detail > * { margin: 0; }
.task-detail__details { overflow-wrap: anywhere; }
.task-pills { display: flex; flex-wrap: wrap; gap: 0.375rem; }
.task-pill { display: inline-flex; min-height: 1.75rem; padding: 0 0.625rem; align-items: center; gap: 0.375rem; border-radius: 999px; font-size: 0.8125rem; font-weight: 600; }
.task-pill__dot { width: 0.4375rem; height: 0.4375rem; border-radius: 50%; background: currentColor; }
.task-pill--open { color: var(--tide-deep); background: var(--tide-pale); }
.task-pill--waiting { color: var(--amber); background: var(--amber-pale); }
.task-pill--done { color: var(--green); background: var(--green-pale); }
.task-pill--cancelled { color: var(--ink-soft); background: var(--tide-mist); }
.task-pill--owner { color: var(--ink); background: var(--porcelain); box-shadow: inset 0 0 0 1px var(--rule); }
.task-pill__avatar { display: grid; width: 1.125rem; height: 1.125rem; place-items: center; border-radius: 50%; color: var(--porcelain); background: var(--tide); font-size: 0.5625rem; font-weight: 800; }
.task-pill__avatar:empty { display: none; }
.task-pill--warn { color: var(--amber); background: var(--amber-pale); }
.task-attention { display: flex; padding: 0.875rem; align-items: center; gap: 0.875rem; border: 1px solid var(--rule); border-radius: 0.75rem; background: var(--porcelain); box-shadow: var(--shadow-card); }
.task-attention .task-tile { width: 3.25rem; height: 3.5rem; }
.task-attention .task-tile b { font-size: 1.375rem; }
.task-attention__text { display: flex; margin: 0; flex-direction: column; gap: 0.125rem; }
.task-attention__label { color: var(--ink-soft); font-size: 0.8125rem; }
.task-attention__date { font-size: 1.0625rem; font-weight: 650; }
.task-detail__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem; }
.task-detail__actions form { margin: 0; }
.task-detail__primary,
.task-detail__done { gap: 0.5rem; border: 0; border-radius: 0.875rem; font-weight: 650; }
.task-detail__primary { color: var(--porcelain); background: var(--tide); box-shadow: var(--shadow-action); }
.task-detail__primary:hover { color: var(--porcelain); background: var(--tide-deep); }
.task-detail__done { color: var(--ink); background: var(--porcelain); box-shadow: inset 0 0 0 1.5px var(--rule); }
.task-detail__action-icon,
.task-detail__done-icon { width: 1.125rem; height: 1.125rem; }
.task-detail__done-icon { stroke: var(--green); }
.task-sections { overflow: hidden; border: 1px solid var(--rule); border-radius: 0.75rem; background: var(--porcelain); box-shadow: var(--shadow-card); }
.task-section + .task-section { border-top: 1px solid var(--tide-mist); }
.task-section > summary { display: flex; min-height: 3.375rem; padding: 0 1rem; align-items: center; gap: 0.75rem; font-size: 1rem; font-weight: 600; list-style: none; cursor: pointer; }
.task-section > summary::-webkit-details-marker { display: none; }
.task-section > summary:hover { background: var(--paper); }
.task-section > summary:focus-visible { outline: 3px solid var(--tide); outline-offset: -3px; }
.task-section__tile { display: grid; width: 2rem; height: 2rem; flex: none; place-items: center; border-radius: 0.5625rem; color: var(--tide); background: var(--tide-mist); }
.task-section__icon { display: block; width: 1.0625rem; height: 1.0625rem; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
/* One disclosure chevron for the phone menu's rows and the task page's sections. */
.phone-menu__chevron,
.task-section__chevron { width: 0.5rem; height: 0.5rem; margin: 0 0.25rem 0 auto; flex: none; border-right: 2px solid var(--rule-strong); border-bottom: 2px solid var(--rule-strong); transform: rotate(-45deg); }
.task-section[open] .task-section__chevron { transform: rotate(45deg); }
.task-section__body { padding: 0.25rem 1rem 1rem; }
.task-section__body .pagination:empty { display: none; }
.task-section__body .record-notes li { overflow-wrap: anywhere; }

@media not all and (max-width: 46rem) {
  .phone-bar,
  .phone-only { display: none !important; }
}

@media (max-width: 46rem) {
  .desktop-only,
  .app-header__inner { display: none !important; }

  /* Header and full-screen menu. The sheet scrolls below the bar, so the menu
     button stays in place and becomes the close button. */
  .app-header { position: relative; z-index: 20; background: var(--porcelain); }
  .phone-bar { display: flex; min-height: 3.75rem; padding: 0.625rem 0.5rem 0.375rem 1rem; align-items: center; justify-content: space-between; gap: 0.5rem; }
  .phone-bar__brand { position: relative; z-index: 2; min-height: 2.75rem; padding: 0; font-size: 1.125rem; }
  .brand-star-button { min-width: 2.75rem; min-height: 2.75rem; }
  .brand__home { display: inline-flex; min-height: 2.75rem; align-items: center; }
  .phone-bar__back { position: relative; z-index: 2; display: inline-flex; min-height: 2.75rem; margin-left: -0.75rem; padding: 0 0.625rem 0 0.25rem; align-items: center; gap: 0.125rem; border-radius: 0.75rem; color: var(--tide); font-size: 1rem; font-weight: 600; text-decoration: none; }
  .phone-bar__back-icon { width: 1.25rem; height: 1.25rem; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
  /* A page with a header back link does not repeat it as a breadcrumb to the same place. */
  body:has(.phone-bar__back) .note-reader__breadcrumb { display: none; }
  .phone-menu > summary { position: relative; z-index: 2; display: grid; width: 2.75rem; height: 2.75rem; place-items: center; border-radius: 0.75rem; color: var(--ink); list-style: none; cursor: pointer; }
  .phone-menu > summary::-webkit-details-marker { display: none; }
  .phone-menu > summary:hover { background: var(--tide-mist); }
  .phone-menu > summary svg { width: 1.375rem; height: 1.375rem; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
  .phone-menu__close-icon,
  .phone-menu__close-label,
  .phone-menu[open] .phone-menu__open-icon,
  .phone-menu[open] .phone-menu__open-label { display: none; }
  .phone-menu[open] .phone-menu__close-icon { display: block; }
  .phone-menu[open] .phone-menu__close-label { display: inline; }
  .phone-menu__sheet { position: fixed; inset: 3.75rem 0 0; z-index: 1; display: flex; padding: 0.75rem 1rem 2rem; flex-direction: column; gap: 1.25rem; overflow-y: auto; overscroll-behavior: contain; background: var(--paper); }
  html:has(.phone-menu[open]) { overflow: hidden; }
  .phone-menu__panel { margin: 0; flex-shrink: 0; overflow: hidden; border-radius: 1rem; background: var(--porcelain); box-shadow: var(--shadow-card); }
  .phone-menu__nav { display: flex; padding: 0.375rem; flex-direction: column; gap: 0.125rem; }
  .phone-menu__nav-row { display: flex; min-height: 3.75rem; padding: 0 0.875rem; align-items: center; gap: 0.875rem; border-radius: 0.875rem; color: var(--ink); font-size: 1.125rem; font-weight: 650; text-decoration: none; }
  .phone-menu__nav-row:hover { background: var(--paper); }
  .phone-menu__nav-row[aria-current="page"] { color: var(--tide-deep); background: var(--tide-pale); }
  .phone-menu__tile { display: grid; width: 2.5rem; height: 2.5rem; flex: none; place-items: center; border-radius: 0.75rem; color: var(--tide); background: var(--tide-mist); }
  .phone-menu__nav-row[aria-current="page"] .phone-menu__tile { color: var(--porcelain); background: var(--tide); }
  .phone-menu__icon { display: block; width: 1.25rem; height: 1.25rem; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
  .phone-menu__account { display: flex; margin: 0; padding: 0.875rem 1rem; align-items: center; gap: 0.75rem; font-size: 1.0625rem; }
  .phone-menu__avatar { display: grid; width: 2.5rem; height: 2.5rem; flex: none; place-items: center; border-radius: 50%; color: var(--porcelain); background: var(--tide); font-size: 0.9375rem; font-weight: 800; }
  .phone-menu__row { display: flex; min-height: 3.25rem; padding: 0 1rem; align-items: center; gap: 0.75rem; border-top: 1px solid var(--tide-mist); color: var(--ink); font-size: 1rem; text-decoration: none; list-style: none; cursor: pointer; }
  .phone-menu__row:hover { background: var(--paper); }
  .phone-menu__row[aria-current="page"] { color: var(--tide-deep); font-weight: 650; }
  .phone-menu__row-icon { display: grid; place-items: center; color: var(--ink-soft); }
  .phone-menu__logout { width: 100%; min-height: 3.25rem; border: 0; color: var(--red); background: transparent; font-size: 1rem; font-weight: 600; }
  .phone-menu__logout:hover { background: var(--red-pale); }
  .phone-menu__panel a:focus-visible,
  .phone-menu__panel summary:focus-visible,
  .phone-menu__logout:focus-visible { outline: 3px solid var(--tide); outline-offset: -3px; }
  .phone-bar__brand .firm-tile--bar { width: 1.625rem; height: 1.625rem; margin-left: 0.5rem; font-size: 0.6875rem; letter-spacing: 0; }
  .phone-firms__list { display: grid; margin: 0; padding: 0.375rem; }
  .phone-firms .firm-option { min-height: 3.25rem; gap: 0.75rem; border-radius: 0.625rem; font-size: 1rem; }
  .phone-firms .firm-tile { width: 1.875rem; height: 1.875rem; border-radius: 0.5rem; }

  .app-main { padding: 0.5rem 1rem 3rem; }

  .list-controls { margin: 0 0 0.875rem; }
  .matter-body__main h3 { margin: 1.25rem 0 0.625rem; }

  /* Task page: the matter header gives way to the back link and the client link. */
  .app-main:has(.task-detail) .matter-header,
  .app-main:has(.task-detail) .matter-summary,
  .app-main:has(.task-detail) .matter-nav { display: none; }
  .task-detail { padding-top: 0.375rem; gap: 0.875rem; }
  .task-detail__matter { padding: 0 0.25rem; }
  .task-detail__matter a { display: inline-flex; min-height: 2.75rem; margin: -0.75rem 0 -0.625rem; align-items: center; color: var(--tide); font-size: 0.875rem; font-weight: 700; letter-spacing: 0.02em; text-decoration: none; }
  .task-detail .page-intro { padding: 0 0.25rem; }
  .task-detail .page-intro h1, .task-detail .page-intro h2 { font-size: 1.875rem; font-weight: 750; letter-spacing: -0.02em; line-height: 1.1; overflow-wrap: anywhere; }
  .task-pills { padding: 0 0.25rem; }
  .task-detail__matter + .page-intro { margin-top: -0.375rem; }
  .task-detail .page-intro + .task-pills { margin-top: -0.125rem; }
  .task-detail__details { padding: 0 0.25rem; }
  .task-detail__actions { flex-direction: column; align-items: stretch; gap: 0.625rem; }
  .task-detail__primary,
  .task-detail__done { display: flex; width: 100%; min-height: 3.25rem; font-size: 1rem; }
}

.person-page__columns { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); align-items: start; gap: 1.25rem; }
.person-page__column { display: flex; min-width: 0; flex-direction: column; gap: 1.25rem; }
.person-card { padding: 1.25rem; border: 1px solid var(--rule); border-radius: 0.75rem; background: var(--porcelain); box-shadow: var(--shadow-card); overflow-wrap: anywhere; }
.person-card__heading { display: flex; margin-bottom: 0.75rem; align-items: baseline; justify-content: space-between; gap: 0.75rem; }
.person-card__heading h2, .person-card__heading h3 { margin: 0; font-size: 1.0625rem; }
.person-card .detail-grid { margin: 0; }
.person-card .section-disclosure { margin-top: 0.75rem; border-bottom: 0; }
.person-card__list { display: flex; margin: 0; padding: 0; flex-direction: column; gap: 0.75rem; list-style: none; }
.person-card__list li { display: flex; flex-direction: column; gap: 0.125rem; }
.person-card__meta { color: var(--ink-soft); font-size: 0.875rem; }
/* A phone's texting state under its number, with its consent history behind History. */
.phone-texts { display: flex; flex-direction: column; gap: 0.375rem; }
.phone-texts__state { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.625rem; }
.consent-chip { display: inline-flex; padding: 0.0625rem 0.5625rem; align-items: center; border-radius: 999px; color: var(--ink-soft); background: var(--tide-mist); font-size: 0.75rem; font-weight: 600; line-height: 1.5; white-space: nowrap; }
.consent-chip--on { color: var(--green); background: var(--green-pale); }
.consent-chip--off { color: var(--red); background: var(--red-pale); }
.phone-texts__history > summary { display: flex; min-height: 2.75rem; align-items: center; gap: 0.5rem; color: var(--ink-soft); font-weight: 600; list-style: none; cursor: pointer; }
.phone-texts__history > summary::-webkit-details-marker { display: none; }
.phone-texts__history > summary::before { content: ""; width: 0.45rem; height: 0.45rem; margin: 0 0.2rem; flex: none; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(-45deg); }
.phone-texts__history[open] > summary::before { transform: rotate(45deg); }
.phone-texts__history > summary:hover { color: var(--tide-deep); }
.consent-history { display: flex; padding: 0.5rem 0 0.25rem; flex-direction: column; gap: 1rem; }
.consent-history__row { display: flex; flex-direction: column; gap: 0.75rem; }
.person-card dl.consent-history__when { display: grid; margin: 0; grid-template-columns: max-content 1fr; gap: 0.5rem 1.125rem; font-size: 0.875rem; }
.person-card dl.consent-history__when dt { color: var(--ink-soft); font-size: inherit; font-weight: 400; white-space: nowrap; }
.person-card dl.consent-history__when dd { margin: 0; }
.consent-quote { margin: 0; padding: 0.625rem 0.875rem; border-left: 3px solid var(--rule-strong); border-radius: 0 0.5rem 0.5rem 0; color: var(--ink-soft); background: var(--paper); font-size: 0.875rem; }
.phone-texts__state > a { font-size: 0.875rem; }
.consent-history > .link-row { margin: 0; }
/* The call script staff read word for word, the answer and the attestation: on the new-lead form and the call page. */
.call-script { display: flex; flex-direction: column; gap: 1.5rem; }
.call-script__read { display: flex; flex-direction: column; gap: 0.5rem; }
.call-script__heading { font-weight: 650; }
.call-script__text { margin: 0; padding: 1rem 1.125rem; border: 1px solid var(--rule); border-radius: 0.625rem; background: var(--paper); font-size: 1.0625rem; line-height: 1.6; }
.call-script .field { margin-bottom: 0; }
.call-script__attest { padding-top: 1rem; border-top: 1px solid var(--rule); }
.call-script__footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.75rem; }
.call-script__footer .form-actions { margin: 0; }
.person-card .link-row { margin-bottom: 0; }
.person-card form { margin: 0; }
.fee-agreement-prepare .person-card { margin: 1rem 0 0; }
.fee-agreement-prepare fieldset.person-card { min-width: 0; }
.fee-agreement-prepare__attorney { padding-top: 0.75rem; border-top: 1px solid var(--rule); }
.fee-agreement-prepare__attorney:first-child { padding-top: 0; border-top: 0; }
.fee-agreement-prepare__attorney-name { margin: 0; }
.fee-agreement-prepare__attorney label { display: inline-flex; margin-right: 1rem; align-items: center; gap: 0.375rem; }
.matter-details__columns { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; gap: 1.25rem; }
.matter-details__columns .person-card h4 { margin: 0.75rem 0 0.5rem; font-size: 0.9375rem; }
.matter-details__columns .person-card section + section { margin-top: 0.75rem; padding-top: 0.75rem; border-top: 1px solid var(--rule); }
@media (max-width: 56.25rem) {
  .matter-details__columns { grid-template-columns: minmax(0, 1fr); }
}
.people-matters { display: flex; margin: 0; padding: 0; flex-direction: column; gap: 0.125rem; list-style: none; }
@media (max-width: 46rem) {
  .person-page__columns { grid-template-columns: minmax(0, 1fr); }
  .person-card { padding: 1rem; }
}

/* The Notes tab: the composer, filters and feed beside the Key facts, and the person page's About card. */
.notes-layout { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); align-items: start; gap: 1.25rem; }
.notes-layout__main { display: flex; min-width: 0; flex-direction: column; gap: 1rem; }
.note-composer { display: flex; margin: 0; flex-direction: column; gap: 1.25rem; }
/* Containers that space their children with gap: a field adds no margin of its own. */
:is(.deadline-form, .panel-card, .note-composer, .conversation-card, .rfc-start) > :is(.field, .field--wide, .field-grid) { margin-bottom: 0; }
h2 + :is(.deadline-form, .panel-card) { margin-top: 1rem; }
.note-composer .form-actions { margin-top: 0; }
.note-composer .note-call-time { display: none; }
/* A call about the case is saved for review; any other note is just saved. */
.note-composer .note-save__call { display: none; }
.note-composer:has(#note-source-call:checked):not(:has(input[name="about"]:not([value=""]):checked)) .note-save__call { display: inline; }
.note-composer:has(#note-source-call:checked):not(:has(input[name="about"]:not([value=""]):checked)) .note-save__plain { display: none; }
.note-composer:has(#note-source-call:checked) .note-call-time { display: block; }
.note-call-time > .field { margin-bottom: 0; }
/* An update that came with a call has a time and is saved for review; with no call it is just saved. */
.lead-update-form .lead-call-time { display: none; }
.lead-update-form .lead-call-time > .field { margin-bottom: 0; }
.lead-update-form .lead-save__call { display: none; }
.lead-update-form:has(input[name="call"]:checked:not([value="none"])) .lead-call-time { display: block; }
.lead-update-form:has(input[name="call"]:checked:not([value="none"])) .lead-save__call { display: inline; }
.lead-update-form:has(input[name="call"]:checked:not([value="none"])) .lead-save__plain { display: none; }
.note-pills { display: flex; flex-wrap: wrap; gap: 0.375rem; }
.note-pills input { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.note-pills label { display: inline-flex; min-height: 2.75rem; padding: 0 0.75rem; align-items: center; border: 1px solid var(--rule); border-radius: 999px; background: var(--porcelain); font-size: 0.875rem; font-weight: 600; cursor: pointer; }
.note-pills input:checked + label { border-color: var(--tide-deep); color: var(--porcelain); background: var(--tide-deep); }
.note-pills input:focus-visible + label { outline: 2px solid var(--tide-deep); outline-offset: 2px; }
.note-about { display: flex; align-items: center; gap: 0.5rem; font-size: 0.875rem; }
.note-about input { width: auto; }
.note-filters { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; font-size: 0.875rem; }
.note-composer + .note-filters { margin-top: 1rem; }
.note-filters + .note-filters { margin-top: -0.25rem; }
.notes-layout__main > .note-filters--topics { margin-bottom: 0.5rem; }
.note-composer fieldset.field { gap: 0; }
.note-composer fieldset.field > legend { margin-bottom: 0.5rem; }
.note-filters a[aria-current="page"] { color: var(--ink); font-weight: 700; text-decoration: none; }
.note-day { display: flex; flex-direction: column; gap: 0.75rem; }
.note-day h3 { margin: 0.5rem 0 0; color: var(--ink-soft); font-size: 0.8125rem; font-weight: 600; }
.note-entry { display: flex; padding: 1rem 1.125rem; flex-direction: column; gap: 0.5rem; border: 1px solid var(--rule); border-radius: 0.75rem; background: var(--porcelain); box-shadow: var(--shadow-card); }
.note-entry .note-reader__body { font-size: 0.9375rem; line-height: 1.55; }
.note-entry__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 0.375rem; color: var(--ink-soft); font-size: 0.8125rem; }
.note-entry__call { margin: 0; color: var(--ink-soft); font-size: 0.875rem; }
.note-entry__meta .text-action { margin-left: auto; padding: 0; }
.note-entry__earlier summary { color: var(--ink-soft); font-size: 0.8125rem; cursor: pointer; }
.note-entry__version { display: flex; margin-top: 0.5rem; padding-left: 0.75rem; flex-direction: column; gap: 0.25rem; border-left: 2px solid var(--rule); }
.note-entry__version .note-entry__meta { margin: 0; }
.note-edit__applied { margin-top: 1.5rem; }
.note-edit__applied-list { display: flex; margin: 0; padding: 0; flex-direction: column; gap: 0.5rem; list-style: none; }
.note-edit__applied-list li { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem; }
.note-entry__footer { display: flex; align-items: center; justify-content: flex-end; gap: 0.75rem; }
.pagination__total { color: var(--ink-soft); font-size: 0.875rem; }
.note-chip { display: inline-flex; padding: 0.05rem 0.5rem; border-radius: 999px; color: #374151; background: var(--tide-mist); font-size: 0.75rem; font-weight: 600; }
.note-chip--about { color: var(--tide-deep); background: var(--tide-pale); }
.note-pin { margin: 0; }
.note-pin__button { min-height: 2.75rem; padding: 0.15rem 0.9rem; border: 1px solid var(--rule); border-radius: 999px; color: var(--ink-soft); background: transparent; font-size: 0.8125rem; cursor: pointer; }
.note-pin__button[aria-pressed="true"] { border-color: var(--amber); color: var(--amber); background: var(--amber-pale); font-weight: 700; }
.note-pin__button[aria-pressed="true"]::before { content: "✓ "; }
.note-topics { display: flex; min-width: 0; flex: 1 1 auto; flex-wrap: wrap; align-items: center; gap: 0.375rem; }
.note-topic { display: inline-flex; min-height: 2rem; padding: 0 0.625rem; align-items: center; border: 1px solid var(--tide-deep); border-radius: 999px; color: var(--tide-deep); background: var(--tide-pale); font-size: 0.8125rem; font-weight: 600; }
.note-topic__status { color: var(--ink-soft); font-size: 0.8125rem; }
.note-topic-suggestions { display: flex; min-width: 0; flex: 1 1 100%; flex-wrap: wrap; align-items: center; gap: 0.5rem; padding: 0.375rem 0.375rem 0.375rem 0.75rem; border: 1px dashed #a7834e; border-radius: 0.625rem; color: #6b5128; background: #fbf6ec; font-size: 0.875rem; font-weight: 600; }
.note-topic-suggestions__labels { margin-right: auto; }
.note-topic-suggestions__accept { margin: 0; }
.note-topic-editor > summary { list-style: none; cursor: pointer; }
.note-topic-editor > summary::-webkit-details-marker { display: none; }
.note-topic-editor > summary.text-action { font-size: 0.875rem; }
.note-topic-editor[open] .note-topic-editor__closed, .note-topic-editor:not([open]) .note-topic-editor__open { display: none; }
.note-topic-editor[open] { flex-basis: 100%; }
.note-topic-editor__form { display: flex; margin: 0.5rem 0 0; padding: 0.75rem; flex-direction: column; align-items: flex-start; gap: 0.75rem; border: 1px solid var(--rule); border-radius: 0.625rem; color: var(--ink); background: var(--porcelain); font-weight: 400; }
.note-topic-editor__choices { display: flex; min-width: 0; margin: 0; padding: 0; flex-wrap: wrap; gap: 0.375rem; border: 0; }
.note-topic-editor__choices legend { margin: 0 0 0.375rem; padding: 0; color: var(--ink-soft); font-size: 0.8125rem; font-weight: 600; }
.note-topic-choice { display: inline-flex; min-height: 2.75rem; padding: 0 0.875rem; align-items: center; gap: 0.375rem; border: 1px solid var(--rule); border-radius: 999px; background: var(--porcelain); font-size: 0.875rem; font-weight: 600; cursor: pointer; }
.note-topic-choice input { margin: 0; accent-color: var(--tide-deep); }
.note-topic-choice:has(input:checked) { border-color: var(--tide-deep); color: var(--tide-deep); background: var(--tide-pale); }
.note-topic-choice:has(input:focus-visible) { outline: 2px solid var(--tide-deep); outline-offset: 2px; }
.note-filters__label { color: var(--ink-soft); font-weight: 600; }
/* A call note's recap: its line under the note, the result notice, and the review page. */
.call-recap-line { display: flex; margin: 0; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.75rem; color: var(--ink-soft); font-size: 0.875rem; }
.call-recap-inline-form { margin: 0; }
.call-recap-wait { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.5rem 0.75rem; padding: 0.625rem 0.75rem; border-radius: 0.5rem; color: var(--amber); background: var(--amber-pale); font-size: 0.875rem; font-weight: 600; }
.call-recap-wait__text { margin-right: auto; }
.call-recap-led { display: flex; margin: 0; flex-wrap: wrap; align-items: center; gap: 0.375rem 0.875rem; padding: 0.625rem 0.75rem; border-radius: 0.5rem; background: var(--paper); font-size: 0.875rem; }
.call-recap-led a { display: inline-flex; min-height: 2.75rem; align-items: center; }
.call-recap-led__label { color: var(--ink-soft); font-weight: 600; }
.call-recap-led__missed { color: var(--amber); }
.call-recap-review { display: flex; max-width: 76rem; margin: 0 auto; flex-direction: column; gap: 0.75rem; }
.call-recap-review > .back-link { margin: 0; }
.call-recap-review .page-intro { margin: 0; }
.call-recap-subtitle { display: flex; flex-wrap: wrap; align-items: center; gap: 0.375rem 0.875rem; margin: 0.25rem 0; font-size: 0.9375rem; }
.call-recap-subtitle .call-recap-saved-mark { font-size: 0.8125rem; }
.call-recap-layout { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); align-items: start; gap: 1.5rem 2rem; }
.call-recap-source { position: sticky; top: 1rem; max-height: calc(100vh - 2rem); padding: 1rem; overflow-y: auto; border: 1px solid var(--rule); border-radius: 0.5rem; background: var(--porcelain); overflow-wrap: anywhere; }
.call-recap-source h2 { margin: 0; font-size: 1.0625rem; font-weight: 650; }
.call-recap-source h3 { margin: 1.25rem 0 0; color: var(--ink-soft); font-size: 0.8125rem; font-weight: 650; }
.call-recap-text { margin: 0.75rem 0; line-height: 1.7; }
.call-recap-text p { margin: 0 0 0.75rem; }
.call-recap-quote { padding: 0 0.125rem; border-radius: 0.25rem; color: inherit; background: var(--tide-pale); }
.call-recap-quote.is-linked, .call-recap-quote:target { background: var(--amber-pale); outline: 2px solid var(--amber); }
.call-recap-ref { display: inline-flex; min-width: 1.375rem; height: 1.375rem; margin-right: 0.25rem; padding: 0 0.25rem; box-sizing: border-box; align-items: center; justify-content: center; border-radius: 999px; color: var(--porcelain); background: var(--tide-deep); font-size: 0.75rem; font-weight: 700; line-height: 1; text-decoration: none; vertical-align: 0.0625em; }
a.call-recap-ref:focus-visible { outline: 3px solid var(--tide); outline-offset: 2px; }
.call-recap-saved-mark { color: var(--green); font-weight: 600; }
.call-recap-saved-mark::before { content: "✓ "; }
.call-recap-private, .call-recap-saved { margin: 0.625rem 0 0; color: var(--ink-soft); font-size: 0.8125rem; }
.call-recap-changes, .call-recap-form { display: flex; min-width: 0; margin: 0; flex-direction: column; gap: 1rem; }
.call-recap-state { padding: 1rem; border-radius: 0.5rem; background: var(--paper); }
.call-recap-state h2 { margin: 0; font-size: 1.0625rem; font-weight: 650; }
.call-recap-state p { margin: 0.5rem 0 0; }
.call-recap-state form { margin-top: 0.75rem; }
.call-recap-state--attention { color: var(--amber); background: var(--amber-pale); }
.call-recap-group { min-width: 0; margin: 0; padding: 0; border: 0; background: var(--porcelain); }
.call-recap-group > legend, .call-recap-group > h2 { float: left; width: 100%; margin: 0; padding: 0; color: var(--ink-soft); font-size: 0.8125rem; font-weight: 650; }
.call-recap-group > legend + * { clear: both; }
.call-recap-group__help { clear: both; margin: 0.5rem 0; color: var(--ink-soft); font-size: 0.8125rem; }
.call-recap-card { display: flex; clear: both; padding: 0.875rem 0.5rem; align-items: flex-start; gap: 0.875rem; border-bottom: 1px solid var(--rule); }
.call-recap-card.is-linked, .call-recap-card:target { background: var(--tide-pale); }
.call-recap-card:focus { outline: none; }
.call-recap-card__check { flex: none; width: 1.125rem; height: 1.125rem; margin: 1.5rem 0.375rem 0; accent-color: var(--tide-deep); }
.call-recap-card__check:focus-visible { outline: 3px solid var(--tide); outline-offset: 4px; }
.call-recap-card__body { display: flex; min-width: 0; flex: 1; flex-direction: column; gap: 0.375rem; }
.call-recap-card__effect { margin: 0; color: var(--ink-soft); font-size: 0.75rem; }
.call-recap-card__head { display: flex; flex-wrap: wrap; align-items: center; gap: 0.25rem 0.75rem; }
.call-recap-card__title { display: flex; min-height: 2.75rem; align-items: center; font-size: 1rem; font-weight: 650; overflow-wrap: anywhere; }
label.call-recap-card__title { cursor: pointer; }
.call-recap-card__value strong { font-weight: 650; }
.call-recap-card__details, .call-recap-card__meta { margin: 0; font-size: 0.875rem; overflow-wrap: anywhere; }
.call-recap-card__meta { color: var(--ink-soft); }
.call-recap-card__change { margin-top: 0.5rem; overflow-wrap: anywhere; }
.call-recap-card__field { color: var(--ink-soft); font-weight: 600; }
.call-recap-card__source { margin: 0.25rem 0 0; color: var(--ink-soft); font-size: 0.8125rem; overflow-wrap: anywhere; }
.call-recap-card__links, .call-recap-card__decided { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 1rem; }
.call-recap-card__links a { display: inline-flex; min-height: 2.75rem; align-items: center; }
.call-recap-task-facts { display: flex; margin: 0.25rem 0 0; flex-wrap: wrap; gap: 0.375rem 1.5rem; font-size: 0.8125rem; }
.call-recap-task-facts > div { display: flex; gap: 0.375rem; }
.call-recap-task-facts dt { color: var(--ink-soft); }
.call-recap-task-facts dd { margin: 0; font-weight: 600; }
.call-recap-change { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; align-items: center; font-size: 0.875rem; overflow-wrap: anywhere; }
.call-recap-change__label { display: block; margin-bottom: 0.125rem; color: var(--ink-soft); font-size: 0.75rem; font-weight: 400; }
.call-recap-card__open { display: inline-block; padding: 0.0625rem 0.5625rem; border-radius: 999px; color: var(--amber); background: var(--amber-pale); font-size: 0.75rem; font-weight: 600; }
.call-recap-card__outcome { color: var(--ink-soft); font-size: 0.875rem; }
.call-recap-card__outcome--applied { color: var(--green); font-weight: 650; }
.call-recap-card__outcome--missed { color: var(--amber); }
.call-recap-group__count { margin-left: 0.25rem; font-weight: 400; }
.call-recap-edit > summary { display: inline-flex; min-height: 2.75rem; align-items: center; list-style: none; cursor: pointer; }
.call-recap-edit > summary::-webkit-details-marker { display: none; }
.call-recap-edit__fields { display: grid; margin: 0.5rem 0; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.75rem; }
.call-recap-edit__fields > .field { margin-bottom: 0; }
.call-recap-edit__fields > .field--wide { grid-column: 1 / -1; }
.call-recap-work-date { display: flex; grid-column: 1 / -1; flex-wrap: wrap; align-items: end; gap: 0.75rem; margin: 0; padding: 0; border: 0; }
.call-recap-work-date > legend { padding: 0; font-size: 0.8125rem; }
.call-recap-work-date > .field { margin-bottom: 0; }
.call-recap-quotes { display: flex; margin: 0; padding: 0; clear: both; flex-direction: column; gap: 0.5rem; list-style: none; color: var(--ink-soft); font-size: 0.8125rem; }
.call-recap-footer { position: sticky; z-index: 2; bottom: 0; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.5rem 1rem; padding: 0.875rem 0; border-top: 1px solid var(--rule-strong); background: var(--porcelain); }
.call-recap-footer__count { font-size: 0.875rem; }
.call-recap-footer__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 1rem; }
@media (max-width: 60rem) {
  .call-recap-layout { grid-template-columns: minmax(0, 1fr); }
  .call-recap-source { position: static; max-height: none; overflow-y: visible; }
}
@media (max-width: 46rem) {
  .call-recap-edit__fields { grid-template-columns: minmax(0, 1fr); }
  .call-recap-card { gap: 0.5rem; }
  .call-recap-card__check { margin-left: 0; }
  .call-recap-footer { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 0 0.625rem; padding: 0.625rem 0; }
  .call-recap-footer__count { min-width: 0; font-size: 0.75rem; }
  .call-recap-footer__actions { display: contents; }
  .call-recap-footer__actions > .text-action { grid-column: 1; grid-row: 2; justify-self: start; font-size: 0.75rem; }
  .call-recap-footer__actions > .primary-action { grid-column: 2; grid-row: 1 / span 2; padding: 0.625rem; }
}
.key-facts { padding: 1.25rem; border: 1px solid var(--rule); border-radius: 0.75rem; background: var(--porcelain); box-shadow: var(--shadow-card); overflow-wrap: anywhere; }
.key-facts h2 { margin: 0 0 0.75rem; font-size: 1.0625rem; }
.key-facts__list { display: flex; margin: 0; padding: 0; flex-direction: column; gap: 0.75rem; list-style: none; }
.key-facts__meta { margin: 0.125rem 0 0; color: var(--ink-soft); font-size: 0.8125rem; }
@media (max-width: 46rem) {
  .notes-layout { grid-template-columns: minmax(0, 1fr); }
}

/* The portal invite, reset and turn-off pages: the invitation's message in a box, and the form that
   confirms the change set apart from the facts above it. */
.portal-message { margin: 1rem 0; padding: 1rem 1.25rem; border: 1px solid var(--rule); border-radius: 0.5rem; background: var(--porcelain); }
.note-composer.portal-confirm { margin-top: 1.5rem; }
/* Ask for documents: one card, then a panel previewing the client's card in the client portal's own colors. */
.request-card { border: 1px solid #dde1e6; border-radius: 12px; background: #ffffff; }
.request-form { max-width: 680px; }
.request-form .field-hint { display: block; margin: 0.25rem 0 0.5rem; }
.request-recipient { min-width: 0; margin: 0; padding: 0; border: 0; }
.request-recipient legend { margin-bottom: 0.5rem; font-size: 0.875rem; font-weight: 650; }
.request-recipient__choice { display: flex; min-height: 2.75rem; padding: 0.625rem; align-items: flex-start; gap: 0.625rem; border: 1px solid var(--rule); border-radius: 0.5rem; cursor: pointer; }
.request-recipient__choice + .request-recipient__choice { margin-top: 0.5rem; }
.request-recipient__choice input { width: auto; flex: none; margin-top: 0.2rem; }
.request-recipient__identity { min-width: 0; font-size: 0.875rem; overflow-wrap: anywhere; }
.request-recipient__identity > span { display: block; color: var(--ink-soft); }
.request-form__preview-action { padding: 0 1.25rem; }
.request-form__preview { margin-top: 1rem; border: 1px solid #dde1e6; border-radius: 12px; background: #fafbfc; }
.request-form__fields { display: flex; padding: 1.25rem; flex-direction: column; gap: 1rem; }
.request-form__row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 1rem; }
@media (max-width: 40rem) { .request-form__row { grid-template-columns: minmax(0, 1fr); gap: 1rem; } }
@media (max-width: 46rem) {
  .app-main:has(.request-page) .matter-header__actions,
  .app-main:has(.request-page) .matter-summary__row,
  .app-main:has(.request-page) .matter-nav { display: none; }
  .app-main:has(.request-page) .matter-header { padding-top: 0.5rem; padding-bottom: 0.75rem; }
  .app-main:has(.request-page) .matter-header__title { gap: 0.25rem 0.5rem; }
  .app-main:has(.request-page) .matter-header__title h1 { font-size: 1.25rem; overflow-wrap: anywhere; }
  .app-main:has(.request-page) .matter-header .lede { margin-bottom: 0; font-size: 0.8125rem; }
  .request-page .task-section-head { margin-top: 0.75rem; }
  .request-page .request-form__fields { padding: 1rem; }
}
.form-more { border-top: 1px solid #dde1e6; }
.form-more > summary { display: list-item; padding: 0.875rem 1.25rem 0.875rem 2.25rem; font-weight: 500; cursor: pointer; }
.form-more__body { padding: 0 1.25rem 1.25rem; }
.request-form__head h2 { margin: 0; font-size: 1.25rem; }
.request-form__head p { margin: 0.25rem 0 0; }
.request-form__footer--split { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.5rem 1rem; }
.request-form__footer--split > p { margin: 0; }
.request-form__footer--split .form-actions { margin: 0; }
.request-form__footer { margin: 0; padding: 0.75rem 1.25rem; border-top: 1px solid #dde1e6; border-radius: 0 0 12px 12px; background: #fafbfc; }
.segmented.request-kind { display: inline-flex; align-self: flex-start; }
.segmented a[aria-pressed="true"] { color: var(--ink); background: var(--porcelain); box-shadow: var(--shadow-segment); font-weight: 600; }
.request-preview__heading { margin: 0 0 0.5rem; color: var(--ink-soft); font-size: 0.75rem; font-weight: 700; letter-spacing: 0.06em; }
.request-preview__card { padding: 16px; border: 1px solid #c9cdd3; border-radius: 12px; color: #15181d; background: #ffffff; }
.request-preview__title { margin: 0 0 0.375rem; font-family: "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif; font-size: 19px; line-height: 1.3; overflow-wrap: anywhere; }
.request-preview__details { margin: 0 0 0.5rem; color: #15181d; overflow-wrap: anywhere; }
.request-preview__by { margin: 0 0 0.75rem; color: #4a505a; font-size: 15px; font-weight: 600; }
.request-preview__send { display: inline-flex; min-height: 2.5rem; padding: 0 1.25rem; align-items: center; border-radius: 999px; color: #ffffff; background: #1f4e43; font-weight: 600; }
.request-preview__note { margin: 0.75rem 0 0; color: var(--ink-soft); font-size: 0.875rem; }
/* Connected-assistant pages: consent card, connections table, proposal review and receipts, failure card. */
.mcp-wordmark { display: flex; margin: 2.5rem 0 0.5rem; justify-content: center; color: var(--ink); font-size: 1.875rem; }
.mcp-wordmark .brand-star-button { width: 1.0em; height: 1.0em; margin: 0 0.1333em 0 0; }
.mcp-wordmark .brand-star { width: 1.0em; height: 1.0em; }
.mcp-wordmark + .mcp-card { margin-top: 1rem; }
.mcp-card { width: min(30rem, calc(100% - 2rem)); margin: 3rem auto 1rem; border: 1px solid var(--rule); border-radius: 1rem; background: var(--porcelain); box-shadow: 0 8px 28px rgba(16, 24, 40, 0.08); overflow: hidden; }
.mcp-card__head { display: flex; padding: 1.75rem 1.75rem 1.25rem; flex-direction: column; align-items: center; gap: 1rem; text-align: center; }
.mcp-card__head h1, .mcp-state h1 { margin: 0; font-size: 1.375rem; letter-spacing: -0.015em; }
.mcp-card__head .mcp-muted { margin: 0.25rem 0 0; }
.mcp-card__head .mcp-firm { margin: 0.25rem 0 0; }
.mcp-muted { color: var(--ink-soft); }
.mcp-link { display: flex; align-items: center; gap: 0.625rem; color: #98a2b3; }
.mcp-tile { display: flex; width: 2.75rem; height: 2.75rem; flex: none; align-items: center; justify-content: center; border: 1px solid var(--rule); border-radius: 0.75rem; color: #374151; background: #f1f3f5; font-size: 1.0625rem; font-weight: 700; }
.mcp-tile--twainos { border: 0; background: #e8f1f3; }
.mcp-tile--small { width: 2rem; height: 2rem; border-radius: 0.5625rem; font-size: 0.875rem; }
.mcp-card__section { display: flex; padding: 0 1.75rem 1.125rem; flex-direction: column; gap: 0.625rem; }
.mcp-eyebrow { margin: 0; color: var(--ink-soft); font-size: 0.75rem; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; }
.mcp-can { display: flex; margin: 0; padding: 0; flex-direction: column; gap: 0.625rem; list-style: none; }
.mcp-can li { display: flex; align-items: flex-start; gap: 0.625rem; font-size: 0.9375rem; line-height: 1.4; }
.mcp-can--no { gap: 0.5rem; }
.mcp-can--no li { color: #374151; font-size: 0.875rem; }
.mcp-card__section--last { padding-bottom: 1.25rem; }
.mcp-can__icon { display: flex; width: 1.375rem; height: 1.375rem; flex: none; align-items: center; justify-content: center; border-radius: 50%; color: var(--green); background: var(--green-pale); }
.mcp-can__icon--no { color: var(--ink-soft); background: #f1f3f5; }
.mcp-note { display: flex; margin: 0 1.75rem 1.125rem; padding: 0.75rem 0.875rem; align-items: center; gap: 0.625rem; border: 1px solid var(--tide-mist); border-radius: 0.625rem; color: #374151; background: #f8f9fb; font-size: 0.8125rem; }
.mcp-note svg { flex: none; color: var(--ink-soft); }
.mcp-card__details { margin: 0 1.75rem 1.25rem; font-size: 0.8125rem; }
.mcp-card__details > summary { color: #374151; font-weight: 500; cursor: pointer; }
.mcp-card__details dl.detail-grid { margin-top: 0.625rem; }
.mcp-card__footer { display: flex; padding: 1rem 1.75rem; gap: 0.625rem; border-top: 1px solid var(--tide-mist); background: #fafbfc; }
.mcp-card__footer > * { flex: 1 1 0; }

.mcp-page { max-width: 55rem; margin: 0 auto; }
.mcp-page.proposal-review { max-width: 47.5rem; }
.mcp-title { display: flex; margin-bottom: 1.25rem; flex-wrap: wrap; align-items: center; gap: 0.75rem; }
.mcp-title h1 { margin: 0; font-size: 1.5rem; letter-spacing: -0.015em; }
.mcp-pill { padding: 0.125rem 0.5625rem; border-radius: 999px; color: var(--amber); background: var(--amber-pale); font-size: 0.75rem; font-weight: 600; }
.mcp-old { color: var(--ink-soft); text-decoration: line-through; }
.mcp-assistant { display: flex; align-items: center; gap: 0.625rem; }
.mcp-table__action { text-align: right; }
.mcp-table__action form { display: inline; }
.mcp-danger { min-height: 2.25rem; color: var(--red); }
.mcp-empty { display: flex; padding: 3rem 1.5rem; flex-direction: column; align-items: center; gap: 0.625rem; border: 1px dashed var(--rule-strong); border-radius: 0.75rem; background: var(--porcelain); text-align: center; }
.mcp-empty p { margin: 0; font-weight: 600; }
.mcp-empty__icon { display: flex; width: 2.75rem; height: 2.75rem; align-items: center; justify-content: center; border-radius: 0.75rem; color: var(--ink-soft); background: #f1f3f5; }

.mcp-group { margin: 0 0 1.25rem; border: 1px solid var(--rule); border-radius: 0.75rem; background: var(--porcelain); box-shadow: var(--shadow-card); overflow: hidden; }
.mcp-group__title { margin: 0; font-size: 0.9375rem; font-weight: 600; }
.mcp-group > .mcp-group__title { padding: 0.875rem 1.25rem; border-bottom: 1px solid var(--tide-mist); }
.mcp-group__body { display: flex; padding: 1.125rem 1.25rem; flex-direction: column; gap: 1rem; }
.mcp-group__body p { margin: 0; }
.mcp-group .section-disclosure { margin: 0; border-top: 1px solid var(--tide-mist); border-bottom: 0; }
.mcp-group__body > .section-disclosure { margin-block: 0; }
.mcp-group .section-disclosure > summary { min-height: 2.75rem; padding-block: 0.5rem; }
.mcp-group .section-disclosure ul { margin: 0.625rem 0 0; }
.mcp-receipt .section-disclosure { padding-inline: 1.25rem; }
.mcp-receipt__row { display: flex; padding: 1rem 1.25rem; flex-wrap: wrap; align-items: center; gap: 0.875rem; }
.mcp-receipt__icon { display: flex; width: 1.75rem; height: 1.75rem; flex: none; align-items: center; justify-content: center; border-radius: 50%; }
.mcp-receipt__icon--saved { color: var(--green); background: var(--green-pale); }
.mcp-receipt__icon--unsaved { color: var(--red); background: var(--red-pale); }
.mcp-receipt__text { flex: 1 1 16rem; }
.mcp-receipt__status { margin: 0; font-weight: 500; }
.mcp-receipt__status--saved { color: var(--green); }
.mcp-receipt__status--unsaved { color: var(--red); }
.mcp-receipt__text dl.detail-grid { margin-top: 0.375rem; }
.mcp-receipt .link-row { margin: 0; }
.mcp-title:has(+ .mcp-approved) { margin-bottom: 0.375rem; }
.mcp-approved { display: flex; margin: 0 0 1.25rem; flex-wrap: wrap; align-items: center; gap: 0.375rem; color: #3f4753; font-weight: 600; }
.mcp-approved svg { flex: none; color: var(--green); }
.mcp-receipt__row:has(.mcp-saved-tasks) { align-items: flex-start; }
.mcp-saved-tasks { margin: 0.75rem 0 0; padding: 0; list-style: none; }
.mcp-saved-tasks li { display: flex; padding: 0.75rem 0; flex-wrap: wrap; align-items: center; gap: 0.75rem; border-top: 1px solid var(--rule); }
.mcp-saved-tasks__text { min-width: 0; flex: 1 1 18rem; }
.mcp-saved-tasks__title { font-weight: 650; }
.mcp-saved-tasks__meta { color: var(--ink-soft); font-size: 0.82rem; }
.mcp-review__footer { display: flex; justify-content: flex-end; }
.mcp-review__footer form { margin: 0; }
@media (max-width: 46rem) { .mcp-review__footer, .mcp-review__footer form, .mcp-review__footer button { width: 100%; } }
.mcp-subject { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; }
.mcp-subject__tile { display: flex; width: 44px; height: 44px; flex: none; align-items: center; justify-content: center; border-radius: 50%; color: var(--tide-deep); background: var(--tide-pale); font-size: 15px; font-weight: 700; }
.mcp-subject__text { display: flex; flex: 1 1 200px; flex-direction: column; gap: 2px; }
.mcp-subject__text a { font-size: 16px; font-weight: 600; }
.mcp-subject__kind { color: var(--ink-soft); font-size: 12px; font-weight: 600; }
.mcp-chip { display: inline-flex; padding: 6px 12px; align-items: center; gap: 7px; border-radius: 999px; color: #374151; background: var(--tide-mist); font-size: 13px; font-weight: 600; }
.mcp-note-block { display: flex; flex-direction: column; gap: 6px; }
.mcp-note-block__text { margin: 0; padding: 14px 16px; border-radius: 10px; background: var(--paper); font-size: 15px; line-height: 1.55; white-space: pre-line; }

.mcp-state { display: flex; margin-top: 6rem; padding: 2rem 1.75rem; flex-direction: column; align-items: center; gap: 0.875rem; text-align: center; }
.mcp-state p { margin: 0; }
.mcp-state h1 { font-size: 1.25rem; }
.mcp-state__next { font-weight: 500; }
.mcp-state__icon { display: flex; width: 3rem; height: 3rem; align-items: center; justify-content: center; border-radius: 50%; }
.mcp-state__icon--unavailable { color: var(--amber); background: var(--amber-pale); }
.mcp-state__icon--failed { color: var(--red); background: var(--red-pale); }
.mcp-state__actions { display: flex; margin-top: 0.5rem; flex-wrap: wrap; justify-content: center; gap: 0.625rem; }
.client-files__sending-row { padding: 0.25rem 0.5rem 0.75rem; }
.client-files__sending-row .client-files__for { padding: 0.25rem 0.5rem; }
.client-files__sending-row .client-files__meta { margin: 0 0 0.5rem; padding: 0 0.5rem; }
.client-files__sending-row .primary-action { margin-left: 0.5rem; }
.file-review { display: flex; flex-direction: column; gap: 0.25rem; }
.file-review h2 { margin: 0; font-size: 1.5rem; }
.file-review__sent { margin: 0 0 1rem; }
.file-review__columns { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 1.25rem; }
.file-review__files { display: flex; flex: 1 1 12.5rem; max-width: 14.5rem; flex-direction: column; gap: 0.375rem; }
.file-review__sending { margin: 0.5rem 0 0; color: var(--ink-soft); font-size: 0.8125rem; }
.file-review__list { display: flex; margin: 0; padding: 0; flex-direction: column; gap: 0.375rem; list-style: none; }
.file-review__file { display: flex; padding: 0.625rem 0.75rem; flex-direction: column; gap: 0.25rem; border: 1px solid transparent; border-radius: 0.625rem; color: var(--ink); text-decoration: none; }
.file-review__file:hover { background: var(--paper); }
.file-review__file[aria-current="true"] { border-color: var(--tide); background: var(--tide-pale); }
.file-review__name { font-weight: 650; overflow-wrap: anywhere; }
.file-review__pill { align-self: flex-start; padding: 0 0.625rem; border-radius: 999px; color: var(--ink-soft); background: var(--tide-mist); font-size: 0.75rem; font-weight: 600; }
.file-review__pill--review, .file-review__pill--sent-back { color: var(--amber); background: var(--amber-pale); }
.file-review__pill--failed { color: var(--red); background: var(--red-pale); }
.file-review__pill--accepted { color: var(--green); background: var(--green-pale); }
.file-review__pill--ready { color: var(--green); background: var(--green-pale); }
.file-review__pill--send-back, .file-review__pill--not-client { color: var(--amber); background: var(--amber-pale); }
.file-review__checks { padding: 1.125rem 1.25rem; border: 1px solid var(--rule); border-radius: 0.75rem; }
.file-review__checks-head { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; margin-bottom: 0.25rem; }
.file-review__checks-head h3 { font-size: 0.9375rem; }
.file-review__check-list { margin: 0; padding: 0; list-style: none; }
.file-review__check { display: grid; padding: 0.625rem 0; grid-template-columns: 1.25rem minmax(0, 1fr); gap: 0.125rem 0.625rem; border-top: 1px solid var(--rule); }
.file-review__check > strong, .file-review__check-detail { grid-column: 2; overflow-wrap: anywhere; }
.file-review__check--plain { display: block; color: var(--ink-soft); }
.file-review__check-detail { color: var(--ink-soft); }
.file-review__mark { grid-row: 1; color: var(--ink-soft); font-weight: 700; }
.file-review__mark--ok { color: var(--green); }
.file-review__mark--warn { color: var(--amber); }
.file-review__message-label { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.5rem; }
.file-review__preview { display: flex; flex: 3 1 23.75rem; min-width: 0; padding: 1.5rem; flex-direction: column; align-items: center; gap: 1rem; border-radius: 0.75rem; background: var(--paper); }
.file-review__stage { display: flex; width: 100%; max-width: 27.5rem; min-height: 12rem; align-items: center; justify-content: center; }
.file-review__stage--tile { min-height: 16rem; border: 1px solid var(--rule); border-radius: 0.5rem; background: #ffffff; }
.file-review__tile { display: grid; width: 4.5rem; height: 4.5rem; place-items: center; border: 1px solid var(--rule); border-radius: 0.5rem; color: var(--ink-soft); font-size: 0.9rem; font-weight: 700; }
.file-review__stage--pdf { max-width: none; }
.file-review__pdf { display: block; width: 100%; height: 70vh; min-height: 30rem; border: 1px solid var(--rule); background: #ffffff; }
.file-review__own-name { display: block; color: var(--ink-soft); font-size: 0.8rem; font-weight: 400; overflow-wrap: anywhere; }
.file-review__image { display: block; max-width: 100%; max-height: 32rem; border: 1px solid var(--rule); background: #ffffff; object-fit: contain; }
.file-review__caption { margin: 0; color: var(--ink-soft); }
.file-review__side { display: flex; flex: 2 1 18.75rem; min-width: 0; flex-direction: column; gap: 0.75rem; }
.file-review__side h3 { margin: 0; font-size: 1.0625rem; overflow-wrap: anywhere; }
.file-review__side p { margin: 0; }
.file-review__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; }
.file-review__actions > form { display: flex; flex: 1 1 8.75rem; margin: 0; }
.file-review__actions > form .primary-action, .file-review__actions > .primary-action { flex: 1; }
.file-review__actions button[disabled] { cursor: not-allowed; opacity: 0.5; }
.file-review__send-back { display: flex; padding: 1.125rem 1.25rem; flex-direction: column; gap: 0.875rem; border: 1px solid var(--tide); border-radius: 0.75rem; }
.file-review__reasons { min-width: 0; margin: 0; padding: 0; border: 0; }
.file-review__reasons legend { margin-bottom: 0.5rem; padding: 0; font-weight: 600; }
.file-review__reason-list { display: flex; flex-wrap: wrap; gap: 0.375rem; }
.file-review__reason { display: inline-flex; min-height: 2.25rem; padding: 0 0.875rem; align-items: center; gap: 0.5rem; border: 1px solid var(--rule); border-radius: 999px; background: #ffffff; font-size: 0.875rem; }
.file-review__reason:has(input:checked) { border-color: var(--tide); color: var(--tide-deep); background: var(--tide-pale); font-weight: 650; }
.file-review__form-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; }
/* Leads: the new-lead count, queue rows, lead page, Take as client and Getting started. */
.nav-count { margin-left: auto; min-width: 1.25rem; padding: 0 0.5rem; border-radius: 999px; color: #ffffff; background: var(--tide); font-size: 0.75rem; font-weight: 600; line-height: 1.25rem; text-align: center; }
.nav-count--row { margin-left: auto; }
.sidebar-menu:not([open]) .nav-count { display: none; }
.status-badge--amber { color: var(--amber); background: var(--amber-pale); }
.status-badge--quiet { color: var(--ink-soft); background: var(--tide-mist); }
.lead-muted { color: var(--ink-soft); }

.lead-list__link { display: flex; flex-wrap: wrap; gap: 0.5rem 1.5rem; }
.lead-list__main { min-width: 0; flex: 1 1 16rem; display: grid; gap: 0.2rem; }
.lead-list__identity { display: flex; flex-wrap: wrap; align-items: center; gap: 0.25rem 0.5rem; grid-column: auto; }
.lead-list__profile { color: var(--ink-soft); font-size: 0.85rem; }
.lead-list__stage, .lead-list__update { min-width: 0; color: var(--ink-soft); font-size: 0.85rem; overflow-wrap: anywhere; }
.lead-list__stage { flex: 0 1 12.5rem; }
.lead-list__stage strong { display: block; color: var(--ink); font-size: 0.9rem; font-weight: 600; }
.lead-list__stage span { display: block; }
.lead-list__update { flex: 0 1 10rem; }
.lead-list__update .lead-list__label { display: block; }
.lead-list__open { flex: none; align-self: center; }

.lead-header__actions { flex-wrap: wrap; }
.lead-meta__claim { display: inline; margin: 0 0 0 0.25rem; }
.lead-meta__claim .lead-owner-control__action { min-height: 1.75rem; padding: 0.15rem 0.6rem; border-radius: 0.4rem; font-size: 0.8rem; }
.lead-contact-band { display: flex; flex-wrap: wrap; margin-bottom: 1.5rem; padding: 1rem 1.25rem; gap: 0.75rem 2.5rem; border-radius: 0.75rem; background: var(--paper); }
.lead-contact-band__item { display: grid; min-width: 0; gap: 0.1rem; }
.lead-contact-band__label { color: var(--ink-soft); font-size: 0.75rem; font-weight: 600; }
.lead-contact-band__value { font-weight: 600; overflow-wrap: anywhere; }
.lead-columns { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 1.5rem; }
.lead-panel { min-width: 0; flex: 1 1 24rem; padding: 1.25rem; border: 1px solid var(--rule); border-radius: 0.75rem; background: var(--porcelain); }
.lead-panel h2 { margin: 0; font-size: 1rem; font-weight: 600; }
.lead-timeline-section h2 { margin-bottom: 0.75rem; }
.lead-panel__head { display: flex; margin-bottom: 0.75rem; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 0.25rem 1rem; }
.lead-panel__block { margin-top: 1.25rem; padding-top: 1rem; border-top: 1px solid var(--tide-mist); }
.lead-panel__block p { margin: 0; }
.lead-panel .lead-timeline__entry { padding-right: 0; padding-left: 0; }
.lead-timeline-section > form, .lead-timeline-section > .lead-note-composer { margin-top: 1rem; }
.lead-note-composer { border-top: 1px solid var(--rule); border-bottom: 0; }
.lead-intake-foot { display: flex; margin-top: 1.25rem; padding-top: 1rem; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 0.5rem 1rem; border-top: 1px solid var(--rule); }
.lead-change { min-width: 0; flex: 0 1 auto; }
.lead-change > summary { cursor: pointer; color: var(--tide-deep); font-weight: 600; }
.lead-change[open] { flex: 1 1 100%; }
.lead-change .action-form { margin-top: 0.75rem; }

.take-form { max-width: 47.5rem; }
.take-form > h1 { margin: 0 0 1.25rem; }
.take-step { display: flex; padding: 1.5rem 0; gap: 1rem; border-top: 1px solid var(--rule); }
.take-step__num { display: flex; width: 1.75rem; height: 1.75rem; flex: none; align-items: center; justify-content: center; border-radius: 999px; color: var(--tide-deep); background: var(--tide-pale); font-weight: 700; }
.take-step__body { min-width: 0; flex: 1; }
.take-step__body h2 { margin: 0.1rem 0 0.9rem; font-size: 1rem; font-weight: 650; }
.take-step__body .lead-choice-list { margin: 1rem 0 0; }
.take-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.take-form .form-actions { padding-top: 1.5rem; border-top: 1px solid var(--rule); }
@media (max-width: 40rem) {
  .take-grid { grid-template-columns: minmax(0, 1fr); }
}

.getting-started { margin-bottom: 2rem; }
.getting-started__head { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; }
.getting-started__head h2 { margin: 0; font-size: 1rem; font-weight: 650; }
.getting-started__count { color: var(--ink-soft); }
.getting-started__bar { display: block; width: 100%; height: 0.375rem; margin: 0.5rem 0; border: 0; border-radius: 999px; background: var(--tide-mist); appearance: none; overflow: hidden; }
.getting-started__bar::-webkit-progress-bar { background: var(--tide-mist); }
.getting-started__bar::-webkit-progress-value { background: var(--tide); }
.getting-started__bar::-moz-progress-bar { background: var(--tide); }
.getting-started__list { margin: 0; padding: 0; list-style: none; }
.getting-started__item { display: flex; min-height: 3rem; padding: 0.5rem 0; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.75rem; border-bottom: 1px solid var(--rule); }
.getting-started__check, .getting-started__ring { display: flex; width: 1.25rem; height: 1.25rem; flex: none; align-items: center; justify-content: center; border-radius: 999px; }
.getting-started__check { color: #ffffff; background: var(--green); }
.getting-started__ring { border: 2px solid var(--rule-strong); }
.getting-started__title { min-width: 0; flex: 1 1 12rem; overflow-wrap: anywhere; }
.getting-started__title--first { font-weight: 600; }
.getting-started__when { color: var(--ink-soft); }
.getting-started__item--waiting { color: var(--ink-soft); }
.getting-started__item--waiting .getting-started__ring { opacity: 0.6; }
.getting-started__waiting { display: block; font-size: 0.8125rem; }
@media (max-width: 52rem) {
  .lead-header__actions { flex: 1 1 100%; margin-left: 0; }
  .lead-panel { flex-basis: 100%; }
  .lead-list__stage, .lead-list__update { flex: 1 1 8rem; }
}
.file-review__menu { display: flex; flex-direction: column; align-items: flex-start; gap: 0.5rem; }
.file-review__move { display: flex; padding: 1.125rem 1.25rem; flex-direction: column; gap: 0.75rem; border: 1px solid var(--amber); border-radius: 0.75rem; background: var(--amber-pale); }
.file-review__move-facts { margin: 0; padding-left: 1.125rem; }
.file-review__move .text-action { align-self: center; }
.file-review__title { display: flex; flex-wrap: wrap; align-items: center; gap: 0.625rem; }
.file-review__badge { padding: 0 0.625rem; border-radius: 999px; color: var(--amber); background: var(--amber-pale); font-size: 0.75rem; font-weight: 600; }
.file-review__flagged { padding: 1.125rem 1.25rem; border: 1px solid var(--rule); border-radius: 0.75rem; }
.file-review__flagged h3 { margin: 0 0 0.625rem; font-size: 0.9375rem; }
.file-review__facts { display: grid; margin: 0; grid-template-columns: max-content minmax(0, 1fr); gap: 0.375rem 1rem; }
.file-review__facts dt { color: var(--ink-soft); }
.file-review__facts dd { margin: 0; overflow-wrap: anywhere; }
.file-review__decide { display: flex; flex-direction: column; gap: 1rem; }
.file-review__options { display: flex; min-width: 0; margin: 0; padding: 0; flex-direction: column; gap: 0.5rem; border: 0; }
.file-review__options legend { margin-bottom: 0.5rem; padding: 0; font-weight: 650; }
.file-review__option { display: flex; padding: 0.875rem 1rem; align-items: flex-start; gap: 0.75rem; border: 1px solid var(--rule); border-radius: 0.625rem; cursor: pointer; }
.file-review__option:has(input:checked) { border-color: var(--tide); background: var(--tide-pale); }
.file-review__option input { margin: 0.2rem 0 0; }
.file-review__option > span { display: flex; flex-direction: column; }
.file-review__history ol { margin: 0.5rem 0 0; padding-left: 1.125rem; }
.file-review__history p { margin: 0.25rem 0 0; overflow-wrap: anywhere; }

.messages-card { margin: 0; padding: 0.25rem; border: 1px solid var(--rule); border-radius: 0.75rem; background: var(--porcelain); list-style: none; }
.messages-row + .messages-row { border-top: 1px solid var(--rule); }
.messages-row__link { display: grid; min-height: 4.25rem; padding: 0.75rem 1rem; grid-template-columns: minmax(0, 1fr) auto; gap: 0.2rem 1rem; align-items: center; border-radius: 0.55rem; color: var(--ink); text-decoration: none; }
.messages-row__link:hover { background: var(--tide-pale); }
.messages-row__link:focus-visible { outline-offset: -3px; }
.messages-row__sender { min-width: 0; font-size: 1rem; font-weight: 650; overflow-wrap: anywhere; }
.messages-row__time { color: var(--ink-soft); font-size: 0.8rem; white-space: nowrap; }
.messages-row__text { min-width: 0; overflow: hidden; color: var(--ink-soft); text-overflow: ellipsis; white-space: nowrap; }
.messages-row__chips { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 0.35rem; }
.messages-chip { display: inline-flex; min-height: 1.4rem; padding: 0.125rem 0.5625rem; align-items: center; border-radius: 999px; color: var(--ink-soft); background: var(--paper); font-size: 0.75rem; font-weight: 600; line-height: 1.2; white-space: nowrap; }
.messages-chip--new { color: var(--tide-deep); background: var(--tide-pale); }
.messages-chip--stop { color: var(--red); background: var(--red-pale); }
.messages-hidden { margin: 0.75rem 0 0; color: var(--ink-soft); font-size: 0.85rem; }
.conversation-head { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.75rem; margin-bottom: 1.25rem; }
.conversation-head h1 { margin: 0; overflow-wrap: anywhere; }
.conversation-layout { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 1.25rem; }
.conversation-thread { display: flex; min-width: 0; padding: 1.25rem; flex: 1 1 26rem; flex-direction: column; gap: 1rem; border: 1px solid var(--rule); border-radius: 0.75rem; background: var(--porcelain); list-style: none; margin: 0; }
.conversation-message { display: flex; flex-direction: column; align-items: flex-start; gap: 0.3rem; }
.conversation-message__time { color: var(--ink-soft); font-size: 0.8rem; }
.conversation-message__media { display: flex; flex-wrap: wrap; gap: 0.3rem; }
.messages-chip--media { color: var(--tide-deep); background: var(--tide-pale); text-decoration: none; }
.messages-chip--media:hover, .messages-chip--media:focus-visible { text-decoration: underline; }
@media (max-width: 47.99rem) {
  .messages-chip--media { position: relative; }
  .messages-chip--media::before { content: ""; position: absolute; top: 50%; right: 0; left: 0; height: 2.75rem; transform: translateY(-50%); }
}
.call-glyph { flex: none; color: var(--ink-soft); vertical-align: -0.15em; }
.call-glyph--missed { color: var(--red); }
.conversation-call__line { display: flex; margin: 0; align-items: center; gap: 0.4rem; color: var(--ink-soft); overflow-wrap: anywhere; }
.conversation-message__bubble { max-width: 100%; margin: 0; padding: 0.6rem 0.85rem; border-radius: 0.75rem 0.75rem 0.75rem 0.25rem; background: var(--paper); white-space: pre-wrap; overflow-wrap: anywhere; }
.conversation-side { display: flex; min-width: 0; flex: 0 1 20rem; flex-direction: column; gap: 1.25rem; }
.conversation-card { padding: 1.25rem; border: 1px solid var(--rule); border-radius: 0.75rem; background: var(--porcelain); }
.conversation-card dl { display: grid; margin: 0; grid-template-columns: auto minmax(0, 1fr); gap: 0.5rem 1rem; }
.conversation-card dt { color: var(--ink-soft); }
.conversation-card dd { margin: 0; overflow-wrap: anywhere; }
.conversation-actions { display: flex; flex-direction: column; gap: 0.75rem; }
.conversation-actions form { margin: 0; }
.conversation-actions form button { width: 100%; }
.conversation-actions details summary { min-height: 2.75rem; display: flex; align-items: center; color: var(--ink-soft); cursor: pointer; }
.conversation-actions details[open] { display: flex; flex-direction: column; gap: 0.5rem; }
.conversation-end { min-height: 2.75rem; padding: 0.5rem 0.875rem; border: 1px solid #f1b8b2; border-radius: 0.5rem; color: var(--red); background: var(--porcelain); font-weight: 500; }
.conversation-end:hover { border-color: var(--red); color: #ffffff; background: var(--red); }
.conversation-actions details p { margin: 0; color: var(--ink-soft); font-size: 0.85rem; }
.messages-row__provenance { margin: 0; padding: 0 1rem 0.75rem; color: var(--ink-soft); font-size: 0.8rem; }
.messages-chip--linked { color: var(--green); background: var(--green-pale); }
.conversation-who, .conversation-link { margin-bottom: 1.25rem; }
.conversation-who h2 { margin: 0 0 0.75rem; font-size: 1.1rem; }
.conversation-who__form { margin: 0; }
.conversation-who__choices { display: flex; flex-direction: column; gap: 0.5rem; margin: 0; padding: 0; border: 0; }
.conversation-who__choices legend { margin-bottom: 0.25rem; }
.conversation-who__option { display: contents; }
.conversation-who__choice { display: flex; align-items: flex-start; gap: 0.6rem; order: 0; }
.conversation-who__choice input { margin-top: 0.3rem; }
.conversation-who__choice label { display: flex; flex-direction: column; gap: 0.15rem; }
.conversation-who__note { color: var(--ink-soft); font-size: 0.85rem; }
.conversation-who__search { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; order: 0; margin: 0 0 0 1.6rem; }
.conversation-who__search input { min-width: 0; flex: 1 1 12rem; }
.conversation-who__act { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 1rem; order: 1; margin-top: 0.5rem; }
@supports selector(:has(*)) {
  .conversation-who__act { display: none; }
  .conversation-who__option:has(> .conversation-who__choice input:checked) > .conversation-who__act { display: flex; }
}
.conversation-who__hint { margin: -0.75rem 0 1.25rem; color: var(--ink-soft); font-size: 0.85rem; }
.conversation-link > * { margin: 0; }
.conversation-link { display: flex; flex-direction: column; gap: 0.5rem; }
.conversation-link__target { font-weight: 650; }
.conversation-change > summary { min-height: 2.75rem; display: inline-flex; align-items: center; color: var(--tide-deep); font-weight: 650; cursor: pointer; }
.conversation-change[open] .conversation-who__form { display: flex; flex-direction: column; gap: 0.75rem; }
.conversation-message--out { align-items: flex-end; }
.conversation-message--out .conversation-message__bubble { border-radius: 0.75rem 0.75rem 0.25rem 0.75rem; color: var(--tide-deep); background: var(--tide-pale); }
.reply-column { display: flex; min-width: 0; flex: 1 1 26rem; flex-direction: column; gap: 1.25rem; }
.reply-column > .conversation-thread { flex: none; }
.reply-card h2 { font-size: 1.1rem; }
.reply-form { display: flex; margin: 0; flex-direction: column; gap: 0.6rem; }
.reply-form .field { margin: 0; }
.reply-form textarea { width: 100%; min-height: 5.5rem; box-sizing: border-box; resize: vertical; }
.reply-muted { color: var(--ink-soft); font-size: 0.875rem; }
.reply-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.6rem; }
.reply-actions { display: flex; flex-wrap: wrap; gap: 0.6rem; }
.ask-form { display: flex; margin: 0; flex-direction: column; gap: 0.4rem; }
.ask-form fieldset { margin: 0; padding: 0; border: 0; }
.conversation-card .texting-notice { margin: 0.75rem 0 0; font-size: 0.875rem; font-weight: 500; }
.reply-lock { display: flex; padding: 0.75rem 0.875rem; flex-direction: column; gap: 0.35rem; border: 1px solid #f3c7a6; border-radius: 0.5rem; background: var(--amber-pale); }
@media (max-width: 40rem) { .reply-wide { display: none; } }