:root {
  color-scheme: dark;
  --bg: #090d16;
  --surface: #101722;
  --surface-strong: #151e2c;
  --text: #edf2f7;
  --muted: #9aa8ba;
  --primary: #b8cbe0;
  --primary-strong: #7898bb;
  --accent: #9182c9;
  --border: rgba(184, 203, 224, 0.16);
  --danger: #dda0a8;
  --radius: 10px;
  --shadow: 0 12px 36px rgba(0, 0, 0, 0.2);
  --panel-bg: rgba(16, 23, 34, 0.94);
  --input-bg: #080d16;
  --option-bg: #101722;
  --option-selected-bg: #263a52;
  --focus-ring: #8cc7ff;
  --disabled-text: #718095;
  --warning-text: #ffe7a8;
  --warning-bg: #4b3814;
  --warning-border: #a77c24;
}

:root[data-theme="light"] { color-scheme: light; }

* {
  box-sizing: border-box;
}

[hidden] {
  display: none !important;
}

html {
  min-width: 320px;
}

body {
  margin: 0;
  color: var(--text);
  background: var(--bg);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.5;
}

body.portal-body,
body.admin-app-body {
  min-height: 100vh;
  background:
    linear-gradient(135deg, rgba(79, 140, 255, 0.1), transparent 30rem),
    radial-gradient(circle at 80% 6%, rgba(143, 92, 255, 0.15), transparent 28rem),
    var(--bg);
  background-attachment: fixed;
  background-repeat: no-repeat;
  background-size: cover;
}

a {
  color: inherit;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
  outline: 3px solid var(--focus-ring);
  outline-offset: 3px;
}

button,
input,
textarea,
select {
  font: inherit;
}

.skip-link {
  position: absolute;
  top: 0.8rem;
  left: 0.8rem;
  z-index: 5;
  transform: translateY(-150%);
  border-radius: var(--radius);
  padding: 0.7rem 1rem;
  color: var(--bg);
  background: var(--primary);
  font-weight: 600;
}

.skip-link:focus {
  transform: translateY(0);
}

.site-header,
.admin-nav,
.page-shell,
.admin-shell,
.footer {
  width: min(1180px, calc(100% - 32px));
  margin-inline: auto;
}

.site-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  padding: 1.1rem 0;
}

.site-header nav,
.admin-header form {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem;
  align-items: center;
}

.brand {
  display: inline-flex;
  gap: 0.8rem;
  align-items: center;
  color: var(--text);
  text-decoration: none;
}

.brand img {
  width: 44px;
  height: 44px;
  object-fit: contain;
}

.brand strong,
.brand small {
  display: block;
}

.brand small,
.eyebrow,
small {
  color: var(--muted);
}

.brand.centered {
  justify-content: center;
}

.subtle-link,
.footer a,
.info-panel a,
td a {
  color: var(--primary);
  font-weight: 500;
}

.page-shell {
  display: grid;
  gap: 1.2rem;
  padding: 2rem 0 4rem;
}

.page-shell.narrow,
.login-shell {
  width: min(760px, calc(100% - 32px));
  margin: 0 auto;
}

.intro-panel,
.wizard-card,
.confirmation-card,
.login-card,
.info-panel,
.table-panel,
.count-card,
.alert {
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--panel-bg);
  box-shadow: var(--shadow);
}

.intro-panel,
.confirmation-card,
.login-card,
.info-panel,
.table-panel {
  padding: clamp(1.1rem, 3vw, 1.8rem);
}

.intro-panel h1,
.confirmation-card h1,
.login-card h1,
.admin-shell h1 {
  max-width: 820px;
  margin: 0.2rem 0 0.8rem;
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 700;
  line-height: 1.08;
  letter-spacing: -0.025em;
}

.intro-panel p,
.confirmation-card p,
.placeholder-panel p {
  max-width: 760px;
  color: var(--muted);
}

.eyebrow {
  margin: 0 0 0.4rem;
  font-size: 0.733rem;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.privacy-note {
  border-left: 3px solid var(--accent);
  padding-left: 0.9rem;
}

.email-fallback {
  margin-bottom: 0;
}

.alert {
  padding: 1rem 1.2rem;
  color: #ffe8ef;
  border-color: rgba(255, 155, 186, 0.38);
  background: rgba(85, 24, 50, 0.76);
}

.alert.compact {
  margin: 0 0 1rem;
}

.alert.success {
  color: #e8fff7;
  border-color: rgba(112, 255, 207, 0.34);
  background: rgba(18, 82, 65, 0.62);
}

.alert.warning {
  color: var(--warning-text);
  border-color: var(--warning-border);
  background: var(--warning-bg);
}

.wizard-card {
  overflow: hidden;
}

.wizard-progress {
  display: grid;
  gap: 0.55rem;
  border-bottom: 1px solid var(--border);
  padding: 1rem clamp(1.1rem, 3vw, 1.8rem);
  color: var(--primary);
  font-size: 0.88rem;
  font-weight: 600;
}

.progress-track {
  height: 8px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.08);
}

.progress-track span {
  display: block;
  width: 20%;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--primary-strong), var(--accent));
  transition: width 180ms ease;
}

.required-note {
  margin: 0;
  color: var(--muted);
  font-size: 0.9rem;
  font-weight: 500;
}

.required-mark {
  display: inline;
  color: var(--danger);
  font-weight: 600;
}

.field-error {
  display: none;
  margin: 0.35rem 0 0;
  color: #ffdbe5;
  font-weight: 500;
}

.field-error.is-visible {
  display: block;
}

.wizard-step {
  display: none;
  padding: clamp(1.1rem, 3vw, 1.8rem);
}

.wizard-step.is-active {
  display: block;
}

.step-heading {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: baseline;
  margin-bottom: 1rem;
}

.step-heading span {
  color: var(--primary);
  font-size: 0.84rem;
  font-weight: 500;
}

.step-heading h2,
.info-panel h2,
.table-panel h2 {
  margin: 0;
  font-size: 1.35rem;
}

.choice-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.75rem;
}

.choice {
  display: flex;
  position: relative;
  min-height: 68px;
  gap: 0.7rem;
  align-items: center;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 0.75rem;
  background: rgba(255, 255, 255, 0.04);
  cursor: pointer;
}

.choice:has(input:checked) {
  border-color: rgba(140, 199, 255, 0.58);
  background: rgba(79, 140, 255, 0.16);
  box-shadow: inset 0 0 0 1px rgba(140, 199, 255, 0.26);
}

.choice:has(input:checked)::after {
  content: "Selected";
  position: absolute;
  right: 0.65rem;
  top: 0.55rem;
  color: var(--primary);
  font-size: 0.68rem;
  font-weight: 600;
  text-transform: uppercase;
}

.choice-grid.is-invalid {
  border: 1px solid rgba(255, 155, 186, 0.58);
  border-radius: var(--radius);
  padding: 0.75rem;
  background: rgba(85, 24, 50, 0.24);
}

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

.form-grid.two-col {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

label span {
  display: block;
  margin-bottom: 0.35rem;
  color: var(--muted);
  font-weight: 500;
}

input,
textarea,
select {
  width: 100%;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  color: var(--text);
  background: var(--input-bg);
  padding: 0.75rem 0.82rem;
}

select option,
select optgroup {
  color: var(--text);
  background-color: var(--option-bg);
}

select option:checked {
  color: var(--text);
  background-color: var(--option-selected-bg);
}

input:disabled,
textarea:disabled,
select:disabled,
option:disabled {
  color: var(--disabled-text);
  cursor: not-allowed;
  opacity: 1;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus {
  -webkit-text-fill-color: var(--text);
  caret-color: var(--text);
  box-shadow: 0 0 0 1000px var(--input-bg) inset;
  transition: background-color 9999s ease-out;
}

input.is-invalid,
textarea.is-invalid,
select.is-invalid {
  border-color: rgba(255, 155, 186, 0.72);
  box-shadow: 0 0 0 1px rgba(255, 155, 186, 0.28);
  background: rgba(85, 24, 50, 0.24);
}

input:user-invalid,
textarea:user-invalid,
select:user-invalid {
  border-color: var(--danger);
  box-shadow: 0 0 0 1px color-mix(in srgb,var(--danger) 32%,transparent);
}

textarea {
  resize: vertical;
}

.consent {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: auto 1fr;
  gap: 0.7rem;
  align-items: start;
}

.consent .field-error {
  grid-column: 1 / -1;
}

.consent input,
.choice input {
  width: auto;
  margin-top: 0.2rem;
}

.hp-field {
  position: absolute;
  left: -10000px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.wizard-actions,
.confirmation-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.7rem;
  justify-content: flex-end;
  border-top: 1px solid var(--border);
  padding: 1rem clamp(1.1rem, 3vw, 1.8rem);
  background: rgba(5, 8, 20, 0.42);
}

.button,
.btn {
  display: inline-flex;
  min-height: 40px;
  align-items: center;
  justify-content: center;
  border: 1px solid transparent;
  border-radius: var(--radius);
  padding: 0.68rem 1rem;
  font-size: 0.933rem;
  font-weight: 500;
  text-decoration: none;
  cursor: pointer;
}

.button:disabled,
.btn:disabled {
  cursor: not-allowed;
  opacity: 0.62;
}

.button-primary,
.btn-primary {
  color: #09101a;
  border-color: #afc7df;
  background: #b8cbe0;
}

a.button-primary {
  color: #09101a;
}

.button-secondary,
.btn-secondary {
  color: var(--text);
  border-color: rgba(184, 203, 224, 0.24);
  background: rgba(184, 203, 224, 0.08);
}

a.button-secondary,
a.button-ghost {
  color: var(--text);
}

.button-ghost,
.btn-ghost {
  color: var(--text);
  border-color: var(--border);
  background: rgba(255, 255, 255, 0.04);
}

.button-danger,
.btn-danger {
  color: #efc2c7;
  border-color: rgba(177, 81, 94, 0.42);
  background: rgba(106, 43, 53, 0.26);
}

.button-small,
.btn-small {
  min-height: 34px;
  padding: 0.4rem 0.65rem;
  font-size: 0.86rem;
  font-weight: 500;
}

.login-shell {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 2rem 0;
}

.login-card {
  width: 100%;
}

.admin-nav {
  display: flex;
  gap: 0.55rem;
  overflow-x: auto;
  border-block: 1px solid var(--border);
  padding: 0.7rem 0;
}

.admin-nav a {
  flex: 0 0 auto;
  border-bottom: 2px solid transparent;
  padding: 0.45rem 0.2rem;
  color: var(--muted);
  text-decoration: none;
}

.admin-nav a.is-active {
  color: var(--text);
  border-bottom-color: var(--primary);
}

.admin-shell {
  display: grid;
  gap: 1rem;
  padding: 2rem 0 4rem;
}

.lifecycle-panel {
  border-color: rgba(184, 203, 224, 0.25);
}

.lifecycle-actions {
  margin-top: 1rem;
}

.table-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.65rem;
  align-items: center;
  white-space: nowrap;
}

.table-actions form {
  margin: 0;
}

.table-action {
  border: 0;
  padding: 0;
  color: var(--primary);
  background: transparent;
  font-weight: 500;
  text-decoration: underline;
  cursor: pointer;
}

.section-heading h1,
.page-header h1 {
  margin-bottom: 0;
}

.section-heading p:last-child,
.page-header p:last-child,
.detail-header p {
  margin-bottom: 0;
}

.count-grid,
.status-grid,
.settings-grid {
  display: grid;
  gap: 0.75rem;
}

.count-grid {
  grid-template-columns: repeat(7, minmax(0, 1fr));
}

.status-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.settings-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 1rem;
}

.count-card,
.status-card {
  min-width: 0;
  padding: 0.85rem;
  color: var(--text);
  text-decoration: none;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: rgba(255, 255, 255, 0.04);
}

.count-card span,
.status-card span {
  display: block;
  color: var(--muted);
  font-size: 0.85rem;
}

.count-card strong,
.status-card strong {
  display: block;
  margin-top: 0.25rem;
}

.count-card strong {
  font-size: 2rem;
}

.table-toolbar,
.detail-header {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: start;
}

.toolbar-actions,
.panel-heading-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  align-items: center;
  justify-content: space-between;
}

.action-group {
  justify-content: flex-end;
}

.action-group > span {
  flex-basis: 100%;
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 500;
  text-align: right;
  text-transform: uppercase;
}

.panel-heading-row {
  margin-bottom: 0.8rem;
}

#stripe-checkout:target {
  border-color: rgba(140, 199, 255, 0.58);
  box-shadow: 0 0 0 3px rgba(140, 199, 255, 0.12);
}

.responsive-table {
  overflow-x: auto;
}

table {
  width: 100%;
  border-collapse: collapse;
}

th,
td {
  border-bottom: 1px solid var(--border);
  padding: 0.8rem 0.6rem;
  text-align: left;
  vertical-align: top;
}

.bulk-select-cell {
  box-sizing: border-box;
  padding: 0.5rem 0.35rem;
  text-align: center;
  vertical-align: middle;
  width: 46px;
}

