/* JUS / blue night. Load after v2, hero motion and scroll controls.
   Scoped palette only: the daylight theme and all content stay unchanged. */
html:root[data-theme="dark"] {
  --bg: #081421;
  --surface: #102237;
  --card: #162c44;
  --text: #edf5ff;
  --muted: #a9bfd6;
  --line: #a2c9ee36;
  --accent: #59caff;
  --accent-text: #7bd6ff;
  --chrome: #081421ed;
  --shadow: 0 22px 70px #000b1c42;
  --night-ink: #071b2e;
  color-scheme: dark;
}

html[data-theme="dark"] ::selection {
  background: #59caff;
  color: #071b2e;
}
html[data-theme="dark"] :is(button, a, input, textarea, select):focus-visible {
  outline-color: var(--accent);
}
html[data-theme="dark"] .button {
  color: var(--night-ink);
  box-shadow: 0 2px 0 #c4edff20 inset;
}
html[data-theme="dark"] .button:hover {
  background: #83d9ff;
  box-shadow: 0 7px 0 #000b1c30, 0 0 28px #39b8ff1a;
}
html[data-theme="dark"] .button.secondary {
  background: transparent;
  color: var(--text);
  box-shadow: none;
}
html[data-theme="dark"] .button.secondary:hover {
  background: #173853;
  border-color: #70ceff80;
}
html[data-theme="dark"] .button.dark {
  background: #08213a;
  color: #edf5ff;
}
html[data-theme="dark"] .button.dark:hover {
  background: #113657;
}
html[data-theme="dark"] .light-button {
  background: #c8ecff;
  color: var(--night-ink);
}
html[data-theme="dark"] :is(.inline-link, .article-link, .footer-links a, .footer-contact > a):hover {
  color: var(--accent-text);
}
html[data-theme="dark"] :is(.icon-button, .social):hover {
  background: #20405d;
  border-color: #76ccff80;
  color: #c5edff;
}
html[data-theme="dark"] header nav a:hover,
html[data-theme="dark"] header nav a.active {
  color: #a8e5ff;
}
html[data-theme="dark"] .nav-dot,
html[data-theme="dark"] .eyebrow i {
  background: var(--accent);
  box-shadow: 0 0 12px #59caff45;
}
html[data-theme="dark"] #announcement {
  color: var(--night-ink);
}
html[data-theme="dark"] .skip {
  background: #b6e7ff;
  color: var(--night-ink);
}

/* Raster media stay unfiltered; hero-motion selects the separately rendered blue scene. */
html[data-theme="dark"] .status-dot {
  box-shadow: 0 0 0 4px #59caff1c, 0 0 15px #59caff24;
}
html[data-theme="dark"] .hero-image-frame {
  background: #182e43;
  box-shadow: 0 20px 60px #000a1945, 0 0 0 1px #96d7ff1c;
}
html[data-theme="dark"] .hero-logo-seal {
  background: #10243a;
  color: #e7f4ff;
  box-shadow: 7px 7px 0 #4dc6ff33;
}
html[data-theme="dark"] .top-tag {
  color: var(--night-ink);
}
html[data-theme="dark"] .bottom-tag {
  background: #a8d9fb;
  color: #102d4a;
  border-color: #70b8e8;
}
html[data-theme="dark"] .sticker {
  background: #1b3550;
  color: #e1f2ff;
}
html[data-theme="dark"] .character-card {
  background: #c5dbea;
  color: #102b43;
  border-color: #a8d9ff35;
  box-shadow: 0 3px 0 #020c1633;
}
html[data-theme="dark"] .character-magnet {
  background: #9ecde9;
}
html[data-theme="dark"] .character-coin {
  background: #b6cdeb;
}
html[data-theme="dark"] .character-card > img {
  mix-blend-mode: normal;
}
html[data-theme="dark"] .character-heading {
  color: #102b43;
}
html[data-theme="dark"] .round-number {
  background: #d4ebf3cc;
  color: #102b43;
  border-color: #15375266;
}
html[data-theme="dark"] .character-copy p {
  color: #29475f;
}
html[data-theme="dark"] .character-stamp {
  border-color: #173c5d33;
}

html[data-theme="dark"] .magnetic-story {
  background: #071a30;
  color: var(--text);
}
html[data-theme="dark"] .story-line {
  color: #edf5ff;
}
html[data-theme="dark"] .story-line.orange {
  color: #72d0ff;
}
html[data-theme="dark"] .story-meta,
html[data-theme="dark"] .story-bottom p {
  color: #b1cbe3;
}
html[data-theme="dark"] .field-lines {
  stroke: #6dccff35;
}
html[data-theme="dark"] .float-one {
  background: #c8e8fa;
}
html[data-theme="dark"] .float-two {
  color: #8bceff;
}

