/* OneCloud 360 shared UI system
   This layer standardises the existing screens without changing their workflows. */

html { background: var(--canvas); }
body {
  color: var(--ink);
  background: var(--canvas);
  font-family: var(--font);
  font-size: 14px;
  line-height: 1.5;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

button, input, select, textarea { font-family: var(--font); }
button { color: inherit; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible,
textarea:focus-visible, [tabindex]:focus-visible {
  outline: 0;
  box-shadow: var(--focus-ring);
}
button:disabled, input:disabled, select:disabled, textarea:disabled {
  cursor: not-allowed;
  opacity: .58;
}

.app-shell { background: var(--canvas); }
.sidebar {
  width: 252px;
  flex-basis: 252px;
  background: var(--surface);
  border-right-color: var(--line);
  box-shadow: none;
}
.brand { min-height: 68px; }
.sidebar-collapse { color: var(--muted); }
.nav-list { scrollbar-color: var(--line-strong) transparent; }
.nav-section {
  padding-top: 16px;
  color: var(--muted-soft);
  font-size: 10px;
  letter-spacing: .09em;
}
.nav-item {
  min-height: 38px;
  height: auto;
  margin: 2px 0;
  border-radius: var(--radius-sm);
  color: var(--muted);
  font-size: 13px;
  font-weight: 500;
  transition: background-color var(--duration-fast) ease, color var(--duration-fast) ease;
}
.nav-item:hover, .nav-item.active {
  background: var(--brand-tint);
  color: var(--brand-dark);
}
.nav-item.active { font-weight: 650; }
.nav-icon { width: 19px; height: 19px; color: var(--muted-soft); }
.nav-icon .oc-icon { width: 18px; height: 18px; }
.nav-count, .new-tag { border-radius: 5px; font-size: 10px; }
.sidebar-bottom { border-top-color: var(--line-subtle); }
.plan-card {
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--surface-sunken);
  box-shadow: none;
}
.plan-card p, .plan-card small { color: var(--muted); }
.plan-dot { box-shadow: none; }

.main-area { min-width: 0; }
.topbar {
  height: 66px;
  padding-inline: clamp(18px, 3vw, 42px);
  border-bottom-color: var(--line);
  background: rgba(255, 255, 255, .97);
  box-shadow: none;
  backdrop-filter: none;
}
.breadcrumb { color: var(--muted); font-size: 12px; }
.breadcrumb strong { color: var(--ink); }
.page-context {
  min-height: 34px;
  display: flex;
  align-items: center;
  padding-inline: clamp(18px, 3vw, 42px);
  background: var(--canvas);
}
.topbar { gap: 14px; }
.topbar-module-nav { display:flex; flex:1 1 auto; align-items:center; gap:4px; min-width:0; overflow-x:auto; scrollbar-width:none; }
.topbar-module-nav::-webkit-scrollbar { display:none; }
.topbar-sales-control { flex:0 0 auto; }
.topbar-module-button { min-height:32px; display:inline-flex; flex:0 0 auto; align-items:center; justify-content:center; gap:6px; padding:0 9px; border:1px solid transparent; border-radius:8px; background:transparent; color:var(--ink-soft); font-family:inherit; font-size:10.5px; font-weight:500; letter-spacing:normal; text-transform:uppercase; white-space:nowrap; }
.topbar-module-button:hover,.topbar-module-button.active { border-color:var(--line); background:var(--brand-tint); color:var(--brand-dark); }
.topbar-module-button[hidden] { display:none; }
.topbar-sales-toggle span:last-child { color:var(--muted); font-size:11px; }
.topbar-sales-menu { position:absolute; top:calc(100% + 5px); left:0; z-index:40; width:236px; max-height:min(70vh,440px); overflow:auto; padding:6px; border:1px solid var(--line); border-radius:10px; background:var(--surface); box-shadow:0 14px 34px rgba(18,42,49,.16); }
.topbar-sales-menu[hidden] { display:none; }
.topbar-sales-menu button { width:100%; min-height:36px; display:flex; align-items:center; padding:0 10px; border:0; border-radius:7px; background:transparent; color:var(--ink-soft); text-align:left; font-size:11px; }
.topbar-sales-menu button:hover,.topbar-sales-menu button[aria-current="page"] { background:var(--brand-tint); color:var(--brand-dark); }
.topbar-sales-menu button.topbar-menu-planned { justify-content:space-between; cursor:not-allowed; opacity:.72; }
.topbar-menu-planned span { padding:3px 7px; border-radius:999px; background:var(--brand-tint); color:var(--brand-dark); font-size:9px; font-weight:600; }
.topbar-actions { flex:0 0 auto; gap: 10px; }
.search-trigger {
  width: min(250px, 25vw);
  min-height: 36px;
  border-color: var(--line);
  border-radius: var(--radius-sm);
  background: var(--surface-sunken);
  color: var(--muted);
  font-size: 12px;
}
.search-trigger:hover { border-color: var(--line-strong); background: var(--surface); }
.search-trigger kbd {
  padding: 2px 5px;
  border-color: var(--line);
  color: var(--muted);
  font-size: 10px;
}
.icon-button {
  width: 36px;
  height: 36px;
  border-radius: var(--radius-sm);
  color: var(--muted);
}
.icon-button:hover { background: var(--brand-tint); color: var(--brand-dark); }
.new-button {
  min-height: 36px;
  border-radius: var(--radius-sm);
  background: var(--brand);
  box-shadow: none;
  font-size: 13px;
}
.new-button:hover { background: var(--brand-hover); transform: none; }
.workspace-switcher {
  border-color: var(--line);
  border-radius: var(--radius-sm);
  box-shadow: none;
}
.workspace-avatar { background: var(--brand-tint); color: var(--brand-dark); }
.profile-avatar { background: var(--surface-sunken); color: var(--ink-soft); }
.task-avatar.violet, .task-avatar.blue, .task-avatar.peach, .task-avatar.green {
  background: var(--brand-tint);
  color: var(--brand-dark);
}
.topbar-actions .topbar-profile-button:hover { border-color: var(--line); background: var(--surface-sunken); }

.page-content {
  width: 100%;
  max-width: 1480px;
  padding: clamp(22px, 3vw, 36px) clamp(18px, 3vw, 42px) 28px;
}
#pageContent:has(.dashboard-system) { max-width: none; }
.welcome-row { margin-bottom: 22px; }
.welcome-row h1 {
  color: var(--ink);
  font-family: var(--display);
  font-size: clamp(23px, 2vw, 28px);
  font-weight: 700;
  letter-spacing: -.035em;
}
.eyebrow {
  color: var(--muted);
  font-size: 10px;
  letter-spacing: .08em;
}
.subheading { color: var(--muted); font-size: 13px; line-height: 1.55; }
.date-picker, .select-button {
  min-height: var(--control-height);
  padding: 0 12px;
  border-color: var(--line);
  border-radius: var(--radius-sm);
  color: var(--ink-soft);
  font-size: 12px;
}
.date-picker:hover, .select-button:hover { border-color: var(--line-strong); }

.metric-grid { gap: 12px; margin-bottom: 16px; }
.metric-card, .panel, .dashboard-panel, .business-metric, .finance-card {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: none;
}
.metric-card {
  min-height: 108px;
  padding: 15px 16px;
}
.metric-label { color: var(--muted); font-size: 12px; }
.metric-icon {
  width: 30px;
  height: 30px;
  border-radius: var(--radius-sm);
  background: var(--brand-tint);
  color: var(--brand);
}
.metric-icon .oc-icon { width: 17px; height: 17px; }
.metric-icon.outstanding, .metric-icon.expenses, .metric-icon.cash {
  background: var(--brand-tint);
  color: var(--brand);
}
.metric-value {
  margin: 10px 0 4px;
  color: var(--ink);
  font-size: 21px;
  font-weight: 700;
  letter-spacing: -.035em;
}
.metric-decimal { color: var(--ink-soft); }
.metric-foot { color: var(--muted); font-size: 11px; }
.trend { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; }
.trend .oc-icon { width: 13px; height: 13px; }
.trend.up { color: var(--success-ink); background: var(--success-soft); }
.trend.down { color: var(--danger-ink); background: var(--danger-soft); }
.sparkline { display: none; }

.dashboard-grid, .bottom-grid { gap: 14px; margin-bottom: 14px; }
.panel { padding: 18px; }
.revenue-panel, .tasks-panel { min-height: 0; }
.panel-heading h2, .dashboard-panel-heading h2 {
  margin-bottom: 4px;
  color: var(--ink);
  font-family: var(--display);
  font-size: 15px;
  font-weight: 650;
  letter-spacing: -.02em;
}
.panel-heading p, .dashboard-panel-heading p {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}
.chart-summary { margin-top: 18px; }
.chart-summary strong { color: var(--ink); font-size: 20px; }
.chart-summary small { color: var(--muted); font-size: 11px; }
.chart-wrap { height: 168px; }
.chart-gridlines i { border-color: var(--line-subtle); }
.chart-xlabels, .chart-ylabels { color: var(--muted); font-size: 10px; }
.chart-legend { color: var(--muted); font-size: 10px; }
.live-chart-empty {
  display: grid;
  min-height: 128px;
  height: 100%;
  place-items: center;
  padding: 20px;
  border: 1px dashed var(--line-strong);
  border-radius: var(--radius-sm);
  color: var(--muted);
  background: var(--surface-sunken);
  font-size: 13px;
  text-align: center;
}
.task-list { margin-top: 14px; }
.task-row { gap: 11px; padding: 11px 0; border-bottom-color: var(--line-subtle); }
.task-copy strong { color: var(--ink-soft); font-size: 12px; }
.task-copy small { color: var(--muted); font-size: 11px; }
.task-check {
  display: grid;
  width: 17px;
  height: 17px;
  place-items: center;
  flex: 0 0 17px;
  border-color: var(--line-strong);
  border-radius: 4px;
}
.task-row input:checked + .task-check { background: var(--brand); border-color: var(--brand); }
.task-check .oc-icon { display: none; width: 12px; height: 12px; color: var(--brand-ink); stroke-width: 2.4; }
.task-row input:checked + .task-check .oc-icon { display: block; }
.task-row input:checked + .task-check:after { content: none; }
.priority.high { color: var(--danger-ink); }
.priority.medium { color: var(--warning-ink); }
.priority.low { color: var(--success-ink); }
.add-task { margin-top: 9px; color: var(--brand-dark); font-size: 12px; }
.add-task > span { display: inline-grid; vertical-align: middle; }
.add-task .oc-icon { width: 15px; height: 15px; }
.text-action, .activity-link { color: var(--brand-dark); font-size: 12px; }
.text-action > span, .activity-link > span { display: inline-grid; vertical-align: middle; }
.text-action .oc-icon, .activity-link .oc-icon { width: 14px; height: 14px; }

.table-scroll { margin-top: 14px; }
table { color: var(--ink-soft); }
thead th {
  padding: 10px 12px;
  border-bottom: 1px solid var(--line);
  background: var(--surface-sunken);
  color: var(--muted);
  font-size: 11px;
  letter-spacing: .055em;
}
tbody td {
  padding: 11px 12px;
  border-top-color: var(--line-subtle);
  color: var(--muted);
  font-size: 12px;
}
tbody tr:hover { background: var(--surface-sunken); }
.invoice-id, .amount-cell { color: var(--ink); font-size: 12px; }
.status-badge {
  display: inline-flex;
  align-items: center;
  border: 1px solid currentColor;
  border-radius: 4px;
  padding: 3px 7px;
  font-size: 10px;
  font-weight: 600;
}
.row-more, .more-button { display: inline-grid; place-items: center; }
.row-more .oc-icon, .more-button .oc-icon { width: 17px; height: 17px; }
.activity-list { margin-top: 14px; }
.activity-row { gap: 11px; padding: 10px 0; border-bottom-color: var(--line-subtle); }
.activity-mark { width: 30px; height: 30px; flex-basis: 30px; border-radius: var(--radius-sm); }
.activity-mark .oc-icon { width: 16px; height: 16px; }
.activity-row p { font-size: 12px; }
.activity-row p strong { color: var(--ink); }
.activity-row p span, .activity-row small { color: var(--muted); }
.activity-amount { color: var(--success-ink); font-size: 12px; }
.page-footer { padding-top: 18px; color: var(--muted); font-size: 11px; }
.page-footer b { color: var(--ink); font-size: 11px; }

.module-page {
  width: 100%;
  max-width: 1480px;
  margin: 0 auto;
  color: var(--ink);
}
.module-heading {
  align-items: flex-end;
  gap: 18px;
  margin-bottom: 22px;
}
.module-heading h1, .dashboard-system .module-heading h1 {
  color: var(--ink);
  font-family: var(--display);
  font-size: clamp(23px, 2vw, 28px);
  font-weight: 700;
  letter-spacing: -.035em;
  line-height: 1.2;
}
.module-heading .subheading { margin-top: 7px; }
.module-page h2 {
  color: var(--ink);
  font-family: var(--display);
  font-size: 15px;
  font-weight: 650;
  letter-spacing: -.02em;
}
.module-page h3 { color: var(--ink); font-family: var(--display); font-size: 13px; font-weight: 650; }
.module-page p:not(.eyebrow) { line-height: 1.5; }
.module-page small, .module-page em { color: var(--muted); }
.module-title-icon { width: 26px; height: 26px; margin-right: 9px; color: var(--brand); }
.module-title-icon .oc-icon { width: 21px; height: 21px; }
.dashboard-system { color: var(--ink); }
.business-metric, .finance-card, .finance-metric-grid .finance-card {
  border-color: var(--line);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: none;
}
.business-metric { min-height: 88px; padding: 14px; }
.business-metric-icon {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  border-radius: var(--radius-sm);
  background: var(--brand-tint);
  color: var(--brand);
}
.business-metric-icon .oc-icon { width: 18px; height: 18px; }
.business-metric small, .business-metric em { color: var(--muted); font-size: 11px; }
.business-metric strong { color: var(--ink); font-size: 17px; }
.dashboard-panel { padding: 16px; }
.dashboard-panel-heading { margin-bottom: 12px; }

.panel, .dashboard-panel, .business-list-column, .work-list-column,
.business-inspector, .work-inspector, .invoice-editor-card,
.settings-card, .finance-accounting-panel, .support-queue-panel {
  border-color: var(--line);
  border-radius: var(--radius);
  box-shadow: none;
}
.module-table th, .finance-table th, .business-table th, .work-data-table thead th {
  color: var(--muted);
  background: var(--surface-sunken);
  font-size: 11px;
}
.module-table td, .finance-table td, .business-table td, .work-data-table tbody td {
  color: var(--ink-soft);
  font-size: 12px;
}
.empty-table, .dashboard-empty, .business-inspector-empty, .work-empty-state {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.55;
}
.status-badge, .nav-count, .new-tag, .status-pill, .plan-badge { border-radius: 4px; }

.primary-button, .secondary-button, .filter-button, .select-button, .date-picker,
.new-button, .search-trigger, .support-tabs button {
  min-height: var(--control-height);
  border-radius: var(--radius-sm);
  font-size: 12px;
  font-weight: 600;
  transition: background-color var(--duration-fast) ease, border-color var(--duration-fast) ease, color var(--duration-fast) ease, box-shadow var(--duration-fast) ease;
}
.primary-button {
  border: 1px solid var(--brand);
  background: var(--brand);
  color: var(--brand-ink);
  box-shadow: none;
}
.primary-button:hover { border-color: var(--brand-hover); background: var(--brand-hover); }
.secondary-button, .filter-button {
  border: 1px solid var(--line-strong);
  background: var(--surface);
  color: var(--ink-soft);
}
.secondary-button:hover, .filter-button:hover { border-color: var(--brand); background: var(--brand-tint); color: var(--brand-dark); }
.text-action:hover, .activity-link:hover { color: var(--brand); text-decoration: underline; text-underline-offset: 3px; }

input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
select, textarea {
  min-height: var(--control-height);
  border-color: var(--line-strong);
  border-radius: var(--radius-sm);
  background: var(--surface);
  color: var(--ink);
  font-size: 13px;
}
textarea { min-height: 92px; line-height: 1.5; }
input::placeholder, textarea::placeholder { color: var(--muted-soft); opacity: 1; }
input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):focus,
select:focus, textarea:focus {
  border-color: var(--brand);
  outline: 0;
  box-shadow: var(--focus-ring);
}
.form-field, .settings-form label { gap: 6px; }
.form-field label, .form-field > span, .settings-form label { color: var(--ink-soft); font-size: 12px; font-weight: 600; }
.form-field small, .form-help, .settings-note { color: var(--muted); font-size: 11px; line-height: 1.5; }
.popover {
  border-color: var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
}
.popover.modal { max-height: min(86vh, 900px); overflow: auto; }
.popover-head { border-bottom-color: var(--line); }
.popover h3 { color: var(--ink); font-size: 17px; }
.popover p { color: var(--muted); font-size: 12px; line-height: 1.5; }
.close-popover { display: inline-grid; width: 32px; height: 32px; place-items: center; border-radius: var(--radius-sm); }
.close-popover:hover { background: var(--surface-sunken); color: var(--ink); }
.close-popover .oc-icon { width: 18px; height: 18px; }
.overlay { background: rgba(15, 36, 43, .34); backdrop-filter: none; }
.toast { border-radius: var(--radius-sm); background: var(--ink); font-size: 12px; box-shadow: var(--shadow-md); }
.toast i { display: inline-grid; place-items: center; }
.toast .oc-icon { width: 13px; height: 13px; }
.page-placeholder { min-height: 52vh; }
.placeholder-card {
  padding: 38px 30px;
  border-color: var(--line);
  border-radius: var(--radius-lg);
  box-shadow: none;
}
.placeholder-icon {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--brand-tint);
  color: var(--brand);
}
.placeholder-icon .oc-icon { width: 24px; height: 24px; }
.placeholder-card h1 { color: var(--ink); font-size: 22px; }
.placeholder-card p { color: var(--muted); font-size: 13px; }

.auth-screen {
  background: var(--canvas);
}
.auth-card {
  border-color: var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
}
.auth-kicker { color: var(--brand-dark); }
.auth-tabs { background: var(--surface-sunken); }
.auth-tab.active { color: var(--brand-dark); box-shadow: var(--shadow-xs); }
.auth-submit {
  border: 1px solid var(--brand);
  border-radius: var(--radius-sm);
  background: var(--brand);
  box-shadow: none;
}
.auth-submit:hover { background: var(--brand-hover); box-shadow: none; }
.auth-provider-button { border-radius: var(--radius-sm); }
.auth-footnote, .auth-provider-note, .auth-caption { color: var(--muted); }

.oc-icon {
  display: inline-block;
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
  vertical-align: middle;
}
.nav-item .oc-icon { width: 18px; height: 18px; }
.metric-icon .oc-icon, .business-metric-icon .oc-icon { width: 18px; height: 18px; }
.sidebar-collapse .oc-icon, .mobile-menu .oc-icon { width: 18px; height: 18px; }
.search-icon .oc-icon { width: 17px; height: 17px; }
.icon-button .oc-icon, .more-button .oc-icon { width: 18px; height: 18px; }
.calendar-icon .oc-icon, .chevron .oc-icon { width: 15px; height: 15px; }

