


:root {
  
  --fcHl1:#fcfafb; --fcHl2:#fce4ec; --fcHl3:#f9d4e0; --fcHl4:#f6d5e0; --fcHl5:#f5bfd1; --fcHl6:#f0a3bd;
  --fcHl7:#e87da1; --fcHl8:#dd4b7b; --fcHl9:#d21e63; --fcHl10:#ad184f; --fcHl11:#b02359; --fcHl12:#582334;
  
  --fcHd1:#371621; --fcHd2:#3a1522; --fcHd3:#4a1a2c; --fcHd4:#6f1533; --fcHd5:#86163b; --fcHd6:#a21644;
  --fcHd7:#c21a52; --fcHd8:#e22765; --fcHd9:#ff5c88; --fcHd10:#f43d72; --fcHd11:#ff9db6; --fcHd12:#f5e6eb;
  
  --fcNl1:#f6f7fb; --fcNl2:#eef1f8; --fcNl3:#f0f0f2; --fcNl4:#e9eaed; --fcNl5:#e1e1e5; --fcNl6:#e2e6f1;
  --fcNl7:#c1c2c8; --fcNl8:#a4a5ad; --fcNl9:#878892; --fcNl10:#71737e; --fcNl11:#5a6079; --fcNl12:#1c2033;
  
  --fcNd1:#16172a; --fcNd2:#21233a; --fcNd3:#2b2e49; --fcNd4:#2a2c39; --fcNd5:#333645; --fcNd6:#363a5c;
  --fcNd7:#525466; --fcNd8:#686b7e; --fcNd9:#7e8091; --fcNd10:#9496a3; --fcNd11:#a6abcf; --fcNd12:#ecedf6;

  
  --fcPrimary: var(--fcHl9);
  --fcPrimarySoft: var(--fcHl2);
  --fcPrimaryDeep: var(--fcHl10);
  --fcSecondary: #27356e;      
  --fcSecondarySoft: #e6e9f4;
  --fcAccent: #ffb703;
  --fcAccentSoft: #fff4d6;
  --fcBg: var(--fcNl1);
  --fcSurface: #ffffff;
  --fcSurfaceAlt: var(--fcNl2);
  --fcText: var(--fcNl12);
  --fcTextMuted: var(--fcNl11);
  --fcLine: var(--fcNl6);
  --fcStar: #ffb703;
  --fcOk: #2f9e6b;
  --fcPanel: #27356e;          
  --fcBtnText: #ffffff;        

  
  --fcShadow: 0 8px 24px rgba(39, 53, 110, .08);
  --fcShadowHover: 0 14px 32px rgba(230, 64, 114, .16);
  --fcShadowSoft: 0 2px 8px rgba(39, 53, 110, .06);

  
  --fcRadius: 14px;
  --fcRadiusLg: 20px;
  --fcRadiusSm: 10px;
  --fcRadiusPill: 999px;

  
  --fcFont: "Inter", "Noto Sans TC", "PingFang TC", "Microsoft JhengHei", sans-serif;
  --fcSizeBase: 15px;
  --fcSpace: 18px;

  
  --fcFlag: repeating-linear-gradient(135deg, var(--fcPrimary) 0 16px, var(--fcPrimaryDeep) 16px 32px);
}


[data-mode="dark"] {
  --fcPrimary: var(--fcHd9);
  --fcPrimarySoft: var(--fcHd3);
  --fcPrimaryDeep: var(--fcHd10);
  --fcSecondary: #c7cef0;
  --fcSecondarySoft: #2b2f4d;
  --fcAccent: #ffc233;
  --fcAccentSoft: #3a2f12;
  --fcBg: var(--fcNd1);
  --fcSurface: var(--fcNd2);
  --fcSurfaceAlt: var(--fcNd3);
  --fcText: var(--fcNd12);
  --fcTextMuted: var(--fcNd11);
  --fcLine: var(--fcNd6);
  --fcStar: #ffc233;
  --fcOk: #34c98a;
  --fcPanel: #20223a;
  --fcBtnText: #37071c;
  --fcShadow: 0 8px 24px rgba(0, 0, 0, .42);
  --fcShadowHover: 0 14px 32px rgba(255, 92, 136, .22);
  --fcShadowSoft: 0 2px 8px rgba(0, 0, 0, .3);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-mode="light"]) {
    --fcPrimary: var(--fcHd9); --fcPrimarySoft: var(--fcHd3); --fcPrimaryDeep: var(--fcHd10);
    --fcSecondary: #c7cef0; --fcSecondarySoft: #2b2f4d; --fcAccent: #ffc233; --fcAccentSoft: #3a2f12;
    --fcBg: var(--fcNd1); --fcSurface: var(--fcNd2); --fcSurfaceAlt: var(--fcNd3);
    --fcText: var(--fcNd12); --fcTextMuted: var(--fcNd11); --fcLine: var(--fcNd6);
    --fcStar: #ffc233; --fcOk: #34c98a; --fcPanel: #20223a; --fcBtnText: #37071c;
    --fcShadow: 0 8px 24px rgba(0,0,0,.42); --fcShadowHover: 0 14px 32px rgba(255,92,136,.22); --fcShadowSoft: 0 2px 8px rgba(0,0,0,.3);
  }
}




.fc-mode {
  width: 40px; height: 40px; flex: 0 0 auto; cursor: pointer;
  border: 1px solid var(--fcLine); border-radius: var(--fcRadiusPill);
  background: var(--fcSurfaceAlt); color: var(--fcSecondary);
  font-size: 1.05rem; display: grid; place-items: center;
}
.fc-mode:hover { border-color: var(--fcPrimary); color: var(--fcPrimary); }
.fc-mode .mMoon { display: none; }
[data-mode="dark"] .fc-mode .mSun { display: none; }
[data-mode="dark"] .fc-mode .mMoon { display: inline; }
@media (prefers-color-scheme: dark) {
  :root:not([data-mode="light"]) .fc-mode .mSun { display: none; }
  :root:not([data-mode="light"]) .fc-mode .mMoon { display: inline; }
}

