/* ============================================================
   LGD THEME PACK — 6 palettes × dark/light (12 variants)
   ------------------------------------------------------------
   How it works
   ·  <html data-theme="sentinel">            → Sentinel dark
   ·  <html data-theme="sentinel" class="light"> → Sentinel light
   ·  No data-theme (or data-theme="orbital") → current Orbital look
   ·  site.theme values: "dark" / "light" (legacy, = Orbital) or
      "<palette>-dark" / "<palette>-light", e.g. "terra-light".

   Load this file AFTER the page's inline <style> block:
      <link rel="stylesheet" href="themes.css">

   Every variant is WCAG-checked:
   text ≥ 15:1 · muted ≥ 4.5:1 · accent ≥ 4.5:1 (light) / 7:1 (dark)
   button label ≥ 4.5:1 · amber/rose ≥ 3.4:1.
   ============================================================ */

/* ---------- shared: RGB triplets the JS canvas/overlays read ---------- */
:root{
  --ink-rgb:10,20,34;        /* Orbital dark */
  --grid-rgb:150,184,219;
}
html.light{
  --ink-rgb:242,246,250;     /* Orbital light */
  --grid-rgb:60,90,120;
}

/* ============================================================
   0 · ORBITAL — night navy & sensor teal  (current default, ported)
   Note: the light accent is corrected from #0B9D83 (3.1:1, fails
   WCAG AA) to #087B66 (4.8:1) — same teal character, readable.
   ============================================================ */
