/* 2026-08-13 · Codex · 现役旧独立生成页统一浅色磨砂；不改生成、扣币、退款和任务状态。 · CHG-20260813-SITE-SURFACE-V3-BATCH7-LEGACY-AIGC-APPS */

body.site-surface--legacy-app {
  --bg-void: #f7f6fa;
  --bg-surface: #fff;
  --bg-elevated: #fff;
  --bg-panel: rgba(255, 255, 255, .82);
  --bg-panel-hover: rgba(255, 255, 255, .96);
  --text-primary: #1d1b22;
  --text-secondary: #5f5a69;
  --text-tertiary: #87818f;
  --text-muted: #87818f;
  --brand-primary: #6f52ff;
  --brand-dim: #c044aa;
  --accent-cyan: #6f52ff;
  --accent-blue: #c044aa;
  --border-subtle: rgba(60, 52, 78, .10);
  --border-default: rgba(60, 52, 78, .12);
  --border-hover: rgba(111, 82, 255, .28);
  --gradient-brand: linear-gradient(135deg, #6f52ff 0%, #c044aa 100%);
  min-height: 100%;
  color: var(--site-ink) !important;
  background:
    radial-gradient(circle at 10% 4%, rgba(111, 82, 255, .14), transparent 27rem),
    radial-gradient(circle at 91% 8%, rgba(216, 70, 160, .09), transparent 25rem),
    linear-gradient(180deg, #faf9fc 0%, #f2f0f6 100%) !important;
  background-attachment: fixed !important;
}

body.site-surface--legacy-app :is(.top-bar, .sw-topbar) {
  color: var(--site-ink) !important;
  background: rgba(255, 255, 255, .82) !important;
  border-bottom-color: var(--site-line) !important;
  box-shadow: 0 10px 34px rgba(35, 30, 50, .06) !important;
  -webkit-backdrop-filter: saturate(150%) blur(20px) !important;
  backdrop-filter: saturate(150%) blur(20px) !important;
}

body.site-surface--legacy-app :is(.top-bar-title, .sw-topbar-title, .sw-topbar-title strong) {
  color: var(--site-ink) !important;
}

body.site-surface--legacy-app :is(.btn-back, .sw-topbar-back, .sw-coins, .user-coins) {
  color: #6547f5 !important;
  background: rgba(255, 255, 255, .82) !important;
  border-color: rgba(111, 82, 255, .18) !important;
}

body.site-surface--legacy-app :is(.main-container, .sw-layout, .preview-area) {
  background: transparent !important;
}

body.site-surface--legacy-app :is(.sidebar, .sw-create-panel, .sw-output-panel) {
  color: var(--site-ink) !important;
  background: rgba(255, 255, 255, .72) !important;
  border-color: var(--site-line) !important;
  box-shadow: var(--site-shadow) !important;
  -webkit-backdrop-filter: saturate(140%) blur(18px);
  backdrop-filter: saturate(140%) blur(18px);
}

body.site-surface--legacy-app :is(
  .upload-zone,
  .price-info,
  .preview-container,
  .task-info-bar,
  .work-item,
  .progress-card,
  .confirm-card,
  .sw-mode-tabs,
  .sw-mode-tab,
  .sw-advanced-body,
  .sw-output-panel,
  .sw-track-card,
  .sw-history-item,
  .sw-history-empty,
  .sw-modal-card,
  .sw-empty-state,
  .sw-lyrics-candidate,
  .compare-container,
  .compare-container-wrapper
) {
  color: var(--site-ink) !important;
  background: var(--site-panel) !important;
  border-color: var(--site-line) !important;
  box-shadow: var(--site-shadow) !important;
  -webkit-backdrop-filter: saturate(140%) blur(16px);
  backdrop-filter: saturate(140%) blur(16px);
}

body.site-surface--legacy-app :is(
  input:not([type="file"]):not([type="checkbox"]),
  textarea,
  select,
  .prompt-textarea,
  .sw-input,
  .sw-textarea
) {
  color: var(--site-ink) !important;
  background: rgba(255, 255, 255, .88) !important;
  border-color: var(--site-line) !important;
}

body.site-surface--legacy-app :is(
  input:not([type="file"]):not([type="checkbox"]),
  textarea,
  select,
  .prompt-textarea,
  .sw-input,
  .sw-textarea
):focus {
  border-color: rgba(111, 82, 255, .42) !important;
  box-shadow: 0 0 0 4px rgba(111, 82, 255, .09) !important;
}

body.site-surface--legacy-app :is(.btn-run-main, .confirm-btn.ok, .sw-btn-gen, .sw-modal-btn.ok, .sw-mode-tab.active) {
  color: #fff !important;
  background: var(--site-gradient) !important;
  border-color: transparent !important;
  box-shadow: 0 12px 28px rgba(111, 82, 255, .24) !important;
}

body.site-surface--legacy-app :is(.current-tag, .sw-badge) {
  color: #fff !important;
  background: var(--site-gradient) !important;
  border-color: transparent !important;
}

body.site-surface--legacy-app :is(.floating-progress, .confirm-modal, .sw-modal-overlay) {
  background: rgba(54, 42, 78, .28) !important;
  -webkit-backdrop-filter: blur(9px) !important;
  backdrop-filter: blur(9px) !important;
}

body.site-surface--legacy-app :is(.progress-title, .confirm-title, .sw-modal-title) {
  color: var(--site-ink) !important;
}

body.site-surface--legacy-app :is(.progress-tip, .sw-coming-soon, .sw-input-hint) {
  color: var(--site-ink-2) !important;
  background: rgba(111, 82, 255, .08) !important;
  border-color: rgba(111, 82, 255, .14) !important;
}

body.site-surface--legacy-app :is(.run-section, .sw-generate-bar) {
  background: rgba(255, 255, 255, .88) !important;
  border-color: var(--site-line) !important;
}

body.site-surface--legacy-app .sw-run-wrap {
  background: rgba(255, 255, 255, .96) !important;
  border-top-color: var(--site-line) !important;
  box-shadow: 0 -10px 28px rgba(34, 29, 49, .08) !important;
}

body.site-surface--legacy-app .sw-price-row .amt {
  color: #6f52ff !important;
}

body.site-surface--legacy-app :is(.toast, .sw-toast) {
  color: var(--site-ink) !important;
  background: rgba(255, 255, 255, .96) !important;
  border-color: var(--site-line) !important;
  box-shadow: 0 14px 38px rgba(34, 29, 49, .13) !important;
}

body.site-surface--legacy-app :is(.toast.success, .sw-toast.success) {
  color: #147a4b !important;
  background: rgba(236, 253, 245, .97) !important;
}

body.site-surface--legacy-app :is(.toast.error, .sw-toast.error) {
  color: #b42345 !important;
  background: rgba(255, 241, 244, .97) !important;
}

body.site-surface--legacy-app :is(.toast.warning, .sw-toast.warning) {
  color: #7148d8 !important;
  background: rgba(246, 241, 255, .97) !important;
}

body.site-surface--legacy-app :is(.upload-zone, .price-info, .preview-container, .task-info-bar, .work-item, .progress-card, .confirm-card, .sw-mode-tab, .sw-track-card, .sw-history-item, .sw-modal-card):hover {
  border-color: rgba(111, 82, 255, .24) !important;
}

@media (max-width: 900px) {
  body.site-surface--legacy-app {
    background:
      radial-gradient(circle at 12% 3%, rgba(111, 82, 255, .10), transparent 20rem),
      linear-gradient(180deg, #faf9fc 0%, #f2f0f6 100%) !important;
    background-attachment: scroll !important;
  }

  body.site-surface--legacy-app :is(.sidebar, .sw-create-panel, .sw-output-panel) {
    border-right: 0 !important;
    box-shadow: 0 10px 28px rgba(34, 29, 49, .07) !important;
  }
}

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