/* ============================================================
   SAPPHIRE — new refined palette (2026 anti-cliche)
   Activated via html[data-accent="sapphire"] (now default)
   Inspired by Aman, The Row, Byredo, Noma — ivory + ink + jewel
============================================================ */

:root[data-accent="sapphire"] {
  /* Replace "gold" accent vars with a deep sapphire-ink jewel */
  --gold-100: #e8eef5;       /* icy highlight */
  --gold-200: #a8c2e2;       /* soft sapphire */
  --gold-300: #6487b8;       /* primary sapphire */
  --gold-400: #3c5a87;       /* pressed */
  --gold-500: #1f3556;       /* deep */
  --sig-live: #a8c2e2;
}

:root[data-accent="sage"] {
  --gold-100: #e6ece1;
  --gold-200: #b6c9a9;
  --gold-300: #87a06f;
  --gold-400: #5b7349;
  --gold-500: #344827;
  --sig-live: #b6c9a9;
}

:root[data-accent="bordeaux"] {
  --gold-100: #f5d9dc;
  --gold-200: #d49097;
  --gold-300: #a34a56;
  --gold-400: #75303a;
  --gold-500: #441921;
  --sig-live: #d49097;
}

/* Warm Ivory light mode — the real 2026 luxury move */
:root[data-mode="light"] {
  --surface-0: #f4efe6;
  --surface-1: #ece6da;
  --surface-2: #e2dbcb;
  --surface-3: #d5ccb9;
  --surface-line: #c7bda8;
  --surface-line-soft: #d9cfba;

  --ink-100: #14110d;
  --ink-200: #211e18;
  --ink-300: #3a352c;
  --ink-400: #5c554a;
  --ink-500: #7d7567;
  --ink-600: #9a9284;
}

:root[data-mode="light"][data-accent="sapphire"] {
  --gold-100: #1f3556;
  --gold-200: #3c5a87;
  --gold-300: #254270;
  --gold-400: #142847;
  --gold-500: #0a1a33;
  --sig-live: #3c5a87;
}
:root[data-mode="light"][data-accent="sage"] {
  --gold-100: #2b3a20;
  --gold-200: #445632;
  --gold-300: #344827;
  --gold-400: #1f2d15;
  --gold-500: #111908;
  --sig-live: #445632;
}
:root[data-mode="light"][data-accent="bordeaux"] {
  --gold-100: #5f1f29;
  --gold-200: #75303a;
  --gold-300: #571923;
  --gold-400: #3a0f17;
  --gold-500: #21060a;
  --sig-live: #75303a;
}
:root[data-mode="light"][data-accent="gold"] {
  --gold-100: #5a4412;
  --gold-200: #7a5c1f;
  --gold-300: #6e5528;
  --gold-400: #4a3812;
  --gold-500: #2c200a;
}
:root[data-mode="light"][data-accent="platinum"] {
  --gold-100: #3f433d;
  --gold-200: #5c6059;
  --gold-300: #4a4e48;
  --gold-400: #2b2d29;
  --gold-500: #16181a;
}
:root[data-mode="light"][data-accent="crimson"] {
  --gold-100: #5a1620;
  --gold-200: #8e2a36;
  --gold-300: #6d1f29;
  --gold-400: #410b12;
  --gold-500: #230207;
}

/* Grain tuned for light */
:root[data-mode="light"] {
  --grain-opacity: .04;
}
:root[data-mode="light"] .grain::before {
  mix-blend-mode: multiply;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.15  0 0 0 0 0.12  0 0 0 0 0.08  0 0 0 .6 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}

/* Selection in light */
:root[data-mode="light"] ::selection {
  background: var(--ink-200); color: var(--surface-0);
}

/* Scrollbar light */
:root[data-mode="light"] ::-webkit-scrollbar-track { background: var(--surface-0); }
:root[data-mode="light"] ::-webkit-scrollbar-thumb { background: var(--surface-3); }

/* Nav in light — warm with crisp rule */
:root[data-mode="light"] .nav {
  background: linear-gradient(180deg, rgba(244,239,230,.88), rgba(244,239,230,.55) 70%, transparent);
}
:root[data-mode="light"] .nav.scrolled {
  background: rgba(244,239,230,.95);
}

