/* Business UI refinement. The public shop, personal theme variables, button
   designer overrides and the semantic capacity-matrix colours remain intact. */
body:not(.shop-public-mode) .app-shell.sidebar-drawer-mode {
  --sidebar-drawer-width: min(86vw, var(--layout-sidebar-width));
}
body:not(.shop-public-mode) .app-shell .sidebar {
  /* Keep the original themed sidebar gradients from styles.css. */
  border-radius: 0 !important;
  box-shadow: none !important;
}
/* Only the scroll container is RTL: its native scrollbar sits on the left.
   Menu groups keep their original reading, icon and keyboard order. */
body:not(.shop-public-mode) .app-shell .sidebar .nav {
  direction: rtl;
  margin-left: -4px;
  margin-right: 0;
  padding-left: 8px;
  padding-right: 0;
}
body:not(.shop-public-mode) .app-shell .sidebar .nav > * { direction: ltr; }
body:not(.shop-public-mode) .sidebar .brand-mark {
  background: transparent;
  box-shadow: none;
}
body:not(.shop-public-mode) .app-shell.sidebar-drawer-mode > .sidebar .brand-mark {
  width: 44px !important;
  height: 44px !important;
  flex: 0 0 44px;
}
body:not(.shop-public-mode) .sidebar .brand > div { min-width: 0; }
body:not(.shop-public-mode) .sidebar .brand h1 { font-size: 1.15rem; letter-spacing: -0.025em; }
body:not(.shop-public-mode) .sidebar .brand .eyebrow { font-weight: 500; line-height: 1.45; letter-spacing: 0.025em; }
body:not(.shop-public-mode) .sidebar .nav-group-toggle:not(.has-custom-button-design) {
  color: color-mix(in srgb, var(--color-sidebar-text) 72%, var(--color-sidebar)) !important;
  font-weight: 600;
  letter-spacing: 0.085em;
}
body:not(.shop-public-mode) .sidebar .nav-item {
  --nav-icon-color: var(--color-sidebar-text);
  position: relative;
  border-color: transparent;
  font-weight: 500;
  box-shadow: none;
}
body:not(.shop-public-mode) .sidebar .nav-item .nav-icon { color: var(--color-sidebar-text); opacity: 0.85; transform: none; stroke-width: 1.75; }
body:not(.shop-public-mode) .sidebar .nav-item:not(.has-custom-button-design):hover {
  border-color: transparent !important;
  background: linear-gradient(90deg, color-mix(in srgb, var(--primary) 20%, transparent), color-mix(in srgb, var(--color-sidebar-text) 8%, transparent)) !important;
}
body:not(.shop-public-mode) .sidebar .nav-item.is-active:not(.has-custom-button-design) {
  border-color: transparent !important;
  background: linear-gradient(90deg, color-mix(in srgb, var(--primary) 26%, transparent), color-mix(in srgb, var(--color-sidebar-text) 8%, transparent)) !important;
  color: var(--color-sidebar-text);
  box-shadow: inset 3px 0 0 var(--leaf);
  font-weight: 700;
}
body:not(.shop-public-mode) .sidebar .nav-item.is-active .nav-icon { color: var(--leaf); opacity: 1; }
body:not(.shop-public-mode) .app-shell .topbar {
  background: var(--color-header);
  border-bottom: 1px solid var(--line);
  box-shadow: none;
  backdrop-filter: none;
}
body:not(.shop-public-mode) .topbar .global-search {
  gap: 10px;
  border-radius: var(--layout-input-radius);
  background: var(--color-table-header);
  box-shadow: none;
}
.global-search-icon { width: 18px; height: 18px; flex: 0 0 18px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; }
body:not(.shop-public-mode) .topbar .profile-chip,
body:not(.shop-public-mode) .topbar .year-picker,
body:not(.shop-public-mode) .topbar .topbar-icon-button {
  border-radius: var(--layout-button-radius);
  box-shadow: none;
}
body:not(.shop-public-mode) .content .panel {
  box-shadow: none;
  border-color: var(--line);
}
body:not(.shop-public-mode) .primary-button,
body:not(.shop-public-mode) .ghost-button,
body:not(.shop-public-mode) .danger-button {
  border-radius: var(--layout-button-radius);
  font-weight: var(--font-font-weight-bold);
  box-shadow: none;
}
body:not(.shop-public-mode) .primary-button { background: linear-gradient(135deg, var(--primary), var(--primary-strong)); color: var(--color-button-text); }
body:not(.shop-public-mode) .primary-button:hover:not(:disabled) { background: linear-gradient(135deg, var(--primary), color-mix(in srgb, var(--primary-strong) 88%, var(--primary))); }
body:not(.shop-public-mode) .ghost-button:hover:not(:disabled) { background: var(--surface-strong); border-color: var(--primary); }
body:not(.shop-public-mode) .profile-menu {
  border-radius: var(--layout-card-radius);
  background: var(--surface);
  box-shadow: 0 8px 24px color-mix(in srgb, var(--ink) 12%, transparent);
}
body:not(.shop-public-mode) .profile-menu button { border-radius: var(--layout-button-radius); font-weight: 600; }
body:not(.shop-public-mode) .account-profile-dialog,
body:not(.shop-public-mode) .settings-workspace-dialog {
  background: radial-gradient(circle at top left, color-mix(in srgb, var(--leaf) 18%, transparent), transparent 22rem), var(--surface);
  border-radius: var(--layout-card-radius);
  box-shadow: 0 16px 48px color-mix(in srgb, var(--ink) 16%, transparent);
}
body:not(.shop-public-mode) .account-profile-dialog .profile-settings-card,
body:not(.shop-public-mode) .settings-workspace-dialog .profile-settings-card {
  background: var(--color-table-header);
  border-color: var(--line);
}
/* Reuse the compact QR-dialog sizing, overriding the generic touch-screen stretch. */
body:not(.shop-public-mode) .profile-settings-backdrop.partner-invite-backdrop {
  place-items: center;
  padding: 16px;
}
body:not(.shop-public-mode) .profile-settings-dialog.partner-invite-dialog {
  align-self: center;
  align-content: start;
  width: min(560px, 100%);
  height: auto;
  min-height: 0;
  max-height: calc(100vh - 32px);
  max-height: calc(100dvh - 32px);
  box-sizing: border-box;
}
body:not(.shop-public-mode) .partner-invite-dialog [data-dialog-status]:empty { display: none; }

