/* erp-theme-matrix-v3
 * 全站系统 / 白天 / 夜间外观矩阵。
 * 只覆盖屏幕颜色，不改变布局、业务状态、打印纸张、邮件正文或数据逻辑。
 */

html[data-gc-appearance="light"] {
  --gc-surface-canvas: #F5F5F7;
  --gc-surface-panel: #FFFFFF;
  --gc-surface-card: #FFFFFF;
  --gc-surface-subtle: #F1F1F4;
  --gc-surface-hover: #EAEAEE;
  --gc-text-primary: #1D1D1F;
  --gc-text-secondary: #49494E;
  --gc-text-tertiary: #76767C;
  --gc-border: rgba(60, 60, 67, 0.14);
  --gc-border-strong: rgba(60, 60, 67, 0.22);
  --gc-shadow-panel: 0 1px 2px rgba(0, 0, 0, 0.04), 0 10px 30px rgba(0, 0, 0, 0.05);
  --bg: var(--gc-surface-canvas);
  --bg-elevated: var(--gc-surface-panel);
  --bg-sunken: var(--gc-surface-subtle);
  --bg-hover: var(--gc-surface-hover);
  --surface: var(--gc-surface-panel);
  --bg-card: var(--gc-surface-card);
  --bg-soft: var(--gc-surface-subtle);
  --ink: var(--gc-text-primary);
  --ink-strong: var(--gc-text-primary);
  --ink-soft: var(--gc-text-secondary);
  --ink-mute: var(--gc-text-tertiary);
  --ink-faint: #98989D;
  --line: var(--gc-border);
  --border: var(--gc-border);
  --line-soft: var(--gc-border);
  --hairline: var(--gc-border);
  --line-strong: var(--gc-border-strong);
  --border-strong: var(--gc-border-strong);
  --gc-bdf: var(--gc-border);
}

html[data-gc-appearance="dark"] {
  --gc-surface-canvas: #101114;
  --gc-surface-panel: #1C1C1E;
  --gc-surface-card: #242426;
  --gc-surface-subtle: #151518;
  --gc-surface-hover: #2C2C2E;
  --gc-text-primary: #F5F5F7;
  --gc-text-secondary: #D1D1D6;
  --gc-text-tertiary: #98989D;
  --gc-border: rgba(255, 255, 255, 0.14);
  --gc-border-strong: rgba(255, 255, 255, 0.22);
  --gc-shadow-panel: 0 1px 2px rgba(0, 0, 0, 0.28), 0 14px 38px rgba(0, 0, 0, 0.18);
}

