:root{
  --bg:#f3f6fa;
  --surface:#fcfdff;
  --ink:#3d2b1f;
  --ink-soft:#8a7361;
  --text-strong:#000000;
  --navy:#014984;
  --powder:#c1d0e8;
  --gold:#c6ae7c;
  --coffee:#6f4e37;
  --line:#e4d8c3;
  --font-heading:"Noto Serif TC", serif;
  --font-body:"Noto Serif TC", serif;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#141c24;
    --surface:#1c252f;
    --ink:#ecdfcf;
    --ink-soft:#b9a68f;
    --text-strong:#f5f0e8;
    --navy:#7fa8d4;
    --powder:#9fb8d8;
    --gold:#d8c295;
    --coffee:#b08968;
    --line:#3a3025;
  }
}
:root[data-theme="dark"]{
  --bg:#141c24;
  --surface:#1c252f;
  --ink:#ecdfcf;
  --ink-soft:#b9a68f;
  --text-strong:#f5f0e8;
  --navy:#7fa8d4;
  --powder:#9fb8d8;
  --gold:#d8c295;
  --coffee:#b08968;
  --line:#3a3025;
}

/* ---------- 主題色系：胭脂粉 ---------- */
:root[data-theme-preset="rose-blush"]{
  --bg:#fbf1f0;
  --surface:#fffafa;
  --ink:#3a2226;
  --ink-soft:#8f6b6f;
  --text-strong:#000000;
  --navy:#8a2f45;
  --powder:#f3d3d9;
  --gold:#c9a15a;
  --coffee:#6b4a4f;
  --line:#ecd3d3;
}
@media (prefers-color-scheme: dark){
  :root[data-theme-preset="rose-blush"]:not([data-theme="light"]){
    --bg:#241419; --surface:#2e1a20; --ink:#f3e3e5; --ink-soft:#c9a3a9;
    --text-strong:#f8ecec; --navy:#d98aa0; --powder:#c98fa0; --gold:#dcbf88;
    --coffee:#c99ba0; --line:#4a2c33;
  }
}
:root[data-theme-preset="rose-blush"][data-theme="dark"]{
  --bg:#241419; --surface:#2e1a20; --ink:#f3e3e5; --ink-soft:#c9a3a9;
  --text-strong:#f8ecec; --navy:#d98aa0; --powder:#c98fa0; --gold:#dcbf88;
  --coffee:#c99ba0; --line:#4a2c33;
}

/* ---------- 主題色系：墨綠 ---------- */
:root[data-theme-preset="ink-green"]{
  --bg:#f2f5f0;
  --surface:#fafcf8;
  --ink:#263229;
  --ink-soft:#6f7f70;
  --text-strong:#000000;
  --navy:#2f4a3d;
  --powder:#d3e3d4;
  --gold:#c6ae7c;
  --coffee:#5a6b52;
  --line:#dbe4d5;
}
@media (prefers-color-scheme: dark){
  :root[data-theme-preset="ink-green"]:not([data-theme="light"]){
    --bg:#131a15; --surface:#1b241d; --ink:#e5ede0; --ink-soft:#a8b8a3;
    --text-strong:#f2f7ee; --navy:#7fae94; --powder:#92ad93; --gold:#d8c295;
    --coffee:#9bb08e; --line:#2e3a2e;
  }
}
:root[data-theme-preset="ink-green"][data-theme="dark"]{
  --bg:#131a15; --surface:#1b241d; --ink:#e5ede0; --ink-soft:#a8b8a3;
  --text-strong:#f2f7ee; --navy:#7fae94; --powder:#92ad93; --gold:#d8c295;
  --coffee:#9bb08e; --line:#2e3a2e;
}

/* ---------- 主題色系：暮色紫 ---------- */
:root[data-theme-preset="dusk-purple"]{
  --bg:#f6eef8;
  --surface:#fdf8fe;
  --ink:#3a2340;
  --ink-soft:#9678a0;
  --text-strong:#000000;
  --navy:#7a3f8a;
  --powder:#e8d4ee;
  --gold:#c9a15a;
  --coffee:#6e4a72;
  --line:#ecd9f0;
}
@media (prefers-color-scheme: dark){
  :root[data-theme-preset="dusk-purple"]:not([data-theme="light"]){
    --bg:#1f1524; --surface:#2a1d30; --ink:#f2e4f5; --ink-soft:#c9a0d1;
    --text-strong:#f8ecfa; --navy:#c07ad1; --powder:#a883b0; --gold:#dcbf88;
    --coffee:#b98fc0; --line:#3d2a44;
  }
}
:root[data-theme-preset="dusk-purple"][data-theme="dark"]{
  --bg:#1f1524; --surface:#2a1d30; --ink:#f2e4f5; --ink-soft:#c9a0d1;
  --text-strong:#f8ecfa; --navy:#c07ad1; --powder:#a883b0; --gold:#dcbf88;
  --coffee:#b98fc0; --line:#3d2a44;
}