/* Existing two navigation levels keep their explicit row ordering. */
body:not(.shop-public-mode) #tableView:is(.is-partners-workspace, .is-settings-workspace) #subNavPanel .settings-subnav-card {
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}
body:not(.shop-public-mode) #tableView:is(.is-partners-workspace, .is-settings-workspace) .settings-topic-nav {
  width: 100%;
  gap: 8px;
  padding: 0;
  border: 0;
  border-bottom: 1px solid color-mix(in srgb, var(--primary) 20%, var(--line));
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
body:not(.shop-public-mode) #tableView:is(.is-partners-workspace, .is-settings-workspace) .settings-topic-nav > button {
  padding: 12px 16px;
  border: 0;
  border-bottom: 3px solid transparent;
  border-radius: 0;
  color: color-mix(in srgb, var(--ink) 80%, var(--muted));
  background: color-mix(in srgb, var(--primary) 4%, transparent);
  box-shadow: none;
  font-weight: 600;
}
body:not(.shop-public-mode) #tableView:is(.is-partners-workspace, .is-settings-workspace) .settings-topic-nav > button:hover {
  color: var(--primary-strong);
  background: var(--surface-strong);
}
body:not(.shop-public-mode) #tableView:is(.is-partners-workspace, .is-settings-workspace) .settings-topic-nav > button.is-active {
  border-bottom-color: var(--primary);
  color: var(--primary-strong);
  background: linear-gradient(180deg, color-mix(in srgb, var(--leaf) 18%, var(--surface)), color-mix(in srgb, var(--primary) 30%, var(--surface)));
  font-weight: 700;
}
body:not(.shop-public-mode) #tableView.is-settings-workspace .settings-detail-nav {
  border: 0;
  padding: 0;
  background: transparent;
  box-shadow: none;
}
body:not(.shop-public-mode) #tableView.is-settings-workspace .settings-detail-nav > button {
  border: 1px solid transparent;
  border-radius: var(--layout-button-radius);
  color: color-mix(in srgb, var(--ink) 80%, var(--muted));
  background: transparent;
  box-shadow: none;
  font-weight: 600;
}
body:not(.shop-public-mode) #tableView.is-settings-workspace .settings-detail-nav > button:hover {
  color: var(--primary-strong);
  background: linear-gradient(135deg, color-mix(in srgb, var(--leaf) 14%, var(--surface)), var(--surface-strong));
  box-shadow: none;
}
body:not(.shop-public-mode) #tableView.is-settings-workspace .settings-detail-nav > button.is-active {
  color: var(--primary-strong);
  background: linear-gradient(135deg, color-mix(in srgb, var(--leaf) 34%, var(--surface)), color-mix(in srgb, var(--primary) 26%, var(--surface)));
  font-weight: 700;
}
body:not(.shop-public-mode) #tableView:is(.is-partners-workspace, .is-settings-workspace) :is(.settings-topic-nav, .settings-detail-nav) > button:focus-visible {
  outline: 2px solid var(--primary);
  outline-offset: 2px;
}
body:not(.shop-public-mode) #tableView.is-settings-workspace .settings-integration-card {
  border: 0;
  background: radial-gradient(circle at top left, color-mix(in srgb, var(--leaf) 10%, transparent), transparent 22rem), var(--surface);
  box-shadow: none;
}
body:not(.shop-public-mode) #tableView.is-settings-workspace .settings-integration-card h3 { font-weight: 700; }
body:not(.shop-public-mode) #tableView.is-settings-workspace .settings-integration-card .field-help { line-height: 1.5; }
body:not(.shop-public-mode) #tableView.is-settings-workspace .settings-integration-card img {
  padding: 0; border-radius: 0; background: transparent;
}
body:not(.shop-public-mode) #tableView:is(.is-partners-workspace, .is-settings-workspace) .settings-search-input {
  background: var(--color-table-header);
  border-color: var(--line);
  border-radius: var(--layout-input-radius);
  min-height: var(--layout-input-height);
}
body:not(.shop-public-mode) #tableView:is(.is-partners-workspace, .is-settings-workspace) .settings-search-input:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 3px var(--focus-ring);
}
body:not(.shop-public-mode) #tableView:is(.is-partners-workspace, .is-settings-workspace) > .table-panel {
  border-radius: var(--layout-table-radius);
  background: radial-gradient(circle at top left, color-mix(in srgb, var(--leaf) 8%, transparent), transparent 22rem), var(--surface);
}
/* All three partner tabs reuse the frameless finance list container. */
body:not(.shop-public-mode) #tableView.is-partners-workspace > .table-panel {
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
body:not(.shop-public-mode) #tableView.is-partners-workspace > .table-panel > .table-wrap > table {
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

