/* The bold ground's palettes (from the v2 mock's assets/palettes.css). Dusk is the default: every page's <html> carries
   data-palette="dusk"; the footer's Light / Dark switch (site.mjs) picks day or dusk and palette.js applies the pick before
   the first paint. Night (site.css's bold tokens, no attribute) and Indigo ship but no control picks them. Every rule needs
   data-ground="bold". */

/* ================================================================ dusk: the DEFAULT palette of bold (Keiden 2026-10-15: "something
   between dusk and dark is good ... dusk is lowkey pretty good"). Ground halfway between the first Dusk (#1e1b29) and
   Night (#0c0a11), surfaces two steps above it; Dusk's ink, accent and softer glow. ground.js applies it with nothing picked. */
:root[data-ground="bold"][data-palette="dusk"] {
  --bg: #1a1826; --bg-2: #201d2b; --surface: #272335; --surface-2: #2f2b3e; --surface-3: #39334a;
  --wash: rgb(255 255 255 / .07); --wash-2: rgb(255 255 255 / .12);
  --line: #8079a0; --line-2: #958db5; --control: #a49cc4;
  --fg-1: #faf8ff; --fg-2: #e2ddee; --fg-3: #c2bcd2; --fg-4: #8e87a6;
  --accent: #bb86ff; --accent-hover: #c89cff; --accent-press: #ad74f7; --accent-edge: #9d6cf2;
  --accent-text: #dcc6ff; --on-accent: #170b2c; --accent-soft: #3b2b5e; --accent-soft-ink: #efe4ff;
  --accent-ring: rgb(187 134 255 / .34); --focus: #dcc6ff;
  --ok: #6fdb9c; --ok-soft: #1d3a2d; --wait: #f4c06a; --wait-soft: #44331a; --bad: #ff9a90; --bad-soft: #4a2326;
  --off: #c9c4d8; --off-soft: #343044;
  --sh-2: 0 20px 50px -20px rgb(0 0 0 / .55); --sh-3: 0 28px 64px -12px rgb(0 0 0 / .6);
  --nav-bg: rgb(26 24 38 / .86);
  --glow: 0 30px 90px -40px rgb(187 134 255 / .28);
}
html[data-ground="bold"][data-palette="dusk"] :is(h1, h2).t-hero { text-shadow: .1em .1em 0 #3d2a66; }
html[data-ground="bold"][data-palette="dusk"] .idea-visual { background: radial-gradient(120% 90% at 30% 0%, #3d2b68 0%, var(--bg-2) 70%); }
html[data-ground="bold"][data-palette="dusk"] .section-alt .idea-visual { background: radial-gradient(120% 90% at 30% 0%, #3d2b68 0%, var(--bg) 70%); }
html[data-ground="bold"][data-palette="dusk"] .cta-band .t-accent { color: var(--accent-text); }   /* the accent on the band's violet stop was 3.8:1 */
html[data-ground="bold"][data-palette="dusk"] .cta-band { border-color: #7a5cc4;
  background: radial-gradient(120% 140% at 0% 0%, #42297a 0%, #2c2246 60%, var(--bg-2) 100%); }

/* ================================================================ indigo: "night sky", deep indigo with periwinkle surfaces;
   violet stays the action colour (buttons, links, focus), cyan is the highlight (accent words in headings, eyebrows,
   meters): two accents on any screen, never more */
:root[data-ground="bold"][data-palette="indigo"] {
  --bg: #141a33; --bg-2: #192040; --surface: #212a52; --surface-2: #29335f; --surface-3: #333e6e;
  --wash: rgb(200 210 255 / .07); --wash-2: rgb(200 210 255 / .12);
  --line: #7380b8; --line-2: #8e9ad0; --control: #9ca7da;
  --fg-1: #fff9ef; --fg-2: #e6e2e8; --fg-3: #c0c2da; --fg-4: #8088b0;
  --accent: #b18cff; --accent-hover: #bf9fff; --accent-press: #a27af7; --accent-edge: #a68bff;
  --accent-text: #d4c2ff; --on-accent: #140c2c; --accent-soft: #2f2c66; --accent-soft-ink: #e8e0ff;
  --accent-ring: rgb(177 140 255 / .34); --focus: #d4c2ff;
  --accent-2: #62e3ee;   /* the highlight: cyan, beside the violet */
  --ok: #6fdb9c; --ok-soft: #173a33; --wait: #f4c06a; --wait-soft: #3d311d; --bad: #ff9a90; --bad-soft: #43202d;
  --off: #c4c7de; --off-soft: #2a3358;
  --sh-2: 0 24px 60px -18px rgb(4 8 30 / .7); --sh-3: 0 28px 64px -12px rgb(4 8 30 / .75);
  --nav-bg: rgb(20 26 51 / .86); --scrim: rgb(6 9 24 / .65);
  --glow: 0 40px 120px -30px rgb(120 150 255 / .4);
}
html[data-ground="bold"][data-palette="indigo"] :is(h1, h2).t-hero { text-shadow: .1em .1em 0 #0a0f26; }
html[data-ground="bold"][data-palette="indigo"] :is(.t-hero, .t-h2) .t-accent,
html[data-ground="bold"][data-palette="indigo"] .t-eyebrow { color: var(--accent-2); }
html[data-ground="bold"][data-palette="indigo"] .meter > span { background: linear-gradient(90deg, var(--accent), var(--accent-2)); box-shadow: 0 0 10px rgb(98 227 238 / .45); }
html[data-ground="bold"][data-palette="indigo"] .hero::before { background: radial-gradient(closest-side, rgb(120 150 255 / .24), rgb(120 150 255 / 0)); }
html[data-ground="bold"][data-palette="indigo"] main > :is(section, article):first-child:not(.hero) { background:
  radial-gradient(min(900px, 120vw) 420px at 85% -120px, rgb(120 150 255 / .16), transparent 70%) no-repeat; }
html[data-ground="bold"][data-palette="indigo"] .idea-visual { background: radial-gradient(120% 90% at 30% 0%, #2c3889 0%, var(--bg-2) 70%); }
html[data-ground="bold"][data-palette="indigo"] .section-alt .idea-visual { background: radial-gradient(120% 90% at 30% 0%, #2c3889 0%, var(--bg) 70%); }
html[data-ground="bold"][data-palette="indigo"] .cta-band { border-color: #5866b4;
  background: radial-gradient(120% 140% at 0% 0%, #34419a 0%, #1e2756 60%, var(--bg-2) 100%); }

/* ================================================================ day: the bold register in daylight; paper ground, ink,
   today's violet on buttons (dark ink on it), 2 px ink edges in place of the glow, pixel headings in ink */
:root[data-ground="bold"][data-palette="day"] {
  color-scheme: light;
  --bg: #f3f1f8; --bg-2: #e9e6f2; --surface: #ffffff; --surface-2: #f7f5fb; --surface-3: #e6e2ef;
  --wash: rgb(23 20 31 / .05); --wash-2: rgb(23 20 31 / .09);
  --line: #17141f; --line-2: #17141f; --control: #17141f;
  --fg-1: #17141f; --fg-2: #37324a; --fg-3: #565068; --fg-4: #8a849c;
  --accent: #a678ff; --accent-hover: #b48cff; --accent-press: #9564f5; --accent-edge: #17141f;
  --accent-text: #5f36c4; --on-accent: #120a24; --accent-soft: #ece3ff; --accent-soft-ink: #4a2a9e;
  --accent-ring: rgb(95 54 196 / .3); --focus: #5f36c4;
  --ok: #1a6e3f; --ok-soft: #e1f3e8; --wait: #8a5200; --wait-soft: #fbefd9; --bad: #ab2a2a; --bad-soft: #fbe6e5;
  --off: #565068; --off-soft: #ebe8f2;
  --sh-1: none; --sh-2: none; --sh-3: 0 20px 50px -16px rgb(23 20 31 / .3); --sh-btn: none;
  --scrim: rgb(23 20 31 / .45); --nav-bg: rgb(243 241 248 / .9);
  --glow: 0 0 #0000;
}
html[data-ground="bold"][data-palette="day"] :is(h1, h2).t-hero { text-shadow: .1em .1em 0 #d9caff; }
html[data-ground="bold"][data-palette="day"] :is(.t-hero, .t-h2) .t-accent { color: var(--accent-text); }
html[data-ground="bold"][data-palette="day"] .btn-primary { box-shadow: inset 0 -4px 0 rgb(0 0 0 / .18); }
html[data-ground="bold"][data-palette="day"] .tab[aria-selected="true"]::after, html[data-ground="bold"][data-palette="day"] .meter > span { box-shadow: none; }
html[data-ground="bold"][data-palette="day"] .reward-px, html[data-ground="bold"][data-palette="day"] .reward-ring { box-shadow: none; }
html[data-ground="bold"][data-palette="day"] .btn-secondary { box-shadow: inset 0 -3px 0 rgb(23 20 31 / .12); }
html[data-ground="bold"][data-palette="day"] .form-submit { box-shadow: 0 -12px 30px -16px rgb(23 20 31 / .25); }
html[data-ground="bold"][data-palette="day"] .idea-visual { background: radial-gradient(120% 90% at 30% 0%, #e2d6ff 0%, var(--bg-2) 70%); }
html[data-ground="bold"][data-palette="day"] .section-alt .idea-visual { background: radial-gradient(120% 90% at 30% 0%, #e2d6ff 0%, var(--bg) 70%); }
html[data-ground="bold"][data-palette="day"] .cta-band { border-color: var(--line-2);
  background: radial-gradient(120% 140% at 0% 0%, #e0d2ff 0%, #f0ebfa 60%, var(--bg-2) 100%); }
html[data-ground="bold"][data-palette="day"] .tier-card:not([data-tier="free"]) { border-top-color: #8a5cf0; }   /* today's violet stripe was 2.8:1 on white */
html[data-ground="bold"][data-palette="day"] .swatch-chip { outline-color: rgb(23 20 31 / .2); }
html[data-ground="bold"][data-palette="day"] .btn-danger { color: #fff; }
html[data-ground="bold"][data-palette="day"] .btn-danger:hover { background: #8f2222; }

/* ================================================================ the footer's Light / Dark switch (ground.js adds it under bold:
   Light is day, Dark is dusk; the pick is v2-palette-pick, the lab chip's key) */
.scheme-switch { display: inline-flex; gap: 2px; padding: 2px; border: 1px solid var(--line); border-radius: 999px; }
.scheme-switch button { font: inherit; font-size: 14px; color: var(--fg-3); background: none; border: 0; border-radius: 999px;
  min-height: 44px; min-width: 44px; padding: 4px 14px; cursor: pointer; }   /* a 44 px target (stranger run 13: it was 32) */
.scheme-switch button:hover { color: var(--fg-1); }
.scheme-switch button[aria-pressed="true"] { color: var(--fg-1); background: var(--surface-3); }
.scheme-switch button:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