html[data-gc-accent="blue"] { --gc-accent-light: #007AFF; --gc-accent-dark: #0A84FF; --gc-accent-hover-light: #0068D8; --gc-accent-hover-dark: #409CFF; --gc-accent-rgb: 0, 122, 255; }
html[data-gc-accent="purple"] { --gc-accent-light: #6857D9; --gc-accent-dark: #8B7CFF; --gc-accent-hover-light: #5848C5; --gc-accent-hover-dark: #A59AFF; --gc-accent-rgb: 104, 87, 217; }
html[data-gc-accent="rose"] { --gc-accent-light: #C04A78; --gc-accent-dark: #E56D9B; --gc-accent-hover-light: #A93E69; --gc-accent-hover-dark: #F18BB0; --gc-accent-rgb: 192, 74, 120; }
html[data-gc-accent="red"] { --gc-accent-light: #D64747; --gc-accent-dark: #FF6961; --gc-accent-hover-light: #BC3B3B; --gc-accent-hover-dark: #FF8780; --gc-accent-rgb: 214, 71, 71; }
html[data-gc-accent="orange"] { --gc-accent-light: #C96B2C; --gc-accent-dark: #FF9F4A; --gc-accent-hover-light: #AE5C25; --gc-accent-hover-dark: #FFB773; --gc-accent-rgb: 201, 107, 44; }
html[data-gc-accent="green"] { --gc-accent-light: #2F8A5B; --gc-accent-dark: #48B879; --gc-accent-hover-light: #28764E; --gc-accent-hover-dark: #6BCC96; --gc-accent-rgb: 47, 138, 91; }
html[data-gc-accent="teal"] { --gc-accent-light: #237D86; --gc-accent-dark: #45AEB8; --gc-accent-hover-light: #1D6971; --gc-accent-hover-dark: #6AC5CD; --gc-accent-rgb: 35, 125, 134; }
html[data-gc-accent="graphite"] { --gc-accent-light: #5C5C64; --gc-accent-dark: #9B9BA3; --gc-accent-hover-light: #4C4C53; --gc-accent-hover-dark: #B3B3BA; --gc-accent-rgb: 92, 92, 100; }
html[data-gc-accent="custom"] { --gc-accent-light: var(--gc-custom-accent, #007AFF); --gc-accent-dark: var(--gc-custom-accent, #0A84FF); --gc-accent-hover-light: var(--gc-custom-accent-hover-light, #0068D8); --gc-accent-hover-dark: var(--gc-custom-accent-hover-dark, #409CFF); --gc-accent-rgb: var(--gc-custom-accent-rgb, 0, 122, 255); }

html[data-gc-appearance="light"] {
  color-scheme: light;
}

html[data-gc-appearance="dark"] {
  color-scheme: dark;

  /* Primitive -> semantic: macOS 深色中性层。 */
  --bg: #101114;
  --bg-elevated: #1C1C1E;
  --bg-sunken: #151518;
  --bg-hover: #2C2C2E;
  --ink: #F5F5F7;
  --ink-soft: #D1D1D6;
  --ink-mute: #A1A1AA;
  --line: rgba(255, 255, 255, 0.14);
  --line-strong: rgba(255, 255, 255, 0.22);
  --surface: var(--bg-elevated);
  --bg-card: var(--bg-elevated);
  --bg-soft: var(--bg-hover);
  --border: var(--line);
  --border-strong: var(--line-strong);
  --line-soft: var(--line);
  --hairline: var(--line);
  --ink-strong: var(--ink);
  --ink-faint: #8E8E93;
  --gc-bdf: var(--line);
  --apple-blue: #0A84FF;
  --apple-blue-hover: #409CFF;
  --apple-blue-bg: rgba(10, 132, 255, 0.20);
  --accent: var(--apple-blue);
  --accent-soft: var(--apple-blue-bg);
  --accent-blue-bg: var(--apple-blue-bg);
  --info: var(--apple-blue);
  --ok: #30D158;
  --ok-bg: rgba(48, 209, 88, 0.17);
  --warn: #FF9F0A;
  --warn-bg: rgba(255, 159, 10, 0.17);
  --danger: #FF453A;
  --danger-bg: rgba(255, 69, 58, 0.17);
  --photo: #0A84FF;
  --photo-bg: rgba(10, 132, 255, 0.18);
  --await-fit: #FFD60A;
  --await-fit-bg: rgba(255, 214, 10, 0.16);
  --stage-dev: #BF5AF2;
  --stage-dev-bg: rgba(191, 90, 242, 0.17);
  --stage-revise: #FF9F0A;
  --stage-revise-bg: rgba(255, 159, 10, 0.17);
  --stage-prod: #0A84FF;
  --stage-prod-bg: rgba(10, 132, 255, 0.18);
  --stage-done: #30D158;
  --stage-done-bg: rgba(48, 209, 88, 0.17);
  --stage-archived: #98989D;
  --stage-archived-bg: rgba(142, 142, 147, 0.18);
  --gray: var(--stage-archived);
  --gray-bg: var(--stage-archived-bg);
  --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.28);
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.30);
  --shadow-md: 0 7px 22px rgba(0, 0, 0, 0.34);
  --shadow-lg: 0 16px 42px rgba(0, 0, 0, 0.42);
  --shadow-xl: 0 28px 74px rgba(0, 0, 0, 0.52);
  --bg-soft-gradient: linear-gradient(180deg, #1C1C1E 0%, #101114 100%);
  --focus-ring: 0 0 0 3px rgba(10, 132, 255, 0.28);
}

html[data-gc-appearance="dark"] body {
  background: var(--bg);
  color: var(--ink);
}

/* macOS 语义桥：Peter 灰度层原本会在 .app-shell 内重新写回浅色 token。
 * 夜间必须同步改写整套 px token，避免出现白色底板、黑色卡片和黑色文字混杂。 */
html[data-gc-appearance="dark"] body.peter-appearance-enabled {
  --px-bg: #101114;
  --px-surface: #1C1C1E;
  --px-surface-soft: #151518;
  --px-surface-hover: #2C2C2E;
  --px-line: rgba(255, 255, 255, 0.14);
  --px-line-strong: rgba(255, 255, 255, 0.22);
  --px-text: #F5F5F7;
  --px-text-soft: #D1D1D6;
  --px-text-mute: #98989D;
  --px-blue: #0A84FF;
  --px-blue-hover: #409CFF;
  --px-blue-soft: rgba(10, 132, 255, 0.20);
  --px-danger: #FF453A;
  --px-shadow-panel: 0 1px 2px rgba(0, 0, 0, 0.28);
  --px-shadow-float: 0 22px 58px rgba(0, 0, 0, 0.52), 0 3px 12px rgba(0, 0, 0, 0.28);
}

html[data-gc-appearance="dark"] body:not(.gc-has-wallpaper) :is(.app-shell, .content-area, main#main) {
  background-color: var(--bg) !important;
  background-image: none !important;
  color: var(--ink);
}

html[data-gc-appearance="dark"] body :is(
  .sidebar,
  .gc-admin-page-head,
  #controlsBar,
  .controls,
  .mobile-tabbar,
  .mobile-topbar
) {
  border-color: var(--line) !important;
  background-color: rgba(18, 21, 28, 0.96) !important;
  color: var(--ink) !important;
}

html[data-gc-appearance="dark"] body .sidebar :is(
  .sidebar-logo,
  .logo-text,
  .sidebar-header-actions button,
  .nav-item,
  .nav-icon,
  .peter-account-trigger,
  .peter-account-trigger-copy,
  .peter-account-trigger-copy small
) {
  color: var(--ink-soft) !important;
}

html[data-gc-appearance="dark"] body .sidebar .nav-item:hover {
  background: rgba(255, 255, 255, 0.07) !important;
}

html[data-gc-appearance="dark"] body .sidebar .nav-item.active {
  background: rgba(255, 255, 255, 0.13) !important;
  color: #FFFFFF !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.06) !important;
}

html[data-gc-appearance="dark"] body .sidebar .nav-count {
  background: rgba(255, 255, 255, 0.12) !important;
  color: var(--ink-soft) !important;
}

html[data-gc-appearance="dark"] body .app-shell :is(
  .today-page,
  .archive-page-v2,
  .patternlog-page,
  .plog-page,
  .ship-page,
  .acc-page,
  .client-info-page,
  .followup-guide-page,
  .dash-page,
  .fudesk-page,
  .pfdesk-page,
  .recycle-page,
  .admin-wrap,
  .peter-ai-workbench-page,
  .quote-tool-page,
  .recording-dashboard,
  .today-scroll-region
) {
  color: var(--ink) !important;
  background-color: transparent !important;
}

html[data-gc-appearance="dark"] body .app-shell :is(
  .today-section,
  .pm-subgroup,
  .pv2-grp,
  .pq2-grp,
  .followup-po-alert,
  .ship-card,
  .ship-strip,
  .ship-table-wrap,
  .gc-ops-card,
  .gc-ops-panel,
  .gc-ops-table-wrap,
  .dashboard-card,
  .archive-card,
  .plog-card,
  .fudesk-card,
  .pfdesk-card,
  .recycle-card,
  .admin-card,
  .quote-card,
  .filter-group,
  .peter-dev-filter-stack,
  .peter-followup-filter-stack
) {
  border-color: var(--line) !important;
  background-color: var(--bg-elevated) !important;
  background-image: none !important;
  color: var(--ink) !important;
  box-shadow: var(--shadow-xs) !important;
}

html[data-gc-appearance="dark"] body .app-shell :is(
  .pm-subgroup-body,
  .pv2-body,
  .pq2-section-body,
  .today-section > .section-content
) {
  background-color: var(--bg-elevated) !important;
  color: var(--ink) !important;
}

html[data-gc-appearance="dark"] body .app-shell :is(
  .today-card-v2,
  .style-card,
  .style-row,
  .po-card,
  .po-item,
  .pq2-po,
  .pq2-st,
  .pq2-report-btn,
  .ship-row-card,
  .gc-ops-row-card,
  .followup-po-card,
  .cycle-card,
  .record-card
) {
  border-color: var(--line) !important;
  background-color: #242426 !important;
  background-image: none !important;
  color: var(--ink) !important;
}

html[data-gc-appearance="dark"] body .app-shell :is(
  .today-card-v2,
  .style-card,
  .style-row,
  .po-card,
  .po-item,
  .pq2-po,
  .pq2-st,
  .ship-row-card
):hover {
  background-color: #2C2C2E !important;
}

html[data-gc-appearance="dark"] body .app-shell :is(
  .today-card-sku,
  .today-card-name,
  .today-card-po,
  .today-card-action-main,
  .pm-subgroup-h .title,
  .pv2-h .t,
  .pq2-id,
  .pq2-st b,
  .pq2-pono
) {
  color: var(--ink) !important;
}

html[data-gc-appearance="dark"] body .app-shell :is(
  .pm-subgroup-h .desc,
  .pv2-h .why,
  .pq2-act,
  .pq2-meta,
  .pq2-note,
  .today-card-action-detail
) {
  color: var(--ink-mute) !important;
}

html[data-gc-appearance="dark"] body .app-shell .pq2-po.pq2-flag-red {
  border-color: rgba(255, 69, 58, 0.34) !important;
  background-color: rgba(74, 28, 31, 0.92) !important;
}

html[data-gc-appearance="dark"] body .app-shell .pq2-po.pq2-flag-rew {
  border-color: rgba(191, 90, 242, 0.34) !important;
  background-color: rgba(54, 31, 66, 0.92) !important;
}

html[data-gc-appearance="dark"] body .app-shell :is(
  .pm-subgroup-h,
  .pv2-h,
  .pq2-h,
  .today-section > h2,
  .ship-section-head,
  .gc-ops-card-head,
  thead,
  thead tr,
  thead th
) {
  border-color: var(--line) !important;
  background-color: var(--bg-sunken) !important;
  color: var(--ink-soft) !important;
}

html[data-gc-appearance="dark"] body .app-shell :is(table, th, td, tr) {
  border-color: var(--line) !important;
}

html[data-gc-appearance="dark"] body .app-shell tbody tr:hover {
  background-color: rgba(255, 255, 255, 0.035) !important;
}

html[data-gc-appearance="dark"] body :is(input, select, textarea) {
  border-color: var(--line-strong) !important;
  background-color: #20242C !important;
  color: var(--ink) !important;
  caret-color: var(--apple-blue);
}

html[data-gc-appearance="dark"] body :is(input, textarea)::placeholder {
  color: var(--ink-mute) !important;
  opacity: 1;
}

html[data-gc-appearance="dark"] body .login-page {
  background: linear-gradient(135deg, #090B10 0%, #11151D 52%, #0D1017 100%) !important;
}

html[data-gc-appearance="dark"] body .login-card {
  border-color: var(--line-strong) !important;
  background: rgba(24, 28, 36, 0.94) !important;
  color: var(--ink) !important;
  box-shadow: var(--shadow-xl) !important;
}

html[data-gc-appearance="dark"] body .login-beian a {
  color: var(--ink-mute) !important;
}

html[data-gc-appearance="dark"] body .login-field input:focus {
  background: #242932 !important;
}

html[data-gc-appearance="dark"] body :is(
  .peter-account-menu,
  .alert-panel,
  .command-menu,
  .gc-form-dialog,
  .gc-wallpaper-dialog,
  .modal-content,
  .drawer-content,
  [role="dialog"]
) {
  border-color: var(--line-strong) !important;
  background-color: #1A1E26 !important;
  color: var(--ink) !important;
  box-shadow: var(--shadow-xl) !important;
}

html[data-gc-appearance="dark"] body :is(
  .peter-account-menu-item,
  .gc-wallpaper-head,
  .gc-wallpaper-copy,
  .gc-wallpaper-appearance-label,
  .gc-admin-page-head,
  .gc-admin-page-head strong,
  h1,
  h2,
  h3,
  h4
) {
  border-color: var(--line) !important;
  color: var(--ink) !important;
}

html[data-gc-appearance="dark"] body :is(
  .peter-account-summary-copy small,
  .gc-wallpaper-head p,
  .gc-wallpaper-copy span,
  .muted,
  .meta,
  .sub,
  .desc
) {
  color: var(--ink-mute) !important;
}

html[data-gc-appearance="dark"] body .peter-account-menu-item:hover,
html[data-gc-appearance="dark"] body .peter-account-menu-item:focus-visible {
  background: rgba(255, 255, 255, 0.08) !important;
}

html[data-gc-appearance="dark"] body .gc-wallpaper-appearance-options {
  border-color: var(--line) !important;
  background: rgba(255, 255, 255, 0.08) !important;
}

html[data-gc-appearance="dark"] body .gc-wallpaper-appearance-option {
  color: var(--ink-mute) !important;
}

html[data-gc-appearance="dark"] body .gc-wallpaper-appearance-option.active {
  background: rgba(255, 255, 255, 0.16) !important;
  color: #FFFFFF !important;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.28) !important;
}

html[data-gc-appearance="dark"] body .gc-wallpaper-preview.appearance-dark {
  border-color: var(--line-strong) !important;
  background-color: #0B0D12 !important;
  box-shadow: inset 0 0 0 999px rgba(4, 8, 16, 0.18);
}

html[data-gc-appearance="dark"] body .gc-wallpaper-preview.appearance-dark .gc-wallpaper-preview-sidebar {
  background: rgba(7, 12, 22, 0.76) !important;
}

html[data-gc-appearance="dark"] body .gc-wallpaper-preview.appearance-dark .gc-wallpaper-preview-content {
  background: rgba(7, 11, 20, 0.50) !important;
}

html[data-gc-appearance="dark"] body .gc-wallpaper-preview.appearance-dark > strong {
  color: var(--ink-mute) !important;
}

/* 白天壁纸：所有账号都使用浅色系统层，不再限于 Peter。 */
html[data-gc-appearance="light"] body.gc-admin-shell-pilot.gc-has-wallpaper .app-shell {
  background-color: #E9EAEE !important;
  background-image:
    linear-gradient(rgba(245, 246, 249, 0.18), rgba(245, 246, 249, 0.18)),
    var(--gc-wallpaper-image, none) !important;
}

html[data-gc-appearance="light"] body.gc-admin-shell-pilot.gc-has-wallpaper .sidebar {
  border-right-color: rgba(29, 29, 31, 0.12) !important;
  background: rgba(244, 245, 248, 0.82) !important;
  color: #1D1D1F !important;
}

html[data-gc-appearance="light"] body.gc-admin-shell-pilot.gc-has-wallpaper:not(.peter-ai-workbench-active):not(.sample-dispatch-active) main#main {
  background: rgba(246, 247, 249, 0.10) !important;
}

html[data-gc-appearance="light"] body.gc-admin-shell-pilot.gc-has-wallpaper :is(.gc-admin-page-head, #controlsBar) {
  border-color: rgba(29, 29, 31, 0.10) !important;
  background: rgba(246, 247, 249, 0.82) !important;
  color: #1D1D1F !important;
}

/* Theme matrix v3 -------------------------------------------------------
 * 页面按 canvas / panel / card 三层归一。这里列出全部正式入口，避免新增或
 * 低频 Tab 继续露出硬编码白底。业务状态色仍由各模块自己的 status token 控制。 */
html {
  --gc-material-opacity: 0.90;
}

html[data-gc-appearance="light"] {
  --gc-accent: var(--gc-accent-light, #007AFF);
  --gc-accent-hover: var(--gc-accent-hover-light, #0068D8);
  --gc-accent-soft: rgba(var(--gc-accent-rgb, 0, 122, 255), 0.13);
  --apple-blue: var(--gc-accent);
  --apple-blue-hover: var(--gc-accent-hover);
  --apple-blue-bg: var(--gc-accent-soft);
  --accent: var(--gc-accent);
  --accent-soft: var(--gc-accent-soft);
  --accent-blue-bg: var(--gc-accent-soft);
  --focus-ring: 0 0 0 3px rgba(var(--gc-accent-rgb, 0, 122, 255), 0.22);
}

html[data-gc-appearance="dark"] {
  --bg: var(--gc-surface-canvas);
  --bg-elevated: var(--gc-surface-panel);
  --bg-sunken: var(--gc-surface-subtle);
  --bg-hover: var(--gc-surface-hover);
  --surface: var(--gc-surface-panel);
  --bg-card: var(--gc-surface-card);
  --bg-soft: var(--gc-surface-subtle);
  --ink: var(--gc-text-primary);
  --ink-strong: var(--gc-text-primary);
  --ink-soft: var(--gc-text-secondary);
  --ink-mute: var(--gc-text-tertiary);
  --line: var(--gc-border);
  --border: var(--gc-border);
  --line-soft: var(--gc-border);
  --hairline: var(--gc-border);
  --line-strong: var(--gc-border-strong);
  --border-strong: var(--gc-border-strong);
  --gc-bdf: var(--gc-border);
  --gc-accent: var(--gc-accent-dark, #0A84FF);
  --gc-accent-hover: var(--gc-accent-hover-dark, #409CFF);
  --gc-accent-soft: rgba(var(--gc-accent-rgb, 0, 122, 255), 0.20);
  --apple-blue: var(--gc-accent);
  --apple-blue-hover: var(--gc-accent-hover);
  --apple-blue-bg: var(--gc-accent-soft);
  --accent: var(--gc-accent);
  --accent-soft: var(--gc-accent-soft);
  --accent-blue-bg: var(--gc-accent-soft);
  --info: var(--gc-accent);
  --focus-ring: 0 0 0 3px rgba(var(--gc-accent-rgb, 0, 122, 255), 0.30);
}

body.peter-appearance-enabled {
  --px-blue: var(--gc-accent);
  --px-blue-hover: var(--gc-accent-hover);
  --px-blue-soft: var(--gc-accent-soft);
}

body.peter-appearance-enabled .app-shell :where(.nav-item, button, [role="button"], input, select, textarea, .style-row, .production-row, .plog-list-row):focus-visible {
  outline-color: var(--gc-accent) !important;
}

html[data-gc-appearance="dark"] body,
html[data-gc-appearance="dark"] body .app-shell,
html[data-gc-appearance="dark"] body .content-area,
html[data-gc-appearance="dark"] body main#main {
  background-color: var(--gc-surface-canvas) !important;
  color: var(--gc-text-primary) !important;
}

body.gc-has-wallpaper .app-shell {
  background-color: var(--gc-surface-canvas) !important;
  background-image: var(--gc-wallpaper-image, none) !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
}

html[data-gc-appearance="light"] body.gc-has-wallpaper .content-area,
html[data-gc-appearance="dark"] body.gc-has-wallpaper .content-area {
  background: transparent !important;
}

html[data-gc-appearance="light"] body.gc-has-wallpaper main#main {
  background: rgba(245, 245, 247, var(--gc-material-opacity)) !important;
}

html[data-gc-appearance="dark"] body.gc-has-wallpaper main#main {
  background: rgba(16, 17, 20, var(--gc-material-opacity)) !important;
}

/* erp-dark-outer-canvas-v4:
 * Peter 固定工作台会在 main 上保留 18–20px padding；旧浅色规则命中该层时，
 * 深色业务区外围会露出一整圈白边。这里用同一身份 / 外壳作用域覆盖画布本身。 */
html[data-gc-appearance="dark"] body.peter-appearance-enabled.gc-admin-shell-pilot .content-area,
html[data-gc-appearance="dark"] body.peter-appearance-enabled.gc-admin-shell-pilot main#main {
  background-color: var(--gc-surface-canvas) !important;
  background-image: none !important;
  color: var(--gc-text-primary) !important;
}

html[data-gc-appearance="dark"] body.peter-appearance-enabled.gc-admin-shell-pilot.gc-has-wallpaper .content-area {
  background: transparent !important;
}

html[data-gc-appearance="dark"] body.peter-appearance-enabled.gc-admin-shell-pilot.gc-has-wallpaper main#main {
  background: rgba(16, 17, 20, var(--gc-material-opacity)) !important;
  background-image: none !important;
}

html[data-gc-appearance="dark"] body.peter-appearance-enabled.gc-admin-shell-pilot.today-tab-active .today-page {
  background: transparent !important;
}

html[data-gc-appearance="dark"] body.peter-appearance-enabled.gc-admin-shell-pilot.today-tab-active main#main .today-scroll-region {
  border-color: var(--gc-border) !important;
  background: var(--gc-surface-canvas) !important;
}

html[data-gc-appearance="dark"] body.peter-appearance-enabled.gc-admin-shell-pilot.gc-has-wallpaper.today-tab-active main#main .today-scroll-region {
  background: rgba(16, 17, 20, var(--gc-material-opacity)) !important;
}

html[data-gc-appearance="light"] body.gc-has-wallpaper :is(.sidebar, .gc-admin-page-head, #controlsBar) {
  background: rgba(250, 250, 252, var(--gc-material-opacity)) !important;
}

html[data-gc-appearance="dark"] body.gc-has-wallpaper :is(.sidebar, .gc-admin-page-head, #controlsBar) {
  background: rgba(18, 19, 22, var(--gc-material-opacity)) !important;
}

html[data-gc-appearance="dark"] body .app-shell :is(
  .peter-ai-workbench-page,
  .peter-workbench-home-pilot,
  .today-page,
  .today-scroll-region,
  .dev-list-grouped,
  .production-page,
  .ship-page,
  .acc-page,
  .archive-page-v2,
  .patternlog-page,
  .plog-page,
  .recycle-page,
  .admin-wrap,
  .followup-guide-page,
  .po-import-demo,
  .sample-dispatch-page,
  .pet-mail-page,
  .client-info-page,
  .quote-tool-page,
  .recording-dashboard,
  .dash-page,
  .gc-ops-dashboard,
  .fudesk-page,
  .pfdesk-page
) {
  background-color: transparent !important;
  background-image: none !important;
  color: var(--gc-text-primary) !important;
}

html[data-gc-appearance="dark"] body .app-shell :is(
  .peter-ai-workbench-card,
  .peter-ai-workbench-section,
  .peter-dev-filter-stack,
  .peter-followup-filter-stack,
  .today-section,
  .pm-subgroup,
  .pv2-grp,
  .pq2-grp,
  .dev-month-section,
  .production-group,
  .ship-card,
  .ship-strip,
  .ship-table-wrap,
  .acc-group,
  .archive-section,
  .archive-card,
  .plog-group,
  .plog-card,
  .recycle-card,
  .admin-card,
  .followup-guide-card,
  .po-import-demo-card,
  .board-card,
  .prod-board-card,
  .plog-list,
  .client-info-brand,
  .client-contact-card,
  .peter-ai-card,
  .qt-stage-panel,
  .qt-table-wrap,
  .pet-mail-panel,
  .gc-cu-panel,
  .admin-sec,
  .admin-table-wrap,
  .gc-ops-card,
  .gc-ops-panel,
  .gc-ops-table-wrap,
  .dashboard-card,
  .filter-group
) {
  border-color: var(--gc-border) !important;
  background-color: var(--gc-surface-panel) !important;
  background-image: none !important;
  color: var(--gc-text-primary) !important;
  box-shadow: var(--gc-shadow-panel) !important;
}

html[data-gc-appearance="dark"] body.gc-has-wallpaper .app-shell :is(
  .peter-ai-workbench-card,
  .peter-ai-workbench-section,
  .peter-dev-filter-stack,
  .peter-followup-filter-stack,
  .today-section,
  .pm-subgroup,
  .pv2-grp,
  .pq2-grp,
  .dev-month-section,
  .production-group,
  .ship-card,
  .ship-table-wrap,
  .acc-group,
  .archive-section,
  .plog-group,
  .recycle-card,
  .admin-card,
  .followup-guide-card,
  .po-import-demo-card
) {
  background-color: rgba(28, 28, 30, var(--gc-material-opacity)) !important;
}

html[data-gc-appearance="dark"] body .app-shell :is(
  .pm-subgroup-body,
  .pv2-body,
  .pq2-section-body,
  .today-section > .section-content,
  .dev-month-body,
  .production-list,
  .ship-table-body,
  .acc-group-body,
  .archive-section-body,
  .plog-group-body,
  .style-list
) {
  border-color: var(--gc-border) !important;
  background-color: var(--gc-surface-panel) !important;
  color: var(--gc-text-primary) !important;
}

html[data-gc-appearance="dark"] body .app-shell :is(
  .peter-ai-workbench-head,
  .pm-subgroup-h,
  .pv2-h,
  .pq2-h,
  .dev-month-header,
  .production-group-header,
  .production-list-header,
  .ship-section-head,
  .acc-group-head,
  .archive-section-head,
  .plog-group-head,
  .gc-ops-card-head,
  .list-header,
  .table-head
) {
  border-color: var(--gc-border) !important;
  background-color: var(--gc-surface-subtle) !important;
  color: var(--gc-text-secondary) !important;
}

html[data-gc-appearance="dark"] body .app-shell :is(
  .today-card-v2,
  .style-card,
  .style-row,
  .po-card,
  .po-item,
  .pq2-po,
  .pq2-st,
  .ship-row-card,
  .acc-row,
  .archive-row,
  .plog-list-row,
  .po-arch-card,
  .production-row,
  .followup-po-card,
  .followup-po-alert,
  .cycle-card,
  .record-card,
  .gc-ops-row-card
) {
  border-color: var(--gc-border) !important;
  background-color: var(--gc-surface-card) !important;
  background-image: none !important;
  color: var(--gc-text-primary) !important;
}

html[data-gc-appearance="dark"] body .app-shell :is(
  .today-card-v2,
  .style-card,
  .style-row,
  .po-card,
  .po-item,
  .pq2-po,
  .pq2-st,
  .ship-row-card,
  .acc-row,
  .archive-row,
  .plog-list-row,
  .po-arch-card,
  .production-row
):hover {
  background-color: var(--gc-surface-hover) !important;
}

html[data-gc-appearance="dark"] body .app-shell :is(
  .peter-ai-workbench-card h3,
  .peter-ai-workbench-card-title,
  .peter-ai-workbench-title,
  .dev-month-header strong,
  .production-group-header strong,
  .production-row .sku,
  .style-row .sku,
  .archive-row .sku,
  .plog-list-row .sku
) {
  color: var(--gc-text-primary) !important;
}

html[data-gc-appearance="dark"] body .app-shell :is(
  .peter-ai-workbench-card p,
  .peter-ai-workbench-card-desc,
  .peter-ai-workbench-subtitle,
  .dev-month-header small,
  .production-group-header small,
  .style-row .meta,
  .production-row .meta,
  .archive-row .meta,
  .plog-list-row .meta
) {
  color: var(--gc-text-tertiary) !important;
}

html[data-gc-appearance="dark"] body .app-shell :is(
  .peter-ai-workbench-card,
  .today-scroll-region,
  .dev-list-grouped,
  .production-group,
  .ship-page,
  .acc-page,
  .archive-page-v2,
  .plog-page,
  .recycle-page,
  .admin-wrap,
  .followup-guide-page,
  .po-import-demo
) :is(input, select, textarea, button:not(.btn-primary):not(.header-create-btn)) {
  border-color: var(--gc-border-strong);
}

html[data-gc-appearance="dark"] body .app-shell :is(
  .peter-ai-workbench-card,
  .today-scroll-region,
  .dev-list-grouped,
  .production-group,
  .ship-page,
  .acc-page,
  .archive-page-v2,
  .plog-page,
  .recycle-page,
  .admin-wrap,
  .followup-guide-page,
  .po-import-demo
) :is(input, select, textarea) {
  background-color: var(--gc-surface-subtle) !important;
  color: var(--gc-text-primary) !important;
}

/* 强调色只连接交互态。红黄绿业务状态不在此选择器范围。 */
body :is(
  .gc-wallpaper-primary,
  .btn-primary,
  .header-create-btn,
  .peter-ai-workbench-card-link,
  .filter-btn.active,
  .view-toggle button.active,
  .gc-segmented button.active
) {
  border-color: var(--gc-accent) !important;
  background-color: var(--gc-accent) !important;
  color: #FFFFFF !important;
}

body :is(
  .gc-wallpaper-primary,
  .btn-primary,
  .header-create-btn,
  .peter-ai-workbench-card-link,
  .filter-btn.active,
  .view-toggle button.active,
  .gc-segmented button.active
):hover {
  border-color: var(--gc-accent-hover) !important;
  background-color: var(--gc-accent-hover) !important;
}

body :is(a, button, input, select, textarea):focus-visible {
  outline: 2px solid var(--gc-accent) !important;
  outline-offset: 2px;
}

/* 外观与背景：macOS 预览卡 + 网易云式强调色和透明度控制。 */
.gc-wallpaper-backdrop {
  background: rgba(0, 0, 0, 0.42) !important;
}

.gc-wallpaper-dialog {
  width: min(760px, calc(100vw - 32px)) !important;
  max-height: min(860px, calc(100vh - 32px)) !important;
  border: 1px solid var(--gc-border-strong) !important;
  border-radius: 22px !important;
  background: var(--gc-surface-panel) !important;
  color: var(--gc-text-primary) !important;
  box-shadow: 0 28px 80px rgba(0, 0, 0, 0.34) !important;
  overflow: hidden !important;
}

.gc-wallpaper-head,
.gc-wallpaper-actions {
  border-color: var(--gc-border) !important;
  background: var(--gc-surface-panel) !important;
}

.gc-wallpaper-head h2,
.gc-appearance-section-head strong,
.gc-material-head output {
  color: var(--gc-text-primary) !important;
}

.gc-wallpaper-head p,
.gc-appearance-section-head span,
.gc-material-section small {
  color: var(--gc-text-tertiary) !important;
}

.gc-wallpaper-body {
  display: grid !important;
  gap: 22px !important;
  padding: 22px 24px 26px !important;
  overflow: auto !important;
  background: var(--gc-surface-panel) !important;
}

.gc-appearance-section {
  display: grid;
  gap: 12px;
}

.gc-appearance-section-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
}

.gc-appearance-section-head span {
  text-align: right;
}

.gc-appearance-card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.gc-appearance-card {
  display: grid !important;
  gap: 9px !important;
  min-width: 0;
  padding: 8px !important;
  border: 1px solid var(--gc-border) !important;
  border-radius: 14px !important;
  background: var(--gc-surface-card) !important;
  color: var(--gc-text-secondary) !important;
  text-align: left;
  transition: border-color 140ms ease, background-color 140ms ease, box-shadow 140ms ease;
}

.gc-appearance-card:hover {
  background: var(--gc-surface-hover) !important;
}

.gc-appearance-card.active {
  border-color: var(--gc-accent) !important;
  box-shadow: 0 0 0 3px var(--gc-accent-soft) !important;
}

.gc-appearance-card-preview {
  position: relative;
  display: block;
  height: 78px;
  border: 1px solid rgba(127, 127, 127, 0.20);
  border-radius: 9px;
  overflow: hidden;
}

.gc-appearance-card-preview i,
.gc-appearance-card-preview b,
.gc-appearance-card-preview em {
  position: absolute;
  display: block;
  content: "";
}

.gc-appearance-card-preview i { inset: 0 auto 0 0; width: 28%; }
.gc-appearance-card-preview b { inset: 11px 9px auto 34%; height: 18px; border-radius: 5px; }
.gc-appearance-card-preview em { inset: 36px 9px 10px 34%; border-radius: 5px; }
.gc-appearance-card-preview.preview-light { background: #F5F5F7; }
.gc-appearance-card-preview.preview-light i { background: #E8E8ED; }
.gc-appearance-card-preview.preview-light b,
.gc-appearance-card-preview.preview-light em { background: #FFFFFF; box-shadow: inset 0 0 0 1px rgba(60, 60, 67, 0.12); }
.gc-appearance-card-preview.preview-dark { background: #101114; }
.gc-appearance-card-preview.preview-dark i { background: #17181C; }
.gc-appearance-card-preview.preview-dark b,
.gc-appearance-card-preview.preview-dark em { background: #242426; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.10); }
.gc-appearance-card-preview.preview-system { background: linear-gradient(110deg, #F5F5F7 0 49.5%, #101114 50.5% 100%); }
.gc-appearance-card-preview.preview-system i { background: linear-gradient(110deg, #E8E8ED 0 49.5%, #17181C 50.5% 100%); }
.gc-appearance-card-preview.preview-system b,
.gc-appearance-card-preview.preview-system em { background: linear-gradient(110deg, #FFFFFF 0 49.5%, #242426 50.5% 100%); box-shadow: inset 0 0 0 1px rgba(127, 127, 127, 0.18); }

.gc-appearance-card-name {
  padding: 0 3px 2px;
  color: var(--gc-text-primary);
  font-weight: 650;
}

.gc-accent-grid {
  display: grid;
  grid-template-columns: repeat(9, minmax(44px, 1fr));
  gap: 10px;
}

.gc-accent-swatch,
.gc-accent-custom {
  position: relative;
  min-width: 0;
  height: 54px;
  border: 1px solid var(--gc-border) !important;
  border-radius: 13px !important;
  background: var(--gc-swatch, var(--gc-surface-subtle)) !important;
}

.gc-accent-swatch.active {
  border-color: #FFFFFF !important;
  box-shadow: 0 0 0 3px var(--gc-accent-soft), inset 0 0 0 2px rgba(0, 0, 0, 0.16) !important;
}

.gc-accent-swatch.active::after {
  position: absolute;
  right: 7px;
  bottom: 7px;
  width: 17px;
  height: 17px;
  border-radius: 50%;
  background: #FFFFFF;
  color: #1D1D1F;
  content: "✓";
  font-size: 12px;
  font-weight: 800;
  line-height: 17px;
  text-align: center;
}

.gc-accent-custom {
  display: grid;
  place-items: center;
  gap: 2px;
  padding: 5px;
  background: var(--gc-surface-subtle) !important;
  color: var(--gc-text-secondary);
  font-size: 11px;
  cursor: pointer;
}

.gc-accent-custom.active {
  border-color: var(--gc-accent) !important;
  box-shadow: 0 0 0 3px var(--gc-accent-soft) !important;
}

.gc-accent-custom input {
  width: 28px !important;
  height: 24px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

.gc-wallpaper-preview {
  min-height: 150px !important;
  border: 1px solid var(--gc-border) !important;
  border-radius: 14px !important;
  background-position: center !important;
  background-size: cover !important;
  overflow: hidden;
}

.gc-wallpaper-preview.appearance-light { background-color: #F5F5F7 !important; }
.gc-wallpaper-preview.appearance-dark { background-color: #101114 !important; }
.gc-wallpaper-preview-sidebar { width: 27% !important; }
.gc-wallpaper-preview.appearance-light .gc-wallpaper-preview-sidebar { background: rgba(245, 245, 247, var(--gc-material-opacity)) !important; }
.gc-wallpaper-preview.appearance-dark .gc-wallpaper-preview-sidebar { background: rgba(18, 19, 22, var(--gc-material-opacity)) !important; }
.gc-wallpaper-preview.appearance-light .gc-wallpaper-preview-content { background: rgba(245, 245, 247, var(--gc-material-opacity)) !important; }
.gc-wallpaper-preview.appearance-dark .gc-wallpaper-preview-content { background: rgba(16, 17, 20, var(--gc-material-opacity)) !important; }

.gc-wallpaper-inline-actions {
  display: flex;
  gap: 10px;
}

.gc-wallpaper-secondary {
  border-color: var(--gc-border-strong) !important;
  background: var(--gc-surface-card) !important;
  color: var(--gc-text-primary) !important;
}

.gc-wallpaper-secondary:hover:not(:disabled) {
  background: var(--gc-surface-hover) !important;
}

.gc-material-head > div {
  display: grid;
  gap: 3px;
}

.gc-material-section input[type="range"] {
  width: 100% !important;
  accent-color: var(--gc-accent);
}

.gc-wallpaper-action-spacer { flex: 1; }

@media (max-width: 720px) {
  .gc-wallpaper-dialog {
    width: calc(100vw - 20px) !important;
    max-height: calc(100vh - 20px) !important;
    border-radius: 18px !important;
  }

  .gc-wallpaper-body { padding: 18px !important; }
  .gc-appearance-section-head { align-items: flex-start; flex-direction: column; gap: 4px; }
  .gc-appearance-section-head span { text-align: left; }
  .gc-appearance-card-grid { gap: 8px; }
  .gc-appearance-card-preview { height: 58px; }
  .gc-accent-grid { grid-template-columns: repeat(5, minmax(42px, 1fr)); }
}

/* appearance-background-panel-v5:
 * 外观、背景和窗口材质按系统设置的阅读顺序重新分组。毛玻璃默认关闭，
 * 开启后只处理三个大面积系统层，不把 blur 加到密集业务行和卡片上。 */
.gc-wallpaper-dialog {
  width: min(820px, calc(100vw - 32px)) !important;
  max-height: min(900px, calc(100vh - 32px)) !important;
}

.gc-wallpaper-body {
  gap: 18px !important;
  padding: 22px 26px 28px !important;
}

.gc-background-choice-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.78fr) minmax(0, 1.22fr);
  gap: 12px;
}

.gc-background-choice {
  min-width: 0;
  display: grid !important;
  align-content: start;
  gap: 10px;
  box-sizing: border-box;
  padding: 12px !important;
  border: 1px solid var(--gc-border) !important;
  border-radius: 15px !important;
  background: var(--gc-surface-card) !important;
  color: var(--gc-text-primary) !important;
  text-align: left;
}

.gc-background-default-choice {
  width: 100%;
  font: inherit;
  cursor: pointer;
}

.gc-background-choice:hover {
  background: var(--gc-surface-hover) !important;
}

.gc-background-choice.active {
  border-color: var(--gc-accent) !important;
  box-shadow: 0 0 0 3px var(--gc-accent-soft) !important;
}

.gc-background-choice-preview {
  position: relative;
  display: block;
  min-height: 106px;
  overflow: hidden;
  border: 1px solid var(--gc-border);
  border-radius: 10px;
  background: var(--gc-surface-canvas);
}

.gc-background-choice-preview i,
.gc-background-choice-preview b,
.gc-background-choice-preview em {
  position: absolute;
  display: block;
}

.gc-background-default-preview i {
  inset: 0 auto 0 0;
  width: 28%;
  background: var(--gc-surface-subtle);
}

.gc-background-default-preview b {
  inset: 17px 13px auto 34%;
  height: 24px;
  border: 1px solid var(--gc-border);
  border-radius: 7px;
  background: var(--gc-surface-card);
}

.gc-background-default-preview em {
  inset: 51px 13px 15px 34%;
  border: 1px solid var(--gc-border);
  border-radius: 7px;
  background: var(--gc-surface-card);
}

.gc-background-choice-copy {
  display: grid;
  gap: 3px;
}

.gc-background-choice-copy strong {
  color: var(--gc-text-primary) !important;
  font-size: 13px;
  font-weight: 680;
}

.gc-background-choice-copy small {
  color: var(--gc-text-tertiary) !important;
  font-size: 11.5px;
  line-height: 1.45;
}

.gc-background-wallpaper-choice {
  grid-template-columns: minmax(170px, 1fr) minmax(150px, 0.86fr);
  grid-template-rows: auto 1fr;
  align-items: start;
}

.gc-background-wallpaper-choice .gc-wallpaper-preview {
  grid-row: 1 / span 2;
  min-height: 106px !important;
  aspect-ratio: 16 / 10;
}

.gc-background-wallpaper-choice .gc-wallpaper-inline-actions {
  align-self: end;
}

.gc-wallpaper-inline-actions .gc-wallpaper-secondary {
  width: 100%;
}

.gc-material-card {
  display: grid;
  overflow: hidden;
  border: 1px solid var(--gc-border);
  border-radius: 15px;
  background: var(--gc-surface-card);
}

.gc-material-toggle-row,
.gc-material-opacity-row {
  padding: 14px 16px;
}

.gc-material-toggle-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  border-bottom: 1px solid var(--gc-border);
}

.gc-material-toggle-row > div,
.gc-material-head > div {
  display: grid;
  gap: 3px;
}

.gc-material-toggle-row strong,
.gc-material-head strong {
  color: var(--gc-text-primary) !important;
  font-size: 13px;
  font-weight: 680;
}

.gc-material-toggle-row small,
.gc-material-head span {
  color: var(--gc-text-tertiary) !important;
  font-size: 11.5px;
  line-height: 1.45;
}

.gc-material-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 10px;
}

.gc-material-head output {
  min-width: 42px;
  color: var(--gc-text-secondary) !important;
  font-size: 12px;
  font-variant-numeric: tabular-nums;
  text-align: right;
}

.gc-switch {
  position: relative;
  flex: 0 0 auto;
  width: 42px;
  height: 24px;
  cursor: pointer;
}

.gc-switch input {
  position: absolute;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden;
  opacity: 0;
}

.gc-switch span {
  position: absolute;
  inset: 0;
  border-radius: 999px;
  background: var(--gc-border-strong);
  box-shadow: inset 0 0 0 1px var(--gc-border);
  transition: background-color 140ms ease;
}

.gc-switch span::after {
  position: absolute;
  top: 2px;
  left: 2px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #FFFFFF;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.24);
  content: "";
  transition: transform 160ms cubic-bezier(0.22, 1, 0.36, 1);
}

.gc-switch input:checked + span {
  background: var(--gc-accent);
}

.gc-switch input:checked + span::after {
  transform: translateX(18px);
}

.gc-switch input:focus-visible + span {
  outline: 2px solid var(--gc-accent);
  outline-offset: 2px;
}

.gc-accent-section {
  padding-top: 2px;
}

.gc-accent-section .gc-accent-swatch,
.gc-accent-section .gc-accent-custom {
  height: 44px;
  border-radius: 11px !important;
}

html[data-gc-glass="on"] body.gc-has-wallpaper :is(.sidebar, .gc-admin-page-head, #controlsBar, main#main) {
  -webkit-backdrop-filter: saturate(1.08) blur(16px);
  backdrop-filter: saturate(1.08) blur(16px);
}

html[data-gc-glass="on"] .gc-wallpaper-preview :is(.gc-wallpaper-preview-sidebar, .gc-wallpaper-preview-content) {
  -webkit-backdrop-filter: saturate(1.08) blur(8px);
  backdrop-filter: saturate(1.08) blur(8px);
}

@media (max-width: 720px) {
  .gc-background-choice-grid { grid-template-columns: 1fr; }
  .gc-background-wallpaper-choice { grid-template-columns: minmax(120px, 0.9fr) minmax(140px, 1.1fr); }
  .gc-material-toggle-row { align-items: flex-start; }
}

@media (max-width: 480px) {
  .gc-background-wallpaper-choice { grid-template-columns: 1fr; }
  .gc-background-wallpaper-choice .gc-wallpaper-preview { grid-row: auto; }
}

/* appearance-dialog-compact-v6:
 * 设置弹窗固定头部和底部，只有中部滚动；桌面双栏缩短阅读路径，
 * 强调色与确定按钮不再被长内容推到视口外。 */
.gc-wallpaper-dialog {
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) auto;
  width: min(760px, calc(100vw - 32px)) !important;
  height: min(650px, calc(100dvh - 32px)) !important;
  max-height: calc(100dvh - 32px) !important;
}

.gc-wallpaper-head {
  position: relative;
  z-index: 2;
  align-items: center;
  padding: 15px 18px 13px !important;
}

.gc-wallpaper-head h2 {
  margin-bottom: 3px !important;
  font-size: 16px !important;
}

.gc-wallpaper-head p {
  font-size: 11.5px !important;
}

.gc-wallpaper-body {
  min-height: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
  padding: 20px 22px !important;
}

.gc-appearance-settings-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 24px;
  align-items: start;
}

/* skin-presets-menu-align-v1: Codex 式一键整套皮肤，继续复用现有本机外观与壁纸状态。 */
.gc-skin-section {
  grid-column: 1 / -1;
  padding-bottom: 2px;
}

.gc-skin-preset-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.gc-skin-preset {
  min-width: 0;
  display: grid;
  grid-template-columns: 50px minmax(0, 1fr);
  align-items: center;
  gap: 9px;
  padding: 7px;
  border: 1px solid var(--gc-border);
  border-radius: 11px;
  background: var(--gc-surface-card);
  color: var(--gc-text-secondary);
  text-align: left;
  cursor: pointer;
}

.gc-skin-preset:hover {
  background: var(--gc-surface-hover);
}

.gc-skin-preset.active {
  border-color: var(--gc-accent);
  box-shadow: 0 0 0 3px var(--gc-accent-soft);
}

.gc-skin-preset > span:last-child {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.gc-skin-preset strong,
.gc-skin-preset small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.gc-skin-preset strong {
  color: var(--gc-text-primary);
  font-size: 11.5px;
  line-height: 1.25;
}

.gc-skin-preset small {
  color: var(--gc-text-tertiary);
  font-size: 9.5px;
  line-height: 1.25;
}

.gc-skin-preset-preview {
  position: relative;
  width: 50px;
  height: 38px;
  overflow: hidden;
  border: 1px solid rgba(120, 120, 128, 0.20);
  border-radius: 7px;
  background: #F3F4F7;
}

.gc-skin-preset-preview i {
  position: absolute;
  inset: 0 auto 0 0;
  width: 29%;
  border-right: 1px solid rgba(120, 120, 128, 0.18);
  background: rgba(224, 226, 232, 0.92);
}

.gc-skin-preset-preview b,
.gc-skin-preset-preview em {
  position: absolute;
  left: 36%;
  right: 8%;
  display: block;
  border-radius: 3px;
  content: "";
}

.gc-skin-preset-preview b {
  top: 7px;
  height: 7px;
  background: #FFFFFF;
}

.gc-skin-preset-preview em {
  top: 18px;
  bottom: 7px;
  background: rgba(255, 255, 255, 0.82);
}

.gc-skin-preset-preview.skin-paper { background: #FFFFFF; }
.gc-skin-preset-preview.skin-paper i { background: #F1F1F2; }
.gc-skin-preset-preview.skin-paper b,
.gc-skin-preset-preview.skin-paper em { background: #E7E7E9; }

.gc-skin-preset-preview.skin-night { background: #111216; }
.gc-skin-preset-preview.skin-night i { background: #1C1C20; }
.gc-skin-preset-preview.skin-night b { background: #6857D9; }
.gc-skin-preset-preview.skin-night em { background: #29292E; }

.gc-skin-preset-preview.skin-immersive {
  background: linear-gradient(145deg, #112B48 0%, #42306E 52%, #101219 100%);
}
.gc-skin-preset-preview.skin-immersive i { background: rgba(9, 13, 22, 0.68); }
.gc-skin-preset-preview.skin-immersive b { background: rgba(0, 122, 255, 0.92); }
.gc-skin-preset-preview.skin-immersive em { background: rgba(22, 25, 34, 0.72); }

@media (max-width: 720px) {
  .gc-skin-preset-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.gc-appearance-settings-column {
  display: grid;
  gap: 22px;
  min-width: 0;
}

.gc-appearance-section {
  gap: 10px !important;
  min-width: 0;
}

.gc-appearance-section + .gc-appearance-section {
  padding-top: 19px;
  border-top: 1px solid var(--gc-border);
}

.gc-appearance-section-head {
  display: grid !important;
  gap: 2px !important;
  align-items: start !important;
}

.gc-appearance-section-head strong {
  font-size: 13px;
  line-height: 1.35;
}

.gc-appearance-section-head span {
  color: var(--gc-text-tertiary) !important;
  font-size: 11px;
  line-height: 1.45;
  text-align: left !important;
}

.gc-appearance-card-grid {
  gap: 8px !important;
}

.gc-appearance-card {
  gap: 6px !important;
  padding: 6px !important;
  border-radius: 11px !important;
}

.gc-appearance-card-preview {
  height: 50px !important;
  border-radius: 7px !important;
}

.gc-appearance-card-preview b {
  inset: 7px 7px auto 34% !important;
  height: 12px !important;
  border-radius: 4px !important;
}

.gc-appearance-card-preview em {
  inset: 25px 7px 7px 34% !important;
  border-radius: 4px !important;
}

.gc-appearance-card-name {
  padding: 0 2px 1px !important;
  font-size: 11.5px;
}

.gc-accent-grid {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

.gc-accent-section .gc-accent-swatch,
.gc-accent-section .gc-accent-custom {
  height: 36px !important;
  border-radius: 10px !important;
}

.gc-accent-swatch.active::after {
  right: 5px !important;
  bottom: 5px !important;
  width: 15px !important;
  height: 15px !important;
  font-size: 10px !important;
  line-height: 15px !important;
}

.gc-accent-custom {
  grid-auto-flow: column;
  grid-template-columns: 20px auto;
  justify-content: center;
  gap: 4px !important;
  font-size: 10px !important;
}

.gc-accent-custom input {
  width: 20px !important;
  height: 20px !important;
}

.gc-accent-note {
  margin: 0;
  color: var(--gc-text-tertiary);
  font-size: 10.5px;
  line-height: 1.4;
}

.gc-wallpaper-section .gc-wallpaper-preview {
  min-height: 0 !important;
  aspect-ratio: 16 / 8.5 !important;
  border-radius: 11px !important;
}

.gc-background-choice-grid {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 7px !important;
}

.gc-background-choice {
  display: flex !important;
  min-height: 50px;
  align-items: center !important;
  gap: 10px !important;
  padding: 8px 10px !important;
  border-radius: 11px !important;
}

.gc-background-choice:hover {
  background: var(--gc-surface-hover) !important;
}

.gc-background-choice-indicator {
  flex: 0 0 auto;
  width: 15px;
  height: 15px;
  box-sizing: border-box;
  border: 1.5px solid var(--gc-border-strong);
  border-radius: 50%;
  background: var(--gc-surface-card);
}

.gc-background-choice.active .gc-background-choice-indicator {
  border: 4px solid var(--gc-accent);
}

.gc-background-choice-copy {
  min-width: 0;
  flex: 1;
  gap: 1px !important;
}

.gc-background-choice-copy strong {
  font-size: 12px !important;
}

.gc-background-choice-copy small {
  font-size: 10.5px !important;
  line-height: 1.35 !important;
}

.gc-background-wallpaper-choice {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  grid-template-rows: auto !important;
  gap: 8px !important;
  padding: 5px 6px 5px 0 !important;
}

.gc-background-custom-select {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 10px;
  padding: 3px 0 3px 10px;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.gc-background-wallpaper-choice .gc-wallpaper-secondary {
  min-width: 76px;
  height: 30px;
  align-self: center;
  padding: 0 10px;
  border-radius: 8px !important;
  font-size: 11px;
}

.gc-material-card {
  border-radius: 11px !important;
}

.gc-material-toggle-row,
.gc-material-opacity-row {
  padding: 11px 12px !important;
}

.gc-material-toggle-row {
  gap: 14px !important;
}

.gc-material-toggle-row strong,
.gc-material-head strong {
  font-size: 12px !important;
}

.gc-material-toggle-row small,
.gc-material-head span {
  font-size: 10.5px !important;
}

.gc-material-head {
  margin-bottom: 7px !important;
}

.gc-wallpaper-actions {
  position: relative;
  z-index: 2;
  flex-wrap: nowrap !important;
  min-height: 58px;
  box-sizing: border-box;
  padding: 11px 18px !important;
  box-shadow: 0 -8px 20px rgba(0, 0, 0, 0.025);
}

.gc-wallpaper-tertiary {
  height: 34px;
  padding: 0 6px;
  border: 0;
  background: transparent;
  color: var(--gc-text-secondary);
  font: 600 12px var(--font-sans, -apple-system, BlinkMacSystemFont, "PingFang SC", sans-serif);
  cursor: pointer;
}

.gc-wallpaper-tertiary:hover {
  color: var(--gc-accent);
}

.gc-wallpaper-tertiary:disabled {
  cursor: default;
  opacity: 0.45;
}

.gc-wallpaper-dialog.is-busy .gc-wallpaper-body {
  pointer-events: none;
  opacity: 0.72;
}

.gc-wallpaper-primary {
  border-color: var(--gc-accent) !important;
  background: var(--gc-accent) !important;
}

@media (max-width: 720px) {
  .gc-wallpaper-dialog {
    width: calc(100vw - 20px) !important;
    height: calc(100dvh - 20px) !important;
    max-height: calc(100dvh - 20px) !important;
  }

  .gc-wallpaper-body {
    padding: 18px !important;
  }

  .gc-appearance-settings-layout {
    grid-template-columns: 1fr;
    gap: 22px;
  }

  .gc-wallpaper-actions {
    padding: 10px 14px !important;
  }

  .gc-wallpaper-actions > :is(button, label) {
    flex: 0 0 auto !important;
  }
}

@media (max-height: 560px) {
  .gc-wallpaper-backdrop { padding: 8px; }
  .gc-wallpaper-dialog {
    height: calc(100dvh - 16px) !important;
    max-height: calc(100dvh - 16px) !important;
  }
  .gc-wallpaper-head p { display: none; }
  .gc-wallpaper-body { padding-block: 14px !important; }
}

@media (prefers-reduced-transparency: reduce) {
  html[data-gc-glass="on"] body.gc-has-wallpaper :is(.sidebar, .gc-admin-page-head, #controlsBar, main#main),
  html[data-gc-glass="on"] .gc-wallpaper-preview :is(.gc-wallpaper-preview-sidebar, .gc-wallpaper-preview-content) {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }
}

/* immersive-component-depth-v4
 * v253 的组件注册表方向正确，但旧管理员样式带 main#main ID，仍会把内部表头和行压回白色。
 * 本层用同一 ID 入口接管真实 DOM 深度，并把首页误加的大底板恢复为透明画布。
 */
html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper .app-shell main#main .peter-workbench-home-pilot .peter-ai-workbench-section {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper .app-shell main#main .peter-workbench-home-pilot .peter-ai-workbench-card {
  border-color: var(--gc-skin-border) !important;
  background: var(--gc-skin-surface-card) !important;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.035), 0 14px 30px rgba(0, 0, 0, 0.14) !important;
  -webkit-backdrop-filter: blur(14px) saturate(1.08);
  backdrop-filter: blur(14px) saturate(1.08);
}

html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper .app-shell main#main .peter-workbench-home-pilot .peter-ai-workbench-card:hover {
  border-color: rgba(var(--gc-accent-rgb), 0.46) !important;
  background: var(--gc-skin-surface-card-hover) !important;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.045), 0 16px 34px rgba(0, 0, 0, 0.16) !important;
}

/* 大货截图的真实五层：外组、分组头、列头、列表、数据行。 */
html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper .app-shell main#main .production-group.date-group {
  border-color: var(--gc-skin-border) !important;
  background: var(--gc-skin-surface-panel) !important;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.12) !important;
}

html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper .app-shell main#main .production-group-header.date-group-header {
  border-color: var(--gc-skin-border) !important;
  background-color: var(--gc-skin-component-table-head) !important;
  background-image: none !important;
  color: var(--gc-skin-text-secondary) !important;
}

html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper .app-shell main#main .production-group-header.date-group-header .count {
  border-color: var(--gc-skin-border) !important;
  background: rgba(255, 255, 255, 0.10) !important;
  color: var(--gc-skin-text-secondary) !important;
}

html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper .app-shell main#main .production-group.date-group .production-list {
  border-color: var(--gc-skin-border) !important;
  background: transparent !important;
}

html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper .app-shell main#main .production-list-header.with-node {
  border-color: var(--gc-skin-border) !important;
  background-color: var(--gc-skin-component-table-head) !important;
  background-image: none !important;
  color: var(--gc-skin-text-tertiary) !important;
}

html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper .app-shell main#main .production-row.with-node {
  border-color: var(--gc-skin-border) !important;
  background-color: var(--gc-skin-component-table-row) !important;
  background-image: none !important;
  color: var(--gc-skin-text-primary) !important;
  box-shadow: none !important;
}

html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper .app-shell main#main .production-row.with-node:hover {
  background-color: var(--gc-skin-surface-card-hover) !important;
}

/* 通用深度桥：吸收仍在各模块里硬编码的白色结构面，不碰状态 chip 和主按钮。 */
html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper .app-shell main#main :is(
  [class$="-table-wrap"],
  [class*="-table-wrap "],
  [class$="-list-wrap"],
  [class*="-list-wrap "],
  [class$="-summary-strip"],
  [class*="-summary-strip "],
  [class$="-filterbar"],
  [class*="-filterbar "],
  [class$="-toolbar"],
  [class*="-toolbar "]
) {
  border-color: var(--gc-skin-border) !important;
  background-color: var(--gc-skin-surface-panel) !important;
  background-image: none !important;
  color: var(--gc-skin-text-primary) !important;
  box-shadow: none !important;
}

html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper .app-shell main#main :is(
  [class$="-list-header"],
  [class*="-list-header "],
  [class$="-table-head"],
  [class*="-table-head "],
  [class$="-group-header"],
  [class*="-group-header "]
) {
  border-color: var(--gc-skin-border) !important;
  background-color: var(--gc-skin-component-table-head) !important;
  background-image: none !important;
  color: var(--gc-skin-text-secondary) !important;
  box-shadow: none !important;
}

html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper .app-shell main#main :is(table, thead, tbody, tr, th, td) {
  border-color: var(--gc-skin-border) !important;
  color: inherit;
}

html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper .app-shell main#main table:not(.gc-rpt-table):not([class*="report"]) :is(thead, th) {
  background-color: var(--gc-skin-component-table-head) !important;
  background-image: none !important;
  color: var(--gc-skin-text-secondary) !important;
}

html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper .app-shell main#main table:not(.gc-rpt-table):not([class*="report"]) tbody tr {
  background-color: var(--gc-skin-component-table-row) !important;
  background-image: none !important;
  color: var(--gc-skin-text-primary) !important;
}

html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper .app-shell :is(main#main, #controlsBar) :is(
  .filter-btn.active,
  .view-btn.active,
  .view-toggle button.active,
  [class$="-segmented"] button.active,
  [class*="-segmented "] button.active
) {
  border-color: var(--gc-skin-border-strong) !important;
  background-color: rgba(255, 255, 255, 0.13) !important;
  color: var(--gc-skin-text-primary) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.035) !important;
}

/* 已登记业务组件的 ID 深度桥，避免任何页面继续落回旧的实色白 / 灰层。 */
html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper .app-shell main#main :is(
  .today-section,
  .pm-subgroup,
  .pv2-grp,
  .pq2-grp,
  .dev-month-section,
  .production-group,
  .acc-workbench-head,
  .acc-summary-strip,
  .acc-group,
  .ship-workbench-head,
  .ship-strip,
  .ship-subtabs,
  .ship-filter-status,
  .ship-table-wrap,
  .plog-section-tabs,
  .plog-toolbar,
  .plog-view-toggle,
  .plog-group,
  .archive-section,
  .admin-sec,
  .admin-card,
  .gc-ops-card,
  .gc-ops-panel,
  .dashboard-card
) {
  border-color: var(--gc-skin-border) !important;
  background-color: var(--gc-skin-surface-panel) !important;
  background-image: none !important;
  color: var(--gc-skin-text-primary) !important;
  box-shadow: none !important;
}

html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper .app-shell main#main :is(
  .pm-subgroup-h,
  .pv2-h,
  .pq2-h,
  .dev-list-header,
  .dev-month-header,
  .production-group-header,
  .production-list-header,
  .acc-list-head,
  .acc-group-head,
  .ship-month-head,
  .ship-group-head,
  .plog-group-header,
  .archive-section-head,
  .table-head
) {
  border-color: var(--gc-skin-border) !important;
  background-color: var(--gc-skin-component-table-head) !important;
  background-image: none !important;
  color: var(--gc-skin-text-secondary) !important;
  box-shadow: none !important;
}

html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper .app-shell main#main :is(
  .today-card-v2,
  .style-card,
  .style-row,
  .dev-list-row,
  .po-card,
  .po-item,
  .pq2-po,
  .pq2-st,
  .production-row,
  .acc-row,
  .ship-row,
  .ship-row-card,
  .plog-card,
  .plog-list-row,
  .po-arch-card,
  .archive-card,
  .archive-row,
  .recycle-row,
  .followup-po-card,
  .followup-po-alert,
  .cycle-card,
  .record-card,
  .gc-ops-row-card
) {
  border-color: var(--gc-skin-border) !important;
  background-color: var(--gc-skin-component-table-row) !important;
  background-image: none !important;
  color: var(--gc-skin-text-primary) !important;
  box-shadow: none !important;
}

html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper .app-shell main#main :is(
  .today-card-v2,
  .style-card,
  .style-row,
  .dev-list-row,
  .po-card,
  .po-item,
  .pq2-po,
  .pq2-st,
  .production-row,
  .acc-row,
  .ship-row,
  .ship-row-card,
  .plog-card,
  .plog-list-row,
  .po-arch-card,
  .archive-card,
  .archive-row,
  .recycle-row
):hover {
  background-color: var(--gc-skin-surface-card-hover) !important;
}

html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper .app-shell main#main :is(
  .pm-subgroup-body,
  .pv2-body,
  .pq2-section-body,
  .today-section > .section-content,
  .dev-month-body,
  .production-list,
  .acc-group-body,
  .ship-table tbody,
  .plog-group-body,
  .archive-section-body,
  .po-arch-bottom,
  .po-arch-empty,
  .style-list
) {
  border-color: var(--gc-skin-border) !important;
  background-color: transparent !important;
  background-image: none !important;
  color: var(--gc-skin-text-primary) !important;
}

html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper .app-shell main#main :is(
  #devDateFilter,
  .acc-filter-select,
  .acc-ef-date-wrap,
  .acc-search-input,
  .ship-search-input,
  .plog-searchbar,
  .plog-searchbar input,
  .recycle-search-input,
  .recycle-search-clear
) {
  border-color: var(--gc-skin-border-strong) !important;
  background-color: var(--gc-skin-surface-control) !important;
  background-image: none !important;
  color: var(--gc-skin-text-primary) !important;
  box-shadow: none !important;
}

/* 输出预览永远在最后赢：业务主题不能改变客户纸张和报表纸张。 */
html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper :is(
  .gc-rpt-sheet,
  .gc-qcrpt-sheet,
  .gc-shiprpt-sheet,
  .pet-mail-preview-paper,
  .gc-sdf-paper,
  .dispatch-paper,
  .print-paper
) {
  color-scheme: light;
  background: #FFFFFF !important;
  color: #1D1D1F !important;
}

html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper :is(
  .gc-rpt-sheet,
  .gc-qcrpt-sheet,
  .gc-shiprpt-sheet,
  .pet-mail-preview-paper,
  .gc-sdf-paper,
  .dispatch-paper,
  .print-paper
) :is(table, thead, tbody, tr, th, td) {
  border-color: #D7DEE8 !important;
  background-color: #FFFFFF !important;
  color: #1D1D1F !important;
}

@media (prefers-reduced-transparency: reduce) {
  html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper .app-shell main#main .peter-workbench-home-pilot .peter-ai-workbench-card {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }
}

/* 邮件与寄样纸张必须维持客户可见的白纸，不跟随屏幕夜间主题。 */
html[data-gc-appearance="dark"] body :is(.pet-mail-preview-paper, .gc-sdf-paper, .dispatch-paper, .print-paper) {
  color-scheme: light;
  background: #FFFFFF !important;
  color: #1D1D1F !important;
}

html[data-gc-appearance="dark"] body :is(.pet-mail-preview-paper, .gc-sdf-paper, .dispatch-paper, .print-paper) :is(h1, h2, h3, h4, h5, h6, p, span, strong, b, small, label, .muted, .meta, .sub, .desc) {
  color: #1D1D1F !important;
}

html[data-gc-appearance="dark"] body :is(.pet-mail-preview-paper, .gc-sdf-paper, .dispatch-paper, .print-paper) :is(table, thead, tbody, tr, th, td) {
  border-color: #D7DEE8 !important;
  color: #1D1D1F !important;
}

@media (prefers-reduced-transparency: reduce) {
  html[data-gc-appearance="dark"] body :is(.sidebar, .gc-admin-page-head, #controlsBar, .controls) {
    background-color: #12151C !important;
  }
}

@media (prefers-contrast: more) {
  html[data-gc-appearance="dark"] {
    --line: rgba(255, 255, 255, 0.22);
    --line-strong: rgba(255, 255, 255, 0.34);
    --ink-mute: #B9B9C0;
  }
}

/* immersive-theme-contract-v3
 * 壁纸沉浸的统一组件注册表。三层 token 只在明确选择该皮肤且已有壁纸时生效；
 * 不改变普通日间 / 夜间，也不进入邮件、寄样和打印纸张。
 */
html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper {
  /* Primitive tokens */
  --gc-skin-primitive-ink-100: #F7F8FA;
  --gc-skin-primitive-ink-72: rgba(247, 248, 250, 0.72);
  --gc-skin-primitive-ink-52: rgba(247, 248, 250, 0.52);
  --gc-skin-primitive-night-92: rgba(8, 11, 17, 0.92);
  --gc-skin-primitive-night-84: rgba(9, 13, 20, 0.84);
  --gc-skin-primitive-night-76: rgba(11, 15, 23, 0.76);
  --gc-skin-primitive-night-64: rgba(12, 17, 26, 0.64);
  --gc-skin-primitive-night-42: rgba(8, 12, 19, 0.42);
  --gc-skin-primitive-line-14: rgba(255, 255, 255, 0.14);
  --gc-skin-primitive-line-22: rgba(255, 255, 255, 0.22);

  /* Semantic tokens */
  --gc-skin-surface-canvas: rgba(7, 11, 17, 0.20);
  --gc-skin-surface-chrome: rgba(9, 14, 21, 0.72);
  --gc-skin-surface-panel: rgba(11, 16, 24, 0.58);
  --gc-skin-surface-panel-strong: rgba(11, 16, 24, 0.78);
  --gc-skin-surface-card: rgba(16, 22, 32, 0.68);
  --gc-skin-surface-card-hover: rgba(24, 32, 44, 0.78);
  --gc-skin-surface-control: rgba(18, 25, 35, 0.66);
  --gc-skin-text-primary: var(--gc-skin-primitive-ink-100);
  --gc-skin-text-secondary: var(--gc-skin-primitive-ink-72);
  --gc-skin-text-tertiary: var(--gc-skin-primitive-ink-52);
  --gc-skin-border: var(--gc-skin-primitive-line-14);
  --gc-skin-border-strong: var(--gc-skin-primitive-line-22);

  /* Component tokens */
  --gc-skin-component-sidebar: rgba(9, 14, 21, 0.74);
  --gc-skin-component-topbar: rgba(8, 13, 20, 0.66);
  --gc-skin-component-panel: var(--gc-skin-surface-panel);
  --gc-skin-component-card: var(--gc-skin-surface-card);
  --gc-skin-component-input: var(--gc-skin-surface-control);
  --gc-skin-component-table-head: rgba(13, 18, 26, 0.72);
  --gc-skin-component-table-row: rgba(16, 22, 31, 0.74);

  /* 兼容现有模块语义变量。 */
  --gc-surface-canvas: var(--gc-skin-surface-canvas);
  --gc-surface-panel: var(--gc-skin-surface-panel);
  --gc-surface-card: var(--gc-skin-surface-card);
  --gc-surface-subtle: var(--gc-skin-surface-control);
  --gc-surface-hover: var(--gc-skin-surface-card-hover);
  --gc-text-primary: var(--gc-skin-text-primary);
  --gc-text-secondary: var(--gc-skin-text-secondary);
  --gc-text-tertiary: var(--gc-skin-text-tertiary);
  --gc-border: var(--gc-skin-border);
  --gc-border-strong: var(--gc-skin-border-strong);
  --bg: var(--gc-skin-surface-canvas);
  --bg-elevated: var(--gc-skin-surface-panel);
  --bg-sunken: var(--gc-skin-surface-control);
  --bg-hover: var(--gc-skin-surface-card-hover);
  --bg-card: var(--gc-skin-surface-card);
  --bg-soft: var(--gc-skin-surface-control);
  --surface: var(--gc-skin-surface-panel);
  --ink: var(--gc-skin-text-primary);
  --ink-strong: var(--gc-skin-text-primary);
  --ink-soft: var(--gc-skin-text-secondary);
  --ink-mute: var(--gc-skin-text-tertiary);
  --line: var(--gc-skin-border);
  --line-soft: var(--gc-skin-border);
  --line-strong: var(--gc-skin-border-strong);
  --border: var(--gc-skin-border);
  --border-strong: var(--gc-skin-border-strong);
  --hairline: var(--gc-skin-border);
  --gc-bdf: var(--gc-skin-border);
  --gc-wb-surface: var(--gc-skin-surface-panel);
  --gc-wb-muted-surface: var(--gc-skin-surface-control);
  --gc-wb-line: var(--gc-skin-border);
  --px-bg: transparent;
  --px-surface: var(--gc-skin-surface-panel);
  --px-surface-soft: var(--gc-skin-surface-control);
  --px-surface-hover: var(--gc-skin-surface-card-hover);
  --px-line: var(--gc-skin-border);
  --px-line-strong: var(--gc-skin-border-strong);
  --px-text: var(--gc-skin-text-primary);
  --px-text-soft: var(--gc-skin-text-secondary);
  --px-text-mute: var(--gc-skin-text-tertiary);
  color: var(--gc-skin-text-primary);
}

/* App canvas + chrome */
html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper :is(.app-shell, .content-area),
html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper .content-area main#main {
  border-color: var(--gc-skin-border) !important;
  background-color: var(--gc-skin-surface-canvas) !important;
  background-image: none !important;
  color: var(--gc-skin-text-primary) !important;
}

html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper :is(.sidebar, .gc-admin-page-head, #controlsBar, .controls, .mobile-topbar, .mobile-tabbar) {
  border-color: var(--gc-skin-border) !important;
  background-color: var(--gc-skin-component-topbar) !important;
  background-image: none !important;
  color: var(--gc-skin-text-primary) !important;
  -webkit-backdrop-filter: blur(22px) saturate(1.12);
  backdrop-filter: blur(22px) saturate(1.12);
}

html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper .sidebar {
  background-color: var(--gc-skin-component-sidebar) !important;
}

/* Every formal screen keeps the wallpaper as its canvas. */
html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper .app-shell :is(
  .peter-ai-workbench-page,
  .peter-workbench-home-pilot,
  .today-page,
  .today-scroll-region,
  .dev-list-grouped,
  .production-page,
  .ship-page,
  .acc-page,
  .archive-page-v2,
  .patternlog-page,
  .plog-page,
  .recycle-page,
  .admin-wrap,
  .followup-guide-page,
  .po-import-demo,
  .client-info-page,
  .dash-page,
  .gc-ops-dashboard,
  .fudesk-page,
  .pfdesk-page
) {
  background: transparent !important;
  color: var(--gc-skin-text-primary) !important;
}

/* Panels: section shells, top tools and summaries. */
html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper .app-shell :is(
  .peter-ai-workbench-section,
  .peter-ai-workbench-card,
  .peter-dev-filter-stack,
  .peter-followup-filter-stack,
  .filter-group,
  .today-section,
  .pm-subgroup,
  .pv2-grp,
  .pq2-grp,
  .dev-month-section,
  .production-group,
  .acc-workbench-head,
  .acc-summary-strip,
  .acc-group,
  .ship-workbench-head,
  .ship-strip,
  .ship-subtabs,
  .ship-filter-status,
  .ship-table-wrap,
  .plog-section-tabs,
  .plog-toolbar,
  .plog-view-toggle,
  .plog-group,
  .archive-section,
  .admin-sec,
  .admin-card,
  .gc-ops-card,
  .gc-ops-panel,
  .dashboard-card
) {
  border-color: var(--gc-skin-border) !important;
  background-color: var(--gc-skin-component-panel) !important;
  background-image: none !important;
  color: var(--gc-skin-text-primary) !important;
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.16) !important;
}

/* Section and table headers. */
html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper .app-shell :is(
  .peter-ai-workbench-head,
  .pm-subgroup-h,
  .pv2-h,
  .pq2-h,
  .dev-list-header,
  .list-header,
  .dev-month-header,
  .production-group-header,
  .production-list-header,
  .acc-group-head,
  .ship-month-head,
  .ship-group-head,
  .plog-group-header,
  .archive-section-head,
  .table-head
),
html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper .app-shell .ship-table th {
  border-color: var(--gc-skin-border) !important;
  background-color: var(--gc-skin-component-table-head) !important;
  background-image: none !important;
  color: var(--gc-skin-text-secondary) !important;
}

/* Dense business rows and cards: no blur, stable readability. */
html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper .app-shell :is(
  .today-card-v2,
  .style-card,
  .style-row,
  .dev-list-row,
  .po-card,
  .po-item,
  .pq2-po,
  .pq2-st,
  .production-row,
  .acc-row,
  .ship-row,
  .ship-row-card,
  .plog-card,
  .plog-list-row,
  .po-arch-card,
  .archive-card,
  .archive-row,
  .recycle-row,
  .followup-po-card,
  .followup-po-alert,
  .cycle-card,
  .record-card,
  .gc-ops-row-card
),
html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper .app-shell .ship-table tr.s-row {
  border-color: var(--gc-skin-border) !important;
  background-color: var(--gc-skin-component-table-row) !important;
  background-image: none !important;
  color: var(--gc-skin-text-primary) !important;
  box-shadow: none !important;
}

html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper .app-shell :is(
  .today-card-v2,
  .style-card,
  .style-row,
  .dev-list-row,
  .po-card,
  .po-item,
  .pq2-po,
  .pq2-st,
  .production-row,
  .acc-row,
  .ship-row,
  .ship-row-card,
  .plog-card,
  .plog-list-row,
  .po-arch-card,
  .archive-card,
  .archive-row,
  .recycle-row
):hover,
html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper .app-shell .ship-table tr.s-row:hover {
  background-color: var(--gc-skin-surface-card-hover) !important;
}

/* Body zones and card footers that previously leaked solid white. */
html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper .app-shell :is(
  .pm-subgroup-body,
  .pv2-body,
  .pq2-section-body,
  .today-section > .section-content,
  .dev-month-body,
  .production-list,
  .acc-group-body,
  .ship-table tbody,
  .plog-group-body,
  .archive-section-body,
  .po-arch-bottom,
  .po-arch-empty,
  .style-list
) {
  border-color: var(--gc-skin-border) !important;
  background-color: transparent !important;
  background-image: none !important;
  color: var(--gc-skin-text-primary) !important;
}

/* Controls, search and date inputs. Primary/status actions retain their own colours. */
html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper .app-shell :is(
  #devDateFilter,
  .acc-filter-select,
  .acc-ef-date-wrap,
  .acc-search-input,
  .ship-search-input,
  .plog-searchbar,
  .plog-searchbar input,
  .recycle-search-input,
  .recycle-search-clear
),
html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper .app-shell :is(
  .peter-dev-filter-stack,
  .peter-followup-filter-stack,
  .acc-workbench-head,
  .ship-workbench-head,
  .plog-toolbar,
  .recycle-page
) :is(input, select, textarea, button:not(.btn-primary):not(.header-create-btn):not(.acc-qb):not(.ship-active-filter-chip)) {
  border-color: var(--gc-skin-border-strong) !important;
  background-color: var(--gc-skin-component-input) !important;
  background-image: none !important;
  color: var(--gc-skin-text-primary) !important;
  box-shadow: none !important;
}

html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper .app-shell :is(input, textarea)::placeholder {
  color: var(--gc-skin-text-tertiary) !important;
}

/* Recycle and archive used literal light text/background pairs. */
html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper .app-shell :is(
  .recycle-title,
  .recycle-sku,
  .recycle-line2,
  .po-arch-pn,
  .po-arch-row .val,
  .plog-sku,
  .plog-name
) {
  color: var(--gc-skin-text-primary) !important;
}

html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper .app-shell :is(
  .recycle-sub,
  .recycle-line3,
  .po-arch-sku,
  .po-arch-row,
  .po-arch-row .lab,
  .plog-header-stats,
  .plog-group-meta
) {
  color: var(--gc-skin-text-secondary) !important;
}

html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper .app-shell :is(.recycle-btn.danger, .recycle-btn.secondary, .ship-report-btn) {
  background-color: var(--gc-skin-component-input) !important;
}

html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper .app-shell :is(
  .plog-section-tab.on,
  .plog-view-toggle button.active,
  .filter-btn.active,
  .view-btn.active
) {
  border-color: var(--gc-skin-border-strong) !important;
  background-color: rgba(255, 255, 255, 0.14) !important;
  color: var(--gc-skin-text-primary) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.04) !important;
}