/* Partner workspace: title/actions, tabs, then the list. No additional cards. */
.workspace-page-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 14px;
  min-width: 0;
  margin-bottom: 12px;
}
.workspace-page-head h2 { margin: 0; color: var(--ink); font-size: var(--font-title-size); font-weight: 700; letter-spacing: -0.025em; }
.workspace-page-actions { min-width: 0; }
.workspace-page-actions .settings-list-actions { gap: 10px; }
.workspace-page-actions button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 42px; }
.workspace-action-icon { width: 18px; height: 18px; flex: 0 0 18px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.workspace-sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
body:not(.shop-public-mode) #tableView:is(.is-partners-workspace, .is-settings-workspace).is-visible {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
}
#tableView.is-partners-workspace > .workspace-page-head { grid-row: 1; }
#tableView.is-partners-workspace > #subNavPanel { grid-row: 2; margin-bottom: 18px; }
#tableView.is-partners-workspace > #actionPanel { grid-row: 3; min-width: 0; }
#tableView.is-partners-workspace > .table-panel { grid-row: 4; min-width: 0; }
#tableView.is-settings-workspace > #subNavPanel { grid-row: 1; }
#tableView.is-settings-workspace > #actionPanel { grid-row: 2; min-width: 0; }
#tableView.is-settings-workspace > .table-panel { grid-row: 3; min-width: 0; }
#tableView.is-partner-list > .table-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
}
#tableView.is-partner-list > .table-panel > .table-toolbar { grid-row: 1; grid-column: 1; margin: 0; min-width: 0; }
#tableView.is-partner-list > .table-panel > .panel-head { grid-row: 1; grid-column: 2; margin: 0; align-self: center; }
#tableView.is-partner-list > .table-panel > .table-wrap { grid-row: 2; grid-column: 1 / -1; border: 0; border-radius: 0; }
#tableView.is-partner-list #tableCount { color: var(--muted); font-weight: 500; background: transparent; padding: 0; }
#tableView.is-partner-list .partner-settings-table:not(.mobile-card-table) { min-width: 960px; table-layout: fixed; }
#tableView.is-partner-list .partner-settings-table:not(.mobile-card-table) th,
#tableView.is-partner-list .partner-settings-table:not(.mobile-card-table) td {
  padding: 10px 12px;
  vertical-align: middle;
  line-height: 1.4;
}
#tableView.is-partner-list .partner-settings-table:not(.mobile-card-table) th { background: var(--color-table-header); color: var(--muted); font-weight: 600; text-transform: none; letter-spacing: normal; font-size: var(--font-table-size); }
#tableView.is-partner-list .partner-settings-table:not(.mobile-card-table) td { height: max(46px, var(--layout-table-row-height)); box-sizing: border-box; }
#tableView.is-partner-list .partner-settings-table:not(.mobile-card-table) th:nth-child(1) { width: 26%; }
#tableView.is-partner-list .partner-settings-table:not(.mobile-card-table) th:nth-child(2) { width: 14%; }
#tableView.is-partner-list .partner-settings-table:not(.mobile-card-table) th:nth-child(3) { width: 10%; }
#tableView.is-partner-list .partner-settings-table:not(.mobile-card-table) th:nth-child(4) { width: 23%; }
#tableView.is-partner-list .partner-settings-table:not(.mobile-card-table) th:nth-child(5) { width: 15%; }
#tableView.is-partner-list .partner-settings-table:not(.mobile-card-table) th:nth-child(6) { width: 84px; text-align: right; }
#tableView.is-partner-list .partner-settings-table:not(.mobile-card-table) th:nth-child(7) { width: 54px; }
#tableView.is-partner-list .partner-settings-table .table-cell-name { font-weight: 600; color: var(--ink); }
#tableView.is-partner-list .partner-settings-table :is(.table-cell-email, .table-cell-phone) { color: var(--muted); }
#tableView.is-partner-list .partner-settings-table:not(.mobile-card-table) .table-cell-site_count { text-align: right; font-variant-numeric: tabular-nums; }
#tableView.is-partner-list .partner-settings-table .partner-row-actions-trigger.mini-button {
  color: var(--muted);
  border-color: transparent;
  background: transparent;
  box-shadow: none;
  border-radius: var(--layout-button-radius);
}
#tableView.is-partner-list .partner-settings-table .partner-row-actions-trigger:is(:hover, [aria-expanded="true"]) { background: var(--surface-strong); color: var(--primary-strong); }
.partner-type-badge { padding: 4px 9px; border-radius: 6px; font-size: 0.85em; font-weight: 500; background: var(--surface-strong); color: var(--ink); }
.partner-type-badge.is-market { background: color-mix(in srgb, var(--primary) 12%, var(--surface)); color: var(--primary-strong); }
.partner-type-badge.is-retail { background: color-mix(in srgb, var(--color-warning) 14%, var(--surface)); color: color-mix(in srgb, var(--color-warning) 60%, var(--ink)); }
body:not(.shop-public-mode) .partner-row-actions-menu {
  min-width: 178px;
  padding: 5px;
  background: var(--surface);
  border-color: var(--line);
  border-radius: var(--layout-button-radius);
  box-shadow: 0 8px 24px color-mix(in srgb, var(--ink) 12%, transparent);
}
body:not(.shop-public-mode) .partner-row-actions-menu .partner-menu-action {
  display: flex;
  align-items: center;
  gap: 10px;
  justify-content: flex-start;
  width: 100%;
  margin: 0;
  padding: 9px 10px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--ink);
  box-shadow: none;
  font-weight: 500;
}
body:not(.shop-public-mode) .partner-row-actions-menu .partner-menu-action:hover { background: var(--surface-strong); }
body:not(.shop-public-mode) .partner-row-actions-menu .partner-menu-action.is-destructive { color: var(--danger); border-top: 1px solid var(--line); margin-top: 4px; border-top-left-radius: 0; border-top-right-radius: 0; }
@media (max-width: 900px) {
  .workspace-page-head { align-items: flex-start; }
  .workspace-page-actions { flex: 1 1 100%; }
  .workspace-page-actions .settings-list-actions { justify-content: flex-start; }
}
@media (max-width: 680px) {
  .workspace-page-head h2 { font-size: min(var(--font-title-size), 24px); }
  .workspace-page-actions button { min-height: 44px; }
  #tableView.is-partner-list > .table-panel { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  #tableView.is-partner-list > .table-panel > .table-toolbar { grid-column: 1; grid-row: 1; }
  #tableView.is-partner-list > .table-panel > .panel-head { grid-column: 1; grid-row: 2; }
  #tableView.is-partner-list > .table-panel > .table-wrap { grid-row: 3; }
  #tableView.is-partner-list .partner-settings-table.mobile-card-table tr { box-shadow: none; border-color: var(--line); border-radius: var(--layout-card-radius); }
  #tableView.is-partner-list .partner-settings-table.mobile-card-table :is(.table-cell-billing_city, .table-cell-phone) { display: grid; grid-template-columns: 1fr; gap: 3px; padding: 6px 0; }
}
/* Finance reuses the business navigation, table and integration surfaces. */
body:not(.shop-public-mode) #tableView:is(.is-accounting-view, .is-employee-hours-view).is-visible { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; }
#tableView:is(.is-accounting-view, .is-employee-hours-view) > #financeWorkspaceHead { grid-row: 1; }
#tableView:is(.is-accounting-view, .is-employee-hours-view) > #subNavPanel { grid-row: 2; margin-bottom: 18px; }
#tableView:is(.is-accounting-view, .is-employee-hours-view) > .table-panel { grid-row: 4; min-width: 0; }
#tableView:is(.is-accounting-view, .is-employee-hours-view) .finance-subnav-card {
  display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px;
  padding: 0; border: 0; background: transparent; box-shadow: none;
}
#tableView:is(.is-accounting-view, .is-employee-hours-view) .finance-subnav-card > .subnav-head { grid-row: 1; min-width: 0; margin: 0; }
#tableView:is(.is-accounting-view, .is-employee-hours-view) .finance-subnav-card .subnav-buttons {
  width: 100%; max-width: 100%; box-sizing: border-box; gap: 8px;
  padding: 0; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; background: transparent; box-shadow: none;
}
#tableView:is(.is-accounting-view, .is-employee-hours-view) .finance-subnav-card .subnav-buttons > button {
  padding: 12px 16px; border: 0; border-bottom: 3px solid transparent; border-radius: 0;
  color: var(--muted); background: transparent; box-shadow: none; font-weight: 600;
}
#tableView:is(.is-accounting-view, .is-employee-hours-view) .finance-subnav-card .subnav-buttons > button.is-active {
  border-bottom-color: var(--primary); color: var(--primary-strong);
  background: linear-gradient(180deg, color-mix(in srgb, var(--leaf) 18%, var(--surface)), color-mix(in srgb, var(--primary) 30%, var(--surface))); font-weight: 700;
}
#tableView:is(.is-accounting-view, .is-employee-hours-view) .finance-detail-nav {
  grid-row: 2; min-width: 0; max-width: 100%; box-sizing: border-box; margin: 0;
  padding: 0; border: 0; background: transparent; box-shadow: none;
}
#tableView:is(.is-accounting-view, .is-employee-hours-view) :is(.finance-detail-nav, .accounting-outgoing-toolbar .tab-selector) > button {
  border: 0; border-radius: var(--layout-button-radius); color: var(--muted); background: transparent; box-shadow: none; font-weight: 600;
}
#tableView:is(.is-accounting-view, .is-employee-hours-view) :is(.finance-detail-nav, .accounting-outgoing-toolbar .tab-selector) > button:hover {
  color: var(--primary-strong); background: linear-gradient(135deg, color-mix(in srgb, var(--leaf) 14%, var(--surface)), var(--surface-strong));
}
#tableView:is(.is-accounting-view, .is-employee-hours-view) :is(.finance-detail-nav, .accounting-outgoing-toolbar .tab-selector) > button.is-active {
  color: var(--primary-strong); background: linear-gradient(135deg, color-mix(in srgb, var(--leaf) 34%, var(--surface)), color-mix(in srgb, var(--primary) 26%, var(--surface))); font-weight: 700;
}
#tableView.is-accounting-view :is(.billing-documents-panel, .accounting-transfers) {
  min-width: 0; padding: var(--layout-card-padding); border: 1px solid var(--line); border-radius: var(--layout-card-radius);
  color: var(--ink); background: radial-gradient(circle at top left, color-mix(in srgb, var(--leaf) 8%, transparent), transparent 22rem), var(--surface); box-shadow: none;
}
#tableView.is-accounting-view .billing-card-head h3 { font-size: 1.05rem; letter-spacing: -0.02em; }
#tableView.is-accounting-view #accountingBepplerDownloadForm { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px; margin: 0 0 16px; }
#tableView.is-accounting-view .accounting-download-grid { flex: 0 1 210px; min-width: 180px; margin: 0; }
#tableView.is-accounting-view .accounting-actions { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; }
#tableView.is-accounting-view .accounting-actions button { min-height: 42px; }
#tableView.is-accounting-view .finance-panel-fold:not(.accounting-connection-panel) {
  padding: 12px 0; border: 0; border-top: 1px solid var(--line); border-radius: 0; background: transparent; box-shadow: none;
}
#tableView.is-accounting-view .finance-panel-fold > summary { gap: 12px; min-height: 44px; color: var(--ink); }
#tableView.is-accounting-view .finance-panel-fold > summary > div { min-width: 0; flex: 1; }
#tableView.is-accounting-view .finance-panel-fold > summary h3 { margin: 2px 0; font-size: 1rem; }
#tableView.is-accounting-view .finance-panel-fold > summary .eyebrow { display: block; margin: 0 0 4px; color: var(--muted); font-size: 0.7rem; font-weight: 600; }
#tableView.is-accounting-view .finance-fold-tools { display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-end; gap: 10px; }
#tableView.is-accounting-view .finance-fold-actions { justify-content: flex-end; margin: 10px 0; }
#tableView.is-accounting-view .finance-provider-mark { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 84px; }
#tableView.is-accounting-view .finance-provider-mark img { width: 84px; height: 32px; object-fit: contain; }
#tableView.is-accounting-view .finance-provider-mark svg { width: 28px; height: 28px; color: var(--primary-strong); }
#tableView.is-accounting-view .accounting-settings-workspace { align-items: start; }
#tableView.is-accounting-view .accounting-connection-panel > form { margin-top: 16px; }
#tableView.is-accounting-view :is(.accounting-outgoing-filters, .accounting-outgoing-toolbar) { display: flex; align-items: flex-end; flex-wrap: wrap; gap: 12px; min-width: 0; }
#tableView.is-accounting-view .accounting-outgoing-toolbar { align-items: center; justify-content: space-between; }
#tableView.is-accounting-view .accounting-outgoing-toolbar :is(.tab-selector, .form-actions) { margin: 0; padding: 0; border: 0; background: transparent; box-shadow: none; }
#tableView.is-accounting-view .accounting-outgoing-toolbar .form-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
#tableView.is-accounting-view .accounting-transfer-filters { padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
#tableView.is-accounting-view .accounting-transfer-control { color: var(--muted); font-size: 0.8rem; }
#tableView.is-accounting-view .accounting-transfer-control :is(select, .settings-search-input) {
  border-color: var(--line); border-radius: var(--layout-input-radius); color: var(--ink); background: var(--surface); font-size: var(--font-input-size);
}
#tableView.is-accounting-view .accounting-transfers :is(input, select, button, [data-select]):focus-visible,
#tableView.is-accounting-view .finance-panel-fold > summary:focus-visible {
  outline: 2px solid var(--primary); outline-offset: 2px;
}
#tableView.is-accounting-view .accounting-transfer-table-wrap { border: 0; border-radius: 0; background: transparent; }
#tableView.is-accounting-view :is(.accounting-transfer-table, .accounting-transfer-invoices .mini-table) :is(th, td) {
  padding: 9px 12px; border-bottom-color: var(--line); line-height: 1.4; vertical-align: middle;
}
#tableView.is-accounting-view :is(.accounting-transfer-table, .accounting-transfer-invoices .mini-table) th {
  color: var(--muted); background: var(--color-table-header); font-size: var(--font-table-size); text-transform: none; letter-spacing: normal;
}
#tableView.is-accounting-view .accounting-transfer-table :is(td, th).accounting-transfer-amount { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
#tableView.is-accounting-view #accountingTransfersRoot .accounting-transfer-table > thead > tr > th:nth-child(6) { text-align: right; }
#tableView.is-accounting-view .accounting-transfer-invoices .mini-table :is(th, td):nth-last-child(-n+3) { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
#tableView.is-accounting-view .accounting-transfer-table .accounting-transfer-row.is-selected > td { background: var(--selection-soft); }
#tableView.is-accounting-view .accounting-transfer-table .accounting-transfer-row:not(.is-selected):hover > td { background: var(--surface-strong); }
#tableView.is-accounting-view :is(.accounting-transfer-expand, .accounting-transfer-menu-cell > button, .accounting-transfer-close, .accounting-transfer-card-heading button) { color: var(--primary-strong); border-radius: var(--layout-button-radius); }
#tableView.is-accounting-view .accounting-transfer-badge { min-height: 26px; border-radius: 6px; font-weight: 500; }
#tableView.is-accounting-view .accounting-transfer-badge.is-paid { color: var(--primary-strong); background: color-mix(in srgb, var(--primary) 12%, var(--surface)); }
#tableView.is-accounting-view .accounting-transfer-badge.is-transfer { color: color-mix(in srgb, var(--color-warning) 60%, var(--ink)); background: color-mix(in srgb, var(--color-warning) 14%, var(--surface)); }
#tableView.is-accounting-view .accounting-transfer-badge.is-missing { color: var(--danger); background: color-mix(in srgb, var(--danger) 12%, var(--surface)); }
#tableView.is-accounting-view .accounting-transfer-badge.is-card { color: var(--color-info); background: color-mix(in srgb, var(--color-info) 12%, var(--surface)); }
#tableView.is-accounting-view .accounting-transfer-badge.is-neutral { color: var(--muted); background: var(--surface-strong); }
#tableView.is-accounting-view .accounting-transfer-selected { padding: 16px 0 0; border: 0; border-top: 1px solid var(--line); border-radius: 0; background: var(--surface); box-shadow: none; }
#tableView.is-accounting-view .accounting-transfer-facts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
#tableView.is-accounting-view .accounting-transfer-facts span:first-child { color: var(--muted); }
#tableView.is-accounting-view .accounting-transfer-facts .accounting-transfer-copyable > :is(span, strong) { color: var(--ink); font-size: 0.88rem; }
#tableView.is-accounting-view .accounting-transfer-copy { border-radius: var(--layout-button-radius); }
#tableView.is-accounting-view .accounting-transfer-copy:is(:hover, .is-copied) { background: var(--selection-soft); }
#tableView.is-accounting-view .accounting-transfer-actions .accounting-transfer-settle { color: var(--color-button-text); background: linear-gradient(135deg, var(--primary), var(--primary-strong)); border-radius: var(--layout-button-radius); }
#tableView.is-accounting-view .accounting-transfer-actions .accounting-transfer-settle:hover:not(:disabled) { background: linear-gradient(135deg, var(--primary), color-mix(in srgb, var(--primary-strong) 88%, var(--primary))); }
#tableView.is-accounting-view .accounting-transfer-menu { color: var(--ink); background: var(--surface); border-color: var(--line); border-radius: var(--layout-button-radius); box-shadow: 0 8px 24px color-mix(in srgb, var(--ink) 12%, transparent); }
#tableView.is-accounting-view .accounting-transfer-menu button { color: var(--ink); background: transparent; border-radius: var(--layout-button-radius); }
#tableView.is-accounting-view .accounting-transfer-menu button:hover { background: var(--surface-strong); }
#tableView.is-accounting-view .accounting-transfer-dialog { color: var(--ink); border-color: var(--line); border-radius: var(--layout-card-radius); background: radial-gradient(circle at top left, color-mix(in srgb, var(--leaf) 18%, transparent), transparent 22rem), var(--surface); }
#tableView.is-accounting-view .accounting-outgoing-group { border-color: var(--line); border-radius: var(--layout-card-radius); background: var(--surface); padding: 12px; }
#tableView.is-accounting-view .accounting-outgoing-group > summary { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 8px 16px; min-height: 44px; cursor: pointer; }
#tableView.is-accounting-view .accounting-outgoing-group > .accounting-transfer-card-meta { margin: 8px 0; }
#tableView.is-accounting-view [data-message]:empty { display: none; }
#tableView.is-employee-hours-view .employee-hours-page { width: 100%; margin: 0; padding: 0; min-width: 0; }
#tableView.is-employee-hours-view .employee-hours-card { width: 100%; min-width: 0; padding: 0; border: 0; border-radius: 0; box-shadow: none; background: transparent; }
#tableView.is-employee-hours-view .employee-hours-card[hidden] { display: none; }
#tableView.is-employee-hours-view .employee-hours-card .panel-head { margin: 0 0 16px; gap: 12px; }
#tableView.is-employee-hours-view .employee-hours-card h3 { font-size: 1.05rem; letter-spacing: 0; }
#tableView.is-employee-hours-view .employee-hours-summary { gap: 12px 24px; margin: 0 0 16px; padding: 12px 0; border-block: 1px solid var(--line); }
#tableView.is-employee-hours-view .employee-hours-summary > span { padding: 0; border: 0; border-radius: 0; background: transparent; color: var(--muted); }
#tableView.is-employee-hours-view .employee-hours-summary strong { color: var(--ink); font-variant-numeric: tabular-nums; }
#tableView.is-employee-hours-view .employee-profile-fields { grid-template-columns: minmax(180px, 1.3fr) repeat(2, minmax(140px, 1fr)) auto; }
#tableView.is-employee-hours-view .employee-hours-fields { grid-template-columns: minmax(180px, 1.3fr) repeat(3, minmax(130px, 1fr)); }
#tableView.is-employee-hours-view .employee-hours-report-filters { gap: 12px; }
#tableView.is-employee-hours-view .employee-hours-card :is(input, select) { border-color: var(--line); border-radius: var(--layout-input-radius); color: var(--ink); background: var(--surface); font-size: var(--font-input-size); }
#tableView.is-employee-hours-view .employee-hours-card :is(button, input, select):focus-visible,
#tableView.is-employee-hours-view .finance-detail-nav button:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
#tableView.is-employee-hours-view .employee-hours-card :is(th, td) { padding: 9px 12px; border-bottom-color: var(--line); line-height: 1.4; vertical-align: middle; }
#tableView.is-employee-hours-view .employee-hours-card th { color: var(--muted); background: var(--color-table-header); font-weight: 600; text-transform: none; letter-spacing: 0; }
#tableView.is-employee-hours-view .employee-hours-card td:not(:first-child):not(.action-cell) { font-variant-numeric: tabular-nums; }
#tableView.is-employee-hours-view .employee-hours-card .action-cell button { min-height: 44px; }
@media (max-width: 1100px) {
  #tableView.is-employee-hours-view :is(.employee-profile-fields, .employee-hours-fields) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
  #tableView.is-employee-hours-view .finance-detail-nav { display: flex; flex-wrap: wrap; gap: 8px; }
  #tableView.is-employee-hours-view .finance-detail-nav > button { flex: 1 1 auto; min-height: 44px; padding: 10px 12px; }
  #tableView.is-employee-hours-view .employee-hours-week-nav { justify-content: flex-start; gap: 8px; width: 100%; }
  #tableView.is-employee-hours-view .employee-hours-week-nav .pill { order: -1; flex-basis: 100%; border: 0; padding: 0; background: transparent; }
  #tableView.is-employee-hours-view .employee-hours-report-filters { width: 100%; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr); }
  #tableView.is-employee-hours-view .employee-hours-report-filters .field { min-width: 0; }
  #tableView.is-employee-hours-view .employee-hours-card .mobile-card-table tr { border-color: var(--line); border-radius: var(--layout-card-radius); background: var(--surface); box-shadow: none; }
  #tableView.is-employee-hours-view .employee-hours-card .mobile-card-table td { white-space: normal; overflow-wrap: anywhere; }
  #tableView.is-employee-hours-view .employee-hours-card .mobile-card-table .action-cell { gap: 8px; }
}
@media (max-width: 480px) {
  #tableView.is-employee-hours-view :is(.employee-profile-fields, .employee-hours-fields) { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 900px) {
  #tableView.is-accounting-view .billing-card-head { flex-wrap: wrap; }
  #tableView.is-accounting-view .accounting-actions { flex: 1 1 100%; }
  #tableView.is-accounting-view .accounting-outgoing-toolbar .form-actions { flex: 1 1 100%; }
}
@media (max-width: 767px) {
  #tableView.is-accounting-view .accounting-transfers { padding: 0; border: 0; background: transparent; }
  #tableView.is-accounting-view .accounting-transfer-card { color: var(--ink); border-color: var(--line); border-radius: var(--layout-card-radius); background: var(--surface); box-shadow: none; }
  #tableView.is-accounting-view .accounting-transfer-card.is-selected { border-color: var(--primary); background: var(--selection-soft); }
  #tableView.is-accounting-view .accounting-transfer-card-meta { color: var(--muted); }
  #tableView.is-accounting-view .accounting-transfer-mobile-top button { color: var(--primary-strong); border-color: var(--line); border-radius: var(--layout-button-radius); background: var(--surface); }
  #tableView.is-accounting-view .accounting-transfer-mobile-filters.is-open { border-color: var(--line); border-radius: var(--layout-card-radius); background: var(--surface); }
  #tableView.is-accounting-view .accounting-transfer-selected { padding: 14px; border: 1px solid var(--line); border-radius: var(--layout-card-radius); }
  #tableView.is-accounting-view .accounting-transfer-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #tableView.is-accounting-view .accounting-outgoing-filters > .field { flex: 1 1 160px; }
  #tableView.is-accounting-view .accounting-outgoing-filters > .accounting-transfer-search { flex: 1 1 100%; }
  #tableView.is-accounting-view .finance-fold-tools .billing-fold-edit { font-size: 0; gap: 0; }
  #tableView.is-accounting-view .finance-fold-tools .billing-fold-edit::after { font-size: 1rem; }
  #tableView.is-accounting-view .finance-provider-mark { flex-basis: 56px; }
  #tableView.is-accounting-view .finance-provider-mark img { width: 56px; }
  #tableView.is-accounting-view .accounting-connection-panel > summary { flex-wrap: wrap; }
  #tableView.is-accounting-view .accounting-connection-panel .finance-fold-tools { flex: 1 1 100%; justify-content: flex-start; }
}
/* One surface per section. Layout-only wrappers never add another frame;
   field boundaries, row separators, focus rings and semantic colours stay. */
