/* ============================================================
   PHAROS — The Light: 10 palettes + palette picker
   Each theme overrides ONLY the light + signal tokens. Ground,
   text and surfaces stay deep midnight so every accent lands at
   maximum contrast. No gold anywhere — the lamp runs cold & clean.
   ============================================================ */

/* 1 · GLACIER — ice white-blue (also the :root default) */
[data-theme="glacier"]{
  --light-core:#FFFFFF; --light-bright:#EAF6FF; --light:#CFE6F5; --light-deep:#6FA8C8;
  --light-glow:rgba(207,230,245,0.55); --light-haze:rgba(207,230,245,0.14);
  --signal:#4FB8C9; --signal-dim:rgba(79,184,201,0.45); --signal-haze:rgba(79,184,201,0.10);
}
/* 2 · MERCURY — platinum, no hue */
[data-theme="mercury"]{
  --light-core:#FFFFFF; --light-bright:#F2F5F8; --light:#D7DFE7; --light-deep:#8A98A6;
  --light-glow:rgba(215,223,231,0.50); --light-haze:rgba(215,223,231,0.13);
  --signal:#8493A1; --signal-dim:rgba(132,147,161,0.45); --signal-haze:rgba(132,147,161,0.10);
}
/* 3 · COBALT — deep electric blue */
[data-theme="cobalt"]{
  --light-core:#EAF1FF; --light-bright:#B9D2FF; --light:#7FB0FF; --light-deep:#3F6FD0;
  --light-glow:rgba(127,176,255,0.52); --light-haze:rgba(127,176,255,0.14);
  --signal:#4F86D8; --signal-dim:rgba(79,134,216,0.45); --signal-haze:rgba(79,134,216,0.10);
}
/* 4 · AURORA — cyan */
[data-theme="aurora"]{
  --light-core:#ECFEFF; --light-bright:#BFF6F9; --light:#76E4EC; --light-deep:#2E97A8;
  --light-glow:rgba(118,228,236,0.52); --light-haze:rgba(118,228,236,0.14);
  --signal:#3FA9C0; --signal-dim:rgba(63,169,192,0.45); --signal-haze:rgba(63,169,192,0.10);
}
/* 5 · VERDIGRIS — weathered emerald */
[data-theme="verdigris"]{
  --light-core:#ECFFF6; --light-bright:#BFF4DC; --light:#74E2B6; --light-deep:#2E9E7E;
  --light-glow:rgba(116,226,182,0.52); --light-haze:rgba(116,226,182,0.14);
  --signal:#2E9E8C; --signal-dim:rgba(46,158,140,0.45); --signal-haze:rgba(46,158,140,0.10);
}
/* 6 · SEA GLASS — pale jade */
[data-theme="seaglass"]{
  --light-core:#F0FFFA; --light-bright:#CFF6EC; --light:#A6E8D4; --light-deep:#4FA890;
  --light-glow:rgba(166,232,212,0.52); --light-haze:rgba(166,232,212,0.14);
  --signal:#4FB89E; --signal-dim:rgba(79,184,158,0.45); --signal-haze:rgba(79,184,158,0.10);
}
/* 7 · AMETHYST — violet */
[data-theme="amethyst"]{
  --light-core:#F6F3FF; --light-bright:#DED6FF; --light:#B6A6FF; --light-deep:#6E5EC8;
  --light-glow:rgba(182,166,255,0.52); --light-haze:rgba(182,166,255,0.14);
  --signal:#7C6ED0; --signal-dim:rgba(124,110,208,0.45); --signal-haze:rgba(124,110,208,0.10);
}
/* 8 · HEATHER — orchid */
[data-theme="heather"]{
  --light-core:#FDF4FF; --light-bright:#F0D6F8; --light:#D6A8E8; --light-deep:#9E5EC0;
  --light-glow:rgba(214,168,232,0.52); --light-haze:rgba(214,168,232,0.14);
  --signal:#A86EC8; --signal-dim:rgba(168,110,200,0.45); --signal-haze:rgba(168,110,200,0.10);
}
/* 9 · ROSEWATER — dusty rose */
[data-theme="rosewater"]{
  --light-core:#FFF4F5; --light-bright:#FBCDD3; --light:#F2A0AA; --light-deep:#C2697A;
  --light-glow:rgba(242,160,170,0.52); --light-haze:rgba(242,160,170,0.14);
  --signal:#C2788A; --signal-dim:rgba(194,120,138,0.45); --signal-haze:rgba(194,120,138,0.10);
}
/* 10 · CRIMSON — the red sector */
[data-theme="crimson"]{
  --light-core:#FFF0F0; --light-bright:#FFC2C2; --light:#FF8C8C; --light-deep:#C24F4F;
  --light-glow:rgba(255,140,140,0.52); --light-haze:rgba(255,140,140,0.14);
  --signal:#C25F5F; --signal-dim:rgba(194,95,95,0.45); --signal-haze:rgba(194,95,95,0.10);
}