.bulk-checkbox {
  align-items: center;
  cursor: pointer;
  display: inline-flex;
  justify-content: center;
  min-height: 36px;
  min-width: 36px;
  position: relative;
}

.bulk-checkbox input {
  height: 18px;
  margin: 0;
  opacity: 0;
  position: absolute;
  width: 18px;
}

.bulk-checkbox span {
  background: var(--surface-strong);
  border: 1px solid rgba(184, 203, 224, 0.55);
  border-radius: 5px;
  box-shadow: inset 0 0 0 2px rgba(15, 23, 42, 0.25);
  height: 18px;
  transition: background-color 140ms ease, border-color 140ms ease, box-shadow 140ms ease;
  width: 18px;
}

.bulk-checkbox input:checked + span,
.bulk-checkbox input:indeterminate + span {
  background: var(--primary);
  border-color: var(--primary);
  box-shadow: inset 0 0 0 4px var(--surface-strong);
}

.bulk-checkbox input:focus-visible + span {
  outline: 3px solid rgba(140, 199, 255, 0.35);
  outline-offset: 2px;
}

.bulk-actions {
  align-items: center;
  background: rgba(120, 152, 187, 0.08);
  border: 1px solid transparent;
  border-radius: var(--radius);
  display: none;
  flex-wrap: wrap;
  gap: 0.65rem 1rem;
  justify-content: space-between;
  margin-top: 1rem;
  padding: 0.7rem;
}

.bulk-actions.is-visible {
  border-color: rgba(140, 199, 255, 0.22);
  display: flex;
}

.bulk-actions small {
  color: var(--muted);
  flex-basis: 100%;
}

.table-row-selected td {
  background: rgba(140, 199, 255, 0.065);
  border-bottom-color: rgba(140, 199, 255, 0.25);
}

th {
  color: var(--muted);
  font-size: 0.8rem;
  text-transform: uppercase;
}

.money-table .numeric {
  text-align: right;
  white-space: nowrap;
}

.status-pill {
  display: inline-flex;
  border: 1px solid rgba(140, 199, 255, 0.4);
  border-radius: 999px;
  padding: 0.2rem 0.55rem;
  color: var(--primary);
  font-size: 0.8rem;
  font-weight: 500;
  white-space: nowrap;
  background: rgba(140, 199, 255, 0.08);
}

.status-sent,
.status-paid,
.status-active,
.status-accepted {
  border-color: rgba(112, 255, 207, 0.4);
  color: #98ffd9;
}

.status-failed,
.status-overdue,
.status-void,
.status-declined,
.status-canceled {
  border-color: rgba(255, 155, 186, 0.46);
  color: #ffb4c9;
}

.status-logged_only,
.status-draft {
  border-color: rgba(255, 223, 128, 0.42);
  color: #ffe6a3;
}

.status-high {
  border-color: rgba(255, 155, 186, 0.46);
  color: #ffb4c9;
}

.status-low,
.status-inactive,
.status-dismissed,
.status-readonly,
.status-archived {
  color: var(--muted);
}

.status-archived {
  border-color: rgba(184, 203, 224, 0.24);
  background: rgba(184, 203, 224, 0.06);
}

.compact-action-form {
  gap: 0.45rem;
}

.compact-stats {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.definition-grid {
  grid-template-columns: minmax(120px, 0.32fr) minmax(0, 1fr);
}

.action-stack {
  display: grid;
  gap: 0.55rem;
  justify-items: end;
}

.secondary-actions .button,
.secondary-actions .btn {
  min-height: 38px;
}

.detail-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.65fr);
  gap: 1rem;
}

.detail-action {
  margin-top: 1rem;
}

dl {
  display: grid;
  gap: 0.85rem;
  margin: 1rem 0 0;
}

dt {
  color: var(--primary);
  font-weight: 500;
}

dd {
  margin: 0;
  color: var(--muted);
  white-space: pre-wrap;
}

.status-form {
  display: flex;
  gap: 0.7rem;
  align-items: end;
}

.inline-form {
  margin: 0.8rem 0 0;
}

.split-actions {
  display: grid;
  grid-template-columns: minmax(220px, 0.4fr) minmax(0, 0.6fr);
  gap: 1rem;
  align-items: end;
}

.link-client-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.7rem;
  align-items: end;
}

.line-items {
  display: grid;
  gap: 0.8rem;
}

.line-items h2 {
  margin: 0.6rem 0 0;
  font-size: 1.2rem;
}

.line-item-row {
  display: grid;
  grid-template-columns: minmax(170px, 0.45fr) minmax(0, 1fr) minmax(90px, 0.16fr) minmax(150px, 0.22fr);
  gap: 0.75rem;
  align-items: end;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 0.75rem;
  background: rgba(255, 255, 255, 0.035);
}

.tax-field {
  max-width: 260px;
}

.checkbox-row {
  display: inline-grid;
  grid-template-columns: auto 1fr;
  gap: 0.55rem;
  align-items: center;
  width: fit-content;
}

.checkbox-row input {
  width: auto;
}

.checkbox-row span {
  margin: 0;
}

.totals-list {
  max-width: 360px;
  margin-left: auto;
}

.totals-list dt,
.totals-list dd {
  display: inline-block;
  width: 48%;
}

.totals-list dd {
  text-align: right;
}

.plain-list {
  margin: 1rem 0 0;
  color: var(--muted);
}

.summary-box {
  min-height: 320px;
  margin-top: 0.8rem;
  font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
}

.summary-box.compact-copy {
  min-height: 0;
  margin-top: 0.4rem;
  font-size: 0.9rem;
}

.invoice-totals {
  display: grid;
  width: min(360px, 100%);
  margin: 1rem 0 0 auto;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
}

.invoice-totals div {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 1rem;
  align-items: center;
  padding: 0.75rem 0.9rem;
  border-bottom: 1px solid var(--border);
  color: var(--muted);
}

.invoice-totals div:last-child {
  border-bottom: 0;
}

.invoice-totals strong {
  color: var(--text);
}

.invoice-totals .grand-total {
  color: var(--text);
  background: rgba(140, 199, 255, 0.14);
  font-size: 1.12rem;
}

.quick-status-form {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  align-items: center;
  margin-top: 1rem;
}

.quick-status-form > span {
  color: var(--muted);
  font-weight: 500;
}

.deleted-note,
.muted-copy,
.info-panel > p {
  color: var(--muted);
}

.danger-panel {
  border-color: rgba(255, 155, 186, 0.28);
}

.settings-action {
  margin-top: 1rem;
}

.note-form {
  display: grid;
  gap: 0.8rem;
  margin-top: 0.8rem;
}

.notes-list {
  display: grid;
  gap: 0.75rem;
  margin-top: 1rem;
}

.attention-list,
.outreach-list {
  display: grid;
  gap: 0.65rem;
  margin-top: 1rem;
}

.attention-row,
.outreach-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.9rem;
  align-items: start;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 0.75rem;
  background: rgba(255, 255, 255, 0.028);
}

.attention-row p,
.outreach-row p {
  margin: 0 0 0.25rem;
}

.attention-row.is-dismissed {
  opacity: 0.68;
}

.outreach-row {
  grid-template-columns: minmax(0, 1fr) minmax(150px, auto);
}

.status-border-failed {
  border-color: rgba(255, 155, 186, 0.44);
}

.outreach-details {
  justify-self: end;
}

.outreach-details summary,
.metadata-details summary {
  color: var(--primary);
  cursor: pointer;
  font-weight: 500;
}

.outreach-details pre {
  max-width: min(720px, calc(100vw - 64px));
  margin: 0.65rem 0 0;
  overflow-x: auto;
  white-space: pre-wrap;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 0.8rem;
  color: var(--muted);
  background: rgba(5, 8, 20, 0.72);
}

.compact-settings .status-card strong {
  overflow-wrap: anywhere;
  font-size: 0.96rem;
}

.note {
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 0.8rem;
  background: rgba(255, 255, 255, 0.035);
}

.task-row {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: start;
}

.metadata-box {
  max-width: 520px;
  overflow-x: auto;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 0.7rem;
  color: var(--muted);
  background: rgba(5, 8, 20, 0.72);
}

.note p {
  margin-top: 0;
  color: var(--text);
}

.footer {
  display: grid;
  gap: 0.3rem;
  border-top: 1px solid var(--border);
  padding: 1rem 0 2rem;
  color: var(--muted);
  font-size: 0.92rem;
}

.footer p {
  margin: 0;
}

.public-document-body {
  --bg: #f6f8fc;
  --surface: #ffffff;
  --surface-strong: #f8fbff;
  --text: #14213d;
  --muted: #667085;
  --primary: #2563eb;
  --primary-strong: #1d4ed8;
  --accent: #7c3aed;
  --border: #d9e2ef;
  --danger: #b42318;
  --shadow: 0 18px 50px rgba(20, 33, 61, 0.09);
  color: var(--text);
  background:
    linear-gradient(180deg, #ffffff 0, #f6f8fc 360px),
    var(--bg);
}

.public-document-body .site-header,
.public-document-body .page-shell,
.public-document-body .footer {
  width: min(1040px, calc(100% - 32px));
}

.public-document-body .brand,
.public-document-body .site-header nav a,
.public-document-body .subtle-link,
.public-document-body .info-panel a,
.public-document-body td a {
  color: var(--text);
}

.public-document-body .site-header {
  border-bottom: 1px solid var(--border);
}

.public-document-body .public-document-hero,
.public-document-body .public-document-panel,
.public-document-body .table-panel {
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: var(--shadow);
}

.public-document-hero {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: end;
  padding: clamp(1.2rem, 3vw, 2rem);
}

.public-document-hero h1 {
  margin: 0.15rem 0 0.35rem;
  color: var(--text);
  font-size: clamp(2rem, 5vw, 3.6rem);
  line-height: 1.02;
  letter-spacing: 0;
}

.public-document-hero p,
.public-document-panel p,
.public-document-panel dd,
.public-document-panel small {
  color: var(--muted);
}

.public-document-total {
  min-width: min(280px, 100%);
  border-left: 4px solid var(--accent);
  padding-left: 1rem;
  text-align: right;
}

.public-document-total span,
.document-summary-grid span {
  display: block;
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 500;
  text-transform: uppercase;
}

.public-document-total strong {
  display: block;
  color: var(--accent);
  font-size: clamp(1.8rem, 4vw, 2.5rem);
  line-height: 1.1;
}

.public-document-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.7rem;
  align-items: center;
}

.public-document-body .button-primary,
.public-document-body .button-secondary {
  color: #ffffff;
  border-color: var(--primary-strong);
  background: var(--primary-strong);
}

.public-document-body .button-ghost {
  color: var(--text);
  border-color: var(--border);
  background: #ffffff;
}

.public-document-body input,
.public-document-body textarea,
.public-document-body select {
  color: var(--text);
  background: #ffffff;
}

.document-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: var(--radius);
}

.document-summary-grid article {
  min-width: 0;
  padding: 1rem;
  border-right: 1px solid var(--border);
  background: var(--surface-strong);
}

.document-summary-grid article:last-child {
  border-right: 0;
}

.document-summary-grid strong {
  display: block;
  margin-top: 0.35rem;
  color: var(--text);
}

.public-document-body th {
  color: var(--muted);
}

.public-document-body .status-pill {
  color: var(--primary-strong);
  border-color: #bfdbfe;
  background: #eff6ff;
}

.public-document-body .status-sent,
.public-document-body .status-paid,
.public-document-body .status-active,
.public-document-body .status-accepted {
  color: #047857;
  border-color: #a7f3d0;
  background: #ecfdf5;
}

.public-document-body .status-failed,
.public-document-body .status-overdue,
.public-document-body .status-void,
.public-document-body .status-declined {
  color: #b42318;
  border-color: #fecaca;
  background: #fff1f2;
}

.public-document-body .status-logged_only,
.public-document-body .status-draft {
  color: #92400e;
  border-color: #fde68a;
  background: #fffbeb;
}

.public-document-body .invoice-totals {
  background: #ffffff;
}

.public-document-body .invoice-totals strong,
.public-document-body .invoice-totals .grand-total {
  color: var(--text);
}

.public-document-body .invoice-totals .grand-total {
  background: #f5f3ff;
}

.unavailable-panel {
  text-align: left;
}

strong {
  font-weight: 600;
}

h2 {
  font-weight: 600;
  letter-spacing: -0.012em;
}

h3 {
  font-weight: 600;
}

.brand strong {
  font-weight: 600;
}

.admin-shell {
  gap: 1.15rem;
}

.admin-shell > .info-panel,
.admin-shell > .table-panel {
  padding: 1.25rem;
}

.page-header {
  display: block;
}

.page-header h1 {
  margin-top: 0.2rem;
}

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

.list-card {
  min-width: 0;
}

.list-card-header {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: start;
}

.list-card-title {
  min-width: 0;
}

.list-card-title h2 {
  margin: 0;
}

.list-card-title p {
  margin: 0.25rem 0 0;
  color: var(--muted);
  font-size: 0.86rem;
}

.list-toolbar-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  align-items: center;
  justify-content: flex-end;
}