html[data-theme="dark"] .model-card {
  background: #20415e;
  color: #eaf5ff;
  box-shadow: 0 1px 0 #c4e7ff24 inset;
}
html[data-theme="dark"] .model-violet {
  background: #274f92;
  color: #eef6ff;
}
html[data-theme="dark"] .model-orange {
  background: #77cefa;
  color: #0a2942;
}
html[data-theme="dark"] .model-card p {
  opacity: 1;
}
html[data-theme="dark"] .model-card > .card-link {
  color: inherit;
  border-color: currentColor;
}
html[data-theme="dark"] .model-card:hover {
  box-shadow: 0 0 0 1px #91d8ff80 inset, 0 20px 36px #000b1c25;
}

html[data-theme="dark"] .article-art {
  background-color: #1d4160;
  color: #e2f3ff;
}
html[data-theme="dark"] .art-1 {
  background: repeating-linear-gradient(135deg, #b1dbff0c 0 1px, transparent 1px 23px), #1d4160;
  color: #e2f3ff;
}
html[data-theme="dark"] .art-1:after {
  border-color: #4dbbfa;
}
html[data-theme="dark"] .art-2 {
  background: #285295;
  color: #eff7ff;
}
html[data-theme="dark"] .art-2:before {
  border-color: #bfe5ff70;
  box-shadow: 0 0 0 30px #bfe5ff12, 0 0 0 60px #bfe5ff0a;
}
html[data-theme="dark"] .art-3 {
  background: #89d4ff;
  color: #102d4a;
}
html[data-theme="dark"] .art-3:before {
  color: #12345c1c;
}
html[data-theme="dark"] .article-body aside {
  background: #122a42;
  border-left-color: var(--accent);
}

html[data-theme="dark"] .join-block {
  background: #69c6fa;
  color: #0a2841;
}
html[data-theme="dark"] .join-block h2 span {
  color: #174a83;
}
html[data-theme="dark"] .join-block > img {
  mix-blend-mode: normal;
}
html[data-theme="dark"] #back-top {
  background: #173653;
  box-shadow: 0 8px 25px #000b1c50, 0 0 0 1px #7ecfff30;
}
html[data-theme="dark"] #loader {
  background: var(--bg);
}
html[data-theme="dark"] #loader > span {
  color: #ddecfa;
}
html[data-theme="dark"] .load-track {
  background: #b9deff20;
}
html[data-theme="dark"] .load-track i {
  background: var(--accent);
}

html[data-theme="dark"] :is(input, textarea, select) {
  border-color: #728faa;
  caret-color: var(--accent);
  accent-color: var(--accent);
}
html[data-theme="dark"] :is(input, textarea):focus,
html[data-theme="dark"] select:focus {
  border-color: #75d4ff;
}
html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder {
  color: #afc4d9;
  opacity: 1;
}
html[data-theme="dark"] .password-toggle {
  background: #284961;
  color: #e8f5ff;
}
html[data-theme="dark"] .field-error {
  color: #ffb9b6;
}
html[data-theme="dark"] .join-form input[aria-invalid="true"] {
  border-color: #ff969d;
}
html[data-theme="dark"] .toggle-row input {
  background: #38536c;
  border-color: #7999b4;
}
html[data-theme="dark"] .toggle-row input:before {
  background: #e6f3ff;
}
html[data-theme="dark"] .toggle-row input:checked {
  background: var(--accent);
  border-color: var(--accent);
}
html[data-theme="dark"] .toggle-row input:checked:before {
  background: #10243a;
}

/* Vector controls follow the blue interface; raster media use their own colour masters. */
html[data-theme="dark"] .jus-scroll-control {
  --jus-rail-track: #9bceff30;
  --jus-rail-fill: #70d0ffb3;
  --jus-rail-label: #15334f;
}
html[data-theme="dark"] .jus-scroll-fill {
  background: linear-gradient(to bottom, #53aaff38, var(--jus-rail-fill));
}
html[data-theme="dark"] #jus-hook-orange stop:nth-child(1),
html[data-theme="dark"] #jus-magnet-orange stop:nth-child(1) {
  stop-color: #b7ecff;
}
html[data-theme="dark"] #jus-hook-orange stop:nth-child(2),
html[data-theme="dark"] #jus-magnet-orange stop:nth-child(2) {
  stop-color: #51c7ff;
}
html[data-theme="dark"] #jus-hook-orange stop:nth-child(3),
html[data-theme="dark"] #jus-magnet-orange stop:nth-child(3) {
  stop-color: #238ed8;
}
html[data-theme="dark"] #jus-magnet-orange stop:nth-child(4) {
  stop-color: #1358a2;
}
html[data-theme="dark"] .jus-hook-barb > path:last-child {
  stroke: #dcf5ff;
}
html[data-theme="dark"] .jus-magnet-core > path:nth-of-type(1) {
  fill: #10467b;
}
html[data-theme="dark"] .jus-magnet-core > path:nth-of-type(3) {
  stroke: #c5f0ff;
}
html[data-theme="dark"] .jus-magnet-core > path:nth-of-type(4) {
  stroke: #1a68af;
}
html[data-theme="dark"] .jus-magnet-particles {
  fill: #92e0ff;
}
html[data-theme="dark"] .jus-magnet-waves {
  stroke: #92e0ff;
}
html[data-theme="dark"] #back-top.jus-magnet-button:before {
  background: radial-gradient(circle at 50% 55%, #54bfff40, transparent 72%);
}