/* BranTools theme system (Master Plan §11) — 12 aesthetically distinct themes.
   Each block overrides the portal tokens + recolors the deep background media
   (hue-rotated plexus) + retints the tool-page skin via --th-accent.
   Interaction behavior never changes between themes.
   Default (no data-theme attr) = SATELLITE, the signal-green original. */

/* 1. MIDNIGHT GLASS — cool glass blue, quiet and deep */
html[data-theme="midnight-glass"]{
  --signal:#8ab4ff; --signal-glow:rgba(138,180,255,.5); --signal-dim:#3d5fa8;
  --cyan:#a6d8ff; --panel-edge:rgba(138,180,255,.26); --panel-edge-hot:rgba(138,180,255,.5);
  --th-accent:#8ab4ff;
}
html[data-theme="midnight-glass"] .px-video{filter:hue-rotate(85deg) saturate(.8) brightness(.8);}

/* 2. SATELLITE — the original signal green (explicit form) */
html[data-theme="satellite"]{ --th-accent:#3ff085; }

/* 3. AMBER TERMINAL — warm phosphor amber on black */
html[data-theme="amber-terminal"]{
  --signal:#ffb000; --signal-glow:rgba(255,176,0,.5); --signal-dim:#9a6b06;
  --cyan:#ffd77a; --panel-edge:rgba(255,176,0,.26); --panel-edge-hot:rgba(255,176,0,.5);
  --ink:#f5e9d5; --ink-dim:#b8a586;
  --th-accent:#ffb000;
}
html[data-theme="amber-terminal"] .px-video{filter:hue-rotate(-95deg) saturate(1.1) brightness(.75);}

/* 4. POLAR — ice light, near-white ink, arctic cyan */
html[data-theme="polar"]{
  --signal:#a8e6ff; --signal-glow:rgba(168,230,255,.45); --signal-dim:#4d8ba8;
  --cyan:#dff6ff; --panel-edge:rgba(168,230,255,.28); --panel-edge-hot:rgba(168,230,255,.55);
  --ink:#eef8fc; --ink-dim:#9fc2cf;
  --th-accent:#a8e6ff;
}
html[data-theme="polar"] .px-video{filter:hue-rotate(110deg) saturate(.5) brightness(.95);}

/* 5. CRT — harsh pure phosphor, darker void, heavier scan feel */
html[data-theme="crt"]{
  --signal:#33ff66; --signal-glow:rgba(51,255,102,.65); --signal-dim:#1c8f3f;
  --panel-edge:rgba(51,255,102,.3); --panel-edge-hot:rgba(51,255,102,.6);
  --th-accent:#33ff66;
}
html[data-theme="crt"] .px-video{filter:saturate(1.4) contrast(1.15) brightness(.65);}
html[data-theme="crt"] .px-scan{opacity:1;}

/* 6. STUDIO — warm gallery neutrals, calm champagne accent */
html[data-theme="studio"]{
  --signal:#e8c17a; --signal-glow:rgba(232,193,122,.4); --signal-dim:#8f7440;
  --cyan:#d9c8a8; --panel-edge:rgba(232,193,122,.24); --panel-edge-hot:rgba(232,193,122,.45);
  --ink:#f2ead9; --ink-dim:#b3a68c;
  --th-accent:#e8c17a;
}
html[data-theme="studio"] .px-video{filter:hue-rotate(-115deg) saturate(.45) brightness(.7);}

/* 7. ORBITAL — deep-space violet */
html[data-theme="orbital"]{
  --signal:#b39cff; --signal-glow:rgba(179,156,255,.5); --signal-dim:#5f4da8;
  --cyan:#87c9ff; --panel-edge:rgba(179,156,255,.26); --panel-edge-hot:rgba(179,156,255,.5);
  --th-accent:#b39cff;
}
html[data-theme="orbital"] .px-video{filter:hue-rotate(140deg) saturate(.9) brightness(.75);}

/* 8. BLACK ICE — monochrome steel, edges like frost on glass */
html[data-theme="black-ice"]{
  --signal:#cfd8de; --signal-glow:rgba(207,216,222,.4); --signal-dim:#6d7a83;
  --cyan:#9fb4c0; --amber:#cfd8de; --panel-edge:rgba(207,216,222,.22); --panel-edge-hot:rgba(207,216,222,.45);
  --ink:#e8edf0; --ink-dim:#93a1aa;
  --th-accent:#cfd8de;
}
html[data-theme="black-ice"] .px-video{filter:saturate(0) brightness(.8);}

/* 9. AURORA — arctic teal with magenta atmospherics */
html[data-theme="aurora"]{
  --signal:#5ef2c8; --signal-glow:rgba(94,242,200,.5); --signal-dim:#2b8f74;
  --cyan:#c77dff; --panel-edge:rgba(94,242,200,.26); --panel-edge-hot:rgba(199,125,255,.4);
  --th-accent:#5ef2c8;
}
html[data-theme="aurora"] .px-video{filter:hue-rotate(25deg) saturate(1.25) brightness(.8);}

/* 10. BROADCAST — retro TV red-orange, off-white ink */
html[data-theme="broadcast"]{
  --signal:#ff6a4d; --signal-glow:rgba(255,106,77,.5); --signal-dim:#a83d2a;
  --cyan:#ffd2a8; --panel-edge:rgba(255,106,77,.28); --panel-edge-hot:rgba(255,106,77,.5);
  --ink:#f7efe9; --ink-dim:#bfa89e;
  --th-accent:#ff6a4d;
}
html[data-theme="broadcast"] .px-video{filter:hue-rotate(-140deg) saturate(1.1) brightness(.7);}

/* 11. EXECUTIVE — graphite and old gold, boardroom restraint */
html[data-theme="executive"]{
  --signal:#d4af6a; --signal-glow:rgba(212,175,106,.35); --signal-dim:#7d6538;
  --cyan:#c9cdd4; --panel-edge:rgba(212,175,106,.22); --panel-edge-hot:rgba(212,175,106,.42);
  --ink:#eceae4; --ink-dim:#a7a294;
  --th-accent:#d4af6a;
}
html[data-theme="executive"] .px-video{filter:hue-rotate(-120deg) saturate(.35) brightness(.6);}

/* 12. TONNELIER AFTER DARK — dramatic crimson smoke */
html[data-theme="tonnelier-after-dark"]{
  --signal:#e04a5f; --signal-glow:rgba(224,74,95,.55); --signal-dim:#8f2e3c;
  --cyan:#ff9d7a; --panel-edge:rgba(224,74,95,.3); --panel-edge-hot:rgba(224,74,95,.55);
  --ink:#f5e4e6; --ink-dim:#b48d92;
  --th-accent:#e04a5f;
}
html[data-theme="tonnelier-after-dark"] .px-video{filter:hue-rotate(-175deg) saturate(1.2) brightness(.6) contrast(1.1);}

/* ── §10 layered environment: fine animated grain (1.5%, never over text —
     sits under all panels), plus intentional-empty-space support ─────────── */
.px-grain{position:fixed;inset:-40px;z-index:1;pointer-events:none;opacity:.015;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grain-shift 9s steps(6) infinite;}
@keyframes grain-shift{
  0%,100%{transform:translate(0,0);}   17%{transform:translate(-14px,8px);}
  34%{transform:translate(9px,-12px);} 51%{transform:translate(-7px,-9px);}
  68%{transform:translate(12px,11px);} 85%{transform:translate(-10px,4px);}}
@media(prefers-reduced-motion:reduce){.px-grain{animation:none;}}