/* Combined DS mirror for local preview (Geist via jsdelivr CDN) */

/* ---- Geist (display + body) ---- */
@font-face { font-family: "Geist"; font-style: normal; font-weight: 400; font-display: swap; src: url("https://cdn.jsdelivr.net/fontsource/fonts/geist@latest/latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Geist"; font-style: normal; font-weight: 500; font-display: swap; src: url("https://cdn.jsdelivr.net/fontsource/fonts/geist@latest/latin-500-normal.woff2") format("woff2"); }
@font-face { font-family: "Geist"; font-style: normal; font-weight: 700; font-display: swap; src: url("https://cdn.jsdelivr.net/fontsource/fonts/geist@latest/latin-700-normal.woff2") format("woff2"); }
@font-face { font-family: "Geist"; font-style: normal; font-weight: 800; font-display: swap; src: url("https://cdn.jsdelivr.net/fontsource/fonts/geist@latest/latin-800-normal.woff2") format("woff2"); }
@font-face { font-family: "Geist"; font-style: normal; font-weight: 900; font-display: swap; src: url("https://cdn.jsdelivr.net/fontsource/fonts/geist@latest/latin-900-normal.woff2") format("woff2"); }
@font-face { font-family: "Geist Mono"; font-style: normal; font-weight: 400; font-display: swap; src: url("https://cdn.jsdelivr.net/fontsource/fonts/geist-mono@latest/latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Geist Mono"; font-style: normal; font-weight: 500; font-display: swap; src: url("https://cdn.jsdelivr.net/fontsource/fonts/geist-mono@latest/latin-500-normal.woff2") format("woff2"); }
@font-face { font-family: "Geist Mono"; font-style: normal; font-weight: 700; font-display: swap; src: url("https://cdn.jsdelivr.net/fontsource/fonts/geist-mono@latest/latin-700-normal.woff2") format("woff2"); }

:root {
  --charbon: #161616; --papier: #f7f5f0; --anthracite: #232323; --gris: #b0b0b0; --orange: #ff5c00; --teal: #2dd4bf;
  --anthracite-hi: #2c2c2c; --hairline: rgba(247, 245, 240, 0.1); --hairline-strong: rgba(247, 245, 240, 0.18); --gris-dim: rgba(176, 176, 176, 0.55);
  --bg: var(--charbon); --surface: var(--anthracite); --surface-hover: var(--anthracite-hi); --border: var(--hairline); --border-strong: var(--hairline-strong);
  --text: var(--papier); --text-secondary: var(--gris); --text-muted: var(--gris-dim);
  --accent: var(--orange); --accent-on: #ffffff; --data: var(--teal); --data-on: var(--charbon); --cursor: var(--orange);
  --font-sans: "Geist", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "Geist Mono", ui-monospace, "SF Mono", Menlo, monospace;
  --fs-body: 19px; --lh-body: 1.5;
  --cursor-w: 0.62em; --cursor-h: 1em; --cursor-blink: 1.05s;
}

*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body { background: var(--bg); color: var(--text); font-family: var(--font-sans); font-size: var(--fs-body); line-height: var(--lh-body); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }

.cursor { display: inline-block; width: var(--cursor-w); height: var(--cursor-h); margin-left: 0.12em; background: var(--cursor); vertical-align: baseline; transform: translateY(0.12em); }
.cursor--blink { animation: cc-blink var(--cursor-blink) steps(1, end) infinite; }
@media (prefers-reduced-motion: reduce) { .cursor--blink { animation: none; } }
@keyframes cc-blink { 0%, 50% { opacity: 1; } 50.01%, 100% { opacity: 0; } }