/* peter-dark-component-contract-v1:
 * Peter 外观已从旧全界面灰度中拆出。把 v254 后新增的邮件台、抽屉抬头和新工作台 token
 * 接回同一套夜间语义，避免新的白色框架穿透主题。客户邮件与打印纸张由后续白纸规则继续隔离。 */
html[data-gc-appearance="dark"] body.peter-appearance-enabled {
  --gc-wb-line: var(--gc-border);
  --gc-wb-muted-surface: var(--gc-surface-subtle);
  --gc-wb-surface: var(--gc-surface-panel);
  --gc-wb-surface-muted: var(--gc-surface-subtle);
  --gc-wb-surface-selected: var(--gc-accent-soft);
  --gc-wb-text: var(--gc-text-primary);
  --gc-wb-text-secondary: var(--gc-text-secondary);
  --gc-wb-text-muted: var(--gc-text-tertiary);
}

html[data-gc-appearance="dark"] body.peter-appearance-enabled .pet-mail-page {
  background: var(--gc-surface-canvas) !important;
  color: var(--gc-text-primary) !important;
}

html[data-gc-appearance="dark"] body.peter-appearance-enabled .pet-mail-page :is(
  .pet-mail-top,
  .pet-mail-panel,
  .pet-mail-compose,
  .pet-mail-collapsed-panel,
  .pet-mail-panel-foot,
  .pet-mail-fields,
  .pet-mail-lines,
  .pet-mail-style-quote-columns,
  .pet-mail-style-quote-price-panel,
  .pet-mail-style-quote-entry,
  .pet-mail-column-chooser-popover
) {
  border-color: var(--gc-border) !important;
  background-color: var(--gc-surface-panel) !important;
  background-image: none !important;
  color: var(--gc-text-primary) !important;
}