/* ---- retheme the inline SVG art (CSS beats presentation attrs) ---- */
.bm-lamp { fill: var(--light-core); }
.bm-beam { fill: var(--light); }
#heroScene .s-core   { stop-color: var(--light-core); }
#heroScene .s-bright { stop-color: var(--light-bright); }
#heroScene .s-light  { stop-color: var(--light); }
.hero__ship-sail.is-lit { fill: var(--light-bright) !important; }
.hero__ship-sail.is-lit--b { fill: var(--light) !important; }
.lh-svg .lh-finial { fill: var(--light); }

/* ============================================================
   The palette picker dock
   ============================================================ */
.lightdock{
  position: fixed; left: clamp(0.9rem, 2vw, 1.6rem); bottom: clamp(0.9rem, 2vw, 1.6rem);
  z-index: 95; width: 224px;
  background: linear-gradient(160deg, rgba(18,34,54,0.92), rgba(6,13,23,0.92));
  border: 1px solid var(--hair); border-radius: var(--r-lg);
  box-shadow: 0 30px 60px -30px rgba(0,0,0,0.95);
  backdrop-filter: blur(16px); padding: 0.95rem 1rem 1.05rem;
  transform: translateY(0); transition: transform var(--med) var(--ease), opacity var(--med);
}
.lightdock.is-tuck{ transform: translateY(calc(100% + 2rem)); opacity: 0; pointer-events: none; }
.lightdock__head{ display: flex; align-items: baseline; justify-content: space-between; gap: 0.5rem; margin-bottom: 0.85rem; }
.lightdock__head .label{ font-size: var(--t-micro); }
.lightdock__name{ font-family: var(--font-display); font-size: 1.12rem; color: var(--light); line-height: 1; }
.lightdock__swatches{ display: grid; grid-template-columns: repeat(5, 1fr); gap: 0.55rem; }
.lightdock__sw{
  position: relative; aspect-ratio: 1; border-radius: 50%; cursor: pointer; border: 0;
  padding: 0; background: var(--deepest); display: grid; place-items: center;
  transition: transform var(--fast) var(--ease);
}
.lightdock__sw::after{
  content:""; width: 62%; height: 62%; border-radius: 50%;
  background: var(--sw); box-shadow: 0 0 10px -1px var(--sw);
  transition: box-shadow var(--fast);
}
.lightdock__sw:hover{ transform: scale(1.14); }
.lightdock__sw:hover::after{ box-shadow: 0 0 16px 1px var(--sw); }
.lightdock__sw.is-on{ box-shadow: 0 0 0 1.5px var(--sw); }
.lightdock__sw.is-on::after{ box-shadow: 0 0 16px 2px var(--sw); }
.lightdock__foot{ margin-top: 0.85rem; display: flex; align-items: center; justify-content: space-between; }
.lightdock__hint{ font-family: var(--font-mono); font-size: 0.62rem; letter-spacing: 0.1em; color: var(--dimmer); text-transform: uppercase; }
.lightdock__tuck{ background: none; border: 0; color: var(--dim); cursor: pointer; font-size: 1rem; line-height: 1; padding: 2px 4px; }
.lightdock__tuck:hover{ color: var(--light); }

/* a small re-open tab when tucked */
.lighttab{
  position: fixed; left: 0; bottom: clamp(0.9rem, 2vw, 1.6rem); z-index: 94;
  background: linear-gradient(160deg, rgba(18,34,54,0.92), rgba(6,13,23,0.92));
  border: 1px solid var(--hair); border-left: 0; border-radius: 0 var(--r-pill) var(--r-pill) 0;
  padding: 0.6rem 0.9rem 0.6rem 0.7rem; cursor: pointer; display: none; align-items: center; gap: 0.5rem;
  color: var(--dim); font-family: var(--font-mono); font-size: var(--t-micro); letter-spacing: 0.12em; text-transform: uppercase;
}
.lighttab.is-show{ display: flex; }
.lighttab__dot{ width: 10px; height: 10px; border-radius: 50%; background: var(--light); box-shadow: 0 0 10px var(--light-glow); }

@media (max-width: 600px){
  .lightdock{ width: calc(100% - 1.8rem); }
  .lightdock__swatches{ grid-template-columns: repeat(10, 1fr); }
}