@media (max-width: 1120px) {
  .sidebar { width: 236px; flex-basis: 236px; }
  .page-content { padding-inline: 24px; }
  .topbar { padding-inline: 24px; }
  .page-context { padding-inline: 24px; }
}
@media (max-width: 930px) {
  .sidebar { width: min(288px, 84vw); }
  .sidebar.open { box-shadow: 12px 0 32px rgba(15, 36, 43, .12); }
  .nav-backdrop { background: rgba(15, 36, 43, .32); }
  .topbar { padding-inline: 18px; }
  .page-context { padding-inline: 18px; }
  .topbar-module-button { padding-inline:8px; }
  .topbar-actions { gap:5px; }
  .page-content { padding-inline: 18px; }
  .metric-grid { gap: 10px; }
}
@media (max-width: 700px) {
  .topbar { height: 58px; }
  .page-context { min-height: 30px; padding-inline: 14px; }
  .topbar-module-nav { gap:1px; }
  .topbar-module-button { min-height:32px; padding-inline:6px; font-size:10px; }
  .topbar-actions { gap: 5px; }
  .search-trigger { width: 36px; }
  .page-content { padding: 20px 14px 24px; }
  .welcome-row { gap: 10px; margin-bottom: 17px; }
  .welcome-row h1 { font-size: 23px; }
  .metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .metric-card { min-width: 0; min-height: 100px; padding: 12px; }
  .metric-value { overflow: hidden; font-size: clamp(16px, 5vw, 20px); text-overflow: ellipsis; }
  .dashboard-grid, .bottom-grid { gap: 10px; margin-bottom: 10px; }
  .panel { padding: 14px; }
  .task-list { display: block; }
  .module-heading { align-items: flex-start; flex-direction: column; }
  .module-heading > :last-child { align-self: flex-start; }
  .module-heading h1 { font-size: 23px; }
  .module-heading .subheading { font-size: 12px; }
  .page-footer { gap: 8px; align-items: flex-start; flex-direction: column; font-size: 10px; }
  .page-footer span:first-child { max-width: 100%; }
}
@media (max-width: 420px) {
  .metric-icon { width: 26px; height: 26px; }
  .metric-foot { font-size: 10px; }
  .popover { right: 10px; width: calc(100vw - 20px); }
  .popover.modal { width: calc(100vw - 20px); }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* Documents: organisation file storage and folder browser */
.documents-manager { display:grid; gap:16px; max-width:1680px; margin:0 auto; }
.documents-page-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:18px; }
.documents-page-heading h1 { margin:0; color:var(--ink); font:700 clamp(24px,2.4vw,32px) var(--display); letter-spacing:-.035em; }
.documents-page-heading .eyebrow { margin:0 0 5px; color:var(--brand); font-size:10px; font-weight:700; letter-spacing:.11em; }
.documents-page-heading .subheading { margin:5px 0 0; color:var(--muted); font-size:13px; }
.documents-heading-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px; }
.documents-heading-actions button,.documents-detail-actions button { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:38px; padding:0 13px; }
.documents-heading-actions svg,.documents-detail-actions svg { width:16px; height:16px; flex:none; }
.documents-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.documents-metrics > .panel { min-width:0; min-height:86px; display:flex; align-items:center; gap:12px; padding:15px; }
.documents-metric-icon,.documents-large-icon,.documents-type-icon,.documents-recent-icon { display:grid; place-items:center; flex:none; color:var(--brand); background:var(--brand-tint); }
.documents-metric-icon { width:40px; height:40px; border-radius:50%; }
.documents-metric-icon svg { width:19px; height:19px; }
.documents-metrics > .panel > div { display:grid; gap:2px; min-width:0; }
.documents-metrics small { color:var(--muted); font-size:11px; }
.documents-metrics strong { color:var(--ink); font:700 21px var(--display); }
.documents-metrics em { overflow:hidden; color:var(--muted-soft); font-size:10px; font-style:normal; text-overflow:ellipsis; white-space:nowrap; }
.documents-manager-layout { display:grid; grid-template-columns:minmax(0,1.65fr) minmax(285px,.78fr); gap:14px; align-items:start; }
.documents-browser { min-width:0; padding:15px; }
.documents-toolbar { display:grid; grid-template-columns:minmax(180px,1fr) minmax(105px,130px) minmax(140px,165px); gap:8px; }
.documents-search { display:flex; align-items:center; gap:9px; min-width:0; min-height:39px; padding:0 11px; border:1px solid var(--line); border-radius:var(--radius-sm,8px); background:var(--surface); color:var(--muted); }
.documents-search svg { width:16px; height:16px; flex:none; }
.documents-search input { width:100%; min-width:0; border:0; outline:0; background:transparent; color:var(--ink); font-size:12px; }
.documents-toolbar select { min-width:0; min-height:39px; padding:0 10px; border:1px solid var(--line); border-radius:var(--radius-sm,8px); background:var(--surface); color:var(--ink-soft); font-size:11px; }
.documents-breadcrumbs { display:flex; align-items:center; gap:8px; overflow:auto; min-height:43px; margin-top:7px; border-bottom:1px solid var(--line-subtle); color:var(--muted-soft); white-space:nowrap; }
.documents-crumb { padding:5px 0; border:0; background:transparent; color:var(--brand); font-size:11px; cursor:pointer; }
.documents-crumb[aria-current="page"] { color:var(--ink); font-weight:650; }
.documents-table-scroll { overflow:auto; }
.documents-table { width:100%; min-width:740px; border-collapse:collapse; table-layout:auto; }
.documents-table th { height:39px; padding:0 9px; border-bottom:1px solid var(--line-subtle); color:var(--muted); font-size:10px; font-weight:650; text-align:left; white-space:nowrap; }
.documents-table td { height:57px; padding:7px 9px; border-bottom:1px solid var(--line-subtle); color:var(--muted); font-size:11px; white-space:nowrap; }
.documents-table tbody tr:hover,.documents-table tbody tr.selected { background:var(--brand-mist); }
.documents-table tbody tr.selected { box-shadow:inset 2px 0 0 var(--brand); }
.documents-check-cell { width:35px; }
.documents-check-cell input { accent-color:var(--brand); }
.documents-name-cell { display:flex; align-items:center; gap:10px; min-width:190px; }
.documents-type-icon { width:34px; height:34px; border-radius:9px; color:var(--info); background:var(--info-soft); }
.documents-type-icon.folder { color:var(--brand); background:var(--brand-soft); }
.documents-type-icon svg { width:18px; height:18px; }
.documents-name-copy { display:grid; gap:3px; min-width:0; }
.documents-name-button { max-width:300px; overflow:hidden; padding:0; border:0; background:transparent; color:var(--ink); font-size:12px; font-weight:650; text-align:left; text-overflow:ellipsis; white-space:nowrap; cursor:pointer; }
.documents-name-copy small { max-width:310px; overflow:hidden; color:var(--muted-soft); font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.documents-access-badge { display:inline-flex; align-items:center; min-height:22px; padding:0 8px; border-radius:20px; background:var(--brand-tint); color:var(--brand-dark); font-size:10px; }
.documents-row-more { display:grid; width:30px; height:30px; place-items:center; border:0; border-radius:6px; background:transparent; color:var(--muted); cursor:pointer; }
.documents-row-more:hover { background:var(--brand-soft); color:var(--brand); }
.documents-row-more svg { width:15px; height:15px; }
.documents-table-footer { display:flex; justify-content:space-between; gap:12px; padding:11px 3px 1px; color:var(--muted-soft); font-size:10px; }
.documents-empty { display:grid; justify-items:center; gap:8px; padding:40px 20px; text-align:center; }
.documents-empty > span { display:grid; width:48px; height:48px; place-items:center; border-radius:50%; background:var(--brand-tint); color:var(--brand); }
.documents-empty svg { width:24px; height:24px; }
.documents-empty h2 { margin:0; color:var(--ink); font:650 16px var(--display); }
.documents-empty p { max-width:390px; margin:0; color:var(--muted); font-size:12px; }
.documents-empty .primary-button { margin-top:5px; }
.documents-inspector { position:sticky; top:14px; min-width:0; display:grid; gap:14px; padding:16px; }
.documents-inspector-heading { display:flex; align-items:center; gap:12px; min-width:0; }
.documents-large-icon { width:46px; height:46px; border-radius:50%; }
.documents-large-icon svg { width:22px; height:22px; }
.documents-inspector-heading > div { min-width:0; }
.documents-inspector-heading .eyebrow { margin:0 0 4px; color:var(--muted); font-size:9px; font-weight:700; letter-spacing:.1em; }
.documents-inspector-heading h2 { margin:0; overflow-wrap:anywhere; color:var(--ink); font:650 15px var(--display); }
.documents-detail-stats { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; padding:2px 0 13px; border-bottom:1px solid var(--line-subtle); }
.documents-detail-stats > div { display:grid; gap:3px; min-width:0; }
.documents-detail-stats small,.documents-detail-link small { color:var(--muted-soft); font-size:10px; }
.documents-detail-stats strong,.documents-detail-link strong { overflow:hidden; color:var(--ink-soft); font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.documents-detail-note { margin:0; color:var(--muted); font-size:11px; line-height:1.6; }
.documents-detail-link { display:grid; gap:3px; margin:0; padding-top:10px; border-top:1px solid var(--line-subtle); }
.documents-detail-actions { display:grid; gap:7px; }
.documents-detail-actions .primary-button { width:100%; }
.documents-detail-actions .secondary-button { width:100%; background:var(--surface); color:var(--brand); }
.documents-delete-button { min-height:32px; border:0; background:transparent; color:var(--danger); font-size:11px; cursor:pointer; }
.documents-recent-panel { padding-top:13px; border-top:1px solid var(--line-subtle); }
.documents-side-heading { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.documents-side-heading h3 { margin:0; color:var(--ink); font:650 12px var(--display); }
.documents-side-heading > span { color:var(--muted); font-size:10px; }
.documents-recent-list { display:grid; margin-top:5px; }
.documents-recent-item { display:flex; align-items:center; gap:9px; width:100%; min-width:0; padding:9px 0; border:0; border-top:1px solid var(--line-subtle); background:transparent; text-align:left; cursor:pointer; }
.documents-recent-icon { width:30px; height:30px; border-radius:50%; }
.documents-recent-icon svg { width:15px; height:15px; }
.documents-recent-item > span:last-child { display:grid; gap:3px; min-width:0; }
.documents-recent-item strong { overflow:hidden; color:var(--ink-soft); font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.documents-recent-item small,.documents-side-empty { overflow:hidden; color:var(--muted-soft); font-size:9px; text-overflow:ellipsis; white-space:nowrap; }
.documents-side-empty { margin:9px 0 2px; }
.documents-access-note { padding:10px; border-radius:var(--radius-sm,8px); background:var(--surface-sunken); }
.documents-access-note strong { color:var(--ink-soft); font-size:10px; }
.documents-access-note p { margin:3px 0 0; color:var(--muted); font-size:10px; line-height:1.5; }
.documents-modal-form { display:grid; gap:13px; }
.documents-modal-form .form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.documents-modal-form textarea { resize:vertical; }
.documents-modal-form .modal-actions { display:flex; justify-content:flex-end; gap:8px; }
.documents-form-status { min-height:18px; margin:0; color:var(--muted); font-size:11px; }
.documents-share-modes,.documents-share-people { display:grid; gap:9px; margin:0; padding:12px; border:1px solid var(--line); border-radius:12px; }
.documents-share-modes legend,.documents-share-people legend { padding:0 5px; color:var(--ink); font-size:12px; font-weight:700; }
.documents-share-modes label,.documents-share-person { display:flex; align-items:flex-start; gap:10px; padding:10px; border-radius:9px; background:var(--surface); cursor:pointer; }
.documents-share-modes label input,.documents-share-person input { margin-top:3px; accent-color:var(--brand); }
.documents-share-modes label span,.documents-share-person span { display:grid; gap:3px; }
.documents-share-modes strong,.documents-share-person strong { color:var(--ink); font-size:12px; }
.documents-share-modes small,.documents-share-person small { color:var(--muted); font-size:11px; }
.documents-share-people { max-height:240px; overflow:auto; }
.documents-manager > .local-note { margin:0; }
@media (max-width:1100px) {
  .documents-manager-layout { grid-template-columns:minmax(0,1fr); }
  .documents-inspector { position:static; grid-template-columns:repeat(2,minmax(0,1fr)); }
  .documents-inspector-heading,.documents-detail-stats,.documents-detail-note,.documents-detail-link,.documents-detail-actions { grid-column:1/-1; }
}
@media (max-width:700px) {
  .documents-page-heading { align-items:flex-start; flex-direction:column; }
  .documents-heading-actions { justify-content:flex-start; width:100%; }
  .documents-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .documents-metrics > .panel { min-height:76px; padding:11px; gap:9px; }
  .documents-metric-icon { width:34px; height:34px; }
  .documents-metrics strong { font-size:18px; }
  .documents-toolbar { grid-template-columns:minmax(0,1fr) minmax(100px,125px); }
  .documents-search { grid-column:1/-1; }
  .documents-browser { padding:10px; }
  .documents-inspector { grid-template-columns:minmax(0,1fr); padding:13px; }
  .documents-inspector-heading,.documents-detail-stats,.documents-detail-note,.documents-detail-link,.documents-detail-actions { grid-column:auto; }
  .documents-table-footer { flex-direction:column; gap:4px; }
  .documents-modal-form .form-grid { grid-template-columns:minmax(0,1fr); }
}

/* Movable OneCloud AI assistant */
.ai-assistant-widget { position:fixed; z-index:25; right:24px; bottom:24px; display:flex; align-items:center; gap:6px; max-width:calc(100vw - 16px); color:var(--ink); touch-action:none; }
.ai-assistant-widget.open { display:block; width:min(390px,calc(100vw - 24px)); max-width:calc(100vw - 16px); }
.ai-assistant-launcher { min-height:48px; display:inline-flex; align-items:center; justify-content:center; gap:9px; padding:0 17px; border:1px solid var(--brand); border-radius:999px; background:linear-gradient(180deg,var(--brand-light),var(--brand)); color:var(--brand-ink); box-shadow:0 10px 30px rgba(0,91,111,.24); font-size:12px; font-weight:750; white-space:nowrap; }
.ai-assistant-launcher:hover { background:linear-gradient(180deg,var(--brand),var(--brand-hover)); transform:translateY(-1px); }
.ai-assistant-launcher-icon,.ai-assistant-title-icon { display:inline-flex; align-items:center; justify-content:center; }
.ai-assistant-launcher-icon .oc-icon { width:18px; height:18px; }
.ai-assistant-move-handle { width:27px; height:36px; display:grid; place-items:center; border:1px solid var(--line); border-radius:9px; background:var(--surface); color:var(--muted); box-shadow:var(--shadow-sm); font-size:19px; cursor:grab; }
.ai-assistant-move-handle:focus-visible,.ai-assistant-header [data-ai-drag]:focus-visible { outline:2px solid var(--brand); outline-offset:2px; }
.ai-assistant-widget.open .ai-assistant-launcher,.ai-assistant-widget.open .ai-assistant-move-handle { display:none; }
.ai-assistant-panel { width:100%; height:min(590px,calc(100vh - 32px)); display:flex; flex-direction:column; overflow:hidden; border:1px solid var(--line); border-radius:18px; background:var(--surface); box-shadow:0 20px 60px rgba(16,42,50,.22); }
.ai-assistant-panel[hidden] { display:none!important; }
.ai-assistant-header { min-height:62px; display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 13px; border-bottom:1px solid var(--line); background:linear-gradient(130deg,var(--surface),var(--surface-sunken)); cursor:grab; touch-action:none; }
.ai-assistant-widget.dragging .ai-assistant-header,.ai-assistant-widget.dragging .ai-assistant-move-handle { cursor:grabbing; }
.ai-assistant-title { min-width:0; display:flex; align-items:center; gap:10px; }
.ai-assistant-title-icon { width:34px; height:34px; flex:none; border-radius:11px; background:var(--brand-tint); color:var(--brand); }
.ai-assistant-title-icon .oc-icon { width:18px; height:18px; }
.ai-assistant-title > span:last-child { min-width:0; display:grid; gap:3px; }
.ai-assistant-title strong { color:var(--ink); font-size:13px; }
.ai-assistant-title small { overflow:hidden; color:var(--muted); font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.ai-assistant-header-actions { display:flex; gap:5px; }
.ai-assistant-header-actions button { width:30px; height:30px; border:0; border-radius:8px; background:transparent; color:var(--muted); font-size:18px; }
.ai-assistant-header-actions button:hover { background:var(--brand-tint); color:var(--brand-dark); }
.ai-assistant-privacy { margin:0; padding:9px 13px; border-bottom:1px solid var(--line-subtle); color:var(--muted); font-size:10px; line-height:1.45; }
.ai-assistant-messages { flex:1; min-height:100px; display:flex; flex-direction:column; align-items:flex-start; gap:9px; overflow:auto; padding:14px; background:var(--canvas); overscroll-behavior:contain; }
.ai-chat-message { max-width:88%; padding:10px 12px; border:1px solid var(--line); border-radius:13px 13px 13px 4px; background:var(--surface); color:var(--ink); font-size:12px; line-height:1.5; overflow-wrap:anywhere; white-space:pre-wrap; }
.ai-chat-message small { display:block; margin-top:7px; color:var(--muted); font-size:9px; }
.ai-chat-user { align-self:flex-end; border-color:var(--brand); border-radius:13px 13px 4px 13px; background:var(--brand); color:var(--brand-ink); }
.ai-assistant-suggestions { display:flex; flex-wrap:wrap; gap:6px; padding:9px 12px 0; background:var(--surface); }
.ai-assistant-suggestions button { min-height:28px; padding:0 9px; border:1px solid var(--line); border-radius:999px; background:var(--surface); color:var(--muted); font-size:10px; }
.ai-assistant-suggestions button:hover { border-color:var(--brand-light); background:var(--brand-tint); color:var(--brand-dark); }
.ai-assistant-form { display:flex; align-items:flex-end; gap:8px; padding:10px 12px 12px; background:var(--surface); }
.ai-assistant-form textarea { flex:1; min-width:0; min-height:44px; max-height:110px; resize:vertical; padding:10px 11px; border:1px solid var(--line); border-radius:12px; background:var(--surface-sunken); color:var(--ink); font:inherit; font-size:12px; line-height:1.4; outline:none; }
.ai-assistant-form textarea:focus { border-color:var(--brand); box-shadow:0 0 0 3px var(--brand-tint); }
.ai-assistant-send { width:40px; height:40px; flex:none; display:grid; place-items:center; border:0; border-radius:12px; background:var(--brand); color:var(--brand-ink); }
.ai-assistant-send:disabled { opacity:.55; cursor:wait; }
.ai-assistant-voice { width:40px; height:40px; flex:none; display:grid; place-items:center; border:1px solid var(--line); border-radius:12px; background:var(--surface); color:var(--ink-soft); }
.ai-assistant-voice:hover,.ai-assistant-voice.listening { border-color:var(--brand); background:var(--brand-tint); color:var(--brand-dark); }
.ai-assistant-voice.listening { box-shadow:0 0 0 3px var(--brand-tint); }
.ai-assistant-voice:focus-visible { outline:2px solid var(--brand); outline-offset:2px; }
.ai-assistant-send .oc-icon { width:17px; height:17px; }
@media (max-width:600px) {
  .ai-assistant-widget { right:12px; bottom:12px; }
  .ai-assistant-widget.open { width:min(390px,calc(100vw - 16px)); }
  .ai-assistant-panel { height:min(600px,calc(100vh - 24px)); }
}

/* Keep module workspaces wide and restore the Finance card grids. */
#pageContent,
#pageContent:has(.dashboard-system) { width:100%; max-width:none; margin-inline:0; }
#pageContent > .module-page,
#pageContent > .dashboard-system { width:100%; max-width:none; margin-inline:0; }
.finance-workspace { width:100%; max-width:none; }
.finance-metric-grid,
.finance-summary-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); align-items:stretch; gap:12px; width:100%; margin:0 0 16px; }
.finance-summary-grid { grid-template-columns:repeat(5,minmax(0,1fr)); }
.finance-metric-grid > *,
.finance-summary-grid > * { min-width:0; }
.finance-metric { display:flex; align-items:center; gap:12px; min-height:92px; padding:15px; }
.finance-metric > .finance-metric-icon { display:grid; width:38px; height:38px; flex:0 0 38px; place-items:center; border-radius:50%; background:var(--brand-tint); color:var(--brand); }
.finance-metric > .finance-metric-icon .oc-icon { width:18px; height:18px; }
.finance-metric > div { display:grid; min-width:0; gap:4px; }
.finance-metric > div small { color:var(--muted); font-size:10px; }
.finance-metric > div strong { color:var(--ink); font:700 clamp(16px,1.4vw,21px)/1.15 var(--display); overflow-wrap:anywhere; }
.finance-metric > div > span { overflow:hidden; color:var(--muted); font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.finance-dashboard-grid { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(290px,.9fr); align-items:stretch; gap:12px; width:100%; }
.finance-dashboard-grid > * { min-width:0; }
.finance-shortcuts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; margin-top:14px; }
.finance-shortcuts > button { display:flex; min-width:0; min-height:66px; align-items:center; gap:10px; padding:10px; border:1px solid var(--line); border-radius:var(--radius-sm); background:var(--surface); color:var(--ink-soft); text-align:left; }
.finance-shortcuts > button:hover { border-color:var(--line-strong); background:var(--brand-mist); }
.finance-shortcuts > button > b { display:grid; width:30px; height:30px; flex:0 0 30px; place-items:center; border-radius:9px; background:var(--brand-tint); color:var(--brand); }
.finance-shortcuts > button > span { display:grid; min-width:0; gap:4px; }
.finance-shortcuts > button strong,.finance-shortcuts > button small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.finance-shortcuts > button strong { color:var(--ink); font-size:11px; }
.finance-shortcuts > button small { color:var(--muted); font-size:9px; }
.finance-shortcuts > button > i { margin-left:auto; color:var(--brand); font-style:normal; }
.team-dashboard-layout,
.team-chat-layout,
.team-record-layout,
.team-roles-layout,
.team-detail-grid { width:100%; max-width:none; }
.team-dashboard-layout > *,
.team-chat-layout > *,
.team-record-layout > *,
.team-roles-layout > *,
.team-detail-grid > * { min-width:0; }
@media(max-width:1100px) {
  .finance-summary-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .team-dashboard-layout { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:900px) {
  .finance-dashboard-grid { grid-template-columns:minmax(0,1fr); }
  .team-dashboard-layout { grid-template-columns:minmax(0,1fr); }
  .team-chat-layout,.team-record-layout,.team-roles-layout,.team-detail-grid { grid-template-columns:minmax(0,1fr); }
}
@media(max-width:700px) {
  .finance-metric-grid,.finance-summary-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .finance-shortcuts { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:460px) {
  .finance-metric-grid,.finance-summary-grid,.finance-shortcuts { grid-template-columns:minmax(0,1fr); }
}

/* Workspace quality pass: Settings, CRM, Team and Support share one calm,
   spacious layout with consistent teal controls and responsive card rows. */
#pageContent:has(.settings-workspace),
#pageContent:has(.crm-workspace),
#pageContent:has(.support-workspace),
#pageContent:has(.team-roles-layout) { width:100%; max-width:none; }
.page-content:has(.settings-workspace),
.page-content:has(.crm-workspace),
.page-content:has(.support-workspace),
.page-content:has(.team-roles-layout) { width:100%; max-width:none; padding-inline:clamp(16px,2.4vw,36px); }

/* Keep successful data states green, while metric icons use the product teal. */
.business-metric-icon.green,
.team-role-mark,
.leave-setup-icon { background:var(--brand-tint)!important; color:var(--brand-dark)!important; }
.settings-workspace .primary-button,
.settings-workspace .new-button,
.support-workspace .primary-button,
.support-workspace .new-button,
.team-workspace .primary-button,
.crm-workspace .primary-button,
.crm-workspace .crm-secondary-action { background:var(--brand); border-color:var(--brand); color:var(--surface); }
.settings-workspace .secondary-button,
.settings-workspace .filter-button,
.support-workspace .secondary-button,
.support-workspace .filter-button,
.crm-workspace .crm-secondary-action { background:var(--surface); color:var(--brand-dark); }
.settings-workspace .primary-button:hover,
.support-workspace .primary-button:hover,
.crm-workspace .crm-secondary-action:hover { background:var(--brand-hover); border-color:var(--brand-hover); color:var(--surface); }

/* Settings modules */
.settings-workspace { width:100%; max-width:none; margin:0; padding:8px 0 28px; }
.settings-workspace .settings-page-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; margin:0 0 12px; padding:0 0 15px; }
.settings-workspace .settings-page-heading > div:first-child { min-width:0; flex:1 1 420px; }
.settings-workspace .settings-page-heading > .status-badge { max-width:min(100%,360px); overflow-wrap:anywhere; }
.settings-workspace .settings-console { width:100%; min-width:0; }
.settings-workspace .settings-module-tabs { gap:5px; padding:0 0 3px; }
.settings-workspace .settings-module-tab { min-height:46px; padding-inline:11px; font-size:10.5px; }
.settings-workspace-main { width:100%; min-width:0; padding:17px 0 24px; }
.settings-workspace-main > #settingsSectionContent,
.settings-workspace-main > #settingsSectionContent > * { min-width:0; }
.settings-workspace .settings-content-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); align-items:start; gap:16px; width:100%; }
.settings-workspace .settings-content-grid > * { min-width:0; }
.settings-workspace .settings-actions { flex-wrap:wrap; align-items:center; gap:12px 16px; }
.settings-workspace .settings-actions > span { flex:1 1 240px; }
.settings-workspace .settings-actions > button,
.settings-workspace .settings-actions > div { flex:0 0 auto; }
.settings-workspace .form-grid,
.settings-workspace .settings-profile-section .form-grid { gap:14px 16px; }
.settings-workspace .settings-overview-bottom:has(.settings-overview-platform) { grid-template-columns:repeat(3,minmax(0,1fr)); }
.settings-workspace .settings-overview-bottom > * { min-width:0; }

/* Uploaded logos are user supplied, so keep their natural dimensions inside a fixed preview frame. */
.settings-workspace .settings-logo-frame,
.settings-workspace .settings-brand-asset-preview { box-sizing:border-box; display:grid; place-items:center; width:100%; height:180px; min-width:0; overflow:hidden; padding:14px; border:1px solid var(--line-subtle); border-radius:10px; background:var(--surface-sunken); }
.settings-workspace .settings-logo-frame > .settings-logo-preview:not([hidden]),
.settings-workspace .settings-brand-asset-preview > .settings-logo-preview:not([hidden]) { display:block; width:auto; height:auto; min-width:0; min-height:0; max-width:100%; max-height:150px; object-fit:contain; }
.settings-workspace .settings-brand-asset-preview > .settings-logo-placeholder:not([hidden]) { max-width:100%; text-align:center; }

/* Migration is a guided workflow: source and import side by side, review below. */
.migration-workspace { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); align-items:start; gap:16px; width:100%; }
.migration-intro { grid-column:1/-1; display:flex; align-items:center; justify-content:space-between; gap:18px; padding:20px 22px; border:1px solid var(--line); border-radius:var(--radius-xl); background:linear-gradient(115deg,var(--surface),var(--brand-mist)); }
.migration-intro > div { min-width:0; }
.migration-intro h2 { margin:0 0 6px; color:var(--ink); font:750 20px var(--display); letter-spacing:-.03em; }
.migration-intro p:not(.eyebrow) { max-width:740px; margin:0; color:var(--muted); font-size:12px; line-height:1.55; }
.migration-intro .status-badge { flex:0 0 auto; }
.migration-step-card { min-width:0; padding:18px; border:1px solid var(--line); border-radius:var(--radius-xl); background:var(--surface); box-shadow:var(--shadow-xs); }
.migration-workspace > .migration-step-card:nth-of-type(3),
.migration-workspace > .migration-step-card:nth-of-type(4) { grid-column:1/-1; }
.migration-step-title { display:flex; align-items:center; gap:11px; margin-bottom:15px; }
.migration-step-title > span { display:grid; width:34px; height:34px; flex:0 0 34px; place-items:center; border-radius:50%; background:var(--brand-tint); color:var(--brand-dark); font-size:13px; font-weight:750; }
.migration-step-title h3 { margin:0 0 3px; color:var(--ink); font:700 13px var(--display); }
.migration-step-title p { margin:0; color:var(--muted); font-size:10.5px; line-height:1.45; }
.migration-source-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; margin-bottom:14px; }
.migration-source-card { display:grid; grid-template-columns:32px minmax(0,1fr); align-items:center; gap:2px 9px; min-width:0; min-height:62px; padding:10px; border:1px solid var(--line); border-radius:10px; background:var(--surface); color:var(--ink-soft); text-align:left; }
.migration-source-card > span { display:grid; grid-row:span 2; width:32px; height:32px; place-items:center; border-radius:9px; background:var(--brand-tint); color:var(--brand-dark); font-weight:750; }
.migration-source-card strong { overflow:hidden; color:var(--ink); font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.migration-source-card small { overflow:hidden; color:var(--muted); font-size:9px; text-overflow:ellipsis; white-space:nowrap; }
.migration-source-card:hover,.migration-source-card.active { border-color:var(--brand); background:var(--brand-mist); }
.migration-source-card.active { box-shadow:0 0 0 2px var(--brand-tint); }
.migration-guide-card { padding:13px 15px; border:1px solid var(--line-subtle); border-radius:10px; background:var(--surface-sunken); }
.migration-guide-heading { display:grid; gap:4px; margin-bottom:9px; }
.migration-guide-heading > span { color:var(--brand); font-size:8px; font-weight:750; letter-spacing:.1em; }
.migration-guide-heading strong { color:var(--ink); font-size:11px; }
.migration-guide-card ol { display:grid; gap:7px; margin:0; padding-left:19px; color:var(--ink-soft); font-size:10px; line-height:1.5; }
.migration-guide-card li { padding-left:2px; }
.migration-guide-card > p,.migration-coverage > p,.migration-step-card > .settings-field-help { margin:10px 0 0; color:var(--muted); font-size:9.5px; line-height:1.5; }
.migration-import-form { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:13px; }
.migration-import-form > * { min-width:0; }
.migration-import-form .form-field.full,.migration-form-actions { grid-column:1/-1; }
.migration-form-actions,.migration-map-actions { display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-end; gap:9px; }
.migration-coverage { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-top:14px; padding:12px; border:1px solid var(--line-subtle); border-radius:10px; background:var(--surface-sunken); }
.migration-coverage > strong { flex:0 0 100%; color:var(--ink); font-size:10px; }
.migration-coverage > span { padding:6px 9px; border:1px solid var(--line); border-radius:999px; background:var(--surface); color:var(--brand-dark); font-size:9px; font-weight:650; }
.migration-coverage > p { flex:0 0 100%; }
.migration-preview-summary { display:flex; flex-wrap:wrap; align-items:baseline; gap:8px 16px; margin:4px 0 12px; padding:14px; border:1px solid var(--line); border-radius:10px; background:var(--surface-sunken); color:var(--muted); font-size:10px; }
.migration-preview-summary > strong { color:var(--brand-dark); font:750 24px var(--display); }
.migration-message { padding:10px 12px; border:1px solid var(--line); border-radius:8px; background:var(--brand-mist); color:var(--brand-dark); font-size:10px; }
.migration-skipped { margin:10px 0; color:var(--ink-soft); font-size:10px; }
.migration-skipped li { margin:5px 0; }
.migration-sage-map .migration-code-map { display:grid; grid-template-columns:minmax(0,1fr) 24px minmax(0,1fr); gap:8px 12px; align-items:center; margin:12px 0; }
.migration-code-map > span { min-width:0; padding:9px 10px; border:1px solid var(--line); border-radius:8px; background:var(--surface-sunken); color:var(--ink-soft); font-size:9px; }
.migration-code-map > b { color:var(--brand); text-align:center; }
.migration-account-map-form { display:grid; gap:10px; }

/* Email templates get a real editing and preview surface for each message type. */
#settingsEmailTemplatesForm { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); align-items:stretch; gap:14px; }
#settingsEmailTemplatesForm > .settings-section-title,
#settingsEmailTemplatesForm > .local-note,
#settingsEmailTemplatesForm > .settings-actions { grid-column:1/-1; }
#settingsEmailTemplatesForm > .settings-email-template { grid-column:span 2; display:grid; align-content:start; gap:12px; min-width:0; margin:0; padding:15px; border:1px solid var(--line); border-radius:var(--radius-lg); background:var(--surface); }
#settingsEmailTemplatesForm > .settings-email-template:nth-of-type(4) { grid-column:2/span 2; }
#settingsEmailTemplatesForm > .settings-email-template:nth-of-type(5) { grid-column:4/span 2; }
.settings-email-template > legend { padding:0 5px; color:var(--brand-dark); font:750 12px var(--display); }
.settings-email-template .form-field { min-width:0; }
.settings-email-template .form-field textarea { min-height:138px; resize:vertical; line-height:1.55; }
.settings-template-preview { display:grid; gap:7px; min-width:0; padding:11px; border:1px solid var(--line-subtle); border-radius:9px; background:var(--surface-sunken); }
.settings-template-preview > span { color:var(--brand); font-size:8px; font-weight:750; letter-spacing:.06em; text-transform:uppercase; }
.settings-template-preview pre { max-height:155px; overflow:auto; margin:0; color:var(--ink-soft); font:10px/1.55 var(--font); white-space:pre-wrap; overflow-wrap:anywhere; }
#settingsEmailTemplatesForm > .local-note { margin:0; padding:10px 12px; border:1px solid var(--line-subtle); border-radius:9px; background:var(--surface-sunken); color:var(--muted); line-height:1.55; }

/* Invoice styles pair the editor with a readable, print-like live document. */
.settings-invoice-design-workspace,.settings-invoice-design-workspace > .settings-content-grid { width:100%; min-width:0; }
.settings-invoice-design-workspace > .settings-content-grid { grid-template-columns:minmax(390px,.9fr) minmax(0,1.2fr); align-items:start; gap:16px; }
.settings-invoice-design-workspace #settingsInvoiceForm { display:grid; align-content:start; gap:13px; }
.invoice-template-gallery { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
.invoice-template-choice { display:flex; align-items:center; gap:10px; min-width:0; min-height:74px; padding:9px; border:1px solid var(--line); border-radius:10px; background:var(--surface); color:var(--ink-soft); text-align:left; }
.invoice-template-choice:hover,.invoice-template-choice[aria-pressed="true"] { border-color:var(--brand); background:var(--brand-mist); }
.invoice-template-choice[aria-pressed="true"] { box-shadow:0 0 0 2px var(--brand-tint); }
.invoice-template-choice > span:last-child { display:grid; min-width:0; gap:4px; }
.invoice-template-choice strong { color:var(--ink); font-size:10px; }
.invoice-template-choice small { color:var(--muted); font-size:8.5px; line-height:1.4; }
.invoice-template-mini { position:relative; display:block; width:42px; height:52px; flex:0 0 42px; overflow:hidden; border:1px solid var(--line); border-radius:4px; background:var(--surface); box-shadow:0 1px 3px rgba(14,47,66,.08); }
.invoice-template-mini:before { position:absolute; top:6px; left:5px; width:13px; height:4px; border-radius:2px; background:var(--invoice-preview-primary,var(--brand)); content:""; }
.invoice-template-mini i,.invoice-template-mini b,.invoice-template-mini em,.invoice-template-mini small { position:absolute; left:5px; display:block; height:2px; border-radius:2px; background:var(--line-strong); }
.invoice-template-mini i { top:15px; width:30px; background:var(--brand-tint); }
.invoice-template-mini b { top:21px; width:28px; }
.invoice-template-mini em { top:26px; width:21px; }
.invoice-template-mini small { top:38px; left:20px; width:14px; background:var(--invoice-preview-primary,var(--brand)); }
.invoice-template-mini.modern-minimal:before,.invoice-template-mini.modern-minimal small { background:var(--invoice-preview-muted); }
.invoice-template-mini.corporate-premium:before,.invoice-template-mini.corporate-premium small { background:var(--invoice-preview-navy); }
.invoice-template-mini.bold-creative:before,.invoice-template-mini.bold-creative small { background:var(--invoice-preview-teal); }
.invoice-design-preview { min-width:0; padding:18px; overflow:hidden; }
.invoice-design-preview > .eyebrow { margin-bottom:12px; color:var(--brand-dark); }
.invoice-preview-paper { width:100%; max-width:760px; min-width:0; margin:0 auto; padding:clamp(18px,2.2vw,30px); border:1px solid var(--line); background:var(--surface); color:var(--invoice-preview-ink); box-shadow:0 5px 18px rgba(29,62,81,.08); }
.invoice-base-header { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; padding-bottom:20px; border-bottom:2px solid var(--invoice-preview-primary,var(--brand)); }
.invoice-base-title { display:grid; gap:6px; min-width:0; }
.invoice-base-title > span { color:var(--invoice-preview-primary,var(--brand)); font:800 22px var(--display); letter-spacing:.03em; }
.invoice-base-title > small,.invoice-base-company > span { color:var(--invoice-preview-muted-ink); font-size:8px; line-height:1.45; }
.invoice-base-title > div { display:grid; gap:3px; margin-top:8px; }
.invoice-base-title > div > span,.invoice-base-parties small { color:var(--invoice-preview-muted-blue); font-size:8px; }
.invoice-base-title > div > strong { color:var(--invoice-preview-deep); font:750 14px var(--display); }
.invoice-base-company { display:grid; justify-items:end; gap:4px; max-width:52%; text-align:right; }
.invoice-base-logo { display:grid; width:31px; height:31px; margin-bottom:3px; place-items:center; border-radius:8px; background:var(--invoice-preview-primary,var(--brand)); color:var(--surface); font-size:10px; font-weight:750; }
.invoice-base-company > strong { max-width:100%; color:var(--invoice-preview-deep); font:750 11px var(--display); overflow-wrap:anywhere; }
.invoice-base-parties { display:flex; justify-content:space-between; gap:16px; padding:14px 0; border-bottom:1px solid var(--invoice-preview-line); }
.invoice-base-parties dl { display:flex; flex-wrap:wrap; gap:10px 17px; margin:0; }
.invoice-base-parties dl > div,.invoice-base-parties > div { display:grid; gap:4px; }
.invoice-base-parties dt { color:var(--invoice-preview-muted-border); font-size:7px; }
.invoice-base-parties dd,.invoice-base-parties > div > strong { margin:0; color:var(--invoice-preview-copy); font-size:8px; }
.invoice-base-table { width:100%; margin:14px 0 8px; border-collapse:collapse; font-size:8px; }
.invoice-base-table th { padding:8px 5px; background:color-mix(in srgb,var(--invoice-preview-primary,var(--brand)) 10%,var(--surface)); color:var(--invoice-preview-copy); font-size:7px; text-align:left; }
.invoice-base-table th:not(:nth-child(2)),.invoice-base-table td:not(:nth-child(2)) { text-align:right; }
.invoice-base-table td { padding:8px 5px; border-bottom:1px solid var(--invoice-preview-canvas); color:var(--invoice-preview-copy-muted); }
.invoice-base-total-row { display:flex; justify-content:space-between; gap:12px; padding:7px 5px 12px; color:var(--invoice-preview-muted-ink); font-size:7px; }
.invoice-base-total-row > span:last-child { display:flex; gap:16px; }
.invoice-base-total-row strong { color:var(--invoice-preview-copy); }
.invoice-base-totals { display:grid; gap:6px; justify-content:end; margin:0 0 14px; }
.invoice-base-totals > div { display:flex; justify-content:space-between; gap:24px; color:var(--invoice-preview-secondary); font-size:8px; }
.invoice-base-totals strong { color:var(--invoice-preview-copy); }
.invoice-base-totals .invoice-base-balance { padding:8px 10px; border-radius:4px; background:var(--invoice-preview-primary,var(--brand)); color:var(--surface); }
.invoice-base-balance strong { color:var(--surface); }
.invoice-base-notes,.invoice-base-terms { margin-top:12px; padding-top:10px; border-top:1px solid var(--invoice-preview-line); }
.invoice-base-notes h3,.invoice-base-terms h3 { margin:0 0 5px; color:var(--invoice-preview-copy); font-size:8px; }
.invoice-base-notes p,.invoice-base-notes strong,.invoice-base-terms p { margin:0 0 4px; color:var(--invoice-preview-soft); font-size:7px; line-height:1.45; }
.invoice-base-footer { display:flex; justify-content:space-between; margin-top:18px; padding-top:8px; border-top:1px solid var(--invoice-preview-line); color:var(--invoice-preview-footer); font-size:7px; }
.invoice-design-preview-caption { display:block; margin-top:10px; color:var(--muted); font-size:9px; text-align:center; }
.invoice-design-preview[data-template="modern-minimal"] { --invoice-preview-primary:var(--invoice-preview-minimal)!important; }
.invoice-design-preview[data-template="corporate-premium"] { --invoice-preview-primary:var(--invoice-preview-navy)!important; }
.invoice-design-preview[data-template="bold-creative"] { --invoice-preview-primary:var(--invoice-preview-teal)!important; }

/* CRM filters and actions wrap cleanly without compressing the search field. */
.crm-workspace { width:100%; max-width:none; }
.crm-workspace-heading,.business-workspace-heading { align-items:center; flex-wrap:wrap; gap:14px 20px; }
.crm-workspace-heading > div:first-child,.business-workspace-heading > div:first-child { min-width:0; flex:1 1 340px; }
.crm-heading-actions,.business-heading-actions,.module-actions,.finance-heading-actions,.business-heading-actions { display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-end; gap:9px; }
.crm-overview-cards { gap:14px; margin-bottom:18px; }
.crm-overview-card { padding:15px 16px; }
.crm-record-panel { min-width:0; padding:14px 16px 12px; }
.crm-register-heading { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:15px 2px 12px; }
.crm-register-heading h2 { margin:0 0 3px; color:var(--ink); font:750 15px var(--display); }
.crm-register-heading p:not(.eyebrow) { margin:0; color:var(--muted); font-size:10px; }
.crm-filterbar { display:grid; grid-template-columns:minmax(240px,1.5fr) repeat(3,minmax(130px,.75fr)) auto; align-items:end; gap:11px; margin:0 0 14px; padding:13px; border:1px solid var(--line); border-radius:12px; background:var(--surface-sunken); }
.crm-filterbar > * { min-width:0; }
.crm-search { display:flex; align-items:center; gap:9px; min-height:42px; padding:0 11px; border:1px solid var(--line-strong); border-radius:9px; background:var(--surface); color:var(--brand); }
.crm-search > span { flex:0 0 auto; font-size:17px; line-height:1; }
.crm-search input { width:100%; min-width:0; min-height:38px; padding:0; border:0; outline:0; background:transparent; box-shadow:none; font-size:11px; }
.crm-search input:focus { box-shadow:none; }
.crm-select-filter { display:grid; gap:5px; min-width:0; color:var(--muted); font-size:9px; font-weight:650; }
.crm-select-filter select { width:100%; min-width:0; min-height:42px; padding-inline:10px; font-size:10px; }
.crm-filter-actions { display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-end; gap:8px; }
.crm-secondary-action { display:inline-flex; align-items:center; justify-content:center; gap:6px; min-height:40px; padding:0 12px; border:1px solid var(--line-strong); border-radius:9px; font-size:10px; font-weight:650; white-space:nowrap; }
.crm-table-scroll { width:100%; overflow:auto; }
.crm-table { min-width:760px; }
.crm-register-footer { display:flex; flex-wrap:wrap; justify-content:space-between; gap:8px 18px; padding:11px 2px 0; color:var(--muted); font-size:9px; }
.crm-register-footer strong { color:var(--brand-dark); }

/* Support workspaces: four clear headline metrics, a readable queue and forms. */
.support-workspace { width:100%; max-width:none; }
.support-workspace > .module-heading { align-items:center; flex-wrap:wrap; gap:14px 20px; }
.support-workspace > .module-heading > div:first-child { min-width:0; flex:1 1 340px; }
.support-workspace .finance-metric-grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
.support-workspace:not(.dashboard-system) .finance-metric-grid .finance-card { display:flex; min-width:0; min-height:88px; flex-direction:row; align-items:center; justify-content:space-between; gap:12px; padding:15px 17px; border:1px solid var(--line); border-radius:var(--radius-lg); background:var(--surface); box-shadow:var(--shadow-xs); }
.support-workspace:not(.dashboard-system) .finance-metric-grid .finance-card > span { color:var(--muted); font-size:10px; }
.support-workspace:not(.dashboard-system) .finance-metric-grid .finance-card > strong { color:var(--brand-dark); font:750 19px var(--display); white-space:nowrap; }
.support-tabs { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:4px 0 14px; padding:0 0 12px; border-bottom:1px solid var(--line); }
.support-tabs button { min-height:38px; padding-inline:13px; }
.support-layout { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(310px,.9fr); align-items:start; gap:16px; width:100%; }
.support-layout > *,.support-side,.support-detail { min-width:0; }
.support-layout > .panel,.support-detail { padding:15px; }
.support-detail .finance-table-toolbar { margin-bottom:12px; }
.support-detail .finance-table-toolbar h2 { font-size:14px; }
.support-ticket-origin { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; margin:0 0 13px; }
.support-ticket-origin > span { display:grid; gap:4px; min-width:0; padding:9px; border:1px solid var(--line-subtle); border-radius:8px; background:var(--surface-sunken); color:var(--ink-soft); font-size:9px; overflow-wrap:anywhere; }
.support-ticket-origin strong { color:var(--muted); font-size:8px; }
.support-body { padding:12px; border-radius:9px; background:var(--surface-sunken); color:var(--ink-soft); font-size:11px; line-height:1.55; white-space:pre-wrap; }
.support-timeline { display:grid; gap:9px; margin:14px 0; padding-left:18px; }
.support-timeline li { padding:10px 11px; border:1px solid var(--line-subtle); border-radius:9px; background:var(--surface); color:var(--ink-soft); font-size:10px; line-height:1.5; }
.support-form { display:grid; gap:10px; margin-top:12px; padding:13px; border:1px solid var(--line); border-radius:10px; background:var(--surface); }
.support-form label { display:grid; gap:6px; color:var(--ink-soft); font-size:10px; font-weight:650; }
.support-form label.inline { display:flex; align-items:center; gap:8px; }
.support-form label.inline input { min-height:0; }
.support-form button { justify-self:start; }
.support-portal-panel { margin:0 0 15px; padding:14px 16px; }
.support-portal-panel > summary { color:var(--ink); font:700 12px var(--display); cursor:pointer; }
.support-portal-panel > p { color:var(--muted); font-size:10px; }
.support-portal-form { display:grid; gap:13px; margin-top:12px; }
.support-portal-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.support-portal-fields > label { display:grid; gap:6px; min-width:0; color:var(--ink-soft); font-size:10px; font-weight:650; }
.support-portal-fields small { color:var(--muted); font-size:9px; font-weight:400; line-height:1.45; }
.support-department-choices { display:flex; flex-wrap:wrap; gap:8px 14px; margin:0; padding:12px; border:1px solid var(--line); border-radius:9px; }
.support-department-choices legend { padding:0 5px; color:var(--ink-soft); font-size:10px; font-weight:650; }
.support-department-choices label { display:flex; align-items:center; gap:6px; color:var(--ink-soft); font-size:10px; }
.support-portal-link,.support-portal-actions { display:flex; flex-wrap:wrap; align-items:end; gap:9px; }
.support-portal-link label { display:grid; flex:1 1 260px; gap:6px; color:var(--ink-soft); font-size:10px; }
.support-portal-actions { justify-content:space-between; padding-top:12px; border-top:1px solid var(--line-subtle); }
.support-portal-actions > span { flex:1 1 180px; color:var(--muted); font-size:9px; }
.support-workspace.dashboard-system .business-metric-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
.support-report-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.support-report-grid > :last-child { grid-column:auto; }
.support-report-grid > * { min-width:0; }

/* Team access is a role chooser and readable policy guide, not a plain list. */
.team-dashboard-layout,.team-roles-layout,.team-record-layout,.team-detail-grid { width:100%; max-width:none; }
.team-roles-layout { grid-template-columns:minmax(0,1fr); gap:14px; }
.team-role-list { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; min-width:0; padding:14px; }
.team-role-list-heading { grid-column:1/-1; display:grid; gap:4px; padding:0 2px 4px; }
.team-role-list-heading strong { color:var(--ink); font:700 12px var(--display); }
.team-role-list-heading small { color:var(--muted); font-size:9px; }
.team-role-option { display:grid; grid-template-columns:34px minmax(0,1fr) auto; align-items:center; gap:9px; min-width:0; min-height:67px; padding:10px 11px; border:1px solid var(--line); border-radius:10px; background:var(--surface); color:var(--ink-soft); text-align:left; transition:border-color .15s ease,background .15s ease,box-shadow .15s ease; }
.team-role-option:hover { border-color:var(--line-strong); background:var(--surface-sunken); }
.team-role-option.active { border-color:var(--brand); background:var(--brand-mist); box-shadow:0 0 0 2px var(--brand-tint); }
.team-role-mark { display:grid; width:32px; height:32px; place-items:center; border-radius:9px; font-size:12px; font-weight:750; }
.team-role-copy { display:grid; min-width:0; gap:3px; }
.team-role-copy strong { overflow:hidden; color:var(--ink); font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.team-role-copy small { color:var(--muted); font-size:8px; }
.team-role-option .status-badge { font-size:8px; }
.team-role-detail { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; min-width:0; padding:18px; }
.team-role-detail > .team-inspector-heading,.team-role-detail > .team-role-description,.team-role-detail > .team-policy-note { grid-column:1/-1; }
.team-role-detail .team-inspector-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; padding-bottom:12px; border-bottom:1px solid var(--line-subtle); }
.team-role-detail .team-inspector-heading h2 { margin:0; color:var(--ink); font:750 17px var(--display); }
.team-role-description { margin:0; padding:12px 14px; border-radius:10px; background:var(--brand-mist); color:var(--brand-dark); font-size:11px; line-height:1.6; }
.team-role-capabilities { grid-column:1/-1; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.team-role-capability { display:grid; align-content:start; gap:6px; min-width:0; min-height:105px; padding:12px; border:1px solid var(--line); border-radius:10px; background:var(--surface-sunken); }
.team-role-capability > span { color:var(--muted); font-size:8px; font-weight:700; letter-spacing:.03em; text-transform:uppercase; }
.team-role-capability > strong { color:var(--brand-dark); font:700 11px var(--display); }
.team-role-capability > small { color:var(--muted); font-size:9px; line-height:1.45; }
.team-role-detail .team-policy-card { min-width:0; margin:0; padding:14px; border:1px solid var(--line); border-radius:10px; background:var(--surface); }
.team-role-detail .team-policy-card h3 { margin:0 0 7px; color:var(--ink); font:700 11px var(--display); }
.team-role-detail .team-policy-card p { margin:0; color:var(--muted); font-size:10px; line-height:1.55; }
.team-role-detail .team-policy-note { margin:0; padding:10px 12px; border:1px solid var(--line-subtle); border-radius:9px; background:var(--surface-sunken); color:var(--muted); font-size:9px; line-height:1.55; }
.team-dashboard-layout > *,.team-chat-layout > *,.team-record-layout > *,.team-roles-layout > *,.team-detail-grid > * { min-width:0; }
.team-dashboard-layout .dashboard-panel { height:100%; padding:16px; }
.team-dashboard-layout .dashboard-panel-heading { align-items:flex-start; gap:12px; }
.team-chat-layout { gap:14px; }

/* Toolbars never collide: controls wrap only below the space they need. */
.module-heading,.dashboard-system .module-heading { flex-wrap:wrap; gap:14px 20px; }
.business-heading-actions,.finance-heading-actions,.crm-heading-actions,.module-actions,.business-heading-actions { gap:9px; }
.module-toolbar,.work-toolbar,.dashboard-toolbar { flex-wrap:wrap; gap:10px 12px; }
.module-toolbar > *, .work-toolbar > *, .dashboard-toolbar > * { min-width:0; }
.module-search,.work-search { min-width:min(100%,260px); }
.work-search { flex:1 1 280px; }
.work-record-count,.record-count { flex:0 0 auto; }
.dashboard-link-list { gap:8px; }
.dashboard-link-row { min-width:0; padding:11px 12px; }

@media(max-width:1180px) {
  .settings-workspace .settings-overview-bottom:has(.settings-overview-platform) { grid-template-columns:1fr; }
  .support-report-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .crm-filterbar { grid-template-columns:minmax(220px,1.2fr) repeat(2,minmax(135px,.8fr)); }
  .crm-filter-actions { grid-column:1/-1; justify-content:flex-end; }
  .team-role-list { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media(max-width:960px) {
  .settings-workspace .settings-content-grid,
  .settings-invoice-design-workspace > .settings-content-grid { grid-template-columns:minmax(0,1fr); }
  .settings-workspace .settings-overview-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .migration-workspace { grid-template-columns:minmax(0,1fr); }
  .migration-intro,.migration-workspace > .migration-step-card:nth-of-type(3),.migration-workspace > .migration-step-card:nth-of-type(4) { grid-column:1; }
  #settingsEmailTemplatesForm { grid-template-columns:repeat(2,minmax(0,1fr)); }
  #settingsEmailTemplatesForm > .settings-email-template,
  #settingsEmailTemplatesForm > .settings-email-template:nth-of-type(4),
  #settingsEmailTemplatesForm > .settings-email-template:nth-of-type(5) { grid-column:auto; }
  #settingsEmailTemplatesForm > .settings-email-template:last-of-type { grid-column:1/-1; }
  .support-layout { grid-template-columns:minmax(0,1fr); }
  .support-workspace .finance-metric-grid,.support-workspace.dashboard-system .business-metric-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .support-report-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .team-role-list { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .crm-filterbar { grid-template-columns:minmax(0,1.3fr) repeat(2,minmax(130px,.8fr)); }
}
@media(max-width:700px) {
  .settings-workspace .settings-page-heading { flex-wrap:wrap; }
  .settings-workspace .settings-page-heading > .status-badge { margin-left:0; }
  .settings-workspace .settings-overview-grid { grid-template-columns:minmax(0,1fr); }
  .settings-workspace .settings-overview-bottom { grid-template-columns:minmax(0,1fr); }
  .settings-source-grid,.migration-source-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  #settingsEmailTemplatesForm { grid-template-columns:minmax(0,1fr); }
  #settingsEmailTemplatesForm > .settings-email-template,
  #settingsEmailTemplatesForm > .settings-email-template:nth-of-type(4),
  #settingsEmailTemplatesForm > .settings-email-template:nth-of-type(5),
  #settingsEmailTemplatesForm > .settings-email-template:last-of-type { grid-column:1; }
  .invoice-template-gallery { grid-template-columns:minmax(0,1fr); }
  .invoice-preview-paper { padding:14px; }
  .invoice-base-header { gap:10px; }
  .invoice-base-parties { flex-direction:column; }
  .crm-filterbar { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .crm-search,.crm-filter-actions { grid-column:1/-1; }
  .crm-filter-actions { justify-content:flex-start; }
  .crm-workspace .crm-heading-actions { justify-content:flex-start; }
  .support-portal-fields { grid-template-columns:minmax(0,1fr); }
  .support-workspace .finance-metric-grid,.support-workspace.dashboard-system .business-metric-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .support-report-grid { grid-template-columns:minmax(0,1fr); }
  .team-role-list { grid-template-columns:minmax(0,1fr); }
  .team-role-detail { grid-template-columns:minmax(0,1fr); }
  .team-role-detail > .team-inspector-heading,.team-role-detail > .team-role-description,.team-role-detail > .team-policy-note,.team-role-capabilities { grid-column:1; }
  .team-role-capabilities { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .module-heading,.dashboard-system .module-heading { align-items:flex-start; }
  .module-toolbar,.work-toolbar,.dashboard-toolbar { align-items:stretch; }
}
@media(max-width:460px) {
  .migration-source-grid,.migration-import-form,.crm-filterbar,.support-ticket-origin { grid-template-columns:minmax(0,1fr); }
  .migration-form-actions,.migration-map-actions { justify-content:stretch; }
  .migration-form-actions > button,.migration-map-actions > button { flex:1 1 auto; }
  .crm-search,.crm-filter-actions { grid-column:1; }
  .support-workspace .finance-metric-grid,.support-workspace.dashboard-system .business-metric-grid { grid-template-columns:minmax(0,1fr); }
  .support-report-grid { grid-template-columns:minmax(0,1fr); }
  .team-role-capabilities { grid-template-columns:minmax(0,1fr); }
}

/* Business registers: keep the list, filters and selected record in one
   deliberate workspace instead of letting the inspector fall into the page. */
.business-workspace { width:100%; max-width:none; }
.business-workspace > .business-metric-grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-bottom:18px; }
.business-workspace .business-metric { min-width:0; padding:15px 16px; }
.business-workspace .business-metric-icon.green { background:var(--brand-tint); color:var(--brand); }
.business-list-detail { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(330px,.85fr); align-items:start; gap:14px; width:100%; }
.business-list-column { display:grid; align-content:start; gap:12px; min-width:0; }
.business-filterbar { display:grid; grid-template-columns:minmax(190px,1.35fr) repeat(2,minmax(132px,.8fr)); align-items:center; gap:11px; margin:0; padding:12px; border:1px solid var(--line); border-radius:var(--radius-lg); background:var(--surface-sunken); }
.business-filterbar > * { min-width:0; }
.business-filterbar > label { display:flex; align-items:center; gap:9px; min-height:42px; padding:0 11px; border:1px solid var(--line-strong); border-radius:var(--radius-sm); background:var(--surface); color:var(--brand); }
.business-filterbar > label > span { flex:0 0 auto; font-size:18px; line-height:1; }
.business-filterbar input[type="search"] { width:100%; min-width:0; min-height:38px; padding:0; border:0; outline:0; background:transparent; box-shadow:none; color:var(--ink); font-size:11px; }
.business-filterbar input[type="search"]:focus { box-shadow:none; }
.business-filterbar select { width:100%; min-width:0; min-height:42px; padding:0 10px; border:1px solid var(--line-strong); border-radius:var(--radius-sm); background-color:var(--surface); color:var(--ink-soft); font-size:10px; }
.business-table-panel { min-width:0; overflow:hidden; padding:0 15px 14px; }
.business-table-title { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:72px; padding:13px 1px 11px; }
.business-table-title h2 { margin:0 0 4px; color:var(--ink); font:700 15px var(--display); }
.business-table-title p { margin:0; color:var(--muted); font-size:10px; }
.business-selected-caption { max-width:48%; overflow:hidden; color:var(--muted); font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.business-table { min-width:700px; }
.business-table tbody tr { cursor:pointer; transition:background-color var(--duration-fast) ease; }
.business-table tbody tr.selected td { background:var(--brand-tint); }
.business-table tbody tr.selected td:first-child { box-shadow:inset 3px 0 var(--brand); }
.business-record-link { max-width:100%; padding:0; overflow:hidden; border:0; background:transparent; color:var(--brand-dark); font:650 11px var(--display); text-align:left; text-overflow:ellipsis; white-space:nowrap; }
.business-record-link:hover { color:var(--brand); text-decoration:underline; }
.business-customer-cell { display:flex; align-items:center; gap:8px; min-width:0; }
.business-avatar { display:inline-grid; place-items:center; width:32px; height:32px; flex:0 0 32px; border-radius:50%; background:var(--brand-tint); color:var(--brand-dark); font-size:10px; font-weight:750; }
.business-amount-cell { color:var(--ink); font-variant-numeric:tabular-nums; font-weight:650; white-space:nowrap; }
.business-inspector { position:sticky; top:14px; min-width:0; max-height:calc(100vh - 100px); overflow:auto; padding:0; background:var(--surface); }
.business-inspector-header { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; padding:16px; border-bottom:1px solid var(--line); }
.business-inspector-header > div:first-child { min-width:0; }
.business-inspector-header .eyebrow { margin:0 0 5px; color:var(--brand); font-size:9px; font-weight:750; letter-spacing:.09em; }
.business-inspector-header h2 { margin:0 0 7px; overflow-wrap:anywhere; color:var(--ink); font:700 16px/1.3 var(--display); }
.business-inspector-header > div:first-child > div:last-child { display:flex; flex-wrap:wrap; align-items:center; gap:8px; color:var(--muted); font-size:10px; }
.business-inspector-actions { display:flex; flex:0 0 auto; gap:6px; }
.business-inspector-actions button { display:inline-grid; place-items:center; width:34px; height:34px; padding:0; border:1px solid var(--line); border-radius:9px; background:var(--surface); color:var(--brand-dark); font-size:15px; transition:background-color var(--duration-fast) ease,border-color var(--duration-fast) ease,color var(--duration-fast) ease; }
.business-inspector-actions button:hover { border-color:var(--brand); background:var(--brand-tint); color:var(--brand); }
.business-detail-tabs { display:flex; align-items:center; gap:5px; overflow-x:auto; margin:0; padding:10px 13px 0; border-bottom:1px solid var(--line); scrollbar-width:thin; }
.business-detail-tab { flex:0 0 auto; min-height:36px; padding:0 10px; border:0; border-bottom:2px solid transparent; border-radius:7px 7px 0 0; background:transparent; color:var(--muted); font:600 10px var(--font); white-space:nowrap; }
.business-detail-tab:hover { background:var(--brand-mist); color:var(--brand-dark); }
.business-detail-tab.active { border-bottom-color:var(--brand); color:var(--brand); }
.business-inspector-body { display:grid; gap:13px; padding:15px; }
.business-inspector-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.business-inspector-fields > div { display:grid; align-content:start; gap:5px; min-width:0; min-height:59px; padding:10px; border:1px solid var(--line-subtle); border-radius:9px; background:var(--surface-sunken); }
.business-inspector-fields small { color:var(--muted); font-size:9px; }
.business-inspector-fields strong { overflow-wrap:anywhere; color:var(--ink); font-size:11px; font-weight:650; }
.business-inspector-related { display:grid; gap:8px; padding-top:12px; border-top:1px solid var(--line); }
.business-inspector-related h3 { margin:0 0 2px; color:var(--ink); font:700 12px var(--display); }
.business-inspector-related > div { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:9px 10px; border:1px solid var(--line-subtle); border-radius:8px; background:var(--surface); color:var(--ink-soft); font-size:10px; }
.business-inspector-related > div span { min-width:0; overflow-wrap:anywhere; }
.business-inspector-related > div strong { flex:0 0 auto; color:var(--ink); font-variant-numeric:tabular-nums; }
.business-inspector-related > p,.business-detail-list > p { margin:0; padding:11px; border-radius:8px; background:var(--surface-sunken); color:var(--muted); font-size:10px; }
.business-detail-list { display:grid; gap:8px; }
.business-detail-list > article { display:flex; align-items:center; gap:9px; min-width:0; padding:10px; border:1px solid var(--line-subtle); border-radius:9px; background:var(--surface); }
.business-detail-list > article > div { display:grid; gap:3px; min-width:0; flex:1; }
.business-detail-list > article strong { overflow-wrap:anywhere; color:var(--ink); font-size:10px; }
.business-detail-list > article small { color:var(--muted); font-size:9px; }
.business-detail-list > article b { color:var(--ink); font-size:10px; white-space:nowrap; }
.business-event-icon { display:grid; place-items:center; width:28px; height:28px; flex:0 0 28px; border-radius:8px; background:var(--brand-tint); color:var(--brand); }
.business-filter-empty { margin:0; padding:14px; color:var(--muted); font-size:11px; }

/* Invoice creation and record previews use the same card rhythm as the rest
   of the workspace, with a stable editor / preview split on wide screens. */
.invoice-editor-workspace { width:100%; max-width:none; margin:0 auto; }
.invoice-editor-heading { display:flex; align-items:center; justify-content:space-between; gap:18px; margin:6px 0 20px; }
.invoice-editor-heading h1 { margin:0; color:var(--ink); font:750 clamp(23px,2vw,29px)/1.2 var(--display); letter-spacing:-.035em; }
.invoice-editor-heading .subheading { margin:7px 0 0; color:var(--muted); font-size:11px; }
.invoice-workspace-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px; }
.invoice-editor-layout { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(330px,.8fr); align-items:start; gap:15px; }
.invoice-editor-main { display:grid; align-content:start; gap:14px; min-width:0; }
.invoice-editor-card { min-width:0; padding:18px; }
.invoice-section-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:15px; }
.invoice-section-heading > div { display:flex; align-items:center; gap:11px; min-width:0; }
.invoice-section-step { display:grid; place-items:center; width:31px; height:31px; flex:0 0 31px; border-radius:9px; background:var(--brand-tint); color:var(--brand); font-size:10px; font-weight:750; }
.invoice-section-heading h2 { margin:0 0 4px; color:var(--ink); font:700 14px var(--display); }
.invoice-section-heading p,.invoice-catalog-actions p { margin:0; color:var(--muted); font-size:10px; line-height:1.5; }
.invoice-secure-note { flex:0 0 auto; padding:6px 9px; border:1px solid var(--line); border-radius:999px; background:var(--surface-sunken); color:var(--muted); font-size:9px; }
.invoice-meta-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.invoice-customer-field { grid-column:1/-1; }
.invoice-picker-row { display:flex; flex-wrap:wrap; align-items:center; gap:8px; position:relative; }
.invoice-picker-row > input { flex:1 1 230px; min-width:0; }
.invoice-inline-create { display:inline-flex; align-items:center; justify-content:center; gap:6px; min-height:36px; padding:0 11px; border:1px solid var(--line-strong); border-radius:var(--radius-sm); background:var(--surface); color:var(--brand-dark); font-size:10px; font-weight:650; }
.invoice-inline-create:hover { border-color:var(--brand); background:var(--brand-tint); color:var(--brand); }
.invoice-customer-loaded { margin-top:6px; color:var(--muted); font-size:9px; }
.invoice-customer-results { position:absolute; z-index:12; top:calc(100% + 4px); left:0; width:min(100%,560px); max-height:260px; overflow:auto; padding:5px; border:1px solid var(--line); border-radius:10px; background:var(--surface); box-shadow:var(--shadow); }
.invoice-customer-option { display:flex; justify-content:space-between; gap:10px; width:100%; padding:9px 10px; border:0; border-radius:7px; background:transparent; color:var(--ink); text-align:left; }
.invoice-customer-option:hover { background:var(--brand-tint); }
.invoice-catalog-actions { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px; margin-bottom:12px; }
.invoice-catalog-actions p { flex:1 1 360px; }
.invoice-items-table-wrap { width:100%; overflow:auto; border:1px solid var(--line); border-radius:10px; }
.invoice-items-head,.invoice-item-row { display:grid; grid-template-columns:minmax(170px,2fr) minmax(76px,.65fr) minmax(95px,.9fr) minmax(84px,.7fr) minmax(72px,.6fr) minmax(105px,.95fr) 38px; align-items:center; gap:8px; min-width:790px; padding:9px 10px; }
.invoice-items-head { background:var(--surface-sunken); color:var(--muted); font-size:9px; font-weight:750; letter-spacing:.045em; }
.invoice-item-row { border-top:1px solid var(--line-subtle); }
.invoice-item-row input,.invoice-item-row select { width:100%; min-width:0; min-height:36px; }
.invoice-remove-item { display:grid; place-items:center; width:30px; height:30px; border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--muted); }
.invoice-remove-item:hover { border-color:var(--danger); color:var(--danger); }
.invoice-editor-footer { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px; margin-top:14px; padding-top:13px; border-top:1px solid var(--line); }
.invoice-footer-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px; }
.invoice-summary-card { position:static; }
.invoice-preview-column { position:sticky; top:14px; min-width:0; }
.invoice-live-preview { padding:15px; }
.invoice-preview-top { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }
.invoice-preview-top > div { display:grid; gap:4px; }
.invoice-preview-label { color:var(--ink); font:750 10px var(--display); letter-spacing:.07em; }
.invoice-preview-currency { color:var(--muted); font-size:8px; }
.invoice-draft-chip { padding:5px 8px; border:1px solid var(--line); border-radius:999px; background:var(--surface-sunken); color:var(--brand-dark); font-size:8px; font-weight:700; }
.invoice-preview-document { display:grid; gap:14px; margin-top:12px; padding:17px; border:1px solid var(--line); border-radius:11px; background:linear-gradient(180deg,var(--surface),var(--surface-sunken)); }
.invoice-preview-brand { display:flex; align-items:center; gap:9px; padding-bottom:10px; border-bottom:1px solid var(--line); }
.invoice-preview-brand > div { display:grid; gap:3px; min-width:0; }
.invoice-preview-brand strong { color:var(--ink); font:700 10px var(--display); }
.invoice-preview-brand small { color:var(--muted); font-size:8px; }
.invoice-preview-title { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.invoice-preview-title span { color:var(--muted); font-size:8px; font-weight:750; letter-spacing:.08em; }
.invoice-preview-title strong { color:var(--ink); font:750 13px var(--display); }
.invoice-preview-parties { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.invoice-preview-parties > div { display:grid; gap:4px; min-width:0; padding:9px; border:1px solid var(--line-subtle); border-radius:8px; background:var(--surface); }
.invoice-preview-parties small,.invoice-preview-dates small { color:var(--muted); font-size:7px; font-weight:750; letter-spacing:.05em; }
.invoice-preview-parties strong,.invoice-preview-dates strong { color:var(--ink); font-size:9px; overflow-wrap:anywhere; }
.invoice-preview-parties span { color:var(--muted); font-size:8px; overflow-wrap:anywhere; }
.invoice-preview-dates { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.invoice-preview-dates > div { display:grid; gap:4px; padding:8px 9px; border-radius:8px; background:var(--surface); }
.invoice-preview-items { overflow:hidden; border:1px solid var(--line); border-radius:8px; }
.invoice-preview-table-head,.invoice-preview-item { display:grid; grid-template-columns:minmax(0,1fr) 44px 86px; align-items:center; gap:8px; padding:8px; }
.invoice-preview-table-head { background:var(--surface-sunken); color:var(--muted); font-size:7px; font-weight:750; }
.invoice-preview-item { border-top:1px solid var(--line-subtle); color:var(--ink-soft); font-size:8px; }
.invoice-preview-totals { display:grid; gap:6px; }
.invoice-preview-totals > div { display:flex; justify-content:space-between; gap:10px; color:var(--muted); font-size:8px; }
.invoice-preview-totals strong { color:var(--ink); font-variant-numeric:tabular-nums; }
.invoice-preview-totals .invoice-preview-grand { padding:8px 9px; border-radius:7px; background:var(--brand-tint); color:var(--brand-dark); font-weight:700; }
.invoice-preview-grand strong { color:var(--brand-dark); }
.invoice-preview-terms,.invoice-preview-note { margin:0; color:var(--muted); font-size:8px; line-height:1.5; }
.invoice-preview-hint { margin:10px 2px 0; color:var(--muted); font-size:8px; line-height:1.5; }
.invoice-summary-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.invoice-summary-grid > div,.invoice-breakdown > div,.invoice-date-grid > div { display:grid; gap:5px; padding:10px; border:1px solid var(--line-subtle); border-radius:9px; background:var(--surface-sunken); }
.invoice-summary-grid small,.invoice-date-grid small,.invoice-breakdown span { color:var(--muted); font-size:9px; }
.invoice-summary-grid strong,.invoice-date-grid strong,.invoice-breakdown strong { color:var(--ink); font-size:10px; overflow-wrap:anywhere; }
.invoice-detail-document { display:grid; gap:14px; min-width:0; padding:14px; border:1px solid var(--line); border-radius:11px; background:linear-gradient(180deg,var(--surface),var(--surface-sunken)); }
.invoice-detail-brand { display:flex; align-items:center; gap:10px; padding-bottom:12px; border-bottom:1px solid var(--line); }
.invoice-brand-mark { display:grid; place-items:center; width:36px; height:36px; flex:0 0 36px; border-radius:10px; background:var(--brand-tint); color:var(--brand); }
.invoice-detail-brand > div { display:grid; gap:3px; min-width:0; }
.invoice-detail-brand strong { color:var(--ink); font:700 11px var(--display); }
.invoice-detail-brand small { color:var(--muted); font-size:9px; overflow-wrap:anywhere; }
.invoice-detail-number { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.invoice-detail-number span:first-child { color:var(--muted); font-size:9px; font-weight:750; letter-spacing:.08em; }
.invoice-detail-number h3 { margin:4px 0 0; color:var(--ink); font:750 17px var(--display); }
.invoice-detail-parties { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); gap:9px; }
.invoice-detail-parties > section { display:grid; align-content:start; gap:5px; min-width:0; padding:10px; border:1px solid var(--line-subtle); border-radius:9px; background:var(--surface); }
.invoice-detail-parties small,.invoice-detail-foot small { color:var(--muted); font-size:8px; font-weight:750; letter-spacing:.06em; }
.invoice-detail-parties strong { color:var(--ink); font-size:10px; overflow-wrap:anywhere; }
.invoice-detail-parties span { color:var(--muted); font-size:9px; overflow-wrap:anywhere; }
.invoice-detail-lineitems { min-width:0; }
.invoice-detail-lineitems h3 { margin:0 0 7px; color:var(--ink); font:700 11px var(--display); }
.invoice-detail-lineitems table { min-width:460px; }
.invoice-detail-totals { display:grid; gap:7px; margin-left:auto; width:min(100%,280px); }
.invoice-detail-totals > div { display:flex; justify-content:space-between; gap:12px; color:var(--muted); font-size:10px; }
.invoice-detail-totals strong { color:var(--ink); font-variant-numeric:tabular-nums; }
.invoice-detail-totals .invoice-detail-grand,.invoice-detail-totals .invoice-detail-balance { padding:9px 10px; border-radius:8px; background:var(--brand-tint); color:var(--brand-dark); font-weight:700; }
.invoice-detail-foot { padding-top:9px; border-top:1px solid var(--line); }
.invoice-detail-foot p { margin:5px 0 0; color:var(--ink-soft); font-size:10px; white-space:pre-wrap; overflow-wrap:anywhere; }
.invoice-customer-card { display:flex; align-items:center; gap:10px; padding:11px; border:1px solid var(--line); border-radius:10px; background:var(--surface-sunken); }
.invoice-customer-card > div { display:grid; gap:3px; min-width:0; }
.invoice-customer-card strong { color:var(--ink); font-size:11px; overflow-wrap:anywhere; }
.invoice-customer-card small { color:var(--muted); font-size:9px; }
.invoice-date-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; }
.invoice-total-highlight { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:12px; border-radius:10px; background:var(--brand-tint); color:var(--brand-dark); font-size:10px; }
.invoice-total-highlight strong { font:750 17px var(--display); white-space:nowrap; }
.invoice-breakdown { display:grid; gap:7px; }
.invoice-breakdown > div { display:flex; flex-direction:row; align-items:center; justify-content:space-between; }
.invoice-breakdown .invoice-grand-total { border-color:var(--line); background:var(--surface); }
.invoice-grand-total strong { color:var(--brand); }
.invoice-payment-progress { height:7px; overflow:hidden; border-radius:999px; background:var(--line); }
.invoice-payment-progress > span { display:block; height:100%; border-radius:inherit; background:var(--brand); }
.invoice-payment-progress-label { color:var(--muted); font-size:9px; }

/* Working Papers uses the same quiet teal, card surfaces, clear tabs and
   responsive two-column workspace as CRM and Finance. */
.working-papers-app { width:100%; max-width:none; }
.wp-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:18px; margin:2px 0 17px; }
.wp-heading > div:first-child { min-width:0; }
.wp-breadcrumb { margin:0 0 7px; color:var(--muted); font-size:9px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.wp-breadcrumb span { padding:0 4px; color:var(--brand); }
.wp-heading h1 { margin:0; color:var(--ink); font:750 clamp(23px,2vw,29px)/1.2 var(--display); letter-spacing:-.035em; }
.wp-subtitle { margin:7px 0 0; color:var(--muted); font-size:11px; }
.wp-heading-actions { display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-end; gap:10px; }
.wp-practice-select { display:grid; gap:3px; min-width:170px; padding:8px 11px; border:1px solid var(--line); border-radius:10px; background:var(--surface); }
.wp-practice-select span,.wp-practice-select small { color:var(--muted); font-size:8px; }
.wp-practice-select strong { color:var(--ink); font-size:10px; }
.wp-create-drawer { position:relative; }
.wp-create-drawer > summary { cursor:pointer; list-style:none; }
.wp-create-drawer > summary::-webkit-details-marker { display:none; }
.wp-create-card { position:absolute; z-index:15; top:calc(100% + 9px); right:0; width:min(720px,calc(100vw - 36px)); max-height:min(75vh,760px); overflow:auto; padding:19px; border:1px solid var(--line); border-radius:14px; background:var(--surface); box-shadow:var(--shadow); }
.wp-create-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; margin-bottom:14px; }
.wp-create-heading h2 { margin:4px 0; color:var(--ink); font:700 15px var(--display); }
.wp-create-heading p { margin:0; color:var(--muted); font-size:10px; }
.wp-eyebrow { margin:0; color:var(--brand); font-size:8px; font-weight:750; letter-spacing:.09em; }
.wp-secure-pill { padding:6px 9px; border:1px solid var(--line); border-radius:999px; background:var(--surface-sunken); color:var(--muted); font-size:9px; white-space:nowrap; }
.wp-form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:11px; }
.wp-field { display:grid; align-content:start; gap:5px; min-width:0; color:var(--muted); font-size:9px; font-weight:650; }
.wp-field > span { color:var(--ink-soft); }
.wp-field i { color:var(--brand); font-style:normal; }
.wp-field input,.wp-field select,.wp-field textarea { width:100%; min-width:0; min-height:38px; padding:8px 10px; border:1px solid var(--line-strong); border-radius:8px; background:var(--surface); color:var(--ink); font:500 10px var(--font); }
.wp-field textarea { min-height:82px; resize:vertical; }
.wp-field-wide { grid-column:1/-1; }
.wp-form-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px; padding-top:8px; }
.wp-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:13px; margin:0 0 16px; }
.wp-metrics > article { display:flex; align-items:center; gap:11px; min-width:0; min-height:82px; padding:13px 14px; border:1px solid var(--line); border-radius:var(--radius-lg); background:var(--surface); box-shadow:var(--shadow-xs); }
.wp-icon { display:grid; place-items:center; width:36px; height:36px; flex:0 0 36px; border-radius:50%; background:var(--brand-tint); color:var(--brand); font-size:16px; font-style:normal; }
.wp-icon.wp-blue,.wp-icon.wp-amber,.wp-icon.wp-green { background:var(--brand-tint); color:var(--brand); }
.wp-metrics > article > div { display:grid; gap:3px; min-width:0; }
.wp-metrics span { color:var(--muted); font-size:9px; }
.wp-metrics strong { color:var(--ink); font:750 18px var(--display); }
.wp-metrics small { overflow:hidden; color:var(--muted); font-size:8px; text-overflow:ellipsis; white-space:nowrap; }
.wp-workspace-grid { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(290px,.8fr); align-items:start; gap:14px; }
.wp-workspace-grid.wp-workspace-empty { grid-template-columns:minmax(0,1fr); }
.wp-primary-workspace,.wp-side-rail { display:grid; align-content:start; gap:12px; min-width:0; }
.wp-engagement-bar { display:grid; grid-template-columns:minmax(210px,1.4fr) repeat(2,minmax(140px,.8fr)) auto; align-items:center; gap:10px; padding:12px; border:1px solid var(--line); border-radius:var(--radius-lg); background:var(--surface); }
.wp-client-select,.wp-financial-year,.wp-engagement-type { display:grid; gap:4px; min-width:0; }
.wp-client-select > span,.wp-financial-year > span,.wp-engagement-type > span { color:var(--muted); font-size:8px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; }
.wp-client-select select { width:100%; min-width:0; min-height:36px; padding:0 9px; border:1px solid var(--line-strong); border-radius:8px; background:var(--surface); color:var(--ink); font-size:10px; }
.wp-financial-year strong,.wp-engagement-type strong { overflow:hidden; color:var(--ink); font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.wp-financial-year small { color:var(--muted); font-size:8px; }
.wp-tabs { display:flex; align-items:stretch; gap:4px; overflow-x:auto; padding:0 9px; border:1px solid var(--line); border-radius:11px; background:var(--surface); scrollbar-width:thin; }
.wp-tabs button { position:relative; display:inline-flex; align-items:center; justify-content:center; min-height:42px; flex:0 0 auto; padding:0 10px; border:0; border-bottom:2px solid transparent; background:transparent; color:var(--muted); font:600 9px var(--font); white-space:nowrap; }
.wp-tabs button:hover { background:var(--brand-mist); color:var(--brand); }
.wp-tabs button.active { border-bottom-color:var(--brand); color:var(--brand); font-weight:750; }
.wp-tab-content { display:grid; align-content:start; gap:12px; min-width:0; }
.wp-content-card,.wp-no-engagement,.wp-paper-fullpage,.wp-final-signoff { min-width:0; padding:16px; border:1px solid var(--line); border-radius:var(--radius-lg); background:var(--surface); box-shadow:var(--shadow-xs); }
.wp-card-title,.wp-setup-heading,.wp-side-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:12px; }
.wp-card-title h2,.wp-setup-heading h2,.wp-side-card h2 { margin:0; color:var(--ink); font:700 13px var(--display); }
.wp-card-title p,.wp-content-card > p { margin:4px 0 0; color:var(--muted); font-size:9px; }
.wp-overview-grid,.wp-review-metrics,.wp-tb-summary,.wp-detail-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.wp-overview-grid > *, .wp-detail-grid > *, .wp-review-metrics > * { min-width:0; }
.wp-setup-list { display:grid; gap:7px; margin:0; padding:0; list-style:none; }
.wp-setup-item { display:flex; align-items:center; gap:9px; min-width:0; padding:9px 10px; border:1px solid var(--line-subtle); border-radius:8px; background:var(--surface-sunken); color:var(--ink-soft); font-size:9px; }
.wp-setup-item:before { content:""; width:8px; height:8px; flex:0 0 8px; border:1px solid var(--line-strong); border-radius:50%; background:var(--surface); }
.wp-setup-item.complete:before { border-color:var(--brand); background:var(--brand); box-shadow:inset 0 0 0 2px var(--surface); }
.wp-index-groups { display:grid; gap:10px; }
.wp-index-section { overflow:hidden; border:1px solid var(--line); border-radius:10px; background:var(--surface); }
.wp-index-section > summary,.wp-index-heading { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:11px 12px; background:var(--surface-sunken); color:var(--ink); font-size:10px; font-weight:700; cursor:pointer; }
.wp-index-table-head,.wp-index-row { display:grid; grid-template-columns:minmax(130px,1.4fr) minmax(85px,.7fr) minmax(90px,.8fr) minmax(90px,.8fr); align-items:center; gap:9px; min-width:0; padding:9px 11px; }
.wp-index-table-head { color:var(--muted); font-size:8px; font-weight:750; }
.wp-index-row { border-top:1px solid var(--line-subtle); color:var(--ink-soft); font-size:9px; }
.wp-index-row > * { min-width:0; }
.wp-index-row button { border:0; background:transparent; color:var(--brand-dark); font:650 9px var(--font); text-align:left; }
.wp-index-row button:hover { color:var(--brand); text-decoration:underline; }
.wp-status { display:inline-flex; align-items:center; max-width:100%; padding:4px 8px; border:1px solid var(--line); border-radius:999px; background:var(--surface-sunken); color:var(--ink-soft); font-size:8px; font-weight:700; white-space:nowrap; }
.wp-status-reviewed,.wp-status-approved,.wp-status-signed-off,.wp-status-complete { border-color:color-mix(in srgb,var(--brand) 25%,var(--line)); background:var(--brand-tint); color:var(--brand-dark); }
.wp-status-awaiting-review,.wp-status-for-review,.wp-status-in-progress { background:var(--info-soft); color:var(--info-ink); }
.wp-status-blocked,.wp-status-needs-investigation { background:var(--warning-soft); color:var(--warning-ink); }
.wp-side-card { min-width:0; padding:14px; border:1px solid var(--line); border-radius:var(--radius-lg); background:var(--surface); box-shadow:var(--shadow-xs); }
.wp-progress-content { display:grid; grid-template-columns:112px minmax(0,1fr); align-items:center; gap:12px; }
.wp-progress-ring { display:grid; place-items:center; width:104px; height:104px; border-radius:50%; }
.wp-progress-ring > div { display:grid; place-content:center; width:78px; height:78px; border-radius:50%; background:var(--surface); text-align:center; }
.wp-progress-ring strong { color:var(--ink); font:750 18px var(--display); }
.wp-progress-ring small { color:var(--muted); font-size:8px; }
.wp-progress-content ul { display:grid; gap:7px; margin:0; padding:0; list-style:none; }
.wp-progress-content li { display:flex; align-items:center; gap:7px; color:var(--muted); font-size:8px; }
.wp-progress-content li i { width:7px; height:7px; flex:0 0 7px; border-radius:50%; background:var(--brand); }
.wp-progress-content li i.review,.wp-progress-content li i.waiting,.wp-progress-content li i.idle,.wp-progress-content li i.late { background:var(--brand); }
.wp-progress-content li b { margin-left:auto; color:var(--ink); font-size:9px; }
.wp-important-list { display:grid; gap:2px; }
.wp-important-list > div { display:flex; align-items:center; gap:8px; min-width:0; padding:8px 0; border-top:1px solid var(--line-subtle); }
.wp-important-list i { color:var(--brand); font-style:normal; }
.wp-important-list span { flex:1; color:var(--ink-soft); font-size:9px; }
.wp-important-list b { color:var(--ink); font-size:10px; }
.wp-recent-list { display:grid; gap:9px; }
.wp-recent-list > div { display:flex; align-items:flex-start; gap:8px; min-width:0; }
.wp-recent-list > div > i { display:grid; place-items:center; width:27px; height:27px; flex:0 0 27px; border-radius:50%; background:var(--brand-tint); color:var(--brand); font-size:8px; font-style:normal; font-weight:750; }
.wp-recent-list p { display:grid; gap:3px; min-width:0; margin:0; }
.wp-recent-list strong { color:var(--ink); font-size:9px; }
.wp-recent-list small { color:var(--muted); font-size:8px; overflow-wrap:anywhere; }
.wp-ai-card { display:flex; align-items:flex-start; gap:10px; padding:13px; border:1px solid color-mix(in srgb,var(--brand) 20%,var(--line)); border-radius:var(--radius-lg); background:var(--brand-mist); }
.wp-ai-card > span { color:var(--brand); font-size:17px; }
.wp-ai-card strong { color:var(--ink); font-size:10px; }
.wp-ai-card p { margin:4px 0 8px; color:var(--muted); font-size:9px; }
.wp-ai-card > div > div { display:flex; flex-wrap:wrap; gap:7px; }
.wp-ai-card button { min-height:30px; padding:0 9px; border:1px solid var(--line); border-radius:7px; background:var(--surface); color:var(--brand-dark); font-size:8px; }
.wp-access-card { display:flex; align-items:flex-start; gap:16px; max-width:760px; padding:22px; }
.wp-access-icon { display:grid; place-items:center; width:44px; height:44px; flex:0 0 44px; border-radius:12px; background:var(--brand-tint); color:var(--brand); }
.wp-access-icon .oc-icon { width:22px; height:22px; }
.wp-access-card h2 { margin:4px 0 7px; font-size:17px; }
.wp-access-card p:not(.eyebrow) { margin:0 0 14px; color:var(--muted); font-size:11px; }

@media(max-width:1080px) {
  .business-list-detail,.invoice-editor-layout,.wp-workspace-grid { grid-template-columns:minmax(0,1fr); }
  .business-inspector,.invoice-preview-column { position:static; max-height:none; }
  .wp-side-rail { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:760px) {
  .business-workspace > .business-metric-grid,.wp-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .business-filterbar { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .business-filterbar > label { grid-column:1/-1; }
  .invoice-editor-heading,.wp-heading { align-items:flex-start; flex-direction:column; }
  .invoice-workspace-actions,.wp-heading-actions { justify-content:flex-start; width:100%; }
  .wp-engagement-bar { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .wp-client-select { grid-column:1/-1; }
}
@media(max-width:560px) {
  .business-workspace > .business-metric-grid,.wp-metrics { grid-template-columns:minmax(0,1fr); gap:9px; }
  .business-filterbar,.business-inspector-fields,.invoice-meta-grid,.invoice-summary-grid,.invoice-detail-parties,.invoice-date-grid,.wp-form-grid,.wp-overview-grid,.wp-review-metrics,.wp-tb-summary,.wp-detail-grid,.wp-engagement-bar { grid-template-columns:minmax(0,1fr); }
  .business-filterbar > label,.wp-client-select,.wp-field-wide { grid-column:1; }
  .business-table-title { align-items:flex-start; flex-direction:column; }
  .business-selected-caption { max-width:100%; }
  .business-inspector { position:static; }
  .invoice-section-heading { align-items:flex-start; flex-direction:column; }
  .invoice-customer-field { grid-column:1; }
  .wp-side-rail { grid-template-columns:minmax(0,1fr); }
  .wp-create-card { right:auto; left:0; width:calc(100vw - 30px); }
  .wp-access-card { flex-direction:column; padding:16px; }
}

/* Team workspaces: one full-width, calm teal system for people, access and chat. */
#pageContent:has(.team-dashboard-layout),
#pageContent:has(.team-chat-layout),
#pageContent:has(.team-record-layout),
#pageContent:has(.team-roles-layout),
#pageContent:has(.leave-workspace-marker) { width:100%; max-width:none; }
.page-content:has(.team-dashboard-layout),
.page-content:has(.team-chat-layout),
.page-content:has(.team-record-layout),
.page-content:has(.team-roles-layout),
.page-content:has(.leave-workspace-marker) { width:100%; max-width:none; padding-inline:clamp(16px,2.2vw,34px); }
.dashboard-system:has(.team-dashboard-layout),
.dashboard-system:has(.team-chat-layout),
.dashboard-system:has(.team-record-layout),
.dashboard-system:has(.team-roles-layout),
.dashboard-system:has(.leave-workspace-marker) { width:100%; max-width:none; padding:8px 0 28px; }
.dashboard-system:has(.team-dashboard-layout) > .business-workspace-heading,
.dashboard-system:has(.team-chat-layout) > .business-workspace-heading,
.dashboard-system:has(.team-record-layout) > .business-workspace-heading,
.dashboard-system:has(.team-roles-layout) > .business-workspace-heading,
.dashboard-system:has(.leave-workspace-marker) > .business-workspace-heading { align-items:center; gap:16px; margin:0 0 18px; padding:0 0 16px; border-bottom:1px solid var(--line); }
.dashboard-system:has(.team-dashboard-layout) > .business-workspace-heading h1,
.dashboard-system:has(.team-chat-layout) > .business-workspace-heading h1,
.dashboard-system:has(.team-record-layout) > .business-workspace-heading h1,
.dashboard-system:has(.team-roles-layout) > .business-workspace-heading h1,
.dashboard-system:has(.leave-workspace-marker) > .business-workspace-heading h1 { margin:0; color:var(--ink); font:750 clamp(23px,2vw,29px)/1.2 var(--display); letter-spacing:-.035em; }
.dashboard-system:has(.team-dashboard-layout) > .business-workspace-heading .subheading,
.dashboard-system:has(.team-chat-layout) > .business-workspace-heading .subheading,
.dashboard-system:has(.team-record-layout) > .business-workspace-heading .subheading,
.dashboard-system:has(.team-roles-layout) > .business-workspace-heading .subheading,
.dashboard-system:has(.leave-workspace-marker) > .business-workspace-heading .subheading { max-width:760px; margin:6px 0 0; color:var(--muted); font-size:11px; line-height:1.55; }
.dashboard-system:has(.team-dashboard-layout) > .business-metric-grid,
.dashboard-system:has(.team-record-layout) > .business-metric-grid,
.dashboard-system:has(.team-roles-layout) > .business-metric-grid,
.dashboard-system:has(.leave-workspace-marker) > .business-metric-grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:13px; width:100%; margin:0 0 17px; }
.dashboard-system:has(.team-dashboard-layout) .business-metric,
.dashboard-system:has(.team-record-layout) .business-metric,
.dashboard-system:has(.team-roles-layout) .business-metric,
.dashboard-system:has(.leave-workspace-marker) .business-metric { display:flex; min-width:0; min-height:92px; align-items:center; gap:12px; padding:15px; border:1px solid var(--line); border-radius:13px; background:var(--surface); box-shadow:var(--shadow-xs); }
.dashboard-system:has(.team-dashboard-layout) .business-metric-icon,
.dashboard-system:has(.team-record-layout) .business-metric-icon,
.dashboard-system:has(.team-roles-layout) .business-metric-icon,
.dashboard-system:has(.leave-workspace-marker) .business-metric-icon { display:grid; width:40px; height:40px; flex:0 0 40px; place-items:center; border-radius:12px; background:var(--brand-tint); color:var(--brand-dark); }
.dashboard-system:has(.team-dashboard-layout) .business-metric > div,
.dashboard-system:has(.team-record-layout) .business-metric > div,
.dashboard-system:has(.team-roles-layout) .business-metric > div,
.dashboard-system:has(.leave-workspace-marker) .business-metric > div { display:grid; min-width:0; gap:3px; }
.dashboard-system:has(.team-dashboard-layout) .business-metric small,
.dashboard-system:has(.team-record-layout) .business-metric small,
.dashboard-system:has(.team-roles-layout) .business-metric small,
.dashboard-system:has(.leave-workspace-marker) .business-metric small { color:var(--muted); font-size:9px; }
.dashboard-system:has(.team-dashboard-layout) .business-metric strong,
.dashboard-system:has(.team-record-layout) .business-metric strong,
.dashboard-system:has(.team-roles-layout) .business-metric strong,
.dashboard-system:has(.leave-workspace-marker) .business-metric strong { color:var(--ink); font:750 clamp(17px,1.4vw,21px)/1.15 var(--display); overflow-wrap:anywhere; }
.dashboard-system:has(.team-dashboard-layout) .business-metric em,
.dashboard-system:has(.team-record-layout) .business-metric em,
.dashboard-system:has(.team-roles-layout) .business-metric em,
.dashboard-system:has(.leave-workspace-marker) .business-metric em { color:var(--muted); font-size:9px; font-style:normal; line-height:1.35; white-space:normal; }

/* Team overview panels balance across the full content canvas. */
.team-dashboard-layout { grid-template-columns:repeat(3,minmax(0,1fr)); gap:15px; width:100%; align-items:stretch; }
.team-dashboard-layout .dashboard-column { display:grid; align-content:start; gap:15px; min-width:0; }
.team-dashboard-layout .dashboard-panel { min-width:0; height:auto; min-height:0; padding:17px; border:1px solid var(--line); border-radius:14px; background:var(--surface); box-shadow:var(--shadow-xs); }
.team-dashboard-layout > .dashboard-panel { height:100%; }
.team-dashboard-layout .dashboard-panel-heading { display:grid; align-content:start; gap:5px; padding-bottom:12px; border-bottom:1px solid var(--line-subtle); }
.team-dashboard-layout .dashboard-panel-heading h2 { margin:0; color:var(--ink); font:700 14px/1.3 var(--display); }
.team-dashboard-layout .dashboard-panel-heading p { margin:0; color:var(--muted); font-size:10px; line-height:1.5; }
.team-current-role { display:flex; align-items:flex-start; gap:12px; padding:14px; border:1px solid var(--line-subtle); border-radius:12px; background:var(--surface-sunken); }
.team-current-role > div { display:grid; min-width:0; gap:5px; }
.team-current-role > div > small { color:var(--muted); font-size:8px; font-weight:750; letter-spacing:.07em; }
.team-current-role > div > strong { color:var(--ink); font:750 16px var(--display); }
.team-current-role > div > p { margin:0; color:var(--muted); font-size:10px; line-height:1.5; }
.team-dashboard-layout .team-panel-action { margin-top:12px; }
.team-dashboard-layout .dashboard-breakdown { display:grid; gap:11px; padding-top:12px; }
.team-dashboard-layout .dashboard-breakdown-row { display:grid; gap:6px; }
.team-dashboard-layout .dashboard-breakdown-label { display:flex; justify-content:space-between; gap:10px; color:var(--ink-soft); font-size:10px; }
.team-dashboard-layout .dashboard-breakdown-label strong { color:var(--ink); font-variant-numeric:tabular-nums; }
.team-dashboard-layout .dashboard-breakdown-row > i { height:6px; overflow:hidden; border-radius:999px; background:var(--brand-tint); }
.team-dashboard-layout .dashboard-breakdown-row > i > b { display:block; height:100%; border-radius:inherit; background:var(--brand); }
.team-dashboard-layout .dashboard-link-list { display:grid; gap:7px; padding-top:11px; }
.team-dashboard-layout .dashboard-link-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:4px 10px; padding:11px 12px; border:1px solid var(--line-subtle); border-radius:10px; background:var(--surface); text-align:left; }
.team-dashboard-layout .dashboard-link-row:hover { border-color:var(--brand); background:var(--brand-mist); }
.team-dashboard-layout .dashboard-link-row strong { color:var(--ink); font-size:10px; }
.team-dashboard-layout .dashboard-link-row small { grid-column:1/-1; color:var(--muted); font-size:9px; line-height:1.4; }

/* Employee and user directories keep their register and inspector side by side. */
.team-record-layout { grid-template-columns:minmax(0,2fr) minmax(280px,.88fr); gap:15px; align-items:start; width:100%; }
.team-register-panel,.team-record-inspector,.team-role-list,.team-role-detail { min-width:0; padding:17px; border:1px solid var(--line); border-radius:14px; background:var(--surface); box-shadow:var(--shadow-xs); }
.team-register-toolbar { display:grid; grid-template-columns:minmax(230px,1fr) repeat(2,minmax(138px,.42fr)); align-items:center; gap:10px; margin:0 0 13px; padding:0 0 13px; border-bottom:1px solid var(--line-subtle); }
.team-register-toolbar .dashboard-search { width:100%; min-width:0; }
.team-register-toolbar .filter-button { width:100%; min-width:0; min-height:40px; }
.dashboard-system .team-register-table { width:100%; min-width:680px; border-collapse:separate; border-spacing:0; }
.team-register-table thead th { padding:11px 10px; border-bottom:1px solid var(--line); background:var(--surface-sunken); color:var(--muted); font-size:8px; font-weight:750; letter-spacing:.06em; white-space:nowrap; }
.team-register-table tbody td { padding:10px; border-bottom:1px solid var(--line-subtle); color:var(--ink-soft); font-size:10px; line-height:1.4; vertical-align:middle; }
.team-register-table tbody tr:last-child td { border-bottom:0; }
.team-register-table tbody tr.selected td { background:var(--brand-mist); }
.team-record-identity { display:flex; align-items:center; gap:9px; min-width:0; padding:2px 0; border:0; background:transparent; color:var(--ink); text-align:left; }
.team-record-identity strong { overflow:hidden; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.team-person-avatar { display:grid; width:33px; height:33px; flex:0 0 33px; place-items:center; border:1px solid var(--line); border-radius:50%; background:var(--brand-tint); color:var(--brand-dark); font-size:10px; font-weight:750; }
.team-person-avatar.large { width:48px; height:48px; flex-basis:48px; font-size:13px; }
.team-record-inspector { position:sticky; top:14px; display:grid; align-content:start; gap:14px; }
.team-inspector-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; padding-bottom:13px; border-bottom:1px solid var(--line-subtle); }
.team-inspector-heading > div { display:grid; min-width:0; gap:5px; }
.team-inspector-heading h2 { margin:0; color:var(--ink); font:750 17px/1.25 var(--display); overflow-wrap:anywhere; }
.team-inspector-heading .eyebrow { margin:0; color:var(--brand); font-size:8px; font-weight:750; letter-spacing:.08em; }
.team-person-summary { display:flex; align-items:center; gap:11px; padding:12px; border:1px solid var(--line-subtle); border-radius:11px; background:var(--surface-sunken); }
.team-person-summary > div { display:grid; min-width:0; gap:4px; }
.team-person-summary strong { color:var(--ink); font-size:11px; }
.team-person-summary small { color:var(--muted); font-size:9px; }
.team-record-inspector .team-detail-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.team-record-inspector .team-detail-grid > div { display:grid; align-content:start; gap:5px; min-width:0; padding:11px; border:1px solid var(--line-subtle); border-radius:10px; background:var(--surface); }
.team-record-inspector .team-detail-grid small { color:var(--muted); font-size:8px; }
.team-record-inspector .team-detail-grid strong { color:var(--ink); font-size:10px; overflow-wrap:anywhere; }
.team-record-inspector .team-policy-note,.team-policy-card,.team-access-empty { border:1px solid var(--line-subtle); border-radius:11px; background:var(--surface-sunken); }
.team-record-inspector .team-policy-note { margin:0; padding:12px; color:var(--muted); font-size:9px; line-height:1.55; }
.team-record-inspector .team-policy-card { display:flex; align-items:center; justify-content:space-between; gap:10px; min-width:0; padding:11px; }
.team-record-inspector .team-policy-card > div:first-child { display:grid; min-width:0; gap:4px; }
.team-record-inspector .team-policy-card > div:first-child strong { color:var(--ink); font-size:10px; }
.team-record-inspector .team-policy-card > div:first-child small { color:var(--muted); font-size:8px; line-height:1.4; }
.team-payroll-actions { display:flex; flex:0 0 auto; flex-wrap:wrap; justify-content:flex-end; gap:5px; }
.team-payroll-actions .secondary-button { min-height:30px; padding-inline:8px; font-size:8px; white-space:nowrap; }
.team-access-empty { display:grid; justify-items:start; gap:8px; min-height:245px; align-content:center; padding:24px; }
.team-access-empty h2 { margin:0; color:var(--ink); font:750 17px var(--display); }
.team-access-empty p { margin:0; color:var(--muted); font-size:10px; line-height:1.55; }
.team-filter-empty { margin:10px 0 0; padding:12px; border-radius:9px; background:var(--surface-sunken); color:var(--muted); font-size:10px; }

/* Role baseline reads as a governance view instead of a compressed permission list. */
.team-roles-layout { grid-template-columns:minmax(0,1fr); gap:14px; }
.team-role-list { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; }
.team-role-list-heading { padding:1px 2px 5px; }
.team-role-list-heading strong { color:var(--ink); font:750 13px var(--display); }
.team-role-list-heading small { color:var(--muted); font-size:9px; line-height:1.45; }
.team-role-option { min-height:72px; padding:11px 12px; border-color:var(--line-subtle); border-radius:11px; }
.team-role-option.active { border-color:var(--brand); background:var(--brand-mist); box-shadow:inset 3px 0 var(--brand); }
.team-role-copy strong { color:var(--ink); font-size:11px; }
.team-role-copy small { color:var(--muted); font-size:9px; }
.team-role-detail { grid-template-columns:repeat(2,minmax(0,1fr)); gap:13px; padding:19px; }
.team-role-detail .team-inspector-heading h2 { font-size:20px; }
.team-role-description { padding:14px 15px; font-size:11px; line-height:1.6; }
.team-role-capabilities { grid-template-columns:repeat(4,minmax(0,1fr)); gap:11px; }
.team-role-capability { min-height:118px; gap:7px; padding:13px; border-radius:11px; background:var(--surface); box-shadow:inset 0 3px var(--brand-tint); }
.team-role-capability > span { font-size:8px; }
.team-role-capability > strong { color:var(--brand-dark); font-size:12px; line-height:1.35; }
.team-role-capability > small { font-size:9px; line-height:1.5; }
.team-role-detail .team-policy-card { padding:15px; border-color:var(--line-subtle); border-radius:11px; background:var(--surface-sunken); }
.team-role-detail .team-policy-card h3 { font-size:11px; }
.team-role-detail .team-policy-card p { font-size:10px; line-height:1.6; }
.team-role-detail .team-policy-note { padding:12px 14px; font-size:9px; line-height:1.6; }

/* Leave uses the same four-card summary, roomy request tables and clear actions. */
.dashboard-system:has(.leave-workspace-marker) > .premium-workspace-panel { width:100%; margin:0 0 14px; padding:17px; border:1px solid var(--line); border-radius:14px; background:var(--surface); box-shadow:var(--shadow-xs); }
.dashboard-system:has(.leave-workspace-marker) .payroll-panel-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin:0 0 13px; padding-bottom:12px; border-bottom:1px solid var(--line-subtle); }
.dashboard-system:has(.leave-workspace-marker) .payroll-panel-heading h2 { margin:0; color:var(--ink); font:700 14px var(--display); }
.dashboard-system:has(.leave-workspace-marker) .payroll-panel-heading p { margin:5px 0 0; color:var(--muted); font-size:10px; line-height:1.5; }
.dashboard-system:has(.leave-workspace-marker) .module-table { width:100%; min-width:740px; border-collapse:separate; border-spacing:0; }
.dashboard-system:has(.leave-workspace-marker) .module-table th { padding:11px 10px; background:var(--surface-sunken); color:var(--muted); font-size:8px; letter-spacing:.06em; }
.dashboard-system:has(.leave-workspace-marker) .module-table td { padding:10px; border-bottom:1px solid var(--line-subtle); color:var(--ink-soft); font-size:10px; }
.dashboard-system:has(.leave-workspace-marker) .leave-request-actions { white-space:nowrap; }
.dashboard-system:has(.leave-workspace-marker) .leave-request-actions button { min-height:31px; margin:2px 4px 2px 0; padding-inline:9px; }
.leave-setup-panel { display:flex; align-items:center; gap:13px; margin:0 0 14px; padding:15px 17px; border:1px solid var(--line); border-radius:13px; background:var(--surface); box-shadow:var(--shadow-xs); }
.leave-setup-panel > div { display:grid; flex:1 1 auto; gap:5px; }
.leave-setup-panel h2 { margin:0; color:var(--ink); font:700 13px var(--display); }
.leave-setup-panel p { margin:0; color:var(--muted); font-size:10px; line-height:1.5; }
.leave-setup-panel .leave-setup-icon { display:grid; width:40px; height:40px; flex:0 0 40px; place-items:center; border-radius:12px; background:var(--brand-tint); color:var(--brand-dark); }
.leave-setup-panel.is-ready { border-color:color-mix(in srgb,var(--brand) 32%,var(--line)); background:var(--brand-mist); }
.dashboard-system:has(.leave-workspace-marker) > .team-policy-note { margin:2px 0 14px; padding:12px 14px; border:1px solid var(--line-subtle); border-radius:10px; background:var(--surface-sunken); color:var(--muted); font-size:9px; line-height:1.55; }

/* Team Chat uses teal accents with the message pane as the visual focus. */
.team-chat-layout.team-chat-whatsapp { grid-template-columns:minmax(230px,.82fr) minmax(410px,1.8fr) minmax(235px,.82fr); gap:13px; min-height:min(72vh,790px); }
.team-chat-sidebar,.team-chat-conversation-panel,.team-chat-info-panel { min-width:0; border:1px solid var(--line); border-radius:14px; background:var(--surface); box-shadow:var(--shadow-xs); }
.team-chat-sidebar { padding:0; }
.team-chat-sidebar-heading,.team-chat-conversation-heading { display:flex; align-items:center; gap:11px; min-height:64px; padding:13px 15px; border-bottom:1px solid var(--line-subtle); }
.team-chat-sidebar-heading { justify-content:space-between; }
.team-chat-sidebar-heading h2,.team-chat-conversation-heading h2,.team-chat-info-panel h2 { margin:0; color:var(--ink); font:700 13px var(--display); }
.team-chat-section-label { padding:12px 14px 6px; color:var(--muted); font-size:8px; font-weight:750; letter-spacing:.07em; text-transform:uppercase; }
.team-chat-conversation-list,.team-chat-people-list { display:grid; align-content:start; gap:4px; flex:0 1 auto; padding:7px; }
.team-chat-conversation-option,.team-chat-person-option { display:flex; align-items:center; gap:10px; min-height:56px; padding:8px 10px; border:1px solid transparent; border-radius:10px; background:transparent; color:var(--ink-soft); text-align:left; }
.team-chat-conversation-option:hover,.team-chat-person-option:hover { background:var(--surface-sunken); }
.team-chat-conversation-option.active { border-color:var(--line); border-inline-start:3px solid var(--brand); background:var(--brand-mist); box-shadow:none; }
.team-chat-conversation-copy,.team-chat-person-copy { display:grid; flex:1 1 auto; min-width:0; gap:4px; }
.team-chat-conversation-copy strong,.team-chat-person-copy strong { overflow:hidden; color:var(--ink); font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.team-chat-conversation-copy small,.team-chat-person-copy small { overflow:hidden; color:var(--muted); font-size:8px; text-overflow:ellipsis; white-space:nowrap; }
.team-chat-conversation-meta { display:grid; justify-items:end; gap:5px; color:var(--muted); font-size:8px; }
.chat-unread-count { display:grid; min-width:18px; height:18px; place-items:center; padding:0 5px; border-radius:999px; background:var(--brand); color:var(--surface); font-size:8px; }
.team-chat-conversation-panel { min-height:0; }
.team-chat-conversation-heading { flex:0 0 auto; }
.team-chat-heading-copy { display:grid; min-width:0; flex:1 1 auto; gap:4px; }
.team-chat-heading-copy p { margin:0; color:var(--muted); font-size:9px; }
.team-chat-message-stream { display:flex; flex:1 1 auto; flex-direction:column; gap:10px; padding:18px; background:linear-gradient(180deg,var(--surface-sunken),var(--surface)); }
.team-chat-message { display:flex; max-width:100%; align-self:flex-start; }
.team-chat-message.mine { align-self:flex-end; }
.team-chat-bubble { max-width:min(76%,680px); padding:10px 12px; border:1px solid var(--line); border-radius:12px 12px 12px 4px; background:var(--surface); color:var(--ink-soft); box-shadow:0 1px 3px rgba(15,56,67,.06); }
.team-chat-message.mine .team-chat-bubble { border-color:var(--brand-tint); border-radius:12px 12px 4px 12px; background:var(--brand-mist); }
.team-chat-message-sender { display:block; margin:0 0 5px; color:var(--brand-dark); font-size:9px; }
.team-chat-bubble p { margin:0; font-size:10px; line-height:1.55; overflow-wrap:anywhere; }
.team-chat-bubble time { display:block; margin-top:5px; color:var(--muted); font-size:8px; text-align:right; }
.team-chat-composer { display:flex; align-items:flex-end; gap:9px; margin:0; padding:12px; border-top:1px solid var(--line-subtle); background:var(--surface); }
.team-chat-composer textarea { min-height:42px; max-height:130px; resize:vertical; border-radius:10px; }
.chat-send-button { display:grid; width:42px; height:42px; flex:0 0 42px; place-items:center; border:1px solid var(--brand); border-radius:11px; background:var(--brand); color:var(--surface); }
.chat-send-button:hover { border-color:var(--brand-hover); background:var(--brand-hover); }
.chat-send-button svg { width:18px; height:18px; fill:currentColor; }
.team-chat-info-panel { gap:12px; align-content:start; padding:17px; }
.team-chat-info-panel .eyebrow { margin:0; color:var(--brand); font-size:8px; font-weight:750; letter-spacing:.08em; }
.team-chat-info-panel p:not(.eyebrow) { margin:0; color:var(--muted); font-size:9px; line-height:1.55; }
.team-chat-empty { display:grid; align-content:center; justify-items:center; flex:1 1 auto; gap:8px; padding:24px; color:var(--muted); text-align:center; }
.team-chat-empty h3 { margin:0; color:var(--ink); font:700 14px var(--display); }
.team-chat-empty p { max-width:380px; margin:0; font-size:10px; line-height:1.55; }
.team-chat-readonly-note { margin:0; padding:12px 15px; border-top:1px solid var(--line-subtle); color:var(--muted); font-size:9px; }
.team-chat-toolbar { gap:11px; margin:0 0 13px; }
.team-chat-toolbar .dashboard-search { flex:1 1 320px; }

/* Invoice totals now have a clear label/value rhythm and line items fit more screens. */
.invoice-items-head,.invoice-item-row { grid-template-columns:minmax(112px,1.8fr) minmax(48px,.55fr) minmax(65px,.8fr) minmax(62px,.65fr) minmax(52px,.5fr) minmax(75px,.9fr) 30px; gap:6px; min-width:560px; padding:9px 8px; }
.invoice-items-head { font-size:8px; }
.invoice-summary-totals { display:grid; align-content:start; gap:2px; min-width:0; padding:5px 12px; border:1px solid var(--line-subtle); border-radius:10px; background:var(--surface-sunken); }
.invoice-summary-totals > div { display:flex; align-items:baseline; justify-content:space-between; gap:12px; min-width:0; padding:9px 2px; border-bottom:1px solid var(--line-subtle); color:var(--muted); font-size:10px; line-height:1.4; }
.invoice-summary-totals > div:last-child { border-bottom:0; }
.invoice-summary-totals > div > span { min-width:0; color:var(--muted); }
.invoice-summary-totals > div > strong { flex:0 0 auto; color:var(--ink); font-size:10px; font-variant-numeric:tabular-nums; text-align:right; white-space:nowrap; }
.invoice-summary-totals > .invoice-summary-grand { margin:4px -5px 2px; padding:11px 10px; border:1px solid var(--brand-tint); border-radius:8px; background:var(--brand-mist); color:var(--brand-dark); font-weight:750; }
.invoice-summary-totals > .invoice-summary-grand > span,.invoice-summary-totals > .invoice-summary-grand > strong { color:var(--brand-dark); font-size:11px; font-weight:750; }
body:has(.invoice-editor-workspace) #aiAssistantWidget { display:none !important; }

@media(max-width:1180px) {
  .team-chat-layout.team-chat-whatsapp { grid-template-columns:minmax(220px,.8fr) minmax(0,1.6fr); }
  .team-chat-layout.team-chat-whatsapp > .team-chat-info-panel { grid-column:1/-1; min-height:0; }
  .team-chat-layout.team-chat-whatsapp > .team-chat-info-panel:empty { display:none; }
  .team-role-capabilities { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:960px) {
  .team-record-layout { grid-template-columns:minmax(0,1fr); }
  .team-record-inspector { position:static; }
  .team-dashboard-layout { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:700px) {
  .dashboard-system:has(.team-dashboard-layout) > .business-metric-grid,
  .dashboard-system:has(.team-record-layout) > .business-metric-grid,
  .dashboard-system:has(.team-roles-layout) > .business-metric-grid,
  .dashboard-system:has(.leave-workspace-marker) > .business-metric-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
  .team-dashboard-layout,.team-chat-layout.team-chat-whatsapp { grid-template-columns:minmax(0,1fr); }
  .team-chat-layout.team-chat-whatsapp > .team-chat-info-panel { grid-column:auto; }
  .team-register-toolbar { grid-template-columns:minmax(0,1fr); }
  .team-role-list { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .team-role-detail { grid-template-columns:minmax(0,1fr); }
  .team-role-detail > .team-inspector-heading,.team-role-detail > .team-role-description,.team-role-detail > .team-policy-note,.team-role-capabilities { grid-column:1; }
  .leave-setup-panel { align-items:flex-start; flex-wrap:wrap; }
  .leave-setup-panel > div { flex-basis:calc(100% - 58px); }
  .invoice-summary-grid { grid-template-columns:minmax(0,1fr); }
  .invoice-items-head,.invoice-item-row { min-width:540px; }
}
@media(max-width:460px) {
  .team-role-list,.team-role-capabilities { grid-template-columns:minmax(0,1fr); }
  .dashboard-system:has(.team-dashboard-layout) > .business-metric-grid,
  .dashboard-system:has(.team-record-layout) > .business-metric-grid,
  .dashboard-system:has(.team-roles-layout) > .business-metric-grid,
  .dashboard-system:has(.leave-workspace-marker) > .business-metric-grid { grid-template-columns:minmax(0,1fr); }
  .invoice-footer-actions { justify-content:stretch; width:100%; }
  .invoice-footer-actions > button { flex:1 1 auto; }
}

/* Work registers share one clear search, filter and results surface. */
.work-list-column {
  display:flex;
  flex-direction:column;
  min-width:0;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--surface);
  box-shadow:var(--shadow-xs);
}
.work-toolbar {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:10px 12px;
  margin:0;
  padding:12px 14px;
  border-bottom:1px solid var(--line-subtle);
  background:var(--surface);
}
.work-search {
  display:flex;
  align-items:center;
  gap:9px;
  width:100%;
  min-width:0;
  min-height:40px;
  padding:0 11px;
  border:1px solid var(--line);
  border-radius:var(--radius-sm);
  background:var(--surface-sunken);
  color:var(--brand);
  transition:border-color var(--duration-fast) ease,box-shadow var(--duration-fast) ease,background-color var(--duration-fast) ease;
}
.work-search:focus-within { border-color:var(--brand); background:var(--surface); box-shadow:0 0 0 3px var(--brand-tint); }
.work-search > span { flex:0 0 auto; color:var(--muted); font-size:16px; line-height:1; }
.work-search input { width:100%; min-width:0; min-height:36px; padding:0; border:0; outline:0; background:transparent; color:var(--ink); font-size:11px; box-shadow:none; }
.work-search input:focus { outline:0; box-shadow:none; }
.work-search input::placeholder { color:var(--muted); }
.work-record-count {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:82px;
  min-height:32px;
  padding:0 10px;
  border:1px solid var(--line);
  border-radius:999px;
  background:var(--surface-sunken);
  color:var(--ink-soft);
  font-size:10px;
  font-weight:650;
  white-space:nowrap;
  font-variant-numeric:tabular-nums;
}
.work-scopebar {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:6px;
  overflow:auto;
  margin:0;
  padding:10px 14px;
  border-bottom:1px solid var(--line-subtle);
}
.work-scope-button { min-height:30px; padding:6px 10px; border-radius:999px; font-size:9px; }
.work-record-list { min-width:0; padding:12px; }
.work-empty-state {
  display:grid;
  align-content:center;
  justify-items:start;
  gap:8px;
  min-height:230px;
  padding:24px;
  border:1px dashed var(--line);
  border-radius:var(--radius);
  background:var(--surface-sunken);
  text-align:left;
}
.work-empty-state > span { display:grid; width:40px; height:40px; place-items:center; margin-bottom:2px; border-radius:11px; background:var(--brand-tint); color:var(--brand-dark); font-size:18px; }
.work-empty-state h2 { margin:0; color:var(--ink); font:700 14px var(--display); }
.work-empty-state p { max-width:480px; margin:0; color:var(--muted); font-size:11px; line-height:1.55; }
.work-empty-state .primary-button { margin-top:5px; }
.work-filter-empty { margin:0; padding:0 14px 14px; color:var(--muted); font-size:10px; }
.tasks-workspace #workRecordList,.documents-workspace #workRecordList { padding:0 12px 12px; }
.calendar-workspace #workRecordList { padding:12px 14px 14px; }

/* Team Chat keeps discovery with the conversation list and gives messages room. */
.team-chat-layout.team-chat-whatsapp {
  grid-template-columns:minmax(250px,.9fr) minmax(420px,1.8fr) minmax(245px,.82fr);
  align-items:stretch;
  gap:12px;
  min-height:min(70vh,740px);
}
.team-chat-sidebar,.team-chat-conversation-panel,.team-chat-info-panel { border-radius:12px; box-shadow:var(--shadow-xs); }
.team-chat-sidebar { min-height:0; }
.team-chat-sidebar-heading { min-height:60px; padding:12px 14px; }
.team-chat-sidebar-heading h2 { font-size:14px; }
.chat-new-group-button { display:grid; width:32px; height:32px; flex:0 0 32px; place-items:center; border:1px solid var(--line); border-radius:9px; background:var(--surface); color:var(--brand); font-size:17px; font-weight:500; }
.chat-new-group-button:hover { border-color:var(--brand); background:var(--brand-mist); }
.team-chat-sidebar-toolbar { display:grid; gap:8px; padding:12px 12px 9px; border-bottom:1px solid var(--line-subtle); }
.team-chat-search { display:flex; align-items:center; gap:8px; min-width:0; min-height:38px; padding:0 10px; border:1px solid var(--line); border-radius:9px; background:var(--surface-sunken); color:var(--muted); }
.team-chat-search:focus-within { border-color:var(--brand); background:var(--surface); box-shadow:0 0 0 3px var(--brand-tint); }
.team-chat-search > span { flex:0 0 auto; font-size:15px; line-height:1; }
.team-chat-search input { width:100%; min-width:0; min-height:34px; padding:0; border:0; outline:0; background:transparent; color:var(--ink); font-size:10px; box-shadow:none; }
.team-chat-search input:focus { outline:0; box-shadow:none; }
.team-chat-search input::placeholder { color:var(--muted); }
.team-chat-count { color:var(--muted); font-size:9px; line-height:1.35; }
.team-chat-conversation-list { flex:1 1 auto; min-height:140px; gap:2px; overflow-y:auto; padding:7px 8px; }
.team-chat-conversation-option,.team-chat-person-option { min-height:62px; gap:10px; padding:8px; border-radius:9px; }
.team-chat-conversation-option { border-bottom:1px solid var(--line-subtle); }
.team-chat-conversation-option:hover,.team-chat-person-option:hover { background:var(--surface-sunken); }
.team-chat-conversation-option.active { border-color:transparent; border-inline-start:3px solid var(--brand); background:var(--brand-mist); }
.chat-avatar { display:grid; width:40px; height:40px; flex:0 0 40px; place-items:center; overflow:hidden; border-radius:50%; background:var(--brand-tint); color:var(--brand-dark); font-size:12px; font-weight:750; }
.chat-avatar.everyone { background:var(--brand); color:var(--brand-ink); }
.chat-avatar.pending { background:var(--surface-sunken); color:var(--muted); }
.team-chat-conversation-copy { gap:4px; }
.team-chat-conversation-copy strong,.team-chat-person-copy strong { font-size:11px; }
.team-chat-conversation-copy small,.team-chat-person-copy small { font-size:9px; line-height:1.35; }
.team-chat-conversation-meta { gap:6px; font-size:9px; }
.team-chat-section-label { padding:11px 14px 5px; border-top:1px solid var(--line-subtle); font-size:8px; }
.team-chat-people-list { flex:0 0 auto; max-height:190px; gap:2px; overflow-y:auto; padding:5px 8px 9px; }
.team-chat-list-empty { margin:0; padding:10px 8px 12px; color:var(--muted); font-size:9px; line-height:1.5; }
.team-chat-conversation-heading { min-height:68px; padding:12px 16px; }
.team-chat-conversation-heading .chat-avatar { width:42px; height:42px; flex-basis:42px; }
.team-chat-heading-copy h2 { margin:0; color:var(--ink); font:700 14px var(--display); }
.team-chat-heading-copy p { font-size:10px; }
.team-chat-message-stream { gap:12px; padding:20px clamp(14px,3vw,30px); background:var(--surface-sunken); }
.team-chat-bubble { max-width:min(76%,680px); padding:10px 13px; border-radius:14px 14px 14px 5px; }
.team-chat-message.mine .team-chat-bubble { border-color:color-mix(in srgb,var(--brand) 20%,var(--line)); border-radius:14px 14px 5px 14px; background:var(--brand-mist); }
.team-chat-message-sender { margin-bottom:5px; font-size:10px; }
.team-chat-bubble p { font-size:12px; line-height:1.5; }
.team-chat-bubble time { margin-top:6px; font-size:9px; }
.team-chat-empty { gap:10px; }
.team-chat-empty h3 { font-size:15px; }
.team-chat-empty p { font-size:11px; line-height:1.6; }
.chat-empty-mark { display:grid; width:50px; height:50px; place-items:center; margin-bottom:5px; border:1px solid var(--line); border-radius:50%; background:var(--surface); color:var(--brand); }
.chat-empty-mark svg { width:23px; height:23px; fill:none; stroke:currentColor; stroke-linecap:round; stroke-linejoin:round; stroke-width:1.6; }
.team-chat-composer { align-items:center; gap:10px; padding:12px 14px; }
.team-chat-composer textarea { width:100%; min-width:0; min-height:44px; flex:1 1 auto; padding:11px 14px; border:1px solid var(--line); border-radius:22px; background:var(--surface-sunken); color:var(--ink); font-size:11px; line-height:1.4; }
.team-chat-composer textarea:focus { border-color:var(--brand); outline:0; box-shadow:0 0 0 3px var(--brand-tint); }
.chat-send-button { width:44px; height:44px; flex-basis:44px; border-radius:50%; }
.chat-send-button svg { width:17px; height:17px; }
.team-chat-info-panel { align-content:start; gap:14px; padding:15px; }
.team-chat-info-identity { display:grid; justify-items:center; gap:7px; padding:8px 0 15px; border-bottom:1px solid var(--line-subtle); text-align:center; }
.team-chat-info-identity .eyebrow { margin:0; font-size:8px; }
.team-chat-info-identity h2 { max-width:100%; overflow-wrap:anywhere; font-size:15px; }
.team-chat-info-kind { margin:0; color:var(--muted); font-size:9px; }
.chat-avatar.info-avatar { width:64px; height:64px; margin-bottom:2px; font-size:17px; }
.team-chat-info-summary { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.team-info-stat { display:grid; align-content:start; gap:6px; min-width:0; min-height:58px; padding:9px; border:1px solid var(--line-subtle); border-radius:9px; background:var(--surface-sunken); }
.team-info-stat > span { color:var(--muted); font-size:8px; }
.team-info-stat > strong { overflow-wrap:anywhere; color:var(--ink); font-size:10px; line-height:1.35; }
.team-chat-group-members { display:grid; gap:3px; max-height:300px; overflow:auto; padding-top:6px; border-top:1px solid var(--line-subtle); }
.team-chat-group-member { display:flex; align-items:center; gap:9px; min-width:0; padding:7px 2px; border-bottom:1px solid var(--line-subtle); }
.team-chat-group-member .chat-avatar { width:34px; height:34px; flex-basis:34px; font-size:10px; }
.team-chat-group-member > span:nth-child(2) { display:grid; flex:1 1 auto; min-width:0; gap:3px; }
.team-chat-group-member > span:nth-child(2) strong { overflow:hidden; color:var(--ink); font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.team-chat-group-member > span:nth-child(2) small { overflow:hidden; color:var(--muted); font-size:8px; text-overflow:ellipsis; white-space:nowrap; }
.chat-remove-member { display:grid; width:26px; height:26px; flex:0 0 26px; place-items:center; border:0; border-radius:50%; background:transparent; color:var(--muted); font-size:16px; }
.chat-remove-member:hover { background:color-mix(in srgb,var(--danger) 9%,var(--surface)); color:var(--danger); }
.chat-add-member-wide { width:100%; }
.team-chat-info-panel .team-policy-note { margin:0; padding:10px; border:1px solid var(--line-subtle); border-radius:9px; background:var(--surface-sunken); font-size:9px; line-height:1.55; }
.team-chat-toolbar { display:none; }

@media(max-width:700px) {
  .work-toolbar { grid-template-columns:minmax(0,1fr); }
  .work-record-count { justify-self:start; }
  .work-scopebar { flex-wrap:nowrap; }
  .work-empty-state { min-height:190px; padding:18px; }
  .team-chat-sidebar { min-height:360px; }
  .team-chat-conversation-panel { min-height:420px; }
  .team-chat-info-panel { min-height:0; }
  .team-chat-message-stream { min-height:280px; }
}

@media(max-width:460px) {
  .work-toolbar,.work-scopebar { padding-inline:10px; }
  .work-record-list,.calendar-workspace #workRecordList { padding:10px; }
  .team-chat-sidebar-toolbar { padding-inline:10px; }
  .team-chat-info-summary { grid-template-columns:minmax(0,1fr); }
}

.pdf-editor-app { display:flex; flex-direction:column; min-height:calc(100vh - 112px); }
.pdf-editor-frame-wrap { flex:1 1 auto; min-height:760px; overflow:hidden; border:1px solid var(--line); border-radius:12px; background:#fff; }
.pdf-editor-frame { display:block; width:100%; height:calc(100vh - 224px); min-height:760px; border:0; background:#fff; }
.pdf-editor-notice { max-width:760px; }
.pdf-editor-notice h2 { margin:0 0 8px; }
.pdf-editor-notice p { color:var(--text-muted); }
@media(max-width:700px) {
  .pdf-editor-app { min-height:calc(100vh - 96px); }
  .pdf-editor-frame-wrap,.pdf-editor-frame { min-height:calc(100vh - 215px); }
  .pdf-editor-frame { height:calc(100vh - 215px); }
}

/* Selected invoices open as a readable document workspace. */
.invoice-document-open > .business-metric-grid,
.invoice-document-open .business-list-column,
.invoice-document-open .business-inspector-related { display:none; }
.invoice-document-open .business-list-detail { grid-template-columns:minmax(0,1fr); }
.invoice-document-open .business-inspector { position:static; max-height:none; overflow:visible; border:0; background:transparent; }
.invoice-document-open .business-inspector-header { align-items:center; padding:10px 0 14px; border:0; }
.invoice-document-open .business-detail-tabs { padding-inline:0; }
.invoice-document-open .business-inspector-body { display:block; padding:18px 0; }
.invoice-document-open .invoice-detail-document { width:min(100%,1100px); min-height:680px; margin:0 auto; gap:26px; padding:clamp(24px,4vw,52px); border-color:var(--line); border-radius:14px; background:var(--surface); box-shadow:0 18px 55px rgb(17 48 63 / 9%); }
.invoice-document-open .invoice-detail-logo { display:block; width:auto; max-width:210px; height:auto; max-height:72px; object-fit:contain; object-position:left center; }
.invoice-document-open .invoice-brand-mark[hidden] { display:none; }
.invoice-document-open .invoice-detail-brand { gap:18px; padding-bottom:20px; }
.invoice-document-open .invoice-detail-brand strong { font-size:15px; }
.invoice-document-open .invoice-detail-brand small { font-size:11px; }
.invoice-document-open .invoice-detail-number h3 { font-size:25px; }
.invoice-document-open .invoice-detail-parties { grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr); gap:16px; }
.invoice-document-open .invoice-detail-parties > section { gap:8px; padding:18px; }
.invoice-document-open .invoice-detail-parties small,.invoice-document-open .invoice-detail-foot small { font-size:9px; }
.invoice-document-open .invoice-detail-parties strong { font-size:13px; }
.invoice-document-open .invoice-detail-parties span { font-size:11px; }
.invoice-document-open .invoice-detail-lineitems h3 { margin-bottom:12px; font-size:14px; }
.invoice-document-open .invoice-detail-lineitems table { width:100%; min-width:600px; }
.invoice-document-open .invoice-detail-totals { width:min(100%,380px); gap:10px; }
.invoice-document-open .invoice-detail-totals > div { font-size:12px; }
.invoice-document-open .invoice-detail-totals .invoice-detail-grand,.invoice-document-open .invoice-detail-totals .invoice-detail-balance { padding:13px 15px; }
.invoice-document-open .invoice-detail-foot p { font-size:12px; }
.invoice-back-list { white-space:nowrap; }
@media(max-width:700px) {
  .invoice-document-open .invoice-detail-document { min-height:0; padding:20px; }
  .invoice-document-open .invoice-detail-parties { grid-template-columns:minmax(0,1fr); }
}

/* Keep CRM report metrics on one row at desktop workspace widths. */
.report-metric-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
@media(max-width:700px) {
  .report-metric-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:420px) {
  .report-metric-grid { grid-template-columns:minmax(0,1fr); }
}

/* Invoice creation uses the full workspace width without a live preview pane. */
.invoice-editor-layout { grid-template-columns:minmax(0,1fr); }
.invoice-preview-column { display:none; }

/* AI settings: keep provider setup and data access in a deliberate, readable layout. */
.settings-ai-workspace { display:grid; gap:16px; width:100%; min-width:0; }
.settings-ai-intro { display:flex; align-items:center; justify-content:space-between; gap:18px; min-width:0; padding:19px 21px; border:1px solid var(--line); border-radius:var(--radius-xl); background:linear-gradient(115deg,var(--surface),var(--brand-mist)); box-shadow:var(--shadow-xs); }
.settings-ai-intro > div { min-width:0; }
.settings-ai-intro .eyebrow { margin:0 0 5px; color:var(--brand); font-size:9px; font-weight:750; letter-spacing:.1em; }
.settings-ai-intro h2 { margin:0 0 6px; color:var(--ink); font:700 19px/1.3 var(--display); letter-spacing:-.025em; }
.settings-ai-intro p:not(.eyebrow) { max-width:720px; margin:0; color:var(--muted); font-size:11px; line-height:1.55; }
.settings-ai-intro > .status-badge { flex:0 0 auto; max-width:min(100%,320px); padding:8px 11px; border:1px solid var(--line); border-radius:9px; background:var(--surface); font-size:10px; line-height:1.4; white-space:normal; }
.settings-workspace .settings-ai-config-grid { grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr); align-items:start; gap:14px; }
.settings-ai-workspace .settings-ai-config-grid > * { min-width:0; }
.settings-workspace-main>#settingsSectionContent #settingsAIProviderForm { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); align-items:start; gap:12px 14px; margin:0; }
.settings-workspace-main>#settingsSectionContent #settingsAIProviderForm > * { min-width:0; }
.settings-workspace-main>#settingsSectionContent #settingsAIProviderForm > .settings-section-title,
.settings-workspace-main>#settingsSectionContent #settingsAIProviderForm > .settings-ai-enable,
.settings-workspace-main>#settingsSectionContent #settingsAIProviderForm > .settings-warning,
.settings-workspace-main>#settingsSectionContent #settingsAIProviderForm > .settings-actions { grid-column:1/-1; }
.settings-workspace-main>#settingsSectionContent #settingsAIProviderForm > .form-field { min-width:0; }
.settings-workspace-main>#settingsSectionContent #settingsAIProviderForm label { min-width:0; }
.settings-workspace-main>#settingsSectionContent #settingsAIProviderForm .settings-check { align-items:flex-start; gap:9px; margin:0; padding:10px 11px; border:1px solid var(--line-subtle); border-radius:9px; background:var(--surface-sunken); color:var(--ink-soft); font-size:10px; line-height:1.45; }
.settings-workspace-main>#settingsSectionContent #settingsAIProviderForm .settings-check input { flex:0 0 auto; margin:2px 0 0; }
.settings-workspace-main>#settingsSectionContent #settingsAIProviderForm .settings-ai-enable > span { display:grid; gap:4px; min-width:0; }
.settings-workspace-main>#settingsSectionContent #settingsAIProviderForm .settings-ai-enable small { color:var(--muted); font-size:9px; line-height:1.45; }
.settings-workspace-main>#settingsSectionContent #settingsAIProviderForm .settings-warning { margin:0; padding:11px 12px; border:1px solid var(--line); border-radius:9px; background:var(--brand-mist); color:var(--ink-soft); font-size:9.5px; line-height:1.55; }
.settings-workspace-main>#settingsSectionContent #settingsAIProviderForm .settings-actions { align-items:center; margin:0; padding-top:12px; }
.settings-workspace-main>#settingsSectionContent #settingsAIProviderForm .settings-actions > span { min-width:0; }
.settings-ai-side { display:grid; align-content:start; gap:14px; min-width:0; }
.settings-workspace-main>#settingsSectionContent .settings-ai-side > .settings-form { display:grid; align-content:start; gap:10px; min-width:0; margin:0; }
.settings-workspace-main>#settingsSectionContent .settings-ai-side .settings-section-title { margin-bottom:2px; }
.settings-workspace-main>#settingsSectionContent .settings-ai-side .settings-stat-row { min-width:0; min-height:43px; margin:0; padding:8px 10px; border:1px solid var(--line-subtle); border-radius:8px; background:var(--surface-sunken); font-size:10px; }
.settings-workspace-main>#settingsSectionContent .settings-ai-side .settings-stat-row strong { min-width:0; color:var(--brand-dark); font-size:10px; overflow-wrap:anywhere; }
.settings-workspace-main>#settingsSectionContent #settingsAIForm { display:grid; gap:10px; min-width:0; margin:3px 0 0; }
.settings-ai-area-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; min-width:0; margin:0; padding:12px; border:1px solid var(--line); border-radius:10px; background:var(--surface-sunken); }
.settings-ai-area-grid legend { padding:0 6px; color:var(--ink-soft); font-size:10px; font-weight:700; }
.settings-workspace-main>#settingsSectionContent .settings-ai-area { display:grid; grid-template-columns:15px minmax(0,1fr); align-items:start; gap:8px; min-width:0; margin:0; padding:9px; border:1px solid var(--line-subtle); border-radius:8px; background:var(--surface); color:var(--ink-soft); cursor:pointer; }
.settings-workspace-main>#settingsSectionContent .settings-ai-area input { width:14px; height:14px; margin:2px 0 0; }
.settings-ai-area > span { display:grid; gap:3px; min-width:0; }
.settings-ai-area strong { color:var(--ink); font-size:10px; font-weight:700; }
.settings-ai-area small { color:var(--muted); font-size:8.5px; line-height:1.35; }
.settings-ai-area:has(input:checked) { border-color:color-mix(in srgb,var(--brand) 25%,var(--line)); background:var(--brand-mist); }
.settings-ai-workspace .settings-ai-side .settings-actions { margin-top:1px; padding-top:11px; }
.settings-ai-privacy .settings-field-help { margin:0; font-size:9.5px; line-height:1.55; }
.settings-ai-privacy > .secondary-button { justify-self:start; }
.settings-ai-workspace > .settings-field-help { margin:0; color:var(--muted); font-size:9.5px; line-height:1.55; }
@media(max-width:960px) {
  .settings-workspace .settings-ai-config-grid { grid-template-columns:minmax(0,1fr); }
  .settings-ai-side { grid-template-columns:repeat(2,minmax(0,1fr)); align-items:start; }
}
@media(max-width:700px) {
  .settings-ai-intro { align-items:flex-start; flex-direction:column; padding:15px; }
  .settings-ai-intro > .status-badge { max-width:100%; }
  .settings-workspace-main>#settingsSectionContent #settingsAIProviderForm { grid-template-columns:minmax(0,1fr); gap:11px; }
  .settings-workspace-main>#settingsSectionContent #settingsAIProviderForm > .settings-section-title,
  .settings-workspace-main>#settingsSectionContent #settingsAIProviderForm > .settings-ai-enable,
  .settings-workspace-main>#settingsSectionContent #settingsAIProviderForm > .settings-warning,
  .settings-workspace-main>#settingsSectionContent #settingsAIProviderForm > .settings-actions { grid-column:1; }
  .settings-ai-side { grid-template-columns:minmax(0,1fr); }
}
@media(max-width:420px) {
  .settings-ai-area-grid { grid-template-columns:minmax(0,1fr); }
}

/* Backup & Restore: clear status cards, aligned controls, and a responsive archive history. */
.backup-workspace { display:grid; gap:14px; width:100%; min-width:0; }
.settings-workspace .backup-summary-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; width:100%; min-width:0; }
.backup-summary-card { display:grid; align-content:start; gap:6px; min-width:0; min-height:108px; margin:0; padding:15px 16px; border:1px solid var(--line); border-radius:var(--radius-lg); background:var(--surface); box-shadow:var(--shadow-xs); }
.backup-summary-card > span { color:var(--muted); font-size:10px; font-weight:650; line-height:1.4; }
.backup-summary-card > strong { min-width:0; overflow-wrap:anywhere; color:var(--ink); font-size:20px; font-weight:700; line-height:1.25; letter-spacing:-.025em; }
.backup-summary-card > small { min-width:0; color:var(--muted); font-size:9px; line-height:1.45; }
.settings-workspace .backup-main-grid { grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); align-items:stretch; gap:14px; }
.backup-main-grid > .settings-form,
.backup-portable-grid > .settings-form { display:grid; align-content:start; gap:14px; min-width:0; margin:0; padding:18px; border:1px solid var(--line); border-radius:var(--radius-lg); background:var(--surface); box-shadow:var(--shadow-xs); }
.backup-main-grid .settings-section-title,
.backup-portable-grid .settings-section-title { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; min-width:0; margin:0; padding:0 0 12px; border-bottom:1px solid var(--line-subtle); }
.backup-main-grid .settings-section-title > div,
.backup-portable-grid .settings-section-title > div { min-width:0; }
.backup-main-grid .settings-section-title h2,
.backup-portable-grid .settings-section-title h2 { margin:0 0 5px; color:var(--ink); font-size:13px; font-weight:700; line-height:1.4; }
.backup-main-grid .settings-section-title p,
.backup-portable-grid .settings-section-title p { max-width:620px; margin:0; color:var(--muted); font-size:10px; line-height:1.5; }
.backup-main-grid .settings-section-title > .status-badge { flex:0 0 auto; max-width:42%; white-space:normal; text-align:center; }
.settings-workspace-main>#settingsSectionContent [data-backup-workspace] #settingsBackupConfigForm { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); align-items:start; gap:12px; min-width:0; margin:0; }
.settings-workspace-main>#settingsSectionContent [data-backup-workspace] #settingsBackupConfigForm > * { min-width:0; }
.settings-workspace-main>#settingsSectionContent [data-backup-workspace] #settingsBackupConfigForm > .full { grid-column:1/-1; }
.settings-workspace-main>#settingsSectionContent [data-backup-workspace] #settingsBackupConfigForm [data-backup-time-field][hidden] { display:none!important; }
.settings-workspace-main>#settingsSectionContent [data-backup-workspace] #settingsBackupConfigForm .form-field { min-width:0; gap:6px; }
.settings-workspace-main>#settingsSectionContent [data-backup-workspace] #settingsBackupConfigForm .form-field > span { color:var(--ink-soft); font-size:10px; font-weight:650; line-height:1.4; }
.settings-workspace-main>#settingsSectionContent [data-backup-workspace] #settingsBackupConfigForm input:not([type="checkbox"]),
.settings-workspace-main>#settingsSectionContent [data-backup-workspace] #settingsBackupConfigForm select,
.backup-run-row input,
.backup-portable-grid input[type="file"] { width:100%; min-width:0; min-height:40px; padding:9px 11px; border:1px solid var(--line); border-radius:8px; background:var(--surface-sunken); color:var(--ink); font-size:11px; }
.settings-workspace-main>#settingsSectionContent [data-backup-workspace] #settingsBackupConfigForm .settings-check,
.backup-portable-grid .settings-check { display:flex; align-items:flex-start; gap:9px; min-width:0; margin:0; padding:10px 11px; border:1px solid var(--line-subtle); border-radius:9px; background:var(--surface-sunken); color:var(--ink-soft); font-size:10px; font-weight:500; line-height:1.45; }
.settings-workspace-main>#settingsSectionContent [data-backup-workspace] #settingsBackupConfigForm .settings-check input,
.backup-portable-grid .settings-check input { flex:0 0 auto; width:15px; height:15px; margin:1px 0 0; }
.settings-workspace-main>#settingsSectionContent [data-backup-workspace] #settingsBackupConfigForm .settings-field-help { margin:0; color:var(--muted); font-size:9px; line-height:1.5; }
.settings-workspace-main>#settingsSectionContent [data-backup-workspace] #settingsBackupConfigForm .settings-warning,
.backup-portable-grid .settings-warning { margin:0; padding:11px 12px; border:1px solid var(--line); border-radius:9px; background:var(--brand-mist); color:var(--ink-soft); font-size:9.5px; line-height:1.55; }
.settings-workspace-main>#settingsSectionContent [data-backup-workspace] #settingsBackupConfigForm .settings-actions { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0; padding:12px 0 0; border-top:1px solid var(--line-subtle); }
.settings-workspace-main>#settingsSectionContent [data-backup-workspace] #settingsBackupConfigForm .settings-actions > span { flex:1 1 220px; min-width:0; color:var(--muted); font-size:9px; line-height:1.45; }
.settings-workspace-main>#settingsSectionContent [data-backup-workspace] #settingsBackupConfigForm .settings-actions > button { flex:0 0 auto; min-height:38px; }
.backup-run-row { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:end; gap:10px; min-width:0; margin:0; padding-top:13px; border-top:1px solid var(--line-subtle); }
.backup-run-row .form-field { min-width:0; gap:6px; }
.backup-run-row .form-field > span { color:var(--ink-soft); font-size:10px; font-weight:650; line-height:1.4; }
.backup-run-row .primary-button { min-height:40px; white-space:nowrap; }
.backup-history-list { display:grid; align-content:start; gap:9px; min-width:0; }
.backup-history-list > .local-note { margin:0; padding:22px 16px; border:1px dashed var(--line); border-radius:10px; background:var(--surface-sunken); color:var(--muted); font-size:10px; line-height:1.55; text-align:center; }
.backup-history-row { display:grid; grid-template-columns:34px minmax(0,1fr) auto; align-items:center; gap:10px; min-width:0; padding:11px; border:1px solid var(--line-subtle); border-radius:10px; background:var(--surface-sunken); }
.backup-history-icon { display:grid; width:34px; height:34px; place-items:center; border-radius:9px; background:var(--brand-mist); color:var(--brand); font-size:15px; }
.backup-history-copy { display:grid; gap:4px; min-width:0; }
.backup-history-copy > strong { overflow-wrap:anywhere; color:var(--ink); font-size:10px; line-height:1.35; }
.backup-history-copy > small { overflow-wrap:anywhere; color:var(--muted); font-size:9px; line-height:1.45; }
.backup-history-row .secondary-button { min-height:34px; white-space:nowrap; }
.settings-workspace .backup-portable-grid { grid-template-columns:repeat(2,minmax(0,1fr)); align-items:stretch; gap:14px; }
.backup-portable-grid > .settings-form { gap:12px; }
.backup-includes { margin:0; padding:11px 12px; border:1px solid var(--line-subtle); border-radius:9px; background:var(--surface-sunken); color:var(--muted); font-size:9.5px; line-height:1.55; }
.backup-portable-grid > .settings-form > .secondary-button { justify-self:start; min-height:38px; }
.backup-portable-grid #settingsBackupRestoreForm { display:grid; gap:11px; min-width:0; margin:0; }
.backup-portable-grid #settingsBackupRestoreForm > * { min-width:0; }
.backup-portable-grid #settingsBackupRestoreForm .form-field { gap:6px; }
.backup-portable-grid #settingsBackupRestoreForm .form-field > span { color:var(--ink-soft); font-size:10px; font-weight:650; }
.backup-portable-grid #settingsBackupRestoreForm .settings-check { align-items:flex-start; }
.backup-portable-grid #settingsBackupRestoreForm .primary-button { justify-self:start; min-height:38px; }
.backup-portable-grid #backupRestoreStatus { color:var(--muted); font-size:9px; line-height:1.45; }
@media(max-width:1180px) {
  .settings-workspace .backup-summary-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:960px) {
  .settings-workspace .backup-main-grid,
  .settings-workspace .backup-portable-grid { grid-template-columns:minmax(0,1fr); }
}
@media(max-width:700px) {
  .backup-main-grid > .settings-form,
  .backup-portable-grid > .settings-form { padding:15px; }
  .settings-workspace-main>#settingsSectionContent [data-backup-workspace] #settingsBackupConfigForm { grid-template-columns:minmax(0,1fr); }
  .settings-workspace-main>#settingsSectionContent [data-backup-workspace] #settingsBackupConfigForm > .full { grid-column:1; }
  .backup-run-row { grid-template-columns:minmax(0,1fr); }
  .backup-run-row .primary-button { justify-self:start; }
  .backup-history-row { grid-template-columns:32px minmax(0,1fr); }
  .backup-history-row .secondary-button { grid-column:2; justify-self:start; }
  .backup-main-grid .settings-section-title { flex-direction:column; }
  .backup-main-grid .settings-section-title > .status-badge { max-width:100%; }
}
@media(max-width:460px) {
  .settings-workspace .backup-summary-grid { grid-template-columns:minmax(0,1fr); }
  .backup-summary-card { min-height:0; }
  .settings-workspace-main>#settingsSectionContent [data-backup-workspace] #settingsBackupConfigForm .settings-actions { align-items:stretch; flex-direction:column; }
  .settings-workspace-main>#settingsSectionContent [data-backup-workspace] #settingsBackupConfigForm .settings-actions > button { align-self:start; }
  .backup-history-row { grid-template-columns:minmax(0,1fr); }
  .backup-history-row .secondary-button { grid-column:1; }
}