html[data-gc-appearance="dark"] body.peter-appearance-enabled .pet-mail-shell {
  background: var(--gc-border) !important;
}

html[data-gc-appearance="dark"] body.peter-appearance-enabled .pet-mail-page :is(
  .pet-mail-panel-h,
  .pet-mail-compose-bar,
  .pet-mail-edit-table th,
  .pet-mail-edit-table td
) {
  border-color: var(--gc-border) !important;
}

html[data-gc-appearance="dark"] body.peter-appearance-enabled .pet-mail-page .pet-mail-edit-table th {
  background: var(--gc-surface-subtle) !important;
  color: var(--gc-text-secondary) !important;
}

html[data-gc-appearance="dark"] body.peter-appearance-enabled .pet-mail-page :is(
  .pet-mail-template,
  .pet-mail-row,
  .pet-mail-group-title,
  .pet-mail-brand-title,
  .pet-mail-back,
  .pet-mail-panel-toggle,
  .pet-mail-mini-btn,
  .pet-mail-btn,
  .pet-mail-column-chooser-trigger,
  .pet-mail-style-quote-column
) {
  border-color: var(--gc-border) !important;
  background-color: var(--gc-surface-card) !important;
  color: var(--gc-text-primary) !important;
}

html[data-gc-appearance="dark"] body.peter-appearance-enabled .pet-mail-page :is(
  .pet-mail-template:hover,
  .pet-mail-row:hover,
  .pet-mail-group-title:hover,
  .pet-mail-brand-title:hover,
  .pet-mail-back:hover,
  .pet-mail-panel-toggle:hover,
  .pet-mail-mini-btn:hover,
  .pet-mail-btn:hover,
  .pet-mail-column-chooser-trigger:hover,
  .pet-mail-style-quote-column:hover
) {
  background-color: var(--gc-surface-hover) !important;
}