body:not(.shop-public-mode) #tableView:is(.is-settings-workspace, .is-partners-workspace) > .table-panel > .table-wrap,
body:not(.shop-public-mode) #tableView.is-accounting-view .accounting-transfer-invoices > .table-wrap,
body:not(.shop-public-mode) #tableView.is-employee-hours-view .employee-hours-card .table-wrap,
body:not(.shop-public-mode) #tableView.is-billing-view .billing-reform .table-wrap {
  border: 0; border-radius: 0; box-shadow: none;
}
body:not(.shop-public-mode) #tableView:is(.is-settings-workspace, .is-partners-workspace, .is-accounting-view, .is-employee-hours-view) > .table-panel > .table-wrap > table > tbody > tr > .full-panel-cell {
  padding: 0; border: 0; background: transparent;
}
body:not(.shop-public-mode) #tableView.is-settings-workspace .settings-matrix-wrap {
  border: 0; border-radius: 0; box-shadow: none;
}
body:not(.shop-public-mode) #tableView.is-settings-workspace .settings-email-template-shell .email-card {
  padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none;
}
body:not(.shop-public-mode) #tableView.is-settings-workspace .sidebar-group-editor {
  padding: 12px 0; border: 0; border-radius: 0; background: transparent;
}
body:not(.shop-public-mode) #tableView.is-settings-workspace .sidebar-group-editor + .sidebar-group-editor { border-top: 1px solid var(--line); }
body:not(.shop-public-mode) #tableView.is-settings-workspace .settings-sort-row {
  border: 0; border-bottom: 1px solid var(--line); border-radius: 0; background: transparent;
}
body:not(.shop-public-mode) .settings-workspace-dialog :is(.settings-modal-content, .settings-editor-card, .billing-editor-card, .profile-settings-card) {
  margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none;
}
body:not(.shop-public-mode) .account-profile-dialog .profile-password-card:not(.profile-security-fold) {
  padding: 12px 0; border: 0; border-radius: 0; background: transparent;
}
@media (prefers-reduced-motion: reduce) {
  body:not(.shop-public-mode) .sidebar .nav-item,
  body:not(.shop-public-mode) .workspace-page-actions button { transition: none; }
}