/* ---------- 主題色系：暖陽橙 ---------- */
:root[data-theme-preset="amber"]{
  --bg:#faf4ec;
  --surface:#fffaf3;
  --ink:#3d2b1a;
  --ink-soft:#9c7c5c;
  --text-strong:#000000;
  --navy:#b3541e;
  --powder:#f0dcc4;
  --gold:#d9a441;
  --coffee:#7a5230;
  --line:#ecdcc4;
}
@media (prefers-color-scheme: dark){
  :root[data-theme-preset="amber"]:not([data-theme="light"]){
    --bg:#201509; --surface:#2a1c0e; --ink:#f5e6d3; --ink-soft:#c9a97e;
    --text-strong:#f8ecdd; --navy:#e0904f; --powder:#c9a97e; --gold:#e6bd6c;
    --coffee:#c9986a; --line:#3d2c18;
  }
}
:root[data-theme-preset="amber"][data-theme="dark"]{
  --bg:#201509; --surface:#2a1c0e; --ink:#f5e6d3; --ink-soft:#c9a97e;
  --text-strong:#f8ecdd; --navy:#e0904f; --powder:#c9a97e; --gold:#e6bd6c;
  --coffee:#c9986a; --line:#3d2c18;
}

/* ---------- 主題色系：靛藍夜 ---------- */
:root[data-theme-preset="indigo"]{
  --bg:#eaeefb;
  --surface:#f8faff;
  --ink:#161c3a;
  --ink-soft:#5c6699;
  --text-strong:#000000;
  --navy:#1f3480;
  --powder:#c6d0f0;
  --gold:#b8925a;
  --coffee:#31407a;
  --line:#d2daf4;
}
@media (prefers-color-scheme: dark){
  :root[data-theme-preset="indigo"]:not([data-theme="light"]){
    --bg:#0c0f22; --surface:#141834; --ink:#e0e4f8; --ink-soft:#8791c4;
    --text-strong:#ecefff; --navy:#6a80e0; --powder:#8390c9; --gold:#d0ac78;
    --coffee:#8794d2; --line:#242a4c;
  }
}
:root[data-theme-preset="indigo"][data-theme="dark"]{
  --bg:#0c0f22; --surface:#141834; --ink:#e0e4f8; --ink-soft:#8791c4;
  --text-strong:#ecefff; --navy:#6a80e0; --powder:#8390c9; --gold:#d0ac78;
  --coffee:#8794d2; --line:#242a4c;
}

/* ---------- 主題色系：大地色 ---------- */
:root[data-theme-preset="earth"]{
  --bg:#f3efe6;
  --surface:#faf7f0;
  --ink:#362b1f;
  --ink-soft:#8c7a63;
  --text-strong:#000000;
  --navy:#6b5638;
  --powder:#ddd0b8;
  --gold:#b98b4e;
  --coffee:#5c4a35;
  --line:#e2d5bc;
}
@media (prefers-color-scheme: dark){
  :root[data-theme-preset="earth"]:not([data-theme="light"]){
    --bg:#1a1510; --surface:#241d16; --ink:#ede4d5; --ink-soft:#bba98c;
    --text-strong:#f5efe3; --navy:#b08a5a; --powder:#a08e6c; --gold:#d4ab6a;
    --coffee:#ab9270; --line:#362c20;
  }
}
:root[data-theme-preset="earth"][data-theme="dark"]{
  --bg:#1a1510; --surface:#241d16; --ink:#ede4d5; --ink-soft:#bba98c;
  --text-strong:#f5efe3; --navy:#b08a5a; --powder:#a08e6c; --gold:#d4ab6a;
  --coffee:#ab9270; --line:#362c20;
}