html[data-gc-appearance="dark"] body.peter-appearance-enabled .pet-mail-page :is(
  .pet-mail-template.active,
  .pet-mail-row.selected,
  .pet-mail-column-chooser-details[open] > .pet-mail-column-chooser-trigger,
  .pet-mail-style-quote-column.active
) {
  border-color: var(--gc-accent) !important;
  background-color: var(--gc-accent-soft) !important;
  color: var(--gc-text-primary) !important;
}

html[data-gc-appearance="dark"] body.peter-appearance-enabled .pet-mail-page :is(
  .pet-mail-group-title > span:last-child,
  .pet-mail-group-title .chev,
  .pet-mail-column-chooser-popover .pet-mail-style-quote-column
) {
  border-color: var(--gc-border) !important;
  background-color: var(--gc-surface-subtle) !important;
  color: var(--gc-text-secondary) !important;
}

html[data-gc-appearance="dark"] body.peter-appearance-enabled .pet-mail-page .pet-mail-column-chooser-popover .pet-mail-style-quote-column::before {
  border-color: var(--gc-border-strong) !important;
  background: var(--gc-surface-card) !important;
}

html[data-gc-appearance="dark"] body.peter-appearance-enabled .pet-mail-page .pet-mail-column-chooser-popover .pet-mail-style-quote-column.active::before {
  border-color: var(--gc-accent) !important;
  background: var(--gc-accent) !important;
}

