/* ==========================================================================
   深色外观：旧版蓝灰石墨台面，品牌蓝只做强调。
   只替换 app.css 的 token；组件结构完全复用。
   ========================================================================== */

[data-theme="dark"] {
  color-scheme: dark;

  --paper: #11151f;
  --paper-2: #0c1018;
  --surface: #1b2230;
  --surface-2: #232d3e;
  --surface-3: #28344a;
  --stage: #0c111b;
  --thumb: #141b28;

  --ink: #edf2fc;
  --ink-2: #c6d1e3;
  --muted: #a4b1c8;
  --faint: #7d8aa0;

  --line: #303c50;
  --line-2: #44536c;
  --mark: #56657d;

  --accent: #8aa9f5;
  --accent-strong: #a9c0ff;
  --accent-solid: #3469cc;
  --accent-soft: #253651;
  --accent-line: #3a4d70;
  --on-accent: #ffffff;

  --ok: #57b98c;
  --danger: #ff9b8a;
  --danger-soft: #2a1a16;

  --shadow-1: 0 1px 2px rgba(0, 0, 0, .45), 0 16px 34px -26px rgba(0, 0, 0, .8);
  --shadow-2: 0 30px 80px -32px rgba(0, 0, 0, .92);

  --select-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a4b1c8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
}

/* 深色下纸张是唯一的高光，阴影更深更收。 */
[data-theme="dark"] .paper { box-shadow: 0 1px 2px rgba(0, 0, 0, .6), 0 30px 60px -30px rgba(0, 0, 0, .9); }
[data-theme="dark"] .crop { opacity: .6; }

/* 色卡自带深底，用内描边交代边界。 */
[data-theme="dark"] .theme-swatch { border-color: rgba(255, 255, 255, .12); }
[data-theme="dark"] .ref-badge { background: rgba(27, 34, 48, .88); }

/* 填充按钮沿用品牌蓝；深色里只把悬停压暗，避免浅色文字压在浅蓝上。 */
[data-theme="dark"] .primary-button { background: #3469cc; border-color: #3469cc; }
[data-theme="dark"] .primary-button:hover:not(:disabled) { background: #2b56ad; border-color: #2b56ad; }

[data-theme="dark"] .brand-seal { box-shadow: 0 2px 10px -2px rgba(0, 0, 0, .8); }
[data-theme="dark"] dialog { box-shadow: 0 40px 110px -30px rgba(0, 0, 0, .95); }
[data-theme="dark"] dialog::backdrop { background: rgba(5, 8, 14, .66); }
[data-theme="dark"] ::selection { background: #263658; color: #dbe6ff; }
[data-theme="dark"] #error-notification { background: #221a1c; }