/* ---------- 主題色系：水墨灰 ---------- */
:root[data-theme-preset="ink-wash"]{
  --bg:#f4f3f0;
  --surface:#fbfaf8;
  --ink:#262626;
  --ink-soft:#8a8a86;
  --text-strong:#000000;
  --navy:#3a3a3a;
  --powder:#dcdad4;
  --gold:#a13d2f;
  --coffee:#4a4a48;
  --line:#dcdbd4;
}
@media (prefers-color-scheme: dark){
  :root[data-theme-preset="ink-wash"]:not([data-theme="light"]){
    --bg:#161615; --surface:#1f1f1e; --ink:#e8e6e0; --ink-soft:#a8a6a0;
    --text-strong:#f5f3ee; --navy:#c9c9c4; --powder:#8a8a86; --gold:#c96b52;
    --coffee:#b5b3ac; --line:#333331;
  }
}
:root[data-theme-preset="ink-wash"][data-theme="dark"]{
  --bg:#161615; --surface:#1f1f1e; --ink:#e8e6e0; --ink-soft:#a8a6a0;
  --text-strong:#f5f3ee; --navy:#c9c9c4; --powder:#8a8a86; --gold:#c96b52;
  --coffee:#b5b3ac; --line:#333331;
}

*{ box-sizing:border-box; }
body{
  margin:0;
  font-family:var(--font-body);
  font-weight:500;
  color:var(--ink);
  background:
    repeating-linear-gradient(
      var(--bg) 0px, var(--bg) 31px,
      color-mix(in srgb, var(--line) 45%, var(--bg)) 31px,
      color-mix(in srgb, var(--line) 45%, var(--bg)) 32px
    );
  background-color:var(--bg);
}
.binding{
  position:fixed; top:0; left:24px; bottom:0; width:1px;
  background:color-mix(in srgb, var(--gold) 55%, transparent);
  pointer-events:none;
}
@media (max-width:600px){ .binding{ display:none; } }

.wrap{ max-width:640px; margin:0 auto; padding:64px 24px 100px 56px; position:relative; }
@media (max-width:600px){ .wrap{ padding:48px 20px 90px; } }

/* ---------- hero ---------- */
.hero{ text-align:center; margin-bottom:20px; }
.hero .en{
  font-family:var(--font-heading);
  font-weight:500;
  letter-spacing:.18em; text-transform:uppercase;
  color:var(--coffee); font-size:12px; margin-bottom:6px;
}
.hero h1{
  font-family:var(--font-heading);
  font-weight:700; font-size:28px; letter-spacing:.08em;
  color:var(--navy); margin:0 0 10px; text-wrap:balance;
}
.hero .divider{
  display:flex; align-items:center; justify-content:center; gap:10px;
  margin:14px 0;
}
.hero .divider .divider-line{ width:36px; height:1px; background:var(--gold); }
/*.hero .divider .divider-center{ }*/

.hero-line1{
  font-family:var(--font-body); margin:0; color:var(--ink-soft); font-size:14px;
  letter-spacing:.05em;
}
.hero-line2{
  font-family:var(--font-body); margin-top: 10px; margin-bottom: 0px;color:var(--ink-soft); font-size:18px;
  letter-spacing:.05em;font-weight: 700;color: var(--navy);
}

/* ---------- month header ---------- */
.month-head{
  display:flex; align-items:center;
  margin:44px 0 18px; position:relative;
}
.month-head:first-of-type{ margin-top:0; }
.month-label{
  flex:0 0 auto;
  font-family:var(--font-heading); font-weight:700;
  font-size:16px; color:var(--navy); letter-spacing:.04em;
  background:var(--powder);
  padding:3px 10px;
  border-radius:20px;
}
.month-ornament{
  display:flex; align-items:center; gap:8px;
  flex:1 1 auto;
  color:var(--gold);
}
.month-ornament .dot-cluster{
  display:inline-flex; align-items:center; gap:3px;
  flex:0 0 auto;
}
.month-ornament .dot{
  display:inline-block;
  width:8px; height:8px;
  border-radius:2px;
}
.month-ornament .dot-navy{ background:var(--navy); }
.month-ornament .dot-gold{ background:var(--gold); }
.month-ornament .dot-powder{ background:var(--powder); }
.month-ornament .ornament-line{
  flex:1 1 auto;
  height:1px;
  background:var(--gold);
}
/*.month-head::after{
  content:"";
  flex:1; height:1px;
  background:repeating-linear-gradient(to right, var(--line) 0 4px, transparent 4px 8px);
}*/