html[data-gc-appearance="dark"] body.peter-appearance-enabled .pet-mail-page :is(
  .pet-mail-title,
  .pet-mail-template b,
  .pet-mail-row-main b,
  .pet-mail-edit-id,
  .pet-mail-style-quote-columns b,
  .pet-mail-column-chooser-trigger > b,
  .pet-mail-column-chooser-popover-head > b,
  .pet-mail-style-quote-entry-id b
) {
  color: var(--gc-text-primary) !important;
}

html[data-gc-appearance="dark"] body.peter-appearance-enabled .pet-mail-page :is(
  .pet-mail-sub,
  .pet-mail-panel-h span,
  .pet-mail-collapsed-panel > span,
  .pet-mail-template span,
  .pet-mail-row-main span,
  .pet-mail-field label,
  .pet-mail-line-field label,
  .pet-mail-edit-id span,
  .pet-mail-style-quote-columns > div:first-child > span,
  .pet-mail-column-chooser-trigger > span,
  .pet-mail-column-chooser-popover-head > span,
  .pet-mail-style-quote-entry-id small,
  .pet-mail-empty
) {
  color: var(--gc-text-tertiary) !important;
}

html[data-gc-appearance="dark"] body.peter-appearance-enabled.peter-ai-enabled .drawer-header.drawer-header-v2 {
  border-color: var(--gc-border) !important;
  background: var(--gc-surface-panel) !important;
  color: var(--gc-text-primary) !important;
}

