:root {
  
  --qa-d1:#03163f; --qa-d2:#041b4e; --qa-d3:#052261; --qa-d4:#062974; --qa-d5:#073088; --qa-d6:#0838a0;
  --qa-d7:#0a43bd; --qa-d8:#0c4fdf; --qa-d9:#5c8fff; --qa-d10:#3f74e6; --qa-d11:#93b4ff; --qa-d12:#cfddfc;
  --qa-l1:#f6f8fe; --qa-l2:#eaf0fd; --qa-l3:#dae4fb; --qa-l4:#c7d7f9; --qa-l5:#b0c7f7; --qa-l6:#94b3f4;
  --qa-l7:#6f98f1; --qa-l8:#3c74ec; --qa-l9:#2764e7; --qa-l10:#1a56d5; --qa-l11:#134bc3; --qa-l12:#0c2e79;
  
  --qa-nd1:#18191b; --qa-nd2:#1e1f22; --qa-nd3:#27282b; --qa-nd4:#2f3134; --qa-nd5:#393b3f; --qa-nd6:#46494e;
  --qa-nd7:#56595f; --qa-nd8:#6c6f75; --qa-nd9:#676a6f; --qa-nd10:#7b7e84; --qa-nd11:#b4b6bb; --qa-nd12:#ededee;
  --qa-nl1:#fcfcfd; --qa-nl2:#f7f7f8; --qa-nl3:#f0f1f2; --qa-nl4:#e8e9eb; --qa-nl5:#dee0e3; --qa-nl6:#d2d4d8;
  --qa-nl7:#c1c3c8; --qa-nl8:#a6a9af; --qa-nl9:#9196a1; --qa-nl10:#7b818f; --qa-nl11:#686d79; --qa-nl12:#35373b;

  
  --qa-r: 2px;
  --qa-font-head: "Roboto", "Noto Sans TC", "PingFang TC", "Microsoft JhengHei", sans-serif;
  --qa-font-body: "Open Sans", "Noto Sans TC", "PingFang TC", "Microsoft JhengHei", sans-serif;
  --qa-gap: 16px;
  --qa-pad: 18px;
  --qa-max: 1160px;

  
  --qa-topbar: #272930;
  --qa-topbar-2: #31333c;

  
  --qa-bg: #f2f3f5;
  --qa-surface: #ffffff;
  --qa-inset: #f5f6f7;
  --qa-line: #e1e3e3;
  --qa-line-soft: #eceded;
  --qa-blue: #2764e7;
  --qa-blue-dim: #1f57cc;
  --qa-green: #26aa6c;
  --qa-red: #e0453a;
  --qa-btn-text: #ffffff;
  --qa-text: #262a30;
  --qa-muted: #5f6673;
  --qa-faint: #9aa0aa;
  --qa-star: #f5a623;
  --qa-accent-soft: #eef2fb;
  --qa-accent-soft-2: #e0e9fb;
  --qa-brief-bg: #f7f9fc;
  --qa-faq-bg: #fafbfc;
  --qa-act-hover: #f2f5fb;
  --qa-quote-bg: #f2faf6;
  --qa-notice-bg: #f2f7ff;
  --qa-notice-border: #cfe0fb;
  --qa-warn-bg: #fdf3f2;
  --qa-warn-border: #f3d2cf;
  --qa-thumb: linear-gradient(135deg, #d6e2fb, #eef2fb);
  --qa-video-bg: linear-gradient(135deg, #c9d8f5, #e6edfa);
  --qa-zebra: #fafbfc;
  --qa-shadow: 0 1px 3px rgba(39, 41, 48, .06);
  --qa-shadow-hover: 0 3px 12px rgba(39, 41, 48, .1);
}


[data-mode="dark"] {
  --qa-bg: #18191b;
  --qa-surface: #202127;
  --qa-inset: #26282d;
  --qa-line: #303237;
  --qa-line-soft: #292b30;
  --qa-blue: #5c8fff;
  --qa-blue-dim: #3f74e6;
  --qa-green: #35c98a;
  --qa-red: #ef6a5f;
  --qa-btn-text: #08122b;
  --qa-text: #ededee;
  --qa-muted: #b4b6bb;
  --qa-faint: #7e828b;
  --qa-star: #f7b73a;
  --qa-accent-soft: #24304a;
  --qa-accent-soft-2: #2c3a58;
  --qa-brief-bg: #22242a;
  --qa-faq-bg: #202127;
  --qa-act-hover: #262d3a;
  --qa-quote-bg: #1b2a24;
  --qa-notice-bg: #1e2735;
  --qa-notice-border: #2f3f57;
  --qa-warn-bg: #2c211f;
  --qa-warn-border: #4a332f;
  --qa-thumb: linear-gradient(135deg, #28324a, #1f2733);
  --qa-video-bg: linear-gradient(135deg, #263250, #1c2331);
  --qa-zebra: rgba(255, 255, 255, .03);
  --qa-shadow: 0 1px 3px rgba(0, 0, 0, .4);
  --qa-shadow-hover: 0 4px 14px rgba(0, 0, 0, .5);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-mode]) {
    --qa-bg: #18191b; --qa-surface: #202127; --qa-inset: #26282d; --qa-line: #303237; --qa-line-soft: #292b30;
    --qa-blue: #5c8fff; --qa-blue-dim: #3f74e6; --qa-green: #35c98a; --qa-red: #ef6a5f; --qa-btn-text: #08122b;
    --qa-text: #ededee; --qa-muted: #b4b6bb; --qa-faint: #7e828b; --qa-star: #f7b73a;
    --qa-accent-soft: #24304a; --qa-accent-soft-2: #2c3a58; --qa-brief-bg: #22242a; --qa-faq-bg: #202127;
    --qa-act-hover: #262d3a; --qa-quote-bg: #1b2a24; --qa-notice-bg: #1e2735; --qa-notice-border: #2f3f57;
    --qa-warn-bg: #2c211f; --qa-warn-border: #4a332f;
    --qa-thumb: linear-gradient(135deg, #28324a, #1f2733); --qa-video-bg: linear-gradient(135deg, #263250, #1c2331);
    --qa-zebra: rgba(255, 255, 255, .03); --qa-shadow: 0 1px 3px rgba(0, 0, 0, .4); --qa-shadow-hover: 0 4px 14px rgba(0, 0, 0, .5);
  }
}