/* Operate-mode density contract. Shared shell -> controls -> domain exceptions.
   No business fields are hidden; touch targets expand for coarse pointers. */
:root {
  --sidebar-width: 204px;
  --accent: #17665b;
  --accent-hover: #105348;
  --accent-soft: #e9f3ef;
  --ui-focus: #17665b;
  --work-page-inset: 24px;
  --work-section-gap: 16px;
  --work-group-gap: 12px;
  --work-control-height: 34px;
  --work-line: #e4ebe7;
  --work-secondary: #596b65;
  --work-action-height: 36px;
  --work-divider: #d6e0db;
  --work-surface: #f1f6f3;
  /* Content uses dividers; elevation is reserved for temporary surfaces. */
  --shadow: none;
  --work-shadow-popover: 0 4px 12px rgb(17 24 39 / 12%);
  --work-shadow-dialog: 0 8px 24px rgb(17 24 39 / 18%);
  --work-shadow-drawer: -4px 0 20px rgb(17 24 39 / 12%);
  --work-motion-duration: 140ms;
  --work-motion-easing: cubic-bezier(0.16, 1, 0.3, 1);
  --work-shell: #edf2ee;
  --work-topbar-height: 56px;
  --work-radius: 8px;
  --ui-ink: #20332f;
  --ui-secondary: #596b65;
}
.app-body { background: var(--bg); }
.app-shell .topbar { height: var(--work-topbar-height); padding-inline: var(--work-page-inset); gap: 12px; }
.app-shell .topbar-tools { gap: 12px; }
.app-shell .sidebar { padding: 20px 10px 12px; }
.app-shell .sidebar .brand { gap: 10px; padding-inline: 6px; }
.app-shell .sidebar .brand b { font-size: 15px; font-weight: 650; }
.app-shell .sidebar :is(.brand small,.profile-copy small) { font-size: 12px; line-height: 18px; }
.app-shell .sidebar .workspace-avatar { color: var(--accent); background: #dbe8df; border-radius: 8px; }
.app-shell .sidebar .workspace-label { margin: 18px 4px 12px; padding: 12px 2px; border: 0; border-block: 1px solid var(--work-divider); border-radius: 0; }
.app-shell .sidebar .nav-item { min-height: 40px; padding: 9px 12px; margin: 2px 0; font-size: 14px; border-radius: 6px; }
.app-shell .sidebar .nav-group-label { letter-spacing: 0; }
.app-shell .sidebar-bottom { padding-top: 16px; }
.app-shell .main-content, .app-shell .main-content.customer-workspace {
  max-width: none; padding: 20px var(--work-page-inset) 24px;
}
.main-content .page-heading { min-height: 40px; margin-bottom: 16px; gap: 12px; }
.main-content .page-heading > div:first-child { gap: 12px; }
.main-content .page-heading h1, .main-content .sp-workspace .page-heading h1 { font-size: 24px; line-height: 32px; letter-spacing: -.02em; font-weight: 650; }
.main-content .page-heading p { color: var(--work-secondary); font-size: 13px; }
.main-content .card, .main-content .knowledge-card, .main-content .member-card,
.main-content .project-card, .main-content .kanban-card { box-shadow: none; border-radius: 8px; }
.main-content .card-header { min-height: 44px; padding: 10px 16px; }
.main-content .card-header h2, .main-content .card-header h3 { font-size: 15px; }
.main-content .card-header h2:before { display: none; }
.main-content .card-body, .main-content .knowledge-card, .main-content .member-card { padding: 16px; }
.main-content .card-footer { padding: 10px 16px; }
.main-content .section-gap { margin-top: var(--work-section-gap); }
.main-content :is(.dashboard-grid,.dashboard-bottom,.team-grid,.project-grid,.followup-columns) { gap: 12px; }
.main-content .notice { margin-bottom: 12px; padding: 10px 12px; font-size: 12px; line-height: 1.6; border-radius: 6px; }
.main-content .filters, .main-content .master-filters { gap: 8px; padding: 12px 16px; }
.main-content .empty-state { padding: 32px 20px; }
.app-shell .button, .modal .button, .drawer .button { min-height: var(--work-control-height); padding: 6px 11px; font-size: 13px; line-height: 20px; border-radius: 6px; font-weight: 500; }
.app-shell .button.small, .modal .button.small, .drawer .button.small { min-height: 30px; padding: 4px 9px; font-size: 12px; }
.app-shell .button.text { color: #596b65; }
.app-shell .button.text:hover { color: var(--accent); background: var(--accent-soft); }
.app-shell .button:is(.danger,[data-action$="-delete"],[data-action="delete-member"]) { color: #b42318; }
.app-shell input:not([type=checkbox]):not([type=radio]):not([type=file]), .app-shell select,
.modal input:not([type=checkbox]):not([type=radio]):not([type=file]), .modal select {
  min-height: var(--work-control-height); padding-block: 6px; font-size: 13px; border-radius: 6px;
}
input::placeholder, textarea::placeholder { color: #596b65; opacity: 1; }
.app-shell .global-search kbd { color: var(--work-secondary); font-size: 12px; }
.app-shell .pagination-button:not(:disabled) { color: var(--work-secondary); }
.app-shell .topbar .button.primary.compact { font-size: 13px; }
.customer-360 :is(.detail-note,.legacy-details summary) { color: var(--work-secondary); }
.app-shell .secondary, .app-shell .muted, .app-shell .small-text { color: var(--work-secondary); }
.app-shell .breadcrumb-home { color: var(--work-secondary); }
.app-shell :is(button,a,input,select,textarea,summary):focus-visible { outline: 2px solid var(--ui-focus); outline-offset: 2px; }
.app-shell ::selection { background: #e9f3ef; color: #20332f; }
.app-shell :is(table,time,.stat-value) { font-variant-numeric: tabular-nums; }

/* Two-line status notice: the state and all counts stay visible; guidance expands. */
.main-content .notice.reverification-banner { display: block; padding: 8px 12px; margin-bottom: 12px; background: #f3f6fa; border: 1px solid #dfe7e3; color: #20332f; }
.rv-status-line, .rv-meta-line { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 12px; }
.rv-status-line { justify-content: space-between; }
.rv-status-line strong { font-size: 12px; font-weight: 600; }
.rv-status-line .button { min-height: 24px; padding: 0 4px; font-size: 12px; }
.reverification-banner .rv-meta-line p { margin: 0; font-size: 12px; line-height: 20px; }
.rv-guidance { margin-left: auto; font-size: 12px; }
.rv-guidance summary { cursor: pointer; min-height: 24px; line-height: 24px; color: #596b65; }
.rv-guidance[open] { flex-basis: 100%; margin-left: 0; padding-top: 4px; border-top: 1px solid #dfe7e3; }
.reverification-banner .rv-guidance p { padding-top: 4px; color: #596b65; }

/* Inquiry table: fixed identity/task columns; remaining width belongs to history. */
.main-content.customer-workspace .history-inventory { padding: 7px 12px; font-size: 12px; border-radius: 6px; }
.customer-workspace .work-view-row { padding: 6px 12px; min-height: 44px; gap: 8px; }
.customer-workspace .quick-views { gap: 2px; }
.customer-workspace .quick-view { min-height: 30px; padding: 5px 8px; }
.customer-workspace .customer-list-card .filters { padding: 10px 12px; min-height: 52px; }
.customer-workspace .customer-list-card .filter-search { max-width: 380px; }
.customer-workspace .customer-table-scroll .customer-list-v2 { min-width: 1288px; }
.customer-workspace .customer-list-v2 col.select-column { width: 32px; }
.customer-workspace .customer-list-v2 col.grade-column { width: 84px; }
.customer-workspace .customer-list-v2 col.identity-column { width: 120px; }
.customer-workspace .customer-list-v2 col.followup-contact-column { width: 132px; }
.customer-workspace .customer-list-v2 col.inquiry-date-column { width: 102px; }
.customer-workspace .customer-list-v2 col.product-column { width: 140px; }
.customer-workspace .customer-list-v2 col.stage-column { width: 108px; }
.customer-workspace .customer-list-v2 col.owner-column { width: 60px; }
.customer-workspace .customer-list-v2 col.next-column { width: 180px; }
.customer-workspace .customer-list-v2 col.legacy-cell { width: auto; }
.customer-workspace .customer-list-v2 col.actions-column { width: 224px; }
.customer-workspace .customer-table-scroll .customer-list-v2 :is(th,td) { padding: 7px 10px; }
.customer-workspace .customer-table-scroll .customer-list-v2 thead th { height: 36px; font-size: 12px; }
.customer-workspace .customer-table-scroll .customer-list-v2 thead th { color: var(--work-secondary); background: #f1f5f2; font-weight: 500; }
.customer-workspace .customer-list-v2 .list-sort-button.active { color: var(--accent); }
.customer-workspace .customer-list-v2 .badge.gray, .customer-360 .badge.gray { color: var(--work-secondary); }
.customer-360 .badge:is([class="badge"],[class="badge "]) { color: var(--work-secondary); }
.customer-workspace .customer-table-scroll .customer-list-v2 tbody td { height: 56px; }
.customer-workspace .customer-table-scroll .customer-list-v2 :is(th,td).select-column { padding-inline: 10px; }
.customer-workspace .customer-list-v2 .identity-column .identity-edit { margin: 0; padding: 0; min-height: 24px; line-height: 20px; color: #596b65; }
.customer-workspace .customer-list-v2 .plan-link { margin: 0; padding: 0; min-height: 24px; line-height: 20px; }
.customer-workspace .customer-list-v2 .summary-meta { margin-top: 2px; font-size: 12px; line-height: 16px; }
.customer-workspace .customer-list-v2 .summary-detail .legacy-preview { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; white-space: normal; overflow-wrap: anywhere; line-height: 18px; max-height: 54px; }
.customer-workspace .customer-list-v2 .customer-persistent-actions .button { min-height: 36px; padding: 7px 12px; font-size: 13px; }
.customer-workspace .customer-list-v2 .customer-persistent-actions .customer-followup-action { min-width: 82px; background: var(--accent-soft); border-color: #d6e0db; color: var(--accent); font-weight: 500; }
.customer-workspace .customer-list-v2 .customer-persistent-actions .customer-followup-action:hover { background: #dbece3; border-color: #17665b; color: var(--accent-hover); }
.customer-workspace .customer-list-v2 .customer-persistent-actions .customer-archive-action { min-width: 112px; color: #20332f; }
.customer-workspace .customer-table-scroll { scroll-padding-inline-end: 236px; }
.customer-workspace .customer-list-v2 .customer-persistent-actions .button + .button { margin: 0; }
.customer-workspace .customer-list-v2 .inline-priority-select { min-height: 28px; height: 28px; padding: 2px 4px 2px 6px; font-size: 12px; }

/* Identity, contact, demand and the next task have readable column boundaries.
   No columns are removed; narrow screens retain one scrollable table. */
.customer-workspace .customer-list-v2 :is(th,td):is(.followup-contact-column,.product-column,.next-column,.actions-column) { border-left: 1px solid var(--work-line); }
.customer-workspace .customer-list-v2 :is(th,td).next-column { background-color: #fafbfc; }
.customer-workspace .customer-list-v2 tbody tr:hover td { background-color: #f4f7fa; background: #f5f9f6; }
.customer-workspace .customer-list-v2 .next-column .subline { overflow-wrap: anywhere; }
.customer-workspace .customer-list-v2 .summary-meta { color: var(--work-secondary); font-size: 12px; }
.customer-workspace .customer-list-v2 .customer-persistent-actions { gap: 8px; }

/* Daily-work and forms share the same grouping rhythm. */
.main-content.daily-workspace .priority-work .card-header { padding: 10px 16px; }
.main-content.daily-workspace .priority-work h2 { font-size: 15px; }
.main-content.daily-workspace .task-table td { padding-block: 8px; }
.main-content .module-dashboard-heading { padding: 12px 16px; }
.main-content .module-compact-row { padding: 12px 16px; }
.main-content .chain-metric { padding: 14px 16px; gap: 4px; }
.main-content .chain-metric strong { font-size: 22px; }
.main-content .wf-toolbar { padding: 10px 12px; gap: 8px; }
.main-content .followup-card-footer { gap: 8px; margin-top: 10px; padding-top: 10px; }
.main-content .followup-card-footer > .button { opacity: 1; }
.main-content .followup-card-footer > .button:disabled { opacity: .55; }
.main-content .business-table .actions-cell > .button + .button { margin-left: 8px; }
.modal .modal-header, .followup-sheet .modal-header { padding: 18px 20px; border-bottom: 1px solid var(--work-line); background: #f9fbf9; }
.modal .modal-body, .followup-sheet .modal-body { padding: 16px 18px; }
.modal .modal-footer, .followup-sheet .modal-footer { padding: 14px 20px; gap: 8px; background: #f9fbf9; }
.modal .form-grid, .modal .form-stack { gap: 12px; }
.modal .field { gap: 5px; }
.modal .field > span { font-size: 13px; color: #20332f; font-weight: 500; }
.modal textarea { min-height: 80px; font-size: 14px; line-height: 1.65; }
.followup-sheet .followup-context { padding: 10px 12px; margin-bottom: 16px; background: #f3f7f4; border-color: var(--work-line); }
.followup-sheet .brief-facts { gap: 6px 12px; }
.followup-sheet .brief-facts > div { display: flex; flex-direction: row; align-items: baseline; flex-wrap: wrap; gap: 4px 8px; }
.followup-sheet .brief-facts :is(span,strong) { font-size: 12px; line-height: 20px; margin: 0; }
.followup-sheet .brief-facts strong { font-weight: 600; }
.followup-sheet .brief-plan { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 8px; margin: 4px 0; padding: 4px 8px; border-left-width: 1px; background: #eaf2ed; border-color: #d6e0db; }
.followup-sheet .brief-plan :is(span,strong) { font-size: 12px; line-height: 20px; margin: 0; }
.followup-sheet .recent-contact { margin: 0; font-size: 12px; }
.followup-sheet .recent-contact summary { min-height: 24px; line-height: 24px; }
.followup-sheet .recent-contact p { margin: 4px 0 0; font-size: 12px; line-height: 20px; }
.customer-360 .detail-stage-path { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.followup-sheet .followup-profile { border-block: 1px solid var(--work-line); padding: 10px 0; }
.followup-sheet .followup-profile > summary { cursor: pointer; font-weight: 550; font-size: 14px; color: #17665b; }

/* Followup is the primary workspace; unrelated side sheets keep their own size. */
.modal.followup-sheet:has(.followup-form) { width: min(860px, 100%); }
.followup-sheet:has(.followup-form) .modal-header { padding: 16px 24px 12px; }
.followup-sheet:has(.followup-form) .modal-header h2 { font-size: 22px; line-height: 30px; font-weight: 650; }
.followup-sheet:has(.followup-form) .modal-body { padding: 16px 24px 24px; }
.followup-sheet:has(.followup-form) .modal-footer { padding: 14px 24px; }
.followup-sheet:has(.followup-form) .modal-footer .button { min-height: 40px; padding: 9px 20px; font-size: 14px; }
.followup-section-nav { display: flex; flex-shrink: 0; gap: 8px; padding: 4px 24px 8px; border-bottom: 1px solid var(--work-line); background: var(--work-surface); }
.modal .followup-section-nav .button { min-height: 36px; font-size: 13px; padding: 6px 12px; color: var(--accent); }
.modal .followup-section-nav .button:hover { color: var(--accent-hover); background: var(--accent-soft); }
.followup-form :is(#followup-communication,#followup-profile,#followup-plan,[data-loss-plan-note]) { scroll-margin-block-start: 8px; }
.followup-form :is(#followup-communication,#followup-plan > legend,[data-loss-plan-note]):focus-visible { outline: 2px solid var(--ui-focus); outline-offset: 3px; }
@media (max-width: 600px) {
  .followup-section-nav { padding-inline: 16px; gap: 4px; }
  .followup-section-nav .button { flex: 1; }
}
.followup-sheet .followup-form { gap: 12px; }
.followup-form .followup-section-title { font-size: 15px; line-height: 24px; margin: 4px 0 0; }
.followup-form .followup-section-title:not(:first-child) { padding-top: 16px; border-top: 1px solid var(--work-line); }
.followup-form .field > span:first-child { font-size: 13px; font-weight: 500; }
.followup-form .field-hint { font-weight: 400; }
/* Legacy styles.css marks field hints !important; override only these reviewed forms. */
.followup-form .field-hint, .modal:has([name=next_sample_line_id]) .field-hint, .modal .sp-form-layout .field-hint { color: var(--work-secondary) !important; font-size: 12px !important; line-height: 18px; }
.modal .sp-form-section > header > span { color: var(--work-secondary); }
.followup-form :is(input:not([type=checkbox]),select) { min-height: 38px; }
.followup-form textarea:is([name=content],[name=feedback]) { min-height: 160px; font-size: 14px; line-height: 1.65; }
.modal textarea[name=next_action] { min-height: 72px; line-height: 1.6; }
.followup-form .followup-profile .form-grid > fieldset { grid-column: 1 / -1; min-width: 0; }
.followup-sheet:has(.followup-form) .followup-context .brief-facts { display: flex; flex-wrap: wrap; gap: 4px 20px; }
.followup-sheet:has(.followup-form) .followup-context .brief-facts .brief-wide { flex: 1 1 240px; }
.drawer.customer-360 { width: min(1280px, calc(100% - 24px)); }
.customer-360 .drawer-header { padding: 20px 24px 16px; }
.customer-360 .drawer-title-row h2 { font-size: 24px; line-height: 32px; }
.customer-360 .drawer-meta { margin-top: 10px; }
.customer-360 .drawer-actions { gap: 8px; margin-top: 16px; align-items: center; }
.customer-360 .drawer-actions .drawer-followup-action { min-height: 44px; min-width: 120px; font-size: 15px; font-weight: 600; padding: 10px 20px; margin-right: 8px; }
.customer-360 .tab-button { min-height: 44px; font-size: 14px; }
.customer-360 .drawer-body { padding: 20px 24px; }
.customer-360 .customer-detail-layout { grid-template-columns: minmax(0, 1fr) 280px; gap: 16px; }
.customer-360 .customer-detail-layout .detail-section { padding: 16px; border-radius: 8px; box-shadow: none; margin-bottom: 12px; }
.customer-360 .customer-detail-layout .customer-archive > .detail-section { padding: 16px 0 0; }

/* Native fields, names, validation and submit paths are unchanged. */
.followup-form .followup-narrative, .followup-form .followup-plan-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--work-group-gap); align-items: start; }
.followup-form .followup-narrative > .field { min-width: 0; }
.followup-form .followup-evidence { padding: 12px; border: 1px dashed var(--work-divider); border-radius: 6px; background: var(--work-surface); }
.followup-form .followup-evidence input[type=file] { width: 100%; min-width: 0; font-size: 13px; }
.followup-form .followup-evidence input::file-selector-button { min-height: 32px; padding: 5px 12px; margin-right: 12px; border: 1px solid var(--work-divider); border-radius: 5px; color: #20332f; background: #fff; cursor: pointer; font: inherit; }
.followup-form .followup-evidence input::file-selector-button:hover { background: #f0f3f7; }
.customer-360 .customer-brief .brief-facts { display: flex; flex-wrap: wrap; gap: 8px 20px; }
.customer-360 .customer-brief .brief-facts > div { display: flex; flex-direction: row; align-items: baseline; gap: 4px 8px; }
.customer-360 .customer-brief .brief-facts > .brief-wide { flex: 1 1 260px; }
.customer-360 .customer-brief .brief-facts :is(span,strong) { margin: 0; line-height: 20px; font-size: 13px; }
.customer-360 .customer-brief { padding: 14px 16px; }
.customer-360 .customer-detail-aside .detail-grid { gap: 12px; }
.customer-360 .drawer-identity-subtitle { margin-top: 4px; }
.customer-360 .drawer-meta { gap: 8px; }
.customer-360 .drawer-actions .button:not(.drawer-followup-action) { min-height: var(--work-action-height); }
.modal:has(.sp-form-layout) :is(input:not([type=checkbox]),select) { min-height: 38px; }
.modal:has(.sp-form-layout) .modal-footer .button { min-height: 40px; padding: 9px 20px; font-size: 14px; }
.modal:has(.sp-form-layout) .field > span:first-child { font-size: 13px; font-weight: 500; }
.modal :is(.sp-form-layout,.followup-form) :is(button,a,input,select,textarea,summary):focus-visible { outline: 2px solid var(--ui-focus); outline-offset: 2px; }

/* Narrow lists scroll as one table: fixed action cells must not cover plan links. */
@media(max-width:1780px) {
  .customer-workspace .customer-table-scroll .customer-list-v2 td.actions-column { position: static; box-shadow: none; }
  .customer-workspace .customer-table-scroll .customer-list-v2 th.actions-column { right: auto; box-shadow: none; }
  .customer-workspace .customer-table-scroll { scroll-padding-inline-end: 12px; }
}
@media(max-width:760px) {
  .drawer.customer-360 { width: 100%; }
  .customer-360 .customer-detail-layout { grid-template-columns: minmax(0, 1fr); }
  .customer-360 .drawer-header, .customer-360 .drawer-body { padding: 16px; }
  .followup-sheet:has(.followup-form) :is(.modal-header,.modal-body,.modal-footer) { padding: 16px; }
  .followup-form :is(.form-grid,.followup-narrative,.followup-plan-fields) { grid-template-columns: minmax(0, 1fr); }
  .main-content.customer-workspace .page-heading, .main-content .sp-workspace .page-heading {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 4px 8px;
    align-items: start;
    margin-bottom: 12px;
  }
  .main-content.customer-workspace .page-heading > div:first-child, .main-content .sp-workspace .page-heading > div:first-child {
    display: contents;
  }
  .main-content.customer-workspace .page-heading h1, .main-content .sp-workspace .page-heading h1 {
    grid-column: 1;
    grid-row: 1;
    align-self: center;
  }
  .main-content.customer-workspace .page-heading .heading-actions, .main-content .sp-workspace .page-heading .heading-actions {
    grid-column: 2;
    grid-row: 1;
    flex-wrap: nowrap;
    justify-self: end;
    gap: 6px;
  }
  .main-content.customer-workspace .page-heading p, .main-content .sp-workspace .page-heading p {
    grid-column: 1 / -1;
    grid-row: 2;
    margin: 0;
    max-width: none;
  }
  .sp-workspace .sp-workflow-guide {
    margin-bottom: 8px;
  }
  .sp-workspace .sp-customer-heading {
    padding: 8px 14px;
  }
}

/* Sampling: one customer container, then brand and product rows without nested frames. */
.main-content .sp-workspace { max-width: none; }
.sp-workspace .sp-workflow-guide { margin-bottom: 12px; gap: 8px; }
.sp-workspace .sp-workflow-guide { color: var(--work-secondary); }
.main-content .sp-workspace .sp-filters { padding: 10px 12px; gap: 8px; margin-bottom: 10px; border-radius: 6px; }
.sp-workspace .sp-filters label:first-child { flex: 0 1 360px; }
.sp-workspace .sp-task-tabs { padding-bottom: 8px; margin-bottom: 0; gap: 4px; }
.sp-workspace .sp-task-tabs .button { padding: 4px 8px; min-height: 30px; }
.sp-workspace .sp-task-tabs .button.active { color: var(--accent); background: var(--accent-soft); border-color: #d6e0db; }
.sp-workspace .sp-count { margin: 8px 0; }
.main-content .sp-workspace .sp-customer-group { border-radius: 8px; margin-bottom: 16px; }
.main-content .sp-workspace .sp-customer-heading { padding: 12px 16px; background: #f0f6f2; }
.main-content .sp-workspace .sp-customer-heading h2 { font-size: 18px; font-weight: 650; }
.main-content .sp-workspace .sp-brand-heading { padding: 8px 16px; background: #f8faf8; border-block: 1px solid var(--work-line); }
.sp-workspace .sp-product-list { padding: 0; gap: 0; }
.sp-workspace .sp-product-card { border: 0; border-radius: 0; }
.sp-workspace .sp-product-card + .sp-product-card { border-top: 1px solid #e4ebe7; }
.sp-workspace .sp-product-heading { padding: 12px 16px; }
.sp-workspace .sp-product-heading h3 { font-size: 15px; margin-bottom: 3px; font-weight: 600; }
.sp-workspace .sp-card-grid > section { padding: 8px 14px; }
@media(min-width:1101px) {
  .sp-workspace .sp-card-grid { grid-template-columns: minmax(220px, .95fr) minmax(0, 1.45fr) minmax(210px, .9fr); }
}
.sp-workspace .sp-card-grid h4 { margin-bottom: 6px; }
.sp-workspace .sp-date-list > div, .sp-workspace .sp-price-summary > div { margin-bottom: 4px; }
.sp-workspace .sp-next-plan { margin-top: 6px; padding: 6px 8px; border-left-width: 1px; }
.sp-workspace .sp-rework-brief { margin: 8px 14px 0; padding: 8px 10px; border-left-width: 1px; }
.sp-workspace .sp-card-actions { padding: 10px 16px; border-radius: 0; background: #fafcfb; }
.app-shell .sp-workspace :is(.sp-task-heading,.sp-card-actions) > .button,
.app-shell .sp-workspace .sp-card-actions > div > .button { min-height: var(--work-action-height); padding: 7px 12px; font-size: 13px; }
.sp-workspace .sp-more summary { min-height: var(--work-action-height); display: flex; align-items: center; padding: 6px 10px; border: 1px solid var(--work-divider); border-radius: 6px; color: #596b65; }
.sp-workspace .sp-more summary:hover { background: var(--work-surface); }
.sp-workspace .sp-more[open] summary { background: var(--work-surface); }
.sp-workspace :is(.sp-meta,.sp-count,.sp-card-grid h4,.sp-date-list dt,.sp-price-summary dt) { color: var(--work-secondary); }
.sp-workspace .sp-feedback-section { background: #f7faf8; }
.sp-workspace .sp-feedback-section h4 { color: #17665b; }
.sp-workspace .sp-next-plan { border-color: var(--work-divider); background: var(--work-surface); }
.sp-workspace .sp-price-summary .sp-final-value { border-color: var(--work-line); }
.sp-workspace .sp-round-history > summary { color: #596b65; }
.sp-workspace .sp-round-history > summary { padding: 8px 14px; color: #596b65; }
.sp-workspace .sp-requirements { margin-top: 8px; }
.modal .sp-form-layout { gap: 12px; }
.modal .sp-form-section > header { margin-bottom: 10px; }
.modal .sp-form-section + .sp-form-section { padding-top: 12px; }
.modal .sp-line-block { padding: 12px; }

@media(max-width:1100px) {
  .main-content .page-heading > div:first-child { display: block; }
  .main-content .page-heading p { margin-top: 3px; }
  .main-content .page-heading .heading-actions { flex-wrap: wrap; }
}
@media(max-width:760px) {
  :root { --work-page-inset: 12px; --work-control-height: 36px; }
  .app-shell .sidebar { width: 224px; }
  .app-shell .main-content, .app-shell .main-content.customer-workspace { padding-top: 12px; }
  .app-shell .topbar { padding-inline: 12px; }
  .main-content .page-heading { flex-wrap: wrap; gap: 8px; }
  .main-content .page-heading .heading-actions { max-width: 100%; }
  .rv-meta-line { display: block; }
  .rv-guidance { margin-left: 0; }
  .sp-workspace .sp-filters label:first-child { flex-basis: 100%; }
  .customer-workspace .customer-list-card .filters select { flex: 1 1 110px; min-width: 110px; }
  .sp-workspace .sp-card-grid > section { padding: 12px; }
  .modal .modal-header, .modal .modal-body, .modal .modal-footer { padding: 12px; }
}
@media(pointer:coarse) {
  .app-shell .button, .app-shell select, .modal .button, .modal select { min-height: 40px; }
  .customer-workspace .customer-list-v2 .identity-column .identity-edit,
  .customer-workspace .customer-list-v2 .plan-link,
  .customer-workspace .customer-list-v2 .customer-persistent-actions .button { min-height: 36px; }
}
/* Independent product plans use the same compact business layout. */
.product-task-panel { margin-block: 16px; padding: 16px; border: 1px solid #dfe7e3; border-radius: 8px; background: #fff; }
.product-task-panel .section-heading, .product-task-context { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.product-task-panel h2 { margin: 0; font-size: 15px; }
.product-task-list { display: grid; gap: 10px; margin-top: 10px; }
.product-task-row { padding: 12px; border: 1px solid #e4ebe7; border-radius: 6px; font-size: 13px; min-width: 0; }
.product-task-action { margin-block: 8px 4px; font-weight: 600; overflow-wrap: anywhere; }
.product-task-row time { display: block; color: #596b65; font-variant-numeric: tabular-nums; }
.product-task-row .row-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.product-task-empty { margin-block: 10px 0; }
.filing-order-summary { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px 20px; }
.filing-order-summary dd { margin: 4px 0 0; overflow-wrap: anywhere; }
.filing-order-summary-wide { grid-column: 1 / -1; }
@media (max-width: 640px) {
  .product-task-panel { padding: 12px; }
  .filing-order-summary { grid-template-columns: minmax(0,1fr); }
}

/* Evidence previews remain in the form; enlarged images use a native modal layer. */
.screenshot-local-preview { margin-block: 8px 16px; min-width: 0; }
.screenshot-preview-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(120px,180px)); gap: 10px; margin-top: 8px; }
.screenshot-preview-card { display: grid; gap: 6px; padding: 8px; border: 1px solid var(--border,#dfe7e3); border-radius: 8px; background: #fff; color: inherit; text-align: left; cursor: zoom-in; min-width: 0; }
.screenshot-preview-card img { width: 100%; height: 110px; object-fit: contain; background: #f5f6f8; border-radius: 6px; }
.screenshot-preview-card span { font-size: 12px; overflow-wrap: anywhere; }
.screenshot-preview-card:focus-visible { outline: 2px solid #17665b; outline-offset: 2px; }
.screenshot-viewer { position: fixed; inset: 0; width: min(1100px,94vw); max-width: 94vw; max-height: 92dvh; margin: auto; padding: 16px; border: 1px solid #dfe7e3; border-radius: 10px; background: #fff; color: #20332f; overflow: auto; }
.screenshot-viewer::backdrop { background: rgb(32 51 47 / .65); }
.screenshot-viewer header { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 12px; }
.screenshot-viewer header strong { min-width: 0; overflow-wrap: anywhere; }
.screenshot-viewer header button { flex-shrink: 0; }
.screenshot-viewer > img { display: block; width: auto; height: auto; max-width: 100%; max-height: 76dvh; object-fit: contain; margin-inline: auto; }
@media(max-width:640px){ .screenshot-viewer { padding: 12px; } .screenshot-preview-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }

/* Local location picker: one canonical saved field, progressive province/city controls. */
.customer-location-picker { margin: 0; padding: 0; border: 0; min-width: 0; }
.customer-location-picker legend { margin-bottom: 8px; font-size: 12px; color: var(--muted,#596b65); }
.customer-location-picker .location-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
.customer-location-picker .field { min-width: 0; }
.customer-location-picker [hidden] { display: none !important; }
.customer-location-picker [data-location-legacy] { display: block; margin-top: 6px; overflow-wrap: anywhere; }
@media(max-width:640px){ .customer-location-picker .location-grid { grid-template-columns: minmax(0,1fr); gap: 8px; } }

/* Follow-up refinement: preserve the dense form and give evidence explicit controls. */
.followup-next-plan { border: 0; padding: 0; margin: 0; min-width: 0; display: grid; gap: 12px; }
.followup-next-plan[hidden], [data-loss-plan-note][hidden] { display: none !important; }
.screenshot-preview-item { min-width: 0; display: grid; align-content: start; gap: 6px; }
.screenshot-preview-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.screenshot-preview-actions button { flex: 1; }
.screenshot-preview-tools { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.toast span { white-space: pre-line; overflow-wrap: anywhere; }

.toast span { max-height: 38dvh; overflow-y: auto; }

.app-shell .sidebar .nav-section>summary {
  color: #596b65;
  font-size: 12px;
  font-weight: 500;
  padding: 10px 12px 6px;
}

.app-shell .sidebar .nav-item:not(.active):hover {
  background: #e2ebe5;
  color: #20332f;
}

.app-shell .sidebar .profile-button {
  border: 0;
  border-top: 1px solid var(--work-divider);
  border-radius: 0;
  padding: 14px 6px 2px;
  background: transparent;
  color: var(--ink);
}

.app-shell .sidebar .profile-button .avatar {
  background: #d8e7dc;
  color: #17665b;
}

.app-shell .global-search {
  background: #f2f5f3;
  border-color: #e7ece9;
  border-radius: 6px;
}

.customer-workspace .customer-list-v2 .customer-name-edit {
  font-size: 14px;
  font-weight: 550;
  color: var(--ink);
}

.customer-workspace .customer-list-v2 .inline-grade-select {
  background: #f4f7f5;
  color: #536b60;
  border-color: #e0e8e3;
  border-radius: 5px;
  font-size: 12px;
}

.customer-workspace .customer-list-v2 tr.is-current-customer:hover td {
  background: #e2efe7;
}

.customer-360 .drawer-avatar {
  background: #deebe1;
  color: #17665b;
  border-radius: 10px;
}

.customer-360 .detail-stage-path>span.current {
  color: var(--accent);
}

.customer-360 .detail-stage-path>span.current>i {
  background: var(--accent);
  border-color: var(--accent);
}

.followup-form .screenshot-upload-field {
  background: #f4f8f5;
  border-color: #d6e0db;
}

.login-brand {
  color: #20332f;
}

.login-illustration {
  display: none;
}

/* Shared secondary text remains readable outside the customer workspace too. */
.app-shell .filters select,
.app-shell .stat-card.is-zero .stat-value,
.app-shell .stat-card.is-zero .stat-icon,
.app-shell .stage-order,
.app-shell .funnel-stage-label > span:last-child,
.app-shell .member-identity p,
.app-shell .team-metric-grid span,
.app-shell .team-metric-grid small,
.app-shell .member-meta .between > span:first-child,
.app-shell .member-reason,
.app-shell .policy-heading p,
.app-shell .policy-source,
.app-shell .legacy-details > summary,
.app-shell .rule-index,
.app-shell .rule-grid article > p,
.app-shell .rule-thresholds strong,
.app-shell .rule-thresholds small,
.app-shell .definition-row dd,
.app-shell .toggle-line p {
  color: var(--work-secondary);
}

/* Manual contrast review: legacy workflow counts are actual business text. */
.app-shell .wf-kind-tab > span { color: var(--work-secondary); background: var(--work-surface); border-radius: 5px; }

/* All business forms share readable help text, including intake and account forms.
   Legacy field hints use !important; match only their typography and text color. */
.modal .field-hint { color: var(--work-secondary) !important; font-size: 12px !important; line-height: 18px; }
.modal :is(.sp-meta,.sp-form-note > span,.sp-commercial-overview > section > p) { color: var(--work-secondary); }
.modal .checkbox-label > span { color: var(--ui-ink); font-size: 13px; line-height: 20px; }

/* Unsaved changes need a separate decision, above the scrolling business form. */
dialog.modal-draft-confirm {
  position: fixed; inset: 0; margin: auto; width: min(440px, calc(100vw - 32px));
  max-height: calc(100dvh - 32px); overflow: auto; box-sizing: border-box;
  padding: 24px; border: 1px solid var(--work-divider); border-radius: 10px;
  background: #fff; color: var(--ui-ink); box-shadow: var(--work-shadow-dialog);
}
dialog.modal-draft-confirm::backdrop { background: rgb(32 51 47 / .4); }
.modal-draft-confirm h2 { margin: 0; font-size: 18px; line-height: 28px; }
.modal-draft-confirm p { margin: 12px 0 0; color: var(--work-secondary); font-size: 13px; line-height: 20px; }
.modal-draft-actions { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 8px; margin-top: 24px; }
.modal-draft-actions .button { min-height: 36px; margin: 0; padding: 7px 12px; font-size: 13px; line-height: 20px; border-radius: 6px; }
.modal-draft-actions .button:focus-visible { outline: 2px solid var(--ui-focus); outline-offset: 2px; }

/* Action semantics and feedback stay visible without replacing business forms. */
.modal #modal-submit.danger { background: #b42318; border-color: #b42318; color: #fff; }
.modal #modal-submit.danger:hover { background: #912018; border-color: #912018; }
.modal .modal-footer { flex-wrap: wrap; }
.modal-footer #modal-error { flex-basis: 100%; margin: 0; padding: 8px 12px; border: 1px solid #b42318; border-radius: 6px; background: #fff; text-align: left; font-size: 13px; line-height: 20px; }
.modal [aria-invalid="true"] { border-color: #b42318; }
.field-error { color: #b42318; font-size: 12px; line-height: 18px; }
.conflict-review { padding: 16px; border: 1px solid var(--work-divider); border-radius: 8px; background: var(--work-surface); margin-bottom: 16px; }
.conflict-review h3 { margin: 0; font-size: 15px; line-height: 24px; }
.conflict-review p { margin: 8px 0 12px; font-size: 13px; line-height: 20px; }
.conflict-review td { white-space: normal; overflow-wrap: anywhere; min-width: 120px; }
.conflict-review select { min-width: 144px; }
.conflict-review:focus-visible { outline: 2px solid var(--ui-focus); outline-offset: 2px; }
.modal .unlink-target { background: var(--work-surface); padding: 12px; }
.modal .unlink-target :is(strong,p) { color: var(--ui-ink); font-size: 13px; line-height: 20px; }