html[data-gc-appearance="dark"] body.peter-appearance-enabled.peter-ai-enabled .drawer-header-v2 :is(
  .drawer-title-main .edit-info-btn,
  .group-add-sister-btn,
  .drawer-header-tools > .drawer-print-btn,
  .drawer-header-tools > .drawer-pdf-dropdown > .drawer-print-btn
) {
  border-color: var(--gc-border) !important;
  background: var(--gc-surface-card) !important;
  color: var(--gc-text-secondary) !important;
}

html[data-gc-appearance="dark"] body.peter-appearance-enabled.peter-ai-enabled .drawer-header-v2 :is(
  .drawer-title-main .edit-info-btn,
  .group-add-sister-btn,
  .drawer-header-tools > .drawer-print-btn,
  .drawer-header-tools > .drawer-pdf-dropdown > .drawer-print-btn,
  .drawer-close
):hover {
  border-color: var(--gc-border-strong) !important;
  background: var(--gc-surface-hover) !important;
  color: var(--gc-accent) !important;
}

html[data-gc-appearance="dark"] body.peter-appearance-enabled.peter-ai-enabled .drawer-header-v2 :is(
  .drawer-title-main .sku-text,
  .drawer-title-main,
  .drawer-desc
) {
  color: var(--gc-text-primary) !important;
}

