/* Shared theme tokens. Without JavaScript, the system preference still applies. */
:root { color-scheme: light;
  --accent: #0068ad;
  --accent-hover: #005a9e;
  --accent-primary: #007acc;
  --accent-primary-hover: #005a9e;
  --bg: #fafbfb;
  --bg-secondary: #eef2f2;
  --bg-tertiary: #dce3e3;
  --bg-card: #ffffff;
  --bg-glass: rgba(255,255,255,.9);
  --text: #1b292d;
  --text-secondary: #485b60;
  --text-tertiary: #52666b;
  --border: rgba(27,41,45,.13);
  --border-secondary: rgba(27,41,45,.08);
  --border-hover: rgba(27,41,45,.3);
  --hover-bg: rgba(0,110,127,.07);
  --surface: #ffffff;
  --surface-hover: #f0f5f5;
  --coverage-covered: #237644;
  --coverage-missed: #b43d3b;
  --button-ink: #ffffff;
  --featured-bg: #e4f3f4;
  --code-bg: #eef2f2;
  --code-ink: #1b292d;
  --brand-filter: brightness(0.48) saturate(1.5);
  --shadow-card: 0 8px 28px rgba(27,41,45,.08); }
:root[data-theme="dark"] { color-scheme: dark; --brand-filter: none;
  --accent: #86d9ef;
  --accent-hover: #b3eafa;
  --accent-primary: #86d9ef;
  --accent-primary-hover: #b3eafa;
  --bg: #10161b;
  --bg-secondary: #202c35;
  --bg-tertiary: #3d3d40;
  --bg-card: rgba(45,45,48,.6);
  --bg-glass: rgba(35,35,38,.6);
  --text: #f1f5f7;
  --text-secondary: #bfccd3;
  --text-tertiary: #a3b3bf;
  --border: rgba(255,255,255,.08);
  --border-secondary: rgba(255,255,255,.06);
  --border-hover: rgba(255,255,255,.18);
  --hover-bg: rgba(90,186,224,.1);
  --surface: #172027;
  --surface-hover: #1c2831;
  --coverage-covered: #64cf94;
  --coverage-missed: #f47b76;
  --button-ink: #0b1e27;
  --featured-bg: #213a46;
  --code-bg: #151c22;
  --code-ink: #d4d4d4; }
@media (prefers-color-scheme: dark) { :root:not([data-theme]) { color-scheme: dark; --brand-filter: none;
  --accent: #86d9ef;
  --accent-hover: #b3eafa;
  --accent-primary: #86d9ef;
  --accent-primary-hover: #b3eafa;
  --bg: #10161b;
  --bg-secondary: #202c35;
  --bg-tertiary: #3d3d40;
  --bg-card: rgba(45,45,48,.6);
  --bg-glass: rgba(35,35,38,.6);
  --text: #f1f5f7;
  --text-secondary: #bfccd3;
  --text-tertiary: #a3b3bf;
  --border: rgba(255,255,255,.08);
  --border-secondary: rgba(255,255,255,.06);
  --border-hover: rgba(255,255,255,.18);
  --hover-bg: rgba(90,186,224,.1);
  --surface: #172027;
  --surface-hover: #1c2831;
  --coverage-covered: #64cf94;
  --coverage-missed: #f47b76;
  --button-ink: #0b1e27;
  --featured-bg: #213a46;
  --code-bg: #151c22;
  --code-ink: #d4d4d4; } }

.nav-container { position: relative; }
.theme-toggle { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; flex: 0 0 44px; order: 2; margin-left: 0.75rem; border: 1px solid var(--border); border-radius: 8px; background: transparent; color: var(--text-secondary); cursor: pointer; }
.theme-toggle[hidden] { display: none; }
.theme-toggle:hover { background: var(--surface-hover); color: var(--accent); border-color: var(--border-hover); }
.theme-toggle svg { width: 20px; height: 20px; }
.theme-sun { display: none; }
[data-theme="dark"] .theme-sun { display: block; }
[data-theme="dark"] .theme-moon { display: none; }
@media (max-width: 1099px) { .theme-toggle { position: absolute; top: 16px; right: calc(var(--gutter) + 50px); margin: 0; } .nav-brand-row { padding-right: 0; } }
.btn { color: var(--button-ink) !important; }
.btn:hover { color: var(--button-ink) !important; }
.btn--ghost, .btn--ghost:hover, .btn--ai, .btn--ai:hover, .btn--outline { color: var(--text) !important; }
.plan--featured { background: linear-gradient(160deg, var(--featured-bg), var(--surface) 65%); }
.nav-link, .nav-link:hover, .footer-column a, .footer-links a, .footer-links a:hover, .footer-info p { color: var(--text-secondary); }
.footer-column h2 { color: var(--text); }
.site-footer { background: var(--surface); }
.content pre { background: var(--code-bg) !important; color: var(--code-ink); }
.form input, .form select, .form textarea { background: var(--surface); color: var(--text); }
.btn--ghost:hover { background: var(--surface-hover); border-color: var(--border-hover); }
/* Shiki exports both palettes; switch token colors without re-rendering code. */
.astro-code, .astro-code span { color: var(--shiki-light, var(--code-ink)); }
[data-theme="dark"] .astro-code, [data-theme="dark"] .astro-code span { color: var(--shiki-dark, var(--code-ink)); }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) .astro-code, :root:not([data-theme]) .astro-code span { color: var(--shiki-dark, var(--code-ink)); }
}
.command code { background: var(--code-bg); color: var(--code-ink); }
.badge { color: var(--button-ink); }

.brand-mark image { filter: var(--brand-filter, none); }

/* Documentation: navigation left, reading column center, optional action rail right. */
.reading-layout--docs .docs-action { max-width: var(--reading-width); margin: 2.5rem auto 0; }
.reading-layout--docs .docs-nav { border: 0; border-radius: 0; background: transparent; padding: 0; }
.reading-layout--docs .docs-nav-root { text-align: left; font-size: 0.9375rem; margin-bottom: 1rem; padding-left: 0.5rem; }
.reading-layout--docs .docs-nav a { overflow-wrap: normal; }
.reading-layout--docs .docs-nav ul ul { border-left: 1px solid var(--border); margin-left: 0.5rem; padding-left: 0.75rem; }
@media (min-width: 1200px) {
  .reading-layout--docs .two-column { display: grid; grid-template-columns: 14rem minmax(0, 48rem); justify-content: center; gap: 2rem; align-items: start; }
  .reading-layout--docs .layout-sidebar { grid-column: 1; grid-row: 1 / 3; width: 100%; max-width: 14rem; margin: 0; position: sticky; top: var(--docs-sticky-top, 6rem); max-height: none; overflow: visible; scrollbar-gutter: auto; }
  .reading-layout--docs .layout-sidebar .docs-nav { padding: 0; }
  .reading-layout--docs .layout-main { grid-column: 2; grid-row: 1; min-width: 0; }
  .reading-layout--docs .docs-action { grid-column: 2; grid-row: 2; width: 100%; margin: 0; }
  .js-nav .reading-layout--docs .reading-nav > summary { display: none; }
}
@media (min-width: 1440px) {
  .reading-layout--docs .two-column { grid-template-columns: minmax(0, 1fr) minmax(0, 48rem) minmax(0, 1fr); }
  .reading-layout--docs .layout-sidebar { justify-self: end; }
  .reading-layout--docs .docs-action { grid-column: 3; grid-row: 1; max-width: 14rem; margin: 0; position: sticky; top: 6rem; }
}

/* Live Remotion colors: terminal scenes deliberately use their own palette. */
:root { --demo-252526: #f3f3f3;
--demo-333333: #e8e8e8;
--demo-1e1e1e: #ffffff;
--demo-3c3c3c: #dddddd;
--demo-cccccc: #333333;
--demo-aaaaaa: #616161;
--demo-569cd6: #0000ff;
--demo-c586c0: #af00db;
--demo-4ec9b0: #267f99;
--demo-dcdcaa: #795e26;
--demo-ce9178: #a31515;
--demo-b5cea8: #098658;
--demo-9cdcfe: #001080;
--demo-d4d4d4: #333333;
--demo-6a9955: #008000;
--demo-2a2a2a: #e8e8e8;
--demo-2d2d2d: #ececec;
--demo-3aa0ff: #007acc;
--demo-a3b3bf: #616161;
--demo-ffffff: #333333;
--demo-0d1117: #ffffff;
--demo-161b22: #f6f8fa;
--demo-e6edf3: #1f2328;
--demo-8b949e: #59636e;
--demo-30363d: #d1d9e0;
--demo-484f58: #59636e;
--demo-1f2937: #e9eef3; --demo-hair: #dedede; --demo-border: #b8b8b8; --demo-accent: #007acc; --demo-hit: #1a7f37; --demo-miss: #cf222e; --demo-warn: #9a6700; --poster-light: block; --poster-dark: none; }
:root[data-theme="dark"] { --demo-252526: #252526;
--demo-333333: #333333;
--demo-1e1e1e: #1e1e1e;
--demo-3c3c3c: #3c3c3c;
--demo-cccccc: #cccccc;
--demo-aaaaaa: #aaaaaa;
--demo-569cd6: #569cd6;
--demo-c586c0: #c586c0;
--demo-4ec9b0: #4ec9b0;
--demo-dcdcaa: #dcdcaa;
--demo-ce9178: #ce9178;
--demo-b5cea8: #b5cea8;
--demo-9cdcfe: #9cdcfe;
--demo-d4d4d4: #d4d4d4;
--demo-6a9955: #6a9955;
--demo-2a2a2a: #2a2a2a;
--demo-2d2d2d: #2d2d2d;
--demo-3aa0ff: #3aa0ff;
--demo-a3b3bf: #a3b3bf;
--demo-ffffff: #ffffff;
--demo-0d1117: #0d1117;
--demo-161b22: #161b22;
--demo-e6edf3: #e6edf3;
--demo-8b949e: #8b949e;
--demo-30363d: #30363d;
--demo-484f58: #484f58;
--demo-1f2937: #1f2937; --demo-hair: rgba(255,255,255,.08); --demo-border: rgba(255,255,255,.18); --demo-accent: #5abae0; --demo-hit: #3fb950; --demo-miss: #f85149; --demo-warn: #d29922; --poster-light: none; --poster-dark: block; }
@media (prefers-color-scheme: dark) { :root:not([data-theme]) { --demo-252526: #252526;
--demo-333333: #333333;
--demo-1e1e1e: #1e1e1e;
--demo-3c3c3c: #3c3c3c;
--demo-cccccc: #cccccc;
--demo-aaaaaa: #aaaaaa;
--demo-569cd6: #569cd6;
--demo-c586c0: #c586c0;
--demo-4ec9b0: #4ec9b0;
--demo-dcdcaa: #dcdcaa;
--demo-ce9178: #ce9178;
--demo-b5cea8: #b5cea8;
--demo-9cdcfe: #9cdcfe;
--demo-d4d4d4: #d4d4d4;
--demo-6a9955: #6a9955;
--demo-2a2a2a: #2a2a2a;
--demo-2d2d2d: #2d2d2d;
--demo-3aa0ff: #3aa0ff;
--demo-a3b3bf: #a3b3bf;
--demo-ffffff: #ffffff;
--demo-0d1117: #0d1117;
--demo-161b22: #161b22;
--demo-e6edf3: #e6edf3;
--demo-8b949e: #8b949e;
--demo-30363d: #30363d;
--demo-484f58: #484f58;
--demo-1f2937: #1f2937; --demo-hair: rgba(255,255,255,.08); --demo-border: rgba(255,255,255,.18); --demo-accent: #5abae0; --demo-hit: #3fb950; --demo-miss: #f85149; --demo-warn: #d29922; --poster-light: none; --poster-dark: block; } }
.demo-poster--light { display: var(--poster-light); }
.demo-poster--dark { display: var(--poster-dark); }

.btn:not(.btn--ai):not(.btn--ghost):not(.btn--outline) { background: var(--accent-primary); }
.btn:not(.btn--ai):not(.btn--ghost):not(.btn--outline):hover { background: var(--accent-primary-hover); }

:root { font-family: system-ui, sans-serif; line-height: 1.6; }
body { margin: 0; background: var(--bg); color: var(--text); }
main { max-width: 40rem; margin: 4rem auto; padding: 1.5rem; }
a { color: var(--accent); }
input, textarea, select, button { box-sizing: border-box; font: inherit; max-width: 100%; padding: .65rem; }
input:not([type=checkbox]), textarea, select { display: block; width: 100%; background: var(--surface); color: var(--text); border: 1px solid var(--border-hover); }
button { cursor: pointer; background: var(--accent); color: var(--button-ink); border: 0; padding: .75rem 1.25rem; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.address-challenge { background: transparent; }
.address-challenge main { margin: 0; padding: 0.25rem; }
.address-challenge form { display: grid; gap: 0.75rem; }
.address-challenge dd { margin: 0 0 1rem; overflow-wrap: anywhere; }