.list-toolbar {
  margin-top: 1rem;
  border-top: 1px solid var(--border);
  padding-top: 1rem;
}

.filter-grid {
  display: grid;
  gap: 0.65rem;
  align-items: end;
  width: 100%;
}

.filter-grid-clients {
  grid-template-columns: minmax(260px, 2fr) minmax(150px, 1fr) auto;
  max-width: 760px;
}

.filter-grid-records {
  grid-template-columns: minmax(260px, 2fr) repeat(2, minmax(150px, 1fr)) auto;
  max-width: 940px;
}

.filter-grid-invoices {
  grid-template-columns: minmax(230px, 1.7fr) repeat(3, minmax(135px, 1fr)) auto;
}

.filter-grid-tasks {
  grid-template-columns: repeat(3, minmax(150px, 1fr)) auto;
  max-width: 800px;
}

.filter-grid-audit {
  grid-template-columns: repeat(4, minmax(135px, 1fr)) auto;
  max-width: 1000px;
}

.filter-grid label {
  min-width: 0;
}

.filter-grid input,
.filter-grid select {
  min-height: 40px;
  padding-block: 0.58rem;
}

.filter-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  align-items: center;
  justify-content: flex-start;
}

.filter-actions .button,
.filter-actions .btn {
  min-width: 88px;
}

.filter-tabs {
  display: inline-flex;
  gap: 0.2rem;
  align-items: center;
  width: fit-content;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 0.2rem;
  background: rgba(255, 255, 255, 0.025);
}

.filter-tab {
  border-radius: 7px;
  padding: 0.42rem 0.7rem;
  color: var(--muted);
  font-size: 0.86rem;
  font-weight: 500;
  text-decoration: none;
}

.filter-tab:hover,
.filter-tab:focus-visible {
  color: var(--text);
}

.filter-tab.is-active {
  color: var(--text);
  background: rgba(184, 203, 224, 0.11);
}

.table-section {
  margin-top: 1rem;
}

.list-card-header + .table-section {
  border-top: 1px solid var(--border);
  padding-top: 0.35rem;
}

.attention-section .attention-list {
  margin-top: 0;
}

.section-description {
  margin: 0.2rem 0 0;
  color: var(--muted);
  font-size: 0.86rem;
}

.breadcrumb {
  margin: 0;
  color: var(--muted);
  font-size: 0.86rem;
}

.narrow-admin-shell {
  width: min(780px, calc(100% - 32px));
}

.form-actions {
  justify-content: flex-start;
}

.locked-field,
.locked-context {
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 0.75rem 0.85rem;
  color: var(--muted);
  background: rgba(255, 255, 255, 0.025);
}

.locked-field span {
  display: block;
  font-size: 0.8rem;
}

.locked-field strong,
.locked-context strong {
  color: var(--text);
}

.compact-record-list {
  display: grid;
  gap: 0;
  margin-top: 0.35rem;
}

.compact-record-row {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: center;
  border-top: 1px solid var(--border);
  padding: 0.8rem 0;
}

.compact-record-row:first-child {
  border-top: 0;
}

.compact-record-row p {
  margin: 0 0 0.15rem;
}

.empty-state {
  margin: 0;
  padding: 0.5rem 0;
  color: var(--muted);
}

.task-dialog {
  width: min(620px, calc(100% - 32px));
  max-height: calc(100vh - 48px);
  overflow-y: auto;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 0;
  color: var(--text);
  background: var(--surface-strong);
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.52);
}

.task-dialog::backdrop {
  background: rgba(3, 6, 12, 0.72);
  backdrop-filter: blur(3px);
}

.dialog-form {
  display: grid;
  gap: 1rem;
  padding: 1.35rem;
}

.dialog-heading {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: start;
}

.dialog-heading h2 {
  margin: 0;
  font-size: 1.4rem;
}

.button-icon {
  width: 36px;
  min-height: 36px;
  padding: 0;
  font-size: 1.25rem;
}

.dialog-actions {
  justify-content: flex-end;
  border-top: 1px solid var(--border);
  padding-top: 1rem;
}

.outreach-row {
  grid-template-columns: minmax(0, 1fr) auto;
  padding: 0.9rem 1rem;
}

.outreach-summary {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.75rem;
  align-items: start;
}

.outreach-type {
  border: 1px solid var(--border);
  border-radius: 999px;
  padding: 0.18rem 0.5rem;
  color: var(--muted);
  font-size: 0.75rem;
}

.outreach-subject {
  color: var(--text);
}

.outreach-status {
  display: grid;
  gap: 0.3rem;
  justify-items: end;
}

.outreach-status small {
  font-size: 0.75rem;
}

.outreach-details {
  grid-column: 1 / -1;
  justify-self: stretch;
  border-top: 1px solid var(--border);
  padding-top: 0.65rem;
}

.outreach-message-panel {
  display: grid;
  gap: 0.75rem;
  margin-top: 0.7rem;
  border-radius: var(--radius);
  padding: 1rem;
  background: rgba(5, 8, 20, 0.5);
}

.outreach-message-meta {
  display: grid;
  gap: 0.15rem;
}

.outreach-message-meta span {
  color: var(--muted);
  font-size: 0.75rem;
}

.outreach-message-panel pre {
  max-width: none;
  margin: 0;
  overflow-x: auto;
  border: 0;
  padding: 0;
  color: var(--text);
  background: transparent;
  font-family: inherit;
  font-size: 0.93rem;
  line-height: 1.55;
  white-space: pre-wrap;
}

.settings-center {
  display: grid;
  width: 100%;
  gap: 0.7rem;
}

.settings-section {
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: rgba(16, 23, 34, 0.9);
}

.settings-section > summary {
  display: grid;
  grid-template-columns: minmax(170px, 0.8fr) auto minmax(260px, 1.4fr) 18px;
  gap: 0.8rem;
  align-items: center;
  min-height: 66px;
  padding: 0.8rem 1rem;
  cursor: pointer;
  list-style: none;
}

.settings-section > summary::-webkit-details-marker {
  display: none;
}

.settings-section[open] > summary {
  border-bottom: 1px solid var(--border);
  background: rgba(255, 255, 255, 0.02);
}

.settings-summary-title {
  font-size: 1rem;
  font-weight: 600;
}

.settings-summary-facts {
  overflow: hidden;
  color: var(--muted);
  font-size: 0.83rem;
  text-align: right;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.settings-chevron {
  width: 8px;
  height: 8px;
  border-right: 1px solid var(--muted);
  border-bottom: 1px solid var(--muted);
  transform: rotate(45deg);
  transition: transform 150ms ease;
}

.settings-section[open] .settings-chevron {
  transform: rotate(225deg);
}

.settings-content {
  padding: 1.1rem;
}

.status-healthy {
  border-color: rgba(102, 201, 151, 0.38);
  color: #96dfba;
  background: rgba(31, 107, 70, 0.16);
}

.status-attention,
.status-incomplete {
  border-color: rgba(225, 183, 93, 0.42);
  color: #ebca82;
  background: rgba(128, 90, 22, 0.15);
}

.status-notes {
  color: var(--muted);
  border-color: var(--border);
}

.technical-details {
  margin-top: 0.9rem;
}

.technical-details summary {
  color: var(--primary);
  cursor: pointer;
  font-size: 0.86rem;
}

.branding-form {
  margin-top: 1rem;
}

.settings-checkbox {
  align-self: end;
  min-height: 44px;
}

.concise-list {
  display: grid;
  gap: 0.55rem;
}

.line-item-row {
  grid-template-columns: minmax(150px, 0.7fr) minmax(240px, 1.3fr) minmax(76px, 0.25fr) minmax(118px, 0.35fr);
}

@media (max-width: 980px) {
  .choice-grid,
  .count-grid,
  .status-grid,
  .settings-grid,
  .document-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .document-summary-grid article:nth-child(2) {
    border-right: 0;
  }

  .detail-grid,
  .form-grid.two-col,
  .split-actions,
  .link-client-form,
  .line-item-row,
  .attention-row,
  .outreach-row,
  .invoice-totals div {
    grid-template-columns: 1fr;
  }

  .filter-grid-clients,
  .filter-grid-records,
  .filter-grid-invoices,
  .filter-grid-tasks,
  .filter-grid-audit {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: none;
  }

  .filter-search {
    grid-column: span 2;
  }

  .filter-actions {
    grid-column: 1 / -1;
  }

  .settings-section > summary {
    grid-template-columns: minmax(0, 1fr) auto 18px;
  }

  .settings-summary-facts {
    grid-column: 1 / -1;
    grid-row: 2;
    text-align: left;
  }

  .outreach-details {
    justify-self: start;
  }

  .money-table .numeric {
    text-align: left;
  }
}

.subscription-hero {
  align-items: stretch;
}

.subscription-badges,
.action-stack,
.inline-input-action {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
}

.subscription-badges {
  margin: 0.8rem 0 0.7rem;
}

.subscription-hero-metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(150px, 1fr));
  gap: 0.75rem;
  min-width: min(100%, 420px);
}

.subscription-hero-metrics article {
  color: var(--text);
  background: linear-gradient(145deg, rgba(120, 152, 187, 0.1), transparent 70%), var(--surface-strong);
  border: 1px solid var(--border);
  border-radius: 0.65rem;
  padding: 0.85rem;
  transition: border-color 160ms ease, background-color 160ms ease;
}

.subscription-hero-metrics article:hover,
.subscription-hero-metrics article:focus-within {
  background-color: #192536;
  border-color: rgba(184, 203, 224, 0.3);
}

.subscription-hero-metrics span,
.subscription-hero-metrics strong {
  display: block;
  color: inherit;
}

.subscription-hero-metrics span {
  color: var(--muted);
  font-size: 0.78rem;
  margin-bottom: 0.3rem;
}

.subscription-card-grid,
.action-intent-grid {
  display: grid;
  gap: 1rem;
}

.subscription-card-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.action-intent-grid {
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
}

.action-intent-grid h3 {
  font-size: 0.85rem;
  margin: 0 0 0.65rem;
}

.action-stack {
  align-items: flex-start;
  flex-direction: column;
}

.compact-definition-list {
  display: grid;
  grid-template-columns: minmax(110px, 0.8fr) minmax(0, 1.4fr);
  margin: 0;
  row-gap: 0.65rem;
}

.compact-definition-list dt {
  color: var(--muted);
}

.compact-definition-list dd {
  margin: 0;
  font-weight: 600;
}

.confirmation-modal {
  color: var(--text);
  background: var(--surface-strong);
  border: 0;
  border-radius: 0.8rem;
  box-shadow: 0 22px 70px rgb(15 23 42 / 24%);
  max-width: 560px;
  padding: 1.4rem;
  width: calc(100% - 2rem);
}

.confirmation-modal::backdrop {
  background: rgb(15 23 42 / 48%);
}