html[data-theme="orbital"]{
  --ink:#0A1422; --ink-2:#0C1828;
  --panel:#10203496; --panel-solid:#102034; --panel-2:#142840;
  --line:rgba(150,184,219,.16); --line-soft:rgba(150,184,219,.09);
  --text:#E9F1F9; --muted:#9AB0C4; --faint:#5E7490;
  --accent:#5BE3C7; --accent-ink:#062A24;
  --amber:#F7B955; --rose:#F0699B;
  --spec:linear-gradient(90deg,#53E0C4 0%,#8BE38B 35%,#F7B955 70%,#F0699B 100%);
  --ink-rgb:10,20,34; --grid-rgb:150,184,219;
}
html[data-theme="orbital"].light{
  --ink:#F2F6FA; --ink-2:#E9F0F7;
  --panel:#FFFFFFE0; --panel-solid:#FFFFFF; --panel-2:#EDF3F9;
  --line:rgba(15,45,75,.16); --line-soft:rgba(15,45,75,.08);
  --text:#0E1B2C; --muted:#44607C; --faint:#8095AB;
  --accent:#087B66; --accent-ink:#FFFFFF;
  --amber:#B8730E; --rose:#CE3A70;
  --spec:linear-gradient(90deg,#0B8A73 0%,#4E8F2E 35%,#B8730E 70%,#CE3A70 100%);
  --ink-rgb:242,246,250; --grid-rgb:60,90,120;
}

/* ============================================================
   1 · SENTINEL — carbon steel & electric azure   [technological]
   Cold instrument-panel graphite; the azure reads like an
   active radar return. Named for the Sentinel constellation.
   ============================================================ */
html[data-theme="sentinel"]{
  --ink:#0A0F16; --ink-2:#0D131C;
  --panel:#121B2696; --panel-solid:#121B26; --panel-2:#16222F;
  --line:rgba(151,180,209,.16); --line-soft:rgba(151,180,209,.09);
  --text:#E8EFF6; --muted:#97ABBE; --faint:#5D7288;
  --accent:#4FA9F5; --accent-ink:#04203B;
  --amber:#F2A73B; --rose:#F06A93;
  --spec:linear-gradient(90deg,#4FA9F5 0%,#6FD6F0 35%,#F2A73B 70%,#F06A93 100%);
  --ink-rgb:10,15,22; --grid-rgb:151,180,209;
}
html[data-theme="sentinel"].light{
  --ink:#F2F6FA; --ink-2:#E9EFF6;
  --panel:#FFFFFFE0; --panel-solid:#FFFFFF; --panel-2:#ECF2F8;
  --line:rgba(15,45,80,.16); --line-soft:rgba(15,45,80,.08);
  --text:#0C1826; --muted:#425F7C; --faint:#7E93A9;
  --accent:#0A66C2; --accent-ink:#FFFFFF;
  --amber:#A9690B; --rose:#C63A6B;
  --spec:linear-gradient(90deg,#0A66C2 0%,#0E8FA8 35%,#A9690B 70%,#C63A6B 100%);
  --ink-rgb:242,246,250; --grid-rgb:60,90,120;
}

/* ============================================================
   2 · AURORA — void violet & electric periwinkle  [technological]
   Ionospheric: deep-space violet base, charged-particle accent,
   synthwave rose for false-color highlights.
   ============================================================ */
html[data-theme="aurora"]{
  --ink:#0D0B18; --ink-2:#110E20;
  --panel:#19133096; --panel-solid:#191330; --panel-2:#1F1940;
  --line:rgba(173,163,219,.16); --line-soft:rgba(173,163,219,.09);
  --text:#ECE9F7; --muted:#A69EC5; --faint:#6B6390;
  --accent:#9D8CFF; --accent-ink:#150D33;
  --amber:#F5AE63; --rose:#F473C1;
  --spec:linear-gradient(90deg,#9D8CFF 0%,#7BE0C8 35%,#F5AE63 70%,#F473C1 100%);
  --ink-rgb:13,11,24; --grid-rgb:173,163,219;
}
html[data-theme="aurora"].light{
  --ink:#F5F4FA; --ink-2:#ECEAF5;
  --panel:#FFFFFFE0; --panel-solid:#FFFFFF; --panel-2:#F0EEF8;
  --line:rgba(50,40,90,.15); --line-soft:rgba(50,40,90,.08);
  --text:#17132E; --muted:#544C79; --faint:#8C86AC;
  --accent:#6247D6; --accent-ink:#FFFFFF;
  --amber:#A2650E; --rose:#B93A8C;
  --spec:linear-gradient(90deg,#6247D6 0%,#0E8A78 35%,#A2650E 70%,#B93A8C 100%);
  --ink-rgb:245,244,250; --grid-rgb:92,82,132;
}

/* ============================================================
   3 · SOLARIS — warm onyx & champagne gold        [elegant]
   Editorial, print-like. Gold is the only loud voice; everything
   else is warm greys. Light mode is ivory with bronze ink.
   ============================================================ */
html[data-theme="solaris"]{
  --ink:#131009; --ink-2:#17130B;
  --panel:#1D181096; --panel-solid:#1D1810; --panel-2:#241E13;
  --line:rgba(216,192,150,.15); --line-soft:rgba(216,192,150,.08);
  --text:#F3EEE2; --muted:#B4A98F; --faint:#7A7059;
  --accent:#E3C27B; --accent-ink:#2A1F06;
  --amber:#DE8B4E; --rose:#CF7D8C;
  --spec:linear-gradient(90deg,#E3C27B 0%,#F0DCA8 35%,#DE8B4E 70%,#CF7D8C 100%);
  --ink-rgb:19,16,9; --grid-rgb:216,192,150;
}
html[data-theme="solaris"].light{
  --ink:#FAF7F0; --ink-2:#F2EDE1;
  --panel:#FFFFFFE6; --panel-solid:#FFFFFF; --panel-2:#F5F0E5;
  --line:rgba(90,70,30,.16); --line-soft:rgba(90,70,30,.08);
  --text:#221C10; --muted:#6E6350; --faint:#9A907B;
  --accent:#7E5F17; --accent-ink:#FFFFFF;
  --amber:#9E641A; --rose:#AE4A5E;
  --spec:linear-gradient(90deg,#7E5F17 0%,#A8853B 35%,#9E641A 70%,#AE4A5E 100%);
  --ink-rgb:250,247,240; --grid-rgb:122,102,62;
}

/* ============================================================
   4 · CANOPY — deep moss & leaf green             [natural]
   Forest understory: green-cast neutrals, chlorophyll accent,
   honey amber. NDVI as a colour scheme.
   ============================================================ */
html[data-theme="canopy"]{
  --ink:#0B130E; --ink-2:#0E1811;
  --panel:#14201696; --panel-solid:#142016; --panel-2:#18291D;
  --line:rgba(163,199,173,.15); --line-soft:rgba(163,199,173,.08);
  --text:#E9F2EB; --muted:#9CB5A3; --faint:#637A6B;
  --accent:#7CCF97; --accent-ink:#062817;
  --amber:#E5B45C; --rose:#E08A8A;
  --spec:linear-gradient(90deg,#7CCF97 0%,#B9E08A 35%,#E5B45C 70%,#E08A8A 100%);
  --ink-rgb:11,19,14; --grid-rgb:163,199,173;
}
html[data-theme="canopy"].light{
  --ink:#F4F7F1; --ink-2:#EAF0E4;
  --panel:#FFFFFFE0; --panel-solid:#FFFFFF; --panel-2:#EEF3E9;
  --line:rgba(30,60,40,.16); --line-soft:rgba(30,60,40,.08);
  --text:#16211A; --muted:#4C6355; --faint:#839580;
  --accent:#27754B; --accent-ink:#FFFFFF;
  --amber:#96660F; --rose:#B05252;
  --spec:linear-gradient(90deg,#27754B 0%,#5B8A2E 35%,#96660F 70%,#B05252 100%);
  --ink-rgb:244,247,241; --grid-rgb:74,100,82;
}

/* ============================================================
   5 · TERRA — espresso earth & burnt sienna       [natural]
   Soil profile: dark humus base, sienna accent, ochre amber.
   Light mode is linen with deep rust — named for NASA's Terra.
   ============================================================ */
html[data-theme="terra"]{
  --ink:#14100B; --ink-2:#18130D;
  --panel:#20191396; --panel-solid:#201913; --panel-2:#271F16;
  --line:rgba(219,190,160,.15); --line-soft:rgba(219,190,160,.08);
  --text:#F4EEE6; --muted:#B9A995; --faint:#7D7060;
  --accent:#E59A6A; --accent-ink:#331705;
  --amber:#E9B457; --rose:#DB7E76;
  --spec:linear-gradient(90deg,#E9B457 0%,#E59A6A 35%,#DB7E76 70%,#C9708A 100%);
  --ink-rgb:20,16,11; --grid-rgb:219,190,160;
}
html[data-theme="terra"].light{
  --ink:#F7F3EC; --ink-2:#F0EAE0;
  --panel:#FFFFFFE6; --panel-solid:#FFFFFF; --panel-2:#F3EDE3;
  --line:rgba(90,60,35,.16); --line-soft:rgba(90,60,35,.08);
  --text:#241A11; --muted:#6F5F4E; --faint:#9C8E7C;
  --accent:#9C4B27; --accent-ink:#FFFFFF;
  --amber:#9C6414; --rose:#B04A55;
  --spec:linear-gradient(90deg,#9C4B27 0%,#9C6414 35%,#B04A55 70%,#8F4E78 100%);
  --ink-rgb:247,243,236; --grid-rgb:128,100,72;
}

/* ============================================================
   COMPAT LAYER
   The pages hardcode a few colours from the Orbital palette
   (selection tint, sticky-bar glass, hover glows). These rules
   re-derive them from tokens so every theme stays coherent.
   Selector groups intentionally repeat the pages' own
   specificity (e.g. `html.light #bar`) so this file, loaded
   later, wins the cascade without !important.
   ============================================================ */

/* text selection tint follows the accent */
:root ::selection,
html.light ::selection{
  background:color-mix(in srgb,var(--accent) 25%,transparent);
}

/* sticky glass bars (post.html #bar, index.html #topbar) */
#bar,#topbar,
html.light #bar,html.light #topbar{
  background:color-mix(in srgb,var(--ink) 86%,transparent);
}

/* accent-tinted interactions (post.html) */
.extlink:hover{box-shadow:0 12px 26px -12px color-mix(in srgb,var(--accent) 45%,transparent)}
.aitem:hover{background:color-mix(in srgb,var(--accent) 5%,transparent)}
article.body a{text-decoration-color:color-mix(in srgb,var(--accent) 40%,transparent)}

/* accent-tinted interactions (index.html) */
#hero .veil,
html.light #hero .veil{
  background:
    radial-gradient(900px 480px at 78% 18%,color-mix(in srgb,var(--accent) 7%,transparent),transparent 60%),
    linear-gradient(180deg,transparent 55%,var(--ink) 96%);
}
html.light #hero h1 .ghost{-webkit-text-stroke:1.5px color-mix(in srgb,var(--text) 45%,transparent)}
html.light #sidebar{background:linear-gradient(180deg,var(--panel-solid) 0%,var(--ink) 100%)}
html.light #totop{background:color-mix(in srgb,var(--panel-solid) 88%,transparent)}
html.light .btn-ghost{background:color-mix(in srgb,var(--panel-solid) 60%,transparent)}
html.light .post:hover{box-shadow:0 26px 50px -28px color-mix(in srgb,var(--text) 32%,transparent)}
html.light .cv-btn:hover{box-shadow:0 14px 30px -12px color-mix(in srgb,var(--accent) 45%,transparent)}