/* Hero image looks different in light — more prominent */
:root[data-mode="light"] .hero-bg img {
  opacity: 0.85;
  filter: contrast(1.05) brightness(1) saturate(.95);
}
:root[data-mode="light"] .hero-bg::before {
  background:
    linear-gradient(180deg,
      rgba(244,239,230,.12) 0%,
      rgba(244,239,230,.08) 30%,
      rgba(244,239,230,.55) 75%,
      var(--surface-0) 100%
    );
}

/* Hero text — dark on light bg */
:root[data-mode="light"] .hero-title { color: var(--ink-100); }
:root[data-mode="light"] .hero-title .accent { color: var(--gold-400); }
:root[data-mode="light"] .hero-title .dot-end { color: var(--gold-300); }
:root[data-mode="light"] .hero-lede { color: var(--ink-300); border-left-color: var(--gold-400); }
:root[data-mode="light"] .hero-lede em { color: var(--gold-400); }
:root[data-mode="light"] .hero-meta .v { color: var(--ink-100); }
:root[data-mode="light"] .hero-meta .k { color: var(--ink-400); }
:root[data-mode="light"] .hero-meta .v small { color: var(--ink-500); }
:root[data-mode="light"] .hero-meta .m { border-top-color: var(--surface-line); }

/* Hero chips — dark outline on light */
:root[data-mode="light"] .hero-chip {
  background: rgba(20,17,13,.06);
  border-color: rgba(20,17,13,.12);
  color: var(--ink-300);
  backdrop-filter: blur(10px);
}
:root[data-mode="light"] .hero-chip.gold {
  border-color: var(--gold-400);
  color: var(--gold-400);
}
:root[data-mode="light"] .hero-chip strong { color: var(--ink-100); }

/* Hero scroll hint */
:root[data-mode="light"] .hero-scroll-hint { color: var(--ink-400); }
:root[data-mode="light"] .hero-scroll-hint .line {
  background: linear-gradient(180deg, transparent, var(--gold-400));
}

/* Nav text in light */
:root[data-mode="light"] .nav-brand { color: var(--ink-100); }
:root[data-mode="light"] .nav-brand .mark { background: var(--gold-400); }
:root[data-mode="light"] .nav-brand .sub { color: var(--ink-400); }
:root[data-mode="light"] .nav-link { color: var(--ink-300); }
:root[data-mode="light"] .nav-link:hover { color: var(--ink-100); }
:root[data-mode="light"] .nav-link.active { color: var(--ink-100); }
:root[data-mode="light"] .nav-concierge { color: var(--ink-400); }
:root[data-mode="light"] .icon-btn {
  border-color: var(--surface-line);
  color: var(--ink-400);
}
:root[data-mode="light"] .icon-btn:hover { border-color: var(--gold-400); color: var(--ink-100); }
:root[data-mode="light"] .icon-btn .dot { background: var(--gold-400); box-shadow: 0 0 0 2px var(--surface-0); }

/* Section heads */
:root[data-mode="light"] .section-head .num { color: var(--gold-400); border-color: var(--gold-500); }
:root[data-mode="light"] .section-head .title { color: var(--ink-100); }
:root[data-mode="light"] .section-head .title .en { color: var(--gold-400); }
:root[data-mode="light"] .section-head .tail { color: var(--ink-400); }
:root[data-mode="light"] .section-head { border-bottom-color: var(--surface-line); }

/* Eyebrow / labels */
:root[data-mode="light"] .eyebrow { color: var(--gold-400); }