/* ---------- month overview calendar ---------- */
.cal-grid{
  display:grid; grid-template-columns:repeat(7, 1fr);
  gap:4px; margin-bottom:24px;
  padding:14px; background:var(--surface); border:1px solid var(--line); border-radius:4px;
}
.cal-weekday{
  text-align:center; font-size:12px; color:var(--text-strong);
  font-family:var(--font-heading); font-weight:600;
  background:var(--powder); border-radius:4px;
  padding:4px 0; margin-bottom:4px;
}
.cal-weekday.sat{ background:#d3e3d4; }
.cal-weekday.sun{ background:#f3d3d3; }
.cal-day{
  width:100%; height:100%;
  display:flex; align-items:center; justify-content:center;
  font-size:12px; color:var(--text-strong); font-family:var(--font-heading);
  border-radius:3px;
}
.cal-day.empty{ visibility:hidden; }
.cal-day.has-event{
  background:var(--navy); color:var(--surface); font-weight:600; cursor:pointer;
}
.cal-day.has-event:hover{ background:var(--gold); }

/* ---------- event card ---------- */
.event{
  position:relative;
  display:flex; gap:16px;
  background:var(--surface);
  border:1px solid var(--line);
  border-left:2px solid var(--navy);
  border-right:2px solid var(--navy);
  border-radius:2px;
  padding:15px 15px;
  margin-bottom:14px;
  box-shadow:0 1px 2px rgba(61,43,31,.05);
}
.event-corner-badge{
  position:absolute; top:-6px; right:0;
  background:#b30000; color:#ffffff;
  font-family:var(--font-heading); font-weight:600;
  font-size:12px; letter-spacing:.04em;
  border-radius:2px; padding:3px 5px;
  box-shadow:0 1px 3px rgba(0,0,0,.15);
}
.event-date{
  width:28%; text-align:center;
  font-family:var(--font-heading); font-weight:600;
  color:var(--navy); font-size:16px; line-height:1.35;
}
.day-entry{ white-space:nowrap; }
.day-entry + .day-entry{ margin-top:8px; }
.day-time{ font-family:var(--font-body); font-size:12px; color:var(--ink-soft); font-weight:500; margin-top:1px; text-align:center; white-space:nowrap; }
.event-body{ flex:1; min-width:0; }
.event-tag{
  display:block; font-family:var(--font-body); font-size:10px; line-height:1.4;
  border-radius:2px; padding:3px 6px; margin-top:8px; letter-spacing:.02em;
  text-align:center;
}
.event-tag-holiday{
  color:var(--coffee);
  border:1px solid var(--gold); background:color-mix(in srgb, var(--gold) 14%, var(--surface));
}
.event-tag-featured{
  color:#ffffff; font-weight:700;
  background:#e1899f; border:1px solid #e1899f;
}
.star{ font-family:var(--font-body); }
.event-city-badge{
  display:inline-block;
  background:var(--navy); color:var(--surface);
  font-family:var(--font-heading); font-weight:500;
  font-size:12px; letter-spacing:.04em;
  border-radius:3px; padding:2px 9px;
  margin-bottom:6px;
}
.event-attr-badge{
  display:inline-block;
  background:var(--powder); color:var(--text-strong);
  font-family:var(--font-body); font-size:12px; border-radius:3px; padding:2px 8px;
  margin-left:6px; margin-bottom:6px;
}
.event-venue{
  font-family:var(--font-heading); font-weight:500;
  font-size:16px; color:var(--text-strong);
}
.event-floorzone{ font-family:var(--font-body); font-size:12px; color:var(--text-strong); margin-top:2px; }
.event-collab{ font-family:var(--font-body); color:var(--text-strong); }
.event-booth{ font-family:var(--font-body); font-size:12px; color:var(--coffee); margin-top:4px; }
.event-desc{ font-family:var(--font-body); font-size:12px; color:var(--coffee); margin-top:4px; }
.event-addr{ font-family:var(--font-body); font-size:12px; color:var(--ink-soft); margin-top:7px; }
.event-organizer{ font-family:var(--font-body); font-size:12px; color:var(--ink-soft); margin-top:4px; }

#emptyMsg, #loadingMsg, #notFoundMsg{
  text-align:center; color:var(--ink-soft); padding:60px 0; font-size:14px;
}
[hidden]{ display:none !important; }
