/* 2026-08-13 · Codex · 工作台、后台与运营页统一浅色磨砂外观；业务、支付、会员和管理接口不变。 · CHG-20260813-SITE-SURFACE-V3-REMAINING-OPS */
:root {
  --ops-bg: #f6f5f8;
  --ops-panel: rgba(255, 255, 255, .80);
  --ops-panel-strong: rgba(255, 255, 255, .94);
  --ops-ink: #1d1b22;
  --ops-ink-2: #5f5968;
  --ops-ink-3: #817a89;
  --ops-line: rgba(60, 52, 78, .11);
  --ops-purple: #6f52ff;
  --ops-purple-soft: rgba(111, 82, 255, .10);
  --ops-gradient: linear-gradient(135deg, #6f52ff 0%, #d846a0 100%);
  --ops-shadow: 0 14px 38px rgba(34, 29, 49, .08);
}

body.site-surface--ops {
  min-height: 100vh;
  color: var(--ops-ink) !important;
  background:
    radial-gradient(circle at 12% 4%, rgba(124, 92, 255, .15), transparent 30rem),
    radial-gradient(circle at 88% 10%, rgba(216, 70, 160, .10), transparent 28rem),
    linear-gradient(145deg, #f8f7fb 0%, #efedf4 100%) !important;
  background-attachment: fixed !important;
}

body.site-surface--ops :is(input, select, textarea) {
  color: var(--ops-ink) !important;
  background: rgba(255, 255, 255, .84) !important;
  border-color: rgba(60, 52, 78, .14) !important;
}

body.site-surface--ops :is(input, select, textarea):focus {
  border-color: rgba(111, 82, 255, .68) !important;
  outline: 3px solid rgba(111, 82, 255, .12) !important;
  box-shadow: none !important;
}

body.site-surface--ops :is(
  .admin-lock,
  .lock,
  .modal-mask,
  .ops-modal-mask,
  .sidebar-backdrop
) {
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
}

body.site-surface--ops :is(
  .admin-lock,
  .lock
) {
  background: rgba(246, 245, 248, .86) !important;
}

body.site-surface--ops :is(
  .admin-lock-card,
  .lock-card,
  .card,
  .panel,
  .metric-card,
  .stat-card,
  .detail-card,
  .link-card,
  .provider-card,
  .module-status-card,
  .ops-form-card,
  .ops-selector-card,
  .ai-onboarding-card,
  .community-admin-card,
  .factory-card,
  .deliver-card,
  .preview-shell,
  .result-panel,
  .order-panel,
  .cta-box,
  .generated-pack
) {
  color: var(--ops-ink) !important;
  background: var(--ops-panel) !important;
  border-color: var(--ops-line) !important;
  box-shadow: var(--ops-shadow) !important;
  -webkit-backdrop-filter: blur(18px) saturate(140%);
  backdrop-filter: blur(18px) saturate(140%);
}

body.site-surface--ops :is(
  .admin-lock-card,
  .lock-card,
  .panel-title,
  .panel-header h3,
  .metric-card .v,
  .table-name,
  .detail-card h3,
  .alert-item strong
) {
  color: var(--ops-ink) !important;
}

body.site-surface--ops :is(
  .helper,
  .mini-note,
  .panel-subtitle,
  .metric-card .k,
  .metric-card .note,
  .detail-empty,
  .empty-state,
  .admin-lock-card p,
  .lock-card p
) {
  color: var(--ops-ink-2) !important;
}

body.site-surface--ops :is(th, .panel-header, .card-head, .modal-head, .modal-foot) {
  color: var(--ops-ink-2) !important;
  background: rgba(248, 247, 251, .92) !important;
  border-color: rgba(60, 52, 78, .09) !important;
}

body.site-surface--ops td {
  color: #3f3948;
  border-color: rgba(60, 52, 78, .08) !important;
}

body.site-surface--ops :is(.btn.primary, .btn-primary, .submit-btn, .order-btn, .payment-report-btn, .admin-lock-card button, .lock-card .btn.primary) {
  color: #fff !important;
  background: var(--ops-gradient) !important;
  border-color: transparent !important;
  box-shadow: 0 10px 26px rgba(111, 82, 255, .22) !important;
}

body.site-surface--ops :is(.btn, .chip-link, .action-btn, .top-links a) {
  color: #4b4454;
  background: rgba(255, 255, 255, .76);
  border-color: rgba(60, 52, 78, .12);
}

/* 登录后的创作工作台 */
body.site-surface--workspace :is(
  .ws-sidebar,
  .ws-topbar,
  .ws-flyout,
  .ws-avatar-menu,
  .ws-mode-menu,
  .ws-param-pop,
  .ws-gen-bar,
  .ws-pop,
  .pb-tabs,
  .pb-tp-drawer,
  .pb-modal-card,
  .ws-recharge-card
) {
  background: rgba(255, 255, 255, .78) !important;
  border-color: var(--ops-line) !important;
  box-shadow: var(--ops-shadow) !important;
  -webkit-backdrop-filter: blur(20px) saturate(145%);
  backdrop-filter: blur(20px) saturate(145%);
}

body.site-surface--workspace :is(
  .ws-card,
  .ws-skel-card,
  .pb-card,
  .pbg-card,
  .pbtm-card,
  .pba-card,
  .pbt-card,
  .pbp-model-card,
  .pbp-member-card,
  .pbchat-mcard,
  .pbgd-card,
  .pbv-hist-card,
  .pbv-model,
  .pbv-form,
  .pbm-song-card,
  .pbm-lyric-card,
  .pbm-create,
  .pbm-workspace,
  .pb-canvas-card,
  .pb-tp-card,
  .ws-pm-model,
  .ws-scene-chip
) {
  background: rgba(255, 255, 255, .78) !important;
  border-color: var(--ops-line) !important;
  box-shadow: 0 10px 30px rgba(34, 29, 49, .065) !important;
}

/* 统一控制台：旧黑色侧栏和黄绿强调改成浅色磨砂与紫色。 */
body.site-surface--admin-console .sidebar {
  color: var(--ops-ink) !important;
  background: rgba(255, 255, 255, .86) !important;
  border-right-color: var(--ops-line) !important;
  box-shadow: 12px 0 36px rgba(43, 35, 68, .075) !important;
}

body.site-surface--admin-console .sidebar :is(.t1, .domain-toggle, .tab-btn, .nav-page, .foot) {
  color: var(--ops-ink-2) !important;
}

body.site-surface--admin-console .sidebar :is(.domain-toggle:hover, .nav-domain.open > .domain-toggle, .tab-btn:hover, .tab-btn.active, .nav-page-link:hover) {
  color: #5b43c7 !important;
  background: var(--ops-purple-soft) !important;
  border-color: rgba(111, 82, 255, .5) !important;
}

body.site-surface--admin-console .sidebar .brand .logo,
body.site-surface--admin-console .sidebar .foot .dot,
body.site-surface--admin-console .topbar-note .status-dot,
body.site-surface--admin-console .stat-card::before {
  color: #fff !important;
  background: var(--ops-gradient) !important;
  box-shadow: 0 0 0 4px rgba(111, 82, 255, .10) !important;
}

body.site-surface--admin-console .admin-topbar {
  background: rgba(248, 247, 251, .86) !important;
  border-bottom-color: var(--ops-line) !important;
}

/* 小红书工厂的原深色示意区也保持浅色。 */
body.site-surface--xhs-factory .preview-shell {
  color: var(--ops-ink) !important;
}

body.site-surface--xhs-factory .preview-step {
  color: var(--ops-ink-2) !important;
  background: rgba(111, 82, 255, .07) !important;
}

body.site-surface--xhs-factory .preview-step.active {
  color: #fff !important;
  background: var(--ops-purple) !important;
}

@media (max-width: 900px) {
  body.site-surface--ops {
    background:
      radial-gradient(circle at 10% 2%, rgba(124, 92, 255, .11), transparent 20rem),
      linear-gradient(145deg, #f8f7fb 0%, #efedf4 100%) !important;
    background-attachment: scroll !important;
  }

  body.site-surface--admin-console .sidebar {
    box-shadow: 0 18px 50px rgba(43, 35, 68, .14) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.site-surface--ops *,
  body.site-surface--ops *::before,
  body.site-surface--ops *::after {
    scroll-behavior: auto !important;
  }
}