/* Experience section */
:root[data-mode="light"] .exp-toggle {
  background: var(--surface-2);
  border-color: var(--surface-line);
}
:root[data-mode="light"] .exp-toggle button { color: var(--ink-400); }
:root[data-mode="light"] .exp-toggle button.on { background: var(--gold-400); color: #fff; }
:root[data-mode="light"] .exp-body h3 { color: var(--ink-100); }
:root[data-mode="light"] .exp-body h3 .en { color: var(--gold-400); }
:root[data-mode="light"] .exp-lede { color: var(--ink-300); }
:root[data-mode="light"] .exp-feat { border-top-color: var(--surface-line); }
:root[data-mode="light"] .exp-feat .num { color: var(--gold-400); }
:root[data-mode="light"] .exp-feat .t { color: var(--ink-100); }
:root[data-mode="light"] .exp-feat .d { color: var(--ink-400); }
:root[data-mode="light"] .exp-avail { color: var(--ink-400); }

/* Buttons in light */
:root[data-mode="light"] .btn-primary { background: var(--gold-400); border-color: var(--gold-400); color: #fff; }
:root[data-mode="light"] .btn-primary:hover { background: var(--gold-300); border-color: var(--gold-300); }
:root[data-mode="light"] .btn-ghost { border-color: var(--surface-line); color: var(--ink-200); }
:root[data-mode="light"] .btn-ghost:hover { border-color: var(--gold-400); color: var(--ink-100); }

/* Collection */
:root[data-mode="light"] .coll-controls { background: var(--surface-1); border-color: var(--surface-line); }
:root[data-mode="light"] .coll-search { color: var(--ink-400); border-right-color: var(--surface-line); }
:root[data-mode="light"] .coll-search input { color: var(--ink-100); }
:root[data-mode="light"] .coll-chip { color: var(--ink-400); border-color: var(--surface-line); }
:root[data-mode="light"] .coll-chip:hover { border-color: var(--gold-400); color: var(--ink-200); }
:root[data-mode="light"] .coll-chip.on { background: var(--gold-400); border-color: var(--gold-400); color: #fff; }
:root[data-mode="light"] .bottle-origin { color: var(--ink-500); }
:root[data-mode="light"] .bottle-name { color: var(--ink-100); }
:root[data-mode="light"] .bottle-name .en { color: var(--gold-400); }
:root[data-mode="light"] .bottle-note { color: var(--ink-400); border-color: var(--surface-line); }
:root[data-mode="light"] .bottle-price { color: var(--ink-100); }
:root[data-mode="light"] .bottle-price small { color: var(--ink-500); }
:root[data-mode="light"] .bottle-order { color: var(--gold-400); }
:root[data-mode="light"] .bottle-order:hover { color: var(--gold-300); }
:root[data-mode="light"] .bottle { background: var(--surface-1); border-color: var(--surface-line); }
:root[data-mode="light"] .bottle:hover { border-color: var(--gold-400); }
:root[data-mode="light"] .bottle-body { border-top-color: var(--surface-line); }
:root[data-mode="light"] .bottle-foot { border-top-color: var(--surface-line); }
:root[data-mode="light"] .bottle-media .rarity { color: var(--gold-400); }

/* Events */
:root[data-mode="light"] .event-card { background: var(--surface-1); border-color: var(--surface-line); }
:root[data-mode="light"] .event-card:hover { border-color: var(--gold-400); }
:root[data-mode="light"] .event-en { color: var(--gold-400); }
:root[data-mode="light"] .event-kr { color: var(--ink-100); }
:root[data-mode="light"] .event-meta { border-top-color: var(--surface-line); color: var(--ink-400); }
:root[data-mode="light"] .event-meta .seats { color: var(--gold-400); }
:root[data-mode="light"] .rail-arrows button { border-color: var(--surface-line); color: var(--ink-300); }
:root[data-mode="light"] .rail-arrows button:hover { border-color: var(--gold-400); color: var(--ink-100); }

/* Membership / contact form */
:root[data-mode="light"] .membership { border-color: var(--surface-line); }
:root[data-mode="light"] .membership-body { background: var(--surface-1); }
:root[data-mode="light"] .membership-body h3 { color: var(--ink-100); }
:root[data-mode="light"] .membership-tiers .tier-row { border-bottom-color: var(--surface-line); }
:root[data-mode="light"] .tier-row .tname { color: var(--gold-400); }
:root[data-mode="light"] .tier-row .tdesc { color: var(--ink-300); }
:root[data-mode="light"] .tier-row .tprice { color: var(--ink-100); }
:root[data-mode="light"] .tier-row .tprice small { color: var(--ink-500); }

/* Dossier */
:root[data-mode="light"] .dossier-num {
  color: var(--surface-line);
}
:root[data-mode="light"] .dossier-body blockquote { color: var(--ink-100); }
:root[data-mode="light"] .dossier-body blockquote em { color: var(--gold-400); }
:root[data-mode="light"] .dossier-body blockquote::before { color: var(--gold-300); opacity: .3; }
:root[data-mode="light"] .dossier-body cite { color: var(--ink-500); }

/* Footer */
:root[data-mode="light"] .site-footer { border-top-color: var(--surface-line); }
:root[data-mode="light"] .footer-brand { color: var(--ink-100); }
:root[data-mode="light"] .footer-brand .it { color: var(--ink-400); }
:root[data-mode="light"] .footer-col h5 { color: var(--gold-400); }
:root[data-mode="light"] .footer-col a,
:root[data-mode="light"] .footer-col p { color: var(--ink-400); }
:root[data-mode="light"] .footer-col a:hover { color: var(--ink-100); }
:root[data-mode="light"] .footer-bottom { color: var(--ink-500); border-top-color: var(--surface-line); }

/* Marquee */
:root[data-mode="light"] .marquee { border-top-color: var(--surface-line); border-bottom-color: var(--surface-line); background: var(--surface-1); }
:root[data-mode="light"] .marquee-track { color: var(--ink-100); }
:root[data-mode="light"] .marquee-track span::after { background: var(--gold-400); }

/* House status */
:root[data-mode="light"] .house-status { color: var(--ink-400); }
:root[data-mode="light"] .house-status .live-dot { background: var(--gold-400); }

/* Scroll progress */
:root[data-mode="light"] .scroll-progress .fill { background: var(--gold-400); }

/* Rooms */
:root[data-mode="light"] .rooms-grid .room-card { background: var(--surface-1); }

/* Pulse animation adapted */
:root[data-mode="light"] .nav-concierge .live {
  background: var(--gold-400);
  box-shadow: 0 0 0 3px rgba(110,85,40,.18);
}
:root[data-mode="light"] .hero-chip .live {
  box-shadow: 0 0 0 3px rgba(110,85,40,.18);
}

/* Confirm crest */
:root[data-mode="light"] .confirm-crest {
  border-color: var(--gold-400);
  color: var(--gold-400);
}

/* Input fields */
:root[data-mode="light"] .inp {
  background: var(--surface-0);
  border-color: var(--surface-line);
  color: var(--ink-100);
}
:root[data-mode="light"] .inp:focus { border-color: var(--gold-400); }
:root[data-mode="light"] select.inp option { background: var(--surface-1); color: var(--ink-100); }

/* Section float num */
:root[data-mode="light"] .sec-float-num { -webkit-text-stroke-color: var(--surface-line); }


/* Room card overlay needs warm gradient */
:root[data-mode="light"] .room-card::after {
  background: linear-gradient(180deg, transparent 30%, rgba(20,17,13,.2) 70%, rgba(20,17,13,.7));
}
:root[data-mode="light"] .room-card h4,
:root[data-mode="light"] .room-card .price,
:root[data-mode="light"] .room-card .tag,
:root[data-mode="light"] .room-card .num,
:root[data-mode="light"] .room-card .meta-row,
:root[data-mode="light"] .room-card .avail {
  color: #f4efe6 !important;
}
:root[data-mode="light"] .room-card .imgwrap img {
  filter: brightness(.82) contrast(1.02) saturate(.92);
}

/* Exp stage — in light keep dark image */
:root[data-mode="light"] .exp-stage::after {
  background: linear-gradient(180deg, rgba(0,0,0,.08) 0%, transparent 40%, rgba(0,0,0,.78));
}

/* Bottle media gradient */
:root[data-mode="light"] .bottle-media {
  background:
    radial-gradient(ellipse 60% 40% at 50% 80%, rgba(20,17,13,.06), transparent 70%),
    linear-gradient(180deg, var(--surface-1), var(--surface-2));
}
:root[data-mode="light"] .bottle-media img { filter: drop-shadow(0 20px 30px rgba(20,17,13,.25)); }

/* Reservation shell subtle */
:root[data-mode="light"] .res-shell {
  background:
    radial-gradient(ellipse 80% 40% at 50% 0%, rgba(100,135,184,.05), transparent 60%),
    var(--surface-1);
}

/* Grain opacity differs */
:root[data-mode="dark"] { --grain-opacity: .06; }