html[data-gc-appearance="dark"] body.peter-appearance-enabled.peter-ai-enabled .drawer-header-v2 :is(
  .drawer-meta-line,
  .drawer-close
) {
  color: var(--gc-text-tertiary) !important;
}

html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.peter-appearance-enabled.gc-has-wallpaper .pet-mail-page :is(
  .pet-mail-top,
  .pet-mail-panel,
  .pet-mail-compose,
  .pet-mail-fields,
  .pet-mail-column-chooser-popover
),
html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.peter-appearance-enabled.gc-has-wallpaper.peter-ai-enabled .drawer-header.drawer-header-v2 {
  border-color: var(--gc-skin-border) !important;
  background-color: var(--gc-skin-component-panel) !important;
}

/* 客户输出仍是白纸；明确列出使沉浸注册表不能误吞这些节点。 */
html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper :is(.pet-mail-preview-paper, .gc-sdf-paper, .dispatch-paper, .print-paper) {
  color-scheme: light;
  background: #FFFFFF !important;
  color: #1D1D1F !important;
}

@media (prefers-reduced-transparency: reduce) {
  html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper {
    --gc-skin-component-sidebar: #10151E;
    --gc-skin-component-topbar: #10151E;
    --gc-skin-component-panel: #151B25;
    --gc-skin-component-card: #19212D;
    --gc-skin-component-input: #1E2632;
    --gc-skin-component-table-head: #121923;
    --gc-skin-component-table-row: #19212D;
  }

  html[data-gc-skin="immersive"][data-gc-appearance="dark"] body.gc-has-wallpaper :is(.sidebar, .gc-admin-page-head, #controlsBar, .controls, .mobile-topbar, .mobile-tabbar) {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }
}