.danger-text {
  color: var(--danger, #9f3a42) !important;
}

.failed-row {
  background: rgba(159, 58, 66, 0.14);
}

.inline-input-action {
  align-items: center;
}

.inline-input-action input {
  flex: 1 1 180px;
}

@media (max-width: 960px) {
  .action-intent-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 700px) {
  .site-header,
  .table-toolbar,
  .detail-header,
  .page-header,
  .list-card-header,
  .status-form,
  .public-document-hero,
  .public-document-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .choice-grid,
  .count-grid,
  .status-grid,
  .settings-grid,
  .document-summary-grid {
    grid-template-columns: 1fr;
  }

  .subscription-card-grid,
  .subscription-hero-metrics,
  .action-intent-grid,
  .compact-definition-list {
    grid-template-columns: 1fr;
  }

  .document-summary-grid article {
    border-right: 0;
    border-bottom: 1px solid var(--border);
  }

  .document-summary-grid article:last-child {
    border-bottom: 0;
  }

  .public-document-total,
  .action-group > span {
    text-align: left;
  }

  .step-heading {
    display: block;
  }

  .wizard-actions,
  .confirmation-actions {
    justify-content: stretch;
  }

  .button,
  .btn {
    width: 100%;
  }

  .filter-grid-clients,
  .filter-grid-records,
  .filter-grid-invoices,
  .filter-grid-tasks,
  .filter-grid-audit {
    grid-template-columns: 1fr;
  }

  .filter-search,
  .filter-actions {
    grid-column: auto;
  }

  .filter-actions,
  .list-toolbar-actions {
    align-items: stretch;
    justify-content: flex-start;
  }

  .filter-actions {
    flex-direction: column;
  }

  .filter-tabs {
    width: 100%;
  }

  .filter-tab {
    flex: 1 1 auto;
    text-align: center;
  }

  .compact-record-row,
  .dialog-heading {
    align-items: stretch;
    flex-direction: column;
  }

  .button-icon {
    width: 36px;
  }

  .outreach-status {
    justify-items: start;
  }

  .settings-section > summary {
    grid-template-columns: minmax(0, 1fr) auto 16px;
  }
}
.admin-app-body {
  color-scheme: dark;
  --message-other: #151e2c;
  --message-self: #1a2940;
  --message-self-border: #446384;
  --delivery-sent: #72d6ad;
  --delivery-pending: #f1c56c;
  --delivery-failed: #f0a0ad;
}
:root[data-theme="light"] .admin-app-body {
  color-scheme: light;
  --bg: #edf2f7;
  --surface: #ffffff;
  --surface-strong: #f3f6fa;
  --text: #182333;
  --muted: #59687a;
  --primary: #315f8b;
  --primary-strong: #234b70;
  --accent: #6857a4;
  --border: #c9d3df;
  --danger: #9d3141;
  --shadow: 0 12px 36px rgba(25, 45, 70, 0.12);
  --panel-bg: rgba(255, 255, 255, 0.96);
  --input-bg: #ffffff;
  --option-bg: #ffffff;
  --option-selected-bg: #dbe9f6;
  --focus-ring: #236aa4;
  --disabled-text: #7a8795;
  --warning-text: #684805;
  --warning-bg: #fff6d9;
  --warning-border: #c4962e;
  --message-other: #f3f6fa;
  --message-self: #e8f1fa;
  --message-self-border: #8daecb;
  --delivery-sent: #216c4f;
  --delivery-pending: #855c08;
  --delivery-failed: #a12e40;
  background: radial-gradient(circle at 12% 4%, rgba(49,95,139,.10), transparent 30rem), var(--bg);
}
.admin-app-body .admin-theme-toggle { color: var(--text); background: var(--surface-strong); border-color: var(--border); }

.client-app-body {
  --client-page: #eef2ff; --client-page-deep: #e0e7ff; --client-surface: #ffffff; --client-surface-raised: #f8fafc;
  --client-text: #111b38; --client-muted: #5d6984; --client-border: #cbd5e1; --client-primary: #4f46e5;
  --client-primary-strong: #3730a3; --client-secondary: #7c3aed; --client-success: #15803d; --client-warning: #b45309;
  --client-danger: #b42318; --client-input: #ffffff; --client-focus: #2563eb; --client-shadow: 0 20px 55px rgba(30,41,89,.13);
  min-height: 100vh; color: var(--client-text); color-scheme: light;
  background: radial-gradient(circle at 12% 5%, rgba(79,70,229,.14), transparent 30%), radial-gradient(circle at 90% 20%, rgba(124,58,237,.11), transparent 28%), linear-gradient(150deg,var(--client-page),var(--client-page-deep));
}
.admin-client-sections { display: grid; gap: .75rem; margin-top: 1rem; }
.admin-client-section { overflow: clip; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: 0 8px 24px rgba(20,33,61,.05); }
.admin-client-section > summary { min-height: 72px; display: grid; grid-template-columns: minmax(0,1fr) auto auto; align-items: center; gap: 1rem; padding: 1rem 1.25rem; cursor: pointer; list-style: none; }
.admin-client-section > summary::-webkit-details-marker { display: none; }.admin-client-section > summary::after { content: ''; width: 9px; height: 9px; border-right: 2px solid var(--muted); border-bottom: 2px solid var(--muted); transform: rotate(45deg); transition: transform .16s ease; }
.admin-client-section[open] > summary::after { transform: rotate(225deg); }.admin-client-section > summary > span:first-child { display: grid; gap: .3rem; }.admin-client-section > summary small { color: var(--muted); font-weight: 500; }.admin-client-section.needs-attention { border-color: #d97706; }
.admin-client-section-body { padding: 0 1.25rem 1.25rem; border-top: 1px solid var(--border); }.admin-client-section-body > h2 { margin-top: 1.25rem; }.inline-role-form { display: flex; align-items: center; gap: .35rem; }.inline-role-form select { min-width: 90px; }
:root[data-theme="dark"] .client-app-body {
  --client-page: #070b1b; --client-page-deep: #10142d; --client-surface: #151a35; --client-surface-raised: #1b2142;
  --client-text: #f4f6ff; --client-muted: #b4bed8; --client-border: #343d68; --client-primary: #8b8cf8;
  --client-primary-strong: #a5b4fc; --client-secondary: #c084fc; --client-success: #4ade80; --client-warning: #fbbf24;
  --client-danger: #fb7185; --client-input: #11162f; --client-focus: #93c5fd; --client-shadow: 0 24px 65px rgba(0,0,0,.38);
  color-scheme: dark;
}
.client-app-body a { color: var(--client-primary-strong); }
.client-app-body .muted-copy, .client-app-body small { color: var(--client-muted); }
.client-header { position: sticky; top: 0; z-index: 20; padding: 0; color: #fff; background: rgba(10,15,40,.94); border-bottom: 1px solid rgba(165,180,252,.22); backdrop-filter: blur(16px); }
.client-header-inner { width: min(1180px,calc(100% - 2rem)); min-height: 76px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.client-brand, .client-brand:visited { color: #fff; text-decoration: none; }
.client-brand small { color: #c7d2fe; }
.client-header-actions { display: flex; align-items: center; gap: .75rem; }
.client-marketing-link, .client-marketing-link:visited { color: #dbeafe; font-size: .9rem; text-decoration: none; }
.theme-toggle { width: 42px; height: 42px; display: grid; place-items: center; padding: 0; color: #fff; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.24); border-radius: 999px; cursor: pointer; }
.theme-toggle:hover { background: rgba(255,255,255,.16); }
.theme-toggle:focus-visible, .client-app-body :focus-visible { outline: 3px solid var(--client-focus); outline-offset: 3px; }
.theme-icon { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.theme-icon-moon { fill: currentColor; stroke: none; }
:root[data-theme="light"] .theme-icon-sun, :root[data-theme="dark"] .theme-icon-moon { display: none; }
.client-nav { display: flex; align-items: center; gap: .25rem; padding: .55rem max(1rem,calc((100vw - 1180px)/2)); background: #111936; border-bottom: 1px solid rgba(165,180,252,.16); }
.client-nav a { color: #dbeafe; padding: .62rem .76rem; border-radius: .55rem; text-decoration: none; }
.client-nav a:hover, .client-nav a.is-active { color: #fff; background: rgba(129,140,248,.24); }
.client-nav form { margin-left: auto; }.client-nav button { color: #fff; }.client-menu-button { display: none; }
.client-shell { width: min(1180px,calc(100% - 2rem)); margin: 0 auto; padding: 2rem 0 4rem; }
.client-auth-shell { width: min(1080px,calc(100% - 2rem)); min-height: calc(100vh - 76px); margin: 0 auto; padding: clamp(2rem,7vh,5rem) 0; display: grid; grid-template-columns: minmax(0,1fr) minmax(360px,520px); align-items: center; gap: clamp(2rem,7vw,6rem); }
.client-auth-intro h1 { max-width: 12ch; margin: .5rem 0 1rem; font-size: clamp(2.4rem,5vw,4.4rem); line-height: .98; letter-spacing: -.045em; }
.client-auth-intro p:last-child { max-width: 48ch; color: var(--client-muted); font-size: 1.08rem; }
.client-auth-card, .client-card, .client-welcome, .client-document-heading { color: var(--client-text); background: color-mix(in srgb,var(--client-surface) 96%,transparent); border: 1px solid var(--client-border); border-radius: 1rem; box-shadow: var(--client-shadow); padding: clamp(1.25rem,3vw,2rem); }
.client-auth-card h2 { margin: .4rem 0 .85rem; font-size: clamp(1.75rem,3vw,2.35rem); line-height: 1.08; }
.client-form { display: grid; gap: 1rem; margin-top: 1.25rem; }.client-form label:not(.checkbox-row) { display: grid; gap: .45rem; }
.client-form input, .client-form textarea, .client-form select { width: 100%; color: var(--client-text); background: var(--client-input); border-color: var(--client-border); }
.client-app-body select option, .client-app-body select optgroup { color: var(--client-text); background-color: var(--client-input); }
.client-app-body select option:checked { color: var(--client-text); background-color: color-mix(in srgb,var(--client-primary) 18%,var(--client-input)); }
.client-app-body input:disabled, .client-app-body textarea:disabled, .client-app-body select:disabled, .client-app-body option:disabled { color: var(--client-muted); }
.client-app-body input:-webkit-autofill, .client-app-body input:-webkit-autofill:hover, .client-app-body input:-webkit-autofill:focus { -webkit-text-fill-color: var(--client-text); caret-color: var(--client-text); box-shadow: 0 0 0 1000px var(--client-input) inset; }
.client-app-body input:user-invalid, .client-app-body textarea:user-invalid, .client-app-body select:user-invalid { border-color: var(--client-danger); box-shadow: 0 0 0 1px color-mix(in srgb,var(--client-danger) 32%,transparent); }
.client-app-body .button-primary { color: #fff; background: linear-gradient(135deg,var(--client-primary),var(--client-secondary)); border-color: transparent; }
.client-app-body .button-secondary, .client-app-body .button-ghost { color: var(--client-text); background: var(--client-surface-raised); border-color: var(--client-border); }
.client-app-body .alert.warning { color: var(--client-warning); border-color: color-mix(in srgb,var(--client-warning) 55%,var(--client-border)); background: color-mix(in srgb,var(--client-warning) 10%,var(--client-surface)); }
.client-welcome, .client-document-heading, .client-page-heading { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: 1.25rem; }
.client-metric-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 1rem; margin: 1rem 0; }
.client-metric-grid a { display: grid; gap: .35rem; min-height: 126px; padding: 1.25rem; color: var(--client-text); text-decoration: none; background: var(--client-surface); border: 1px solid var(--client-border); border-radius: .9rem; box-shadow: 0 10px 28px rgba(20,33,61,.06); }
.client-metric-grid a:hover { border-color: var(--client-primary); transform: translateY(-2px); }.client-metric-grid strong { font-size: 2rem; }.client-metric-grid small { color: var(--client-muted); }
.client-grid-two { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1rem; margin: 1rem 0; }
.client-action-list, .client-activity, .client-choice-list { display: grid; gap: .65rem; }.client-action-list a, .client-activity article { display: flex; justify-content: space-between; gap: 1rem; padding: .9rem 0; border-bottom: 1px solid var(--client-border); }
.client-activity article { flex-wrap: wrap; }.client-activity small { width: 100%; color: var(--client-muted); }.client-contact { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; }
.client-choice { width: 100%; display: flex; justify-content: space-between; text-align: left; padding: 1rem; color: var(--client-text); background: var(--client-surface-raised); border: 1px solid var(--client-border); border-radius: .75rem; cursor: pointer; }
.client-choice:hover { border-color: var(--client-secondary); }.client-detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.client-app-body table { color: var(--client-text); }.client-app-body th { color: var(--client-muted); }.client-app-body td,.client-app-body th { border-color: var(--client-border); }
.filter-tabs { display: flex; gap: .35rem; }.filter-tabs a { padding: .5rem .75rem; border-radius: 999px; text-decoration: none; }.filter-tabs a.is-active { color: #fff; background: var(--client-primary); }
.decline-panel { margin-top: 1.5rem; }.preserve-lines { white-space: pre-line; }.checkbox-row { display: flex; align-items: flex-start; gap: .65rem; }.checkbox-row input { width: auto; margin-top: .3rem; }
.portal-user-list { display: grid; gap: .75rem; }.portal-user-row { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 1rem; padding: 1rem; background: var(--client-surface-raised); border: 1px solid var(--client-border); border-radius: .8rem; }.portal-user-meta { display: flex; flex-wrap: wrap; gap: .4rem .8rem; color: var(--client-muted); }.portal-user-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .4rem; }.role-help { display: grid; gap: .5rem; padding: 0; list-style: none; color: var(--client-muted); }
.nav-unread-badge { display: inline-grid; min-width: 1.4rem; height: 1.4rem; padding: 0 .35rem; place-items: center; border-radius: 999px; background: var(--client-danger); color: #fff; font-size: .72rem; font-weight: 700; }.client-narrow-shell { max-width: 920px; }.message-list { display: grid; }.message-list-row { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 1.25rem; padding: 1.15rem 0; border-bottom: 1px solid var(--client-border); }.message-list-row:last-child { border-bottom: 0; }.message-list-row.is-unread { border-left: 3px solid var(--client-primary); padding-left: 1rem; }.message-row-heading { display: flex; align-items: center; gap: .75rem; }.message-row-heading h2 { margin: 0; font-size: 1.08rem; }.message-preview { color: var(--client-muted); margin: .4rem 0 0; overflow-wrap: anywhere; }.message-row-meta { display: flex; min-width: 180px; flex-direction: column; align-items: flex-end; justify-content: center; gap: .45rem; }.compact-related { padding: .9rem 1.1rem; }.secondary-help { text-align: center; color: var(--client-muted); }
.admin-app-body .nav-unread-badge { background: var(--danger); color: var(--bg); }.admin-app-body .attachment-note { color: var(--delivery-pending); }.admin-app-body tr.is-unread td:first-child { border-left: 3px solid var(--primary-strong); }
.client-app-body .status-pill { color: var(--client-text); border-color: var(--client-border); background: var(--client-surface-raised); }.client-app-body .status-warning { color: var(--client-warning); border-color: color-mix(in srgb,var(--client-warning) 55%,transparent); background: color-mix(in srgb,var(--client-warning) 12%,var(--client-surface)); }
@media (max-width: 800px) {
  .client-menu-button { display: inline-flex; }
  .client-nav { display: none; position: sticky; top: 76px; z-index: 19; flex-direction: column; align-items: stretch; }
  .client-nav.is-open { display: flex; }
  .client-nav form { margin-left: 0; }
  .client-nav a, .client-nav button { width: 100%; text-align: left; }
  .client-metric-grid, .client-grid-two { grid-template-columns: 1fr 1fr; }
  .client-auth-shell { grid-template-columns: 1fr; max-width: 620px; align-items: start; }
  .client-auth-intro h1 { font-size: clamp(2.2rem,10vw,3.5rem); }
}
@media (max-width: 560px) {
  .client-header-inner { width: min(100% - 1rem,1180px); min-height: 68px; }.client-brand img { width: 40px; height: 40px; }.client-marketing-link { display: none; }.theme-toggle { width: 38px; height: 38px; }
  .client-shell { width: min(100% - 1rem, 1180px); padding-top: 1rem; }
  .client-metric-grid, .client-grid-two, .client-detail-grid { grid-template-columns: 1fr; }
  .client-welcome, .client-document-heading, .client-page-heading, .client-contact { align-items: stretch; flex-direction: column; }
  .client-document-heading .toolbar-actions { display: grid; }
  .client-auth-shell { width: min(100% - 1rem,620px); min-height: auto; padding: 1.5rem 0 3rem; gap: 1.5rem; }.client-auth-intro p:last-child { margin-bottom: 0; }.portal-user-row,.message-list-row { grid-template-columns: 1fr; }.portal-user-actions { justify-content: flex-start; }.message-row-meta { min-width: 0; align-items: flex-start; }.conversation-message { max-width: 100%; }.conversation-message-heading { flex-direction: column; gap: .2rem; }
}

/* Client messaging */
.client-app-body {
  --message-other: var(--client-surface-raised);
  --message-self: color-mix(in srgb,var(--client-primary) 11%,var(--client-surface));
  --message-self-border: color-mix(in srgb,var(--client-primary) 42%,var(--client-border));
}
.message-thread-shell { min-width: 0; }
.conversation-header { align-items: flex-start; }
.conversation-facts { display: flex; flex-wrap: wrap; gap: .7rem 1.5rem; margin: 1rem 0 0; }
.conversation-facts div { display: grid; gap: .15rem; }
.conversation-facts dt { color: var(--muted); font-size: .75rem; font-weight: 650; letter-spacing: .06em; text-transform: uppercase; }
.conversation-facts dd { margin: 0; }
.client-app-body .conversation-facts dt { color: var(--client-muted); }
.conversation-panel { min-width: 0; }
.conversation-timeline { display: grid; gap: 1rem; min-width: 0; }
.conversation-message { width: min(82%,760px); min-width: 0; padding: 1rem 1.1rem; color: inherit; border: 1px solid var(--border); border-radius: 1rem; background: var(--message-other); box-shadow: 0 7px 20px rgba(0,0,0,.06); overflow-wrap: anywhere; }
.conversation-message.message-from-self { justify-self: end; border-color: var(--message-self-border); background: var(--message-self); }
.conversation-message.message-from-other { justify-self: start; }
.client-app-body .conversation-message { border-color: var(--client-border); }
.client-app-body .conversation-message.message-from-self { border-color: var(--message-self-border); }
.conversation-message-heading { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; margin-bottom: .7rem; }
.conversation-message-heading > span { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: .35rem; text-align: right; }
.source-pill { display: inline-flex; padding: .12rem .42rem; color: var(--muted); border: 1px solid var(--border); border-radius: 999px; font-size: .7rem; line-height: 1.35; }
.client-app-body .source-pill { color: var(--client-muted); border-color: var(--client-border); }
.message-body { min-width: 0; margin: 0; overflow-wrap: anywhere; word-break: normal; }
.plain-message { white-space: pre-wrap; }
.email-html > :first-child { margin-top: 0; }
.email-html > :last-child { margin-bottom: 0; }
.email-html p { margin: 0 0 .75rem; }
.email-html a { overflow-wrap: anywhere; word-break: break-word; }
.email-html blockquote { margin: .75rem 0; border-left: 3px solid var(--border); padding-left: .85rem; color: var(--muted); }
.client-app-body .email-html blockquote { border-color: var(--client-border); color: var(--client-muted); }
.email-html pre,.email-html code { max-width: 100%; white-space: pre-wrap; overflow-wrap: anywhere; }
.email-html pre { overflow-x: auto; border: 1px solid var(--border); border-radius: .55rem; padding: .75rem; background: color-mix(in srgb,var(--surface-strong) 86%,transparent); }
.client-app-body .email-html pre { border-color: var(--client-border); background: var(--client-surface); }
.attachment-note { display: block; margin-top: .8rem; color: var(--client-warning); }
.delivery-row { display: flex; flex-wrap: wrap; align-items: center; gap: .45rem .75rem; margin-top: .85rem; border-top: 1px solid var(--border); padding-top: .75rem; }
.delivery-badge { display: inline-flex; border: 1px solid currentColor; border-radius: 999px; padding: .18rem .48rem; color: var(--muted); font-size: .72rem; font-weight: 650; }
.delivery-sent { color: var(--delivery-sent); }.delivery-queued { color: var(--delivery-pending); }.delivery-failed { color: var(--delivery-failed); }
.delivery-error { flex-basis: 100%; color: var(--delivery-failed); }
.conversation-delivery-warning { display: flex; flex-wrap: wrap; gap: .25rem 1rem; border: 1px solid color-mix(in srgb,var(--delivery-failed) 58%,transparent); border-radius: var(--radius); padding: .85rem 1rem; color: var(--text); background: color-mix(in srgb,var(--delivery-failed) 10%,var(--surface)); }
.conversation-delivery-warning span { color: var(--muted); }
.message-filter-toolbar { display: grid; grid-template-columns: minmax(150px,210px) minmax(210px,330px) auto auto; gap: .7rem; align-items: end; }
.message-filter-toolbar label span { font-size: .8rem; }
.message-admin-list { padding-top: .7rem; }
.message-table-subject { display: flex; flex-wrap: wrap; gap: .45rem; align-items: center; margin-bottom: .25rem; }
.message-admin-list .message-preview { display: block; max-width: 54ch; color: var(--muted); }
.compact-empty { display: grid; justify-items: start; gap: .2rem; padding: 1rem; color: var(--muted); }
.client-loader-form { display: grid; grid-template-columns: minmax(260px,1fr) auto; gap: .75rem; align-items: end; margin-top: 1.25rem; border: 1px solid var(--border); border-radius: var(--radius); padding: 1rem; background: var(--surface-strong); }
.client-loader-form .button { margin-bottom: 0; }
.message-compose-panel { max-width: 820px; }
.message-compose-form { border-top: 1px solid var(--border); padding-top: 1.25rem; }
.message-compose-form label > small { display: block; margin-top: .35rem; }
.form-intro > p:last-child { margin-bottom: 0; color: var(--muted); }
.compose-placeholder { margin-top: 1rem; border: 1px dashed var(--border); border-radius: var(--radius); padding: 1rem; color: var(--muted); }
.form-actions { display: flex; flex-wrap: wrap; gap: .65rem; align-items: center; }
.reply-panel { margin-top: .25rem; }

/* Admin communications workspace */
.sr-only { position: absolute !important; width: 1px !important; height: 1px !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; }
.messages-index-shell { max-width: 1180px; }
.admin-message-nav-link { display: inline-flex !important; align-items: center; gap: .35rem; }.admin-app-body .admin-message-nav-link .nav-unread-badge { min-width: 1.3rem; height: 1.3rem; color: var(--bg); background: var(--danger); box-shadow: 0 0 0 2px var(--surface); }
.admin-messages-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 1.5rem; margin: .5rem 0 1.25rem; }
.admin-messages-header h1 { margin: .15rem 0 .3rem; font-size: clamp(2rem,4vw,3rem); line-height: 1; letter-spacing: -.035em; }
.admin-messages-header p:last-child { max-width: 66ch; margin: 0; color: var(--muted); }
.header-actions { display: flex; flex: 0 0 auto; align-items: center; gap: .6rem; }
.message-summary-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: .75rem; margin-bottom: 1rem; }
.message-summary-card { position: relative; display: grid; grid-template-columns: minmax(0,1fr) auto; gap: .15rem .75rem; min-height: 96px; overflow: hidden; border: 1px solid var(--border); border-radius: 14px; padding: .9rem 1rem; color: var(--text); text-decoration: none; background: color-mix(in srgb,var(--surface) 94%,transparent); box-shadow: 0 8px 24px rgba(0,0,0,.08); transition: border-color .16s ease,transform .16s ease,background .16s ease; }
.message-summary-card::before { position: absolute; inset: 0 auto 0 0; width: 3px; content: ""; background: var(--summary-accent,var(--accent)); }
.message-summary-card:hover { border-color: color-mix(in srgb,var(--summary-accent,var(--accent)) 60%,var(--border)); background: var(--surface-strong); transform: translateY(-1px); }
.message-summary-card span { align-self: end; color: var(--muted); font-size: .78rem; font-weight: 750; letter-spacing: .045em; text-transform: uppercase; }
.message-summary-card strong { grid-row: 1/3; grid-column: 2; align-self: center; font-size: 1.9rem; line-height: 1; }
.message-summary-card small { color: var(--muted); }
.summary-unread { --summary-accent: var(--accent); }.summary-needs-reply { --summary-accent: var(--delivery-pending); }.summary-waiting-client { --summary-accent: var(--primary-strong); }.summary-open { --summary-accent: var(--delivery-sent); }
.admin-message-tabs { display: flex; gap: .3rem; overflow-x: auto; scrollbar-width: thin; border: 1px solid var(--border); border-radius: 14px 14px 0 0; padding: .42rem; background: var(--surface); }
.admin-message-tabs a { display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; gap: .4rem; min-height: 40px; border: 1px solid transparent; border-radius: 10px; padding: .48rem .72rem; color: var(--muted); font-size: .86rem; font-weight: 680; text-decoration: none; white-space: nowrap; }
.admin-message-tabs a:hover { color: var(--text); background: var(--surface-strong); }
.admin-message-tabs a.is-active { color: var(--text); border-color: color-mix(in srgb,var(--accent) 52%,var(--border)); background: color-mix(in srgb,var(--accent) 16%,var(--surface-strong)); box-shadow: inset 0 -2px 0 var(--accent); }
.tab-count { display: inline-grid; min-width: 1.45rem; height: 1.45rem; place-items: center; border-radius: 999px; padding: 0 .35rem; color: var(--text); background: color-mix(in srgb,var(--muted) 17%,transparent); font-size: .7rem; }
.admin-message-tabs a.is-active .tab-count { background: color-mix(in srgb,var(--accent) 28%,transparent); }
.message-filter-panel { border: 1px solid var(--border); border-top: 0; border-radius: 0 0 14px 14px; padding: .85rem; background: color-mix(in srgb,var(--surface) 96%,transparent); }
.message-filter-toolbar { grid-template-columns: minmax(240px,1.5fr) minmax(160px,.8fr) minmax(160px,.75fr) auto; }
.message-filter-toolbar label { display: grid; gap: .35rem; min-width: 0; }
.message-filter-toolbar label span { color: var(--muted); font-weight: 650; }
.message-filter-toolbar input,.message-filter-toolbar select { width: 100%; min-width: 0; }
.message-filter-toolbar .filter-actions { display: flex; align-items: center; gap: .4rem; }
.message-filter-toolbar .button { white-space: nowrap; }
.message-freshness { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .35rem 1rem; margin-top: .7rem; border-top: 1px solid var(--border); padding-top: .65rem; color: var(--muted); font-size: .78rem; }
.message-freshness a { color: var(--primary); font-weight: 650; }
.admin-conversation-list { display: grid; gap: .65rem; margin-top: 1rem; }
.admin-conversation-card { position: relative; display: grid; grid-template-columns: minmax(300px,1.55fr) minmax(200px,.85fr) minmax(150px,.55fr); gap: 1rem; align-items: center; min-width: 0; border: 1px solid var(--border); border-radius: 14px; padding: 1rem; color: var(--text); background: color-mix(in srgb,var(--surface) 97%,transparent); box-shadow: 0 6px 20px rgba(0,0,0,.06); transition: border-color .16s ease,box-shadow .16s ease,transform .16s ease; }
.admin-conversation-card:hover,.admin-conversation-card:focus-within { border-color: color-mix(in srgb,var(--primary-strong) 65%,var(--border)); box-shadow: 0 12px 30px rgba(0,0,0,.12); transform: translateY(-1px); }
.admin-conversation-card.is-unread { border-left: 4px solid var(--accent); background: linear-gradient(100deg,color-mix(in srgb,var(--accent) 10%,var(--surface)),var(--surface) 38%); box-shadow: 0 10px 28px rgba(0,0,0,.11); }
.conversation-identity { display: grid; grid-template-columns: 42px minmax(0,1fr); gap: .8rem; min-width: 0; align-items: start; }
.client-initial { display: inline-grid; width: 42px; height: 42px; place-items: center; border: 1px solid color-mix(in srgb,var(--accent) 50%,var(--border)); border-radius: 12px; color: var(--text); background: linear-gradient(145deg,color-mix(in srgb,var(--primary-strong) 26%,var(--surface-strong)),color-mix(in srgb,var(--accent) 18%,var(--surface))); font-size: .78rem; font-weight: 750; letter-spacing: .04em; }
.conversation-identity-copy { min-width: 0; }
.conversation-client { display: flex; flex-wrap: wrap; align-items: center; gap: .45rem; margin: 0 0 .15rem; color: var(--muted); font-size: .78rem; }
.conversation-client a { color: var(--muted); font-weight: 650; }
.conversation-identity h2 { margin: 0; font-size: 1.02rem; line-height: 1.3; overflow-wrap: anywhere; }
.conversation-identity h2 a { text-decoration: none; }
.conversation-identity h2 a:hover { color: var(--primary); text-decoration: underline; text-underline-offset: 3px; }
.admin-conversation-card .message-preview { display: -webkit-box; max-width: 68ch; overflow: hidden; margin: .35rem 0 0; color: var(--muted); font-size: .86rem; line-height: 1.45; overflow-wrap: anywhere; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.conversation-context { display: grid; gap: .42rem; min-width: 0; color: var(--muted); font-size: .8rem; }
.conversation-context span { display: grid; grid-template-columns: minmax(75px,.65fr) minmax(0,1fr); gap: .5rem; overflow-wrap: anywhere; }
.conversation-context strong { color: var(--muted); font-size: .68rem; letter-spacing: .04em; text-transform: uppercase; }
.conversation-context a { color: var(--primary); }
.conversation-operations { display: grid; justify-items: end; gap: .42rem; min-width: 0; text-align: right; }
.conversation-operations time { color: var(--muted); font-size: .76rem; }
.message-status-badge,.message-unread-badge,.conversation-delivery-flag { display: inline-flex; align-items: center; width: max-content; max-width: 100%; border: 1px solid var(--border); border-radius: 999px; padding: .22rem .55rem; font-size: .7rem; font-weight: 720; line-height: 1.3; }
.message-status-needs-reply { color: var(--warning-text); border-color: color-mix(in srgb,var(--delivery-pending) 60%,var(--border)); background: color-mix(in srgb,var(--delivery-pending) 11%,var(--surface)); }
.message-status-waiting-client { color: var(--primary); border-color: color-mix(in srgb,var(--primary-strong) 62%,var(--border)); background: color-mix(in srgb,var(--primary-strong) 13%,var(--surface)); }
.message-status-open { color: var(--delivery-sent); border-color: color-mix(in srgb,var(--delivery-sent) 58%,var(--border)); background: color-mix(in srgb,var(--delivery-sent) 9%,var(--surface)); }
.message-status-closed { color: var(--muted); background: var(--surface-strong); }
.message-unread-badge { color: var(--text); border-color: color-mix(in srgb,var(--accent) 62%,var(--border)); background: color-mix(in srgb,var(--accent) 18%,var(--surface)); }
.conversation-delivery-flag { gap: .3rem; color: var(--delivery-failed); border-color: color-mix(in srgb,var(--delivery-failed) 62%,var(--border)); background: color-mix(in srgb,var(--delivery-failed) 9%,var(--surface)); }
.admin-message-empty { display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: 1rem; margin-top: 1rem; border: 1px dashed color-mix(in srgb,var(--accent) 45%,var(--border)); border-radius: 14px; padding: 1.25rem; background: color-mix(in srgb,var(--surface) 94%,transparent); }
.admin-message-empty h2 { margin: 0 0 .2rem; font-size: 1.15rem; }.admin-message-empty p { margin: 0; color: var(--muted); }
.empty-state-mark { display: grid; width: 48px; height: 48px; place-items: center; border-radius: 14px; color: var(--text); background: linear-gradient(145deg,color-mix(in srgb,var(--primary-strong) 35%,var(--surface)),color-mix(in srgb,var(--accent) 35%,var(--surface))); font-weight: 750; }

.breadcrumb { margin: 0 0 .75rem; color: var(--muted); font-size: .85rem; }.breadcrumb a { color: var(--primary); }
.conversation-workspace-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 1.5rem; border: 1px solid var(--border); border-radius: 16px; padding: clamp(1rem,2.5vw,1.4rem); background: linear-gradient(110deg,color-mix(in srgb,var(--accent) 9%,var(--surface)),var(--surface) 42%); box-shadow: var(--shadow); }
.conversation-title-block { min-width: 0; }.conversation-title-block .eyebrow { margin-bottom: .25rem; }
.conversation-title-line { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; }.conversation-title-line h1 { margin: 0; font-size: clamp(1.65rem,3.4vw,2.5rem); line-height: 1.08; overflow-wrap: anywhere; }
.conversation-title-block > p:last-child { margin: .6rem 0 0; color: var(--muted); }.conversation-title-block > p:last-child a { color: var(--primary); font-weight: 680; }
.conversation-lifecycle-actions { display: flex; flex: 0 0 auto; align-items: center; gap: .5rem; }.conversation-lifecycle-actions form { margin: 0; }
.conversation-delivery-warning { align-items: center; margin-top: .75rem; }.conversation-delivery-warning .warning-icon { display: grid; flex: 0 0 auto; width: 30px; height: 30px; place-items: center; border-radius: 999px; color: var(--bg); background: var(--delivery-failed); font-weight: 750; }.conversation-delivery-warning > div { display: grid; gap: .1rem; }
.admin-message-workspace { display: grid; grid-template-columns: minmax(0,1fr) minmax(260px,320px); gap: 1rem; align-items: start; margin-top: 1rem; }
.conversation-main-column { display: grid; gap: 1rem; min-width: 0; }
.conversation-main-column .conversation-panel,.conversation-main-column .reply-panel { min-width: 0; border: 1px solid var(--border); border-radius: 16px; padding: clamp(1rem,2vw,1.25rem); background: color-mix(in srgb,var(--surface) 97%,transparent); box-shadow: 0 9px 28px rgba(0,0,0,.07); }
.admin-conversation-timeline { position: relative; padding: .25rem 0; }
.admin-conversation-timeline::before { position: absolute; top: .5rem; bottom: .5rem; left: 50%; width: 1px; content: ""; background: linear-gradient(transparent,var(--border) 8%,var(--border) 92%,transparent); pointer-events: none; }
.admin-conversation-timeline .conversation-message { position: relative; width: min(78%,700px); z-index: 1; }
.admin-app-body .conversation-message.message-from-self { color: var(--text); border-color: color-mix(in srgb,var(--accent) 48%,var(--border)); background: linear-gradient(145deg,color-mix(in srgb,var(--primary-strong) 22%,var(--surface)),color-mix(in srgb,var(--accent) 17%,var(--surface))); }
.admin-app-body .conversation-message.message-from-other { color: var(--text); border-color: var(--border); background: var(--surface-strong); }
.conversation-message-heading time { color: var(--muted); font-size: .76rem; }
.delivery-detail { align-items: flex-start; }.delivery-detail .delivery-badge { max-width: 100%; }.delivery-state-failed { border-top-color: color-mix(in srgb,var(--delivery-failed) 45%,var(--border)); }
.delivery-portal { color: var(--muted); }
.conversation-context-sidebar { position: sticky; top: 1rem; overflow: clip; border: 1px solid var(--border); border-radius: 16px; background: color-mix(in srgb,var(--surface) 97%,transparent); box-shadow: 0 9px 28px rgba(0,0,0,.07); }
.context-sidebar-heading { border-bottom: 1px solid var(--border); padding: 1rem; background: color-mix(in srgb,var(--accent) 8%,var(--surface)); }.context-sidebar-heading h2 { margin: .1rem 0 0; font-size: 1.18rem; }
.context-definition-list { display: grid; margin: 0; padding: .3rem 1rem; }.context-definition-list div { display: grid; grid-template-columns: minmax(90px,.7fr) minmax(0,1fr); gap: .65rem; border-bottom: 1px solid var(--border); padding: .68rem 0; }.context-definition-list div:last-child { border-bottom: 0; }.context-definition-list dt { color: var(--muted); font-size: .7rem; font-weight: 720; letter-spacing: .04em; text-transform: uppercase; }.context-definition-list dd { min-width: 0; margin: 0; overflow-wrap: anywhere; }.context-definition-list dd small { display: block; margin-top: .12rem; }.context-definition-list a { color: var(--primary); font-weight: 650; }
.context-links { display: grid; gap: .5rem; border-top: 1px solid var(--border); padding: .85rem 1rem; background: var(--surface-strong); }.context-links a { color: var(--primary); font-size: .82rem; font-weight: 650; }
.reply-panel { scroll-margin-top: 1rem; }.reply-panel-heading { display: grid; grid-template-columns: minmax(0,1fr) minmax(200px,auto); gap: 1rem; align-items: start; }.reply-panel-heading h2 { margin: .1rem 0 .25rem; }.reply-panel-heading p:last-child { max-width: 62ch; margin: 0; color: var(--muted); }
.reply-recipient { display: grid; border: 1px solid var(--border); border-radius: 12px; padding: .7rem .85rem; background: var(--surface-strong); }.reply-recipient span { color: var(--muted); font-size: .68rem; font-weight: 720; letter-spacing: .05em; text-transform: uppercase; }.reply-recipient small { overflow-wrap: anywhere; }
.reply-panel textarea { min-height: 170px; resize: vertical; }
.closed-conversation-note { display: flex; justify-content: space-between; align-items: center; gap: 1rem; border: 1px solid var(--border); border-radius: 16px; padding: 1.15rem; background: var(--surface); }.closed-conversation-note h2 { margin: 0 0 .2rem; }.closed-conversation-note p { margin: 0; color: var(--muted); }
.admin-conversation-card.is-compact { grid-template-columns: minmax(260px,1.3fr) minmax(180px,.8fr) minmax(150px,.5fr); padding: .8rem; box-shadow: none; }.admin-conversation-card.is-compact .client-initial { width: 36px; height: 36px; border-radius: 10px; }.admin-conversation-card.is-compact .conversation-identity { grid-template-columns: 36px minmax(0,1fr); }.admin-conversation-card.is-compact .conversation-identity h2 { font-size: .94rem; }
.admin-client-section.needs-attention > summary { border-left: 3px solid var(--delivery-pending); }
.message-compose-shell .message-compose-panel { border-radius: 16px; }.message-compose-shell .form-intro h1 { margin: .15rem 0 .35rem; }

@media (max-width: 1024px) {
  .message-summary-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .message-filter-toolbar { grid-template-columns: minmax(220px,1.2fr) minmax(160px,.8fr) minmax(160px,.8fr); }
  .message-filter-toolbar .filter-actions { grid-column: 1/-1; }
  .admin-conversation-card,.admin-conversation-card.is-compact { grid-template-columns: minmax(280px,1.3fr) minmax(190px,.8fr); }
  .conversation-operations { grid-column: 1/-1; display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; }
  .admin-message-workspace { grid-template-columns: minmax(0,1fr) minmax(240px,280px); }
}

@media (max-width: 800px) {
  .admin-messages-header,.conversation-workspace-header { align-items: stretch; flex-direction: column; }
  .admin-messages-header .header-actions,.conversation-lifecycle-actions { justify-content: flex-start; }
  .admin-conversation-card,.admin-conversation-card.is-compact { grid-template-columns: 1fr; }
  .conversation-context { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .conversation-operations { grid-column: auto; justify-content: flex-start; text-align: left; }
  .admin-message-workspace { grid-template-columns: 1fr; }
  .conversation-context-sidebar { position: static; grid-row: 1; }
  .admin-conversation-timeline::before { left: 1rem; }
  .admin-conversation-timeline .conversation-message { width: min(90%,700px); }
}

@media (max-width: 760px) {
  .message-filter-toolbar { grid-template-columns: 1fr 1fr; }
  .message-search-field { grid-column: 1/-1; }
  .message-filter-toolbar .filter-actions { grid-column: 1/-1; }
  .client-loader-form { grid-template-columns: 1fr; }
  .conversation-message { width: 92%; }
}
@media (max-width: 520px) {
  .message-filter-toolbar { grid-template-columns: 1fr; }
  .message-filter-toolbar .button { width: 100%; }
  .conversation-message { width: 96%; padding: .9rem; }
  .conversation-message-heading { flex-direction: column; gap: .25rem; }
  .conversation-message-heading > span { justify-content: flex-start; text-align: left; }
  .conversation-facts { display: grid; grid-template-columns: 1fr 1fr; }
  .messages-index-shell,.message-thread-shell { width: min(100% - 1rem,1180px); }
  .message-summary-grid { grid-template-columns: 1fr 1fr; gap: .5rem; }
  .message-summary-card { min-height: 88px; padding: .75rem; }.message-summary-card strong { font-size: 1.55rem; }.message-summary-card small { display: none; }
  .admin-message-tabs { margin-inline: -.25rem; border-radius: 12px 12px 0 0; }
  .admin-message-tabs a { min-height: 42px; }
  .message-filter-toolbar { grid-template-columns: 1fr; }.message-search-field,.message-filter-toolbar .filter-actions { grid-column: auto; }.message-filter-toolbar .filter-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .admin-conversation-card { padding: .8rem; }.conversation-identity { grid-template-columns: 36px minmax(0,1fr); }.client-initial { width: 36px; height: 36px; border-radius: 10px; }
  .conversation-context { grid-template-columns: 1fr; }.conversation-operations { display: grid; grid-template-columns: 1fr auto; justify-items: start; width: 100%; }.conversation-operations .button { grid-column: 2; grid-row: 1/4; align-self: center; }
  .admin-message-empty { grid-template-columns: auto minmax(0,1fr); }.admin-message-empty .toolbar-actions { grid-column: 1/-1; display: grid; width: 100%; }.admin-message-empty .button { width: 100%; }
  .conversation-lifecycle-actions { flex-wrap: wrap; }.conversation-lifecycle-actions .button { min-height: 42px; }
  .conversation-main-column .conversation-panel,.conversation-main-column .reply-panel { padding: .85rem; }
  .admin-conversation-timeline::before { display: none; }.admin-conversation-timeline .conversation-message { width: 96%; padding: .85rem; }
  .reply-panel-heading { grid-template-columns: 1fr; }.closed-conversation-note { align-items: stretch; flex-direction: column; }.closed-conversation-note .button { width: 100%; }
  .context-definition-list div { grid-template-columns: 92px minmax(0,1fr); }
}
@media (prefers-reduced-motion: reduce) { .client-app-body *, .client-app-body *::before, .client-app-body *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; } }
/* Projects and delivery workspace */
.project-page-header,.project-hero,.client-project-hero,.panel-heading-row{display:flex;justify-content:space-between;align-items:flex-start;gap:1.25rem}.project-page-header{margin-bottom:1.25rem}.project-page-header h1,.project-hero h1,.client-project-hero h1{margin:.15rem 0}.project-summary-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.75rem;margin:1rem 0 1.25rem}.project-summary-grid>a,.project-operational-strip>article{display:flex;flex-direction:column;gap:.25rem;padding:1rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface)}.project-summary-grid strong,.project-operational-strip strong{font-size:1.35rem}.project-tabs{display:flex;gap:.35rem;overflow-x:auto;margin:1rem 0;padding-bottom:.25rem}.project-tabs a{white-space:nowrap;padding:.65rem .85rem;border-radius:999px;border:1px solid var(--border);text-decoration:none}.project-tabs a.is-active{background:var(--accent);border-color:var(--accent);color:#fff}.project-filter-panel{display:grid;grid-template-columns:2fr 1fr 1fr auto;align-items:end;gap:.75rem;padding:1rem;margin-bottom:1rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface)}.project-card-list,.milestone-list,.deliverable-list,.project-activity{display:grid;gap:.75rem}.project-card{display:grid;grid-template-columns:minmax(16rem,1.2fr) minmax(18rem,1fr) auto;align-items:center;gap:1rem;padding:1rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface)}.project-card h2{margin:.2rem 0}.project-card dl{display:grid;grid-template-columns:auto 1fr;gap:.25rem .6rem;margin:0}.project-card dt{color:var(--muted)}.project-card dd{margin:0}.project-badges{display:flex;flex-wrap:wrap;gap:.35rem}.health-on_track{background:#dff6e8;color:#145c35}.health-at_risk{background:#fff0c2;color:#734b00}.health-blocked{background:#ffdede;color:#7f1d1d}.health-complete{background:#dcecff;color:#174b7a}.project-form fieldset{border:1px solid var(--border);border-radius:var(--radius);padding:1rem}.project-form legend{font-weight:700;padding:0 .4rem}.project-hero-actions,.action-stack{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}.project-operational-strip{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.65rem;margin:1rem 0}.project-operational-strip progress,.project-progress progress,.project-card progress,.client-project-card progress{width:100%}.project-lifecycle{display:flex;justify-content:space-between;gap:1rem;align-items:center}.inline-reason-form{display:flex;gap:.4rem;align-items:center}.project-layout{display:grid;grid-template-columns:minmax(0,2.1fr) minmax(17rem,.9fr);gap:1rem;margin-top:1rem}.project-main-column,.project-sidebar{display:grid;gap:1rem;align-content:start}.project-main-column>.info-panel,.project-sidebar>.info-panel{margin:0}.milestone-list>article,.deliverable-list>article,.project-update,.activity-row,.project-activity>article{display:flex;justify-content:space-between;gap:1rem;padding:1rem 0;border-bottom:1px solid var(--border)}.project-update,.activity-row,.project-activity>article{display:block}.milestone-list h3,.deliverable-list h3,.project-update h3{margin:.35rem 0}.internal-note{border-left:3px solid var(--warning);padding-left:.75rem}.project-main-column details{margin-top:1rem;border:1px solid var(--border);border-radius:var(--radius);padding:.75rem}.project-main-column summary{cursor:pointer;font-weight:700}.client-project-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.client-project-card{display:flex;flex-direction:column;gap:.75rem}.client-project-card h2{margin:0}.client-project-card .button{margin-top:auto;align-self:flex-start}.client-project-hero,.client-project-next,.project-section-nav{margin-bottom:1rem}.project-progress{min-width:15rem;display:flex;flex-direction:column;gap:.3rem;padding:1rem;border:1px solid var(--border);border-radius:var(--radius)}.project-progress strong{font-size:1.6rem}.client-project-next{display:flex;gap:1rem;align-items:center;padding:1rem;border-radius:var(--radius);background:var(--surface-strong)}.client-project-next span:last-child{margin-left:auto}.project-section-nav{display:flex;gap:.5rem;overflow:auto}.project-section-nav a{white-space:nowrap}.client-project-detail>.client-card{margin-bottom:1rem}.customer-action{padding:.65rem;border-left:3px solid var(--accent);background:var(--surface-strong)}.deliverable-review-actions{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:1rem}.deliverable-review-actions form{padding:1rem;border:1px solid var(--border);border-radius:var(--radius)}
@media(max-width:900px){.project-summary-grid,.project-operational-strip{grid-template-columns:repeat(2,minmax(0,1fr))}.project-filter-panel{grid-template-columns:1fr 1fr}.project-card{grid-template-columns:1fr}.project-layout{grid-template-columns:1fr}.project-lifecycle,.project-hero,.client-project-hero{flex-direction:column}.client-project-grid{grid-template-columns:1fr}}
@media(max-width:600px){.project-summary-grid,.project-operational-strip,.project-filter-panel,.deliverable-review-actions{grid-template-columns:1fr}.project-page-header,.panel-heading-row{flex-direction:column}.project-card,.client-project-card{min-width:0}.client-project-next{align-items:flex-start;flex-direction:column}.client-project-next span:last-child{margin-left:0}.inline-reason-form{align-items:stretch;flex-direction:column}.project-tabs{margin-inline:-.25rem}.project-hero-actions{width:100%}.project-hero-actions .button{flex:1}.milestone-list>article,.deliverable-list>article{flex-direction:column}}

/* Project workspace polish */
.project-breadcrumb{display:flex;align-items:center;gap:.5rem;margin:0 0 1rem;color:var(--muted);font-size:.92rem}.project-breadcrumb a{color:inherit}.project-workspace-header{display:flex;justify-content:space-between;align-items:flex-start;gap:2rem;padding:1.35rem;border:1px solid var(--border);border-radius:calc(var(--radius) + .25rem);background:var(--surface);box-shadow:var(--shadow)}.project-title-block{min-width:0;max-width:50rem}.project-title-block h1{margin:.15rem 0 .45rem;overflow-wrap:anywhere}.project-title-block>p:not(.eyebrow){max-width:48rem;margin:.25rem 0 1rem;color:var(--muted);font-size:1.02rem}.project-header-actions{display:flex;justify-content:flex-end;align-items:center;flex-wrap:wrap;gap:.5rem;max-width:38rem}.project-more-actions{position:relative}.project-more-actions>summary{list-style:none;cursor:pointer}.project-more-actions>summary::-webkit-details-marker{display:none}.project-action-menu{position:absolute;z-index:5;right:0;top:calc(100% + .4rem);display:grid;min-width:13rem;padding:.4rem;border:1px solid var(--border);border-radius:.65rem;background:var(--surface);box-shadow:0 12px 30px rgba(15,23,42,.18)}.project-action-menu button{appearance:none;padding:.65rem .75rem;border:0;border-radius:.4rem;color:var(--text);background:transparent;text-align:left;cursor:pointer}.project-action-menu button:hover,.project-action-menu button:focus-visible{background:var(--surface-strong)}.visibility-private{border-color:color-mix(in srgb,var(--warning) 55%,var(--border))}.visibility-visible{border-color:color-mix(in srgb,var(--success) 55%,var(--border))}
.project-workspace-tabs{display:flex;gap:.25rem;overflow-x:auto;margin:1rem 0;padding:.35rem;border:1px solid var(--border);border-radius:.8rem;background:var(--surface);scrollbar-width:thin}.project-workspace-tabs a{display:flex;align-items:center;gap:.4rem;flex:0 0 auto;padding:.7rem .85rem;border-radius:.55rem;color:var(--muted);font-weight:650;text-decoration:none}.project-workspace-tabs a small{display:grid;min-width:1.35rem;height:1.35rem;padding:0 .3rem;place-items:center;border-radius:999px;background:var(--surface-strong);font-size:.75rem}.project-workspace-tabs a[aria-current="page"]{color:#fff;background:var(--accent);box-shadow:0 5px 14px color-mix(in srgb,var(--accent) 25%,transparent)}.project-workspace-tabs a[aria-current="page"] small{color:var(--accent);background:#fff}.project-tab-panel{margin:0}.project-overview-grid{display:grid;grid-template-columns:minmax(0,2fr) minmax(17rem,.8fr);gap:1rem}.project-prose{white-space:pre-line;line-height:1.7}.customer-note{margin-top:1rem;padding:1rem;border-left:4px solid var(--accent);border-radius:.25rem;background:var(--surface-strong)}.customer-note p{margin:.4rem 0 0;white-space:pre-line}.internal-project-note{border-color:color-mix(in srgb,var(--warning) 65%,var(--border));background:color-mix(in srgb,var(--warning) 7%,var(--surface))}.internal-project-note .eyebrow{color:color-mix(in srgb,var(--warning) 78%,var(--text))}.visibility-panel{border-top:4px solid var(--warning)}.visibility-panel.is-visible{border-top-color:var(--success)}.relation-summary{display:grid;gap:.55rem}.relation-summary>a,.relation-summary>div{display:flex;justify-content:space-between;gap:1rem;padding:.65rem .75rem;border:1px solid var(--border);border-radius:.55rem;text-decoration:none}.relation-summary span{color:var(--muted)}.compact-empty{margin:.75rem 0;padding:.9rem 1rem;border:1px dashed var(--border);border-radius:.7rem;color:var(--muted);background:color-mix(in srgb,var(--surface-strong) 65%,transparent)}.compact-empty p{margin:0}.project-create-panel{margin-top:1rem;padding:.85rem;border:1px solid var(--border);border-radius:.7rem}.project-create-panel>summary{cursor:pointer;font-weight:750}.dialog-form{display:grid;gap:1rem}.dialog-summary{display:grid;grid-template-columns:auto 1fr;gap:.4rem .8rem;margin:0;padding:1rem;border-radius:.65rem;background:var(--surface-strong)}.dialog-summary dt{color:var(--muted)}.dialog-summary dd{margin:0;overflow-wrap:anywhere}.confirmation-modal{max-height:min(90vh,48rem);overflow:auto}.confirmation-modal textarea{min-height:6rem}.conversation-summary-list{display:grid;gap:.75rem}.conversation-summary-list article{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1rem;border:1px solid var(--border);border-radius:.75rem;background:var(--surface)}.conversation-summary-list h3{margin:.15rem 0}.conversation-summary-list p{margin:.2rem 0}.client-preview-banner{position:sticky;z-index:20;top:0;display:flex;justify-content:center;gap:1rem;padding:.75rem 1rem;color:#fff;background:#5b3fd6;font-weight:750}.client-preview-banner a{color:#fff}.client-project-detail.is-preview{--client-surface:var(--surface);--client-border:var(--border);--client-text:var(--text)}
.client-project-hero{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(22rem,1fr);align-items:stretch;padding:clamp(1.25rem,3vw,2rem);border:1px solid var(--client-border);border-radius:1rem;background:var(--client-surface);box-shadow:var(--client-shadow)}.client-project-title h1{margin:.15rem 0 .5rem;overflow-wrap:anywhere}.client-project-title>p:not(.eyebrow){max-width:48rem;color:var(--client-muted);font-size:1.05rem;line-height:1.6}.client-project-metrics{display:grid;grid-template-columns:1fr 1fr;gap:.6rem}.client-project-metrics>div{display:flex;flex-direction:column;gap:.3rem;padding:.9rem;border:1px solid var(--client-border);border-radius:.75rem;background:var(--client-surface-strong)}.client-project-metrics>div:first-child{grid-row:span 2}.client-project-metrics span,.client-project-card-progress span{color:var(--client-muted);font-size:.82rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em}.client-project-metrics strong{font-size:1.05rem;overflow-wrap:anywhere}.client-project-metrics>div:first-child strong{font-size:1.65rem}.client-project-metrics progress{width:100%}.client-project-next{justify-content:space-between;border:1px solid var(--client-border);background:color-mix(in srgb,var(--client-accent) 8%,var(--client-surface))}.client-project-next>div{display:grid;gap:.25rem}.client-project-next strong{font-size:1.08rem}.client-project-overview{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(18rem,.75fr);gap:1rem}.client-project-overview>.client-card{margin:0}.client-workspace-tabs{border-color:var(--client-border);background:var(--client-surface)}.client-workspace-tabs a{color:var(--client-muted)}.client-workspace-tabs a[aria-current="page"]{background:var(--client-accent)}
.milestone-timeline{position:relative;display:grid;gap:0;margin:1rem 0 0;padding:0;list-style:none}.milestone-timeline:before{content:"";position:absolute;top:1rem;bottom:1rem;left:.55rem;width:2px;background:var(--client-border)}.milestone-timeline li{position:relative;display:grid;grid-template-columns:1.2rem 1fr;gap:.8rem;padding:0 0 1.25rem}.milestone-marker{z-index:1;width:1.1rem;height:1.1rem;margin-top:1.05rem;border:3px solid var(--client-surface);border-radius:50%;outline:2px solid var(--client-muted);background:var(--client-surface)}.milestone-completed .milestone-marker{outline-color:var(--success);background:var(--success)}.milestone-in_progress .milestone-marker,.milestone-waiting_on_client .milestone-marker{outline-color:var(--client-accent);background:var(--client-accent)}.milestone-timeline article{padding:1rem;border:1px solid var(--client-border);border-radius:.75rem;background:var(--client-surface-strong)}.milestone-timeline h3{margin:0}.project-timeline article{position:relative;padding-left:1.2rem}.project-timeline article:before{content:"";position:absolute;top:1.25rem;left:0;width:.5rem;height:.5rem;border-radius:50%;background:var(--accent)}
.project-timeline{margin:0;padding:0;list-style:none}.project-timeline li{display:grid;grid-template-columns:2rem minmax(0,1fr);gap:.75rem;padding:1rem 0;border-bottom:1px solid var(--border)}.activity-marker{display:grid;place-items:center;width:2rem;height:2rem;border:1px solid var(--border);border-radius:50%;color:var(--accent);background:var(--surface-strong)}.activity-content{min-width:0}.activity-content h3{margin:0;line-height:1.35;overflow-wrap:anywhere}.activity-content p{margin:.35rem 0}.activity-content time,.activity-meta{display:block;margin-top:.35rem;color:var(--muted);font-size:.875rem}.activity-meta{display:flex!important;flex-wrap:wrap;gap:.35rem .75rem}
.client-project-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.client-project-card{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(10rem,.55fr);gap:1rem;align-items:start}.client-project-card-main{min-width:0}.client-project-card h2{font-size:1.35rem;overflow-wrap:anywhere}.client-project-summary{color:var(--client-muted);line-height:1.55}.client-project-card-progress{display:flex;flex-direction:column;gap:.4rem;padding:.8rem;border:1px solid var(--client-border);border-radius:.65rem;background:var(--client-surface-strong)}.client-project-card-progress strong{font-size:1.4rem}.client-project-card-progress progress{width:100%}.client-project-card-details{grid-column:1/-1;display:grid;grid-template-columns:auto 1fr;gap:.4rem 1rem;margin:0;padding-top:.8rem;border-top:1px solid var(--client-border)}.client-project-card-details dt{color:var(--client-muted)}.client-project-card-details dd{margin:0;overflow-wrap:anywhere}.client-project-card>.button{grid-column:1/-1;margin-top:0}
@media(max-width:1100px){.client-project-list{grid-template-columns:1fr}.project-workspace-header{flex-direction:column}.project-header-actions{justify-content:flex-start;max-width:none}.client-project-hero{grid-template-columns:1fr}.client-project-overview{grid-template-columns:1fr}}
@media(max-width:900px){.project-overview-grid{grid-template-columns:1fr}.project-operational-strip{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.project-workspace-header{padding:1rem}.project-header-actions{width:100%}.project-header-actions>.button,.project-header-actions>button{flex:1 1 10rem}.project-more-actions{flex:1 1 100%}.project-more-actions>summary{width:100%;text-align:center}.project-action-menu{left:0;right:auto;width:100%}.project-operational-strip{grid-template-columns:1fr}.project-workspace-tabs{margin-inline:-.25rem}.conversation-summary-list article{align-items:flex-start;flex-direction:column}.client-project-metrics{grid-template-columns:1fr}.client-project-metrics>div:first-child{grid-row:auto}.client-project-card{grid-template-columns:1fr}.client-project-card-details{grid-column:auto}.client-project-card>.button{grid-column:auto;width:100%}.client-preview-banner{align-items:center;justify-content:space-between;font-size:.85rem}.milestone-timeline .panel-heading-row{gap:.5rem}.milestone-timeline .panel-heading-row .status-pill{align-self:flex-start}}
/* Secure documents and file delivery */
.document-filter-panel{display:grid;grid-template-columns:2fr repeat(6,minmax(9rem,1fr));align-items:end;gap:.65rem;margin-bottom:1rem;padding:1rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface)}.document-filter-panel .filter-actions{display:flex;gap:.4rem}.document-card-list,.document-version-list,.client-document-grid{display:grid;gap:.75rem}.document-card{display:grid;grid-template-columns:minmax(18rem,1.3fr) minmax(18rem,1fr) auto;align-items:center;gap:1rem;padding:1rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow)}.document-card h2{margin:.3rem 0}.document-card dl{display:grid;grid-template-columns:auto 1fr;gap:.25rem .6rem;margin:0}.document-card dt{color:var(--muted)}.document-card dd{margin:0}.document-operations{margin-top:1rem}.document-form fieldset{border:1px solid var(--border);border-radius:var(--radius);padding:1rem}.document-form legend{padding:0 .35rem;font-weight:700}.document-actions form{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem}.document-version-list>article,.document-client-version{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;border-bottom:1px solid var(--border);padding:1rem 0}.document-version-list h3{margin:.35rem 0}.client-document-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.client-document-card{display:flex;flex-direction:column;gap:.65rem}.client-document-card h2,.client-document-card h3{margin:.2rem 0}.client-document-card .toolbar-actions,.client-document-card>.button{margin-top:auto}.status-pending_scan,.status-processing,.status-submitted{background:#fff0c2;color:#734b00}.status-available,.status-published{background:#dff6e8;color:#145c35}.status-rejected,.status-quarantined,.status-failed,.status-withdrawn{background:#ffdede;color:#7f1d1d}.status-archived{background:var(--surface-strong);color:var(--muted)}
@media(max-width:1200px){.document-filter-panel{grid-template-columns:repeat(4,minmax(0,1fr))}.document-search{grid-column:span 2}.document-filter-panel .filter-actions{grid-column:span 2}.document-card{grid-template-columns:minmax(16rem,1.2fr) minmax(15rem,1fr) auto}}
@media(max-width:800px){.document-filter-panel{grid-template-columns:1fr 1fr}.document-card{grid-template-columns:1fr}.document-card>.button{justify-self:start}.client-document-grid{grid-template-columns:1fr}}
.icon{display:inline-block;flex:0 0 auto;vertical-align:-.18em}.button>.icon{margin-right:.25rem}.button-icon{display:inline-grid!important;place-items:center;min-width:2.75rem;min-height:2.75rem;padding:.55rem!important}.button-icon>.icon{margin:0}.button-icon.is-loading .icon-refresh{animation:document-refresh-spin .75s linear infinite}@keyframes document-refresh-spin{to{transform:rotate(360deg)}}
.document-workspace{max-width:1440px}.document-title-group{min-width:0}.document-hero h1,.filename,.checksum{overflow-wrap:anywhere}.document-more-actions{position:relative}.document-more-actions>summary{list-style:none;cursor:pointer}.document-more-actions>summary::-webkit-details-marker{display:none}.document-action-menu{position:absolute;z-index:5;right:0;top:calc(100% + .35rem);display:grid;min-width:13rem;padding:.4rem;border:1px solid var(--border);border-radius:.65rem;background:var(--surface);box-shadow:var(--shadow)}.document-action-menu button{width:100%;padding:.65rem .75rem;border:0;text-align:left;color:inherit;background:transparent;cursor:pointer}.document-action-menu button:hover,.document-action-menu button:focus-visible{background:var(--surface-strong)}.danger-text{color:var(--danger)!important}
.document-processing-banner{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:1rem;align-items:start;margin:1rem 0;padding:1rem;border:1px solid var(--warning);border-radius:var(--radius);background:color-mix(in srgb,var(--warning) 10%,var(--surface))}.document-processing-banner h2{margin:0}.document-processing-banner p{margin:.35rem 0}.processing-icon{display:grid;place-items:center;width:2.5rem;height:2.5rem;border-radius:50%;background:var(--surface)}.inline-status{min-height:1.3em}.document-summary-strip{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.65rem;margin:1rem 0}.document-summary-strip article{display:flex;flex-direction:column;gap:.3rem;min-width:0;padding:1rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface)}.document-summary-strip span{color:var(--muted);font-size:.82rem;text-transform:uppercase;letter-spacing:.04em}.document-summary-strip strong{overflow-wrap:anywhere}.security-summary{display:flex;gap:.75rem}.security-summary h2{margin:0;font-size:1rem}.security-summary p{margin:.25rem 0}.notification-result form{margin-top:1rem}.document-version-timeline{display:grid;gap:0;margin:1rem 0;padding:0;list-style:none}.document-version-timeline>li{display:grid;grid-template-columns:2.25rem minmax(0,1fr);gap:.75rem}.version-marker{display:grid;place-items:center;width:2.25rem;height:2.25rem;border:1px solid var(--border);border-radius:50%;color:var(--accent);background:var(--surface-strong)}.document-version-timeline article{display:flex;justify-content:space-between;gap:1rem;min-width:0;padding:0 0 1.25rem}.document-version-timeline h3{margin:.45rem 0}.document-upload-panel{margin-top:1rem;padding:1rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface-strong)}.processing-attempt-list{display:grid;gap:.65rem;padding-left:1.25rem}.processing-attempt-list li{padding:.65rem}.processing-attempt-list span{display:block;color:var(--muted)}
@media(max-width:1024px){.document-summary-strip{grid-template-columns:repeat(3,minmax(0,1fr))}.document-workspace .project-layout{grid-template-columns:1fr}.document-workspace .project-sidebar{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:768px){.document-summary-strip{grid-template-columns:repeat(2,minmax(0,1fr))}.document-workspace .project-sidebar{grid-template-columns:1fr}.document-version-timeline article{flex-direction:column}.document-processing-banner{grid-template-columns:auto minmax(0,1fr)}.document-processing-banner>.button-icon{grid-column:2;justify-self:start}.document-action-menu{left:0;right:auto}}
@media(max-width:480px){.document-summary-strip{grid-template-columns:1fr}.document-hero,.document-hero .project-hero-actions{width:100%}.document-hero .project-hero-actions{justify-content:flex-start}.document-version-timeline>li{grid-template-columns:1.75rem minmax(0,1fr)}.version-marker{width:1.75rem;height:1.75rem}}
.document-card-heading{display:flex;gap:.75rem;min-width:0}.document-card-icon,.document-hero-icon{display:grid;place-items:center;flex:0 0 auto;width:2.75rem;height:2.75rem;border-radius:.7rem;color:var(--accent);background:var(--surface-strong)}.document-empty{text-align:center}.document-empty>.icon{color:var(--accent)}.document-empty .toolbar-actions{justify-content:center}.client-document-grid:has(> :only-child){grid-template-columns:1fr}.client-document-card>.document-card-heading{align-items:flex-start}.document-client-hero{display:grid;grid-template-columns:auto minmax(0,1fr) auto}.document-client-hero .button{align-self:center}.client-document-layout{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(16rem,.6fr);gap:1rem;margin-bottom:1rem}.pending-upload-panel{border-color:color-mix(in srgb,var(--warning) 65%,var(--client-border))}
@media(max-width:768px){.document-client-hero{grid-template-columns:auto minmax(0,1fr)}.document-client-hero>.button{grid-column:1/-1;justify-self:start}.client-document-layout{grid-template-columns:1fr}}
@media(max-width:520px){.document-filter-panel{grid-template-columns:1fr}.document-search,.document-filter-panel .filter-actions{grid-column:auto}.document-filter-panel .filter-actions{display:grid;grid-template-columns:1fr 1fr}.document-version-list>article,.document-client-version{flex-direction:column}.document-actions form{align-items:stretch;flex-direction:column}.document-actions form>*{width:100%}}