:root {
  --bg: #0B0F24;
  --panel: #131A3A;
  --card: #1B2347;
  --line: #2A3360;
  --text: #F3F4F8;
  --muted: #A7AEC8;
  --blue: #27A5DA;
  --magenta: #CF5DA4;
  --blue-soft: #8FD3F0;
  --ink: #0B0F24; /* dark text on blue/magenta fills */
  --head: 'Poppins', Arial, sans-serif;
  --body: 'DM Sans', Arial, sans-serif;
  color-scheme: dark;
}
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; background: var(--bg); color: var(--text); font-family: var(--body); }
h1, h2, h3, .head { font-family: var(--head); font-weight: 600; margin: 0; }
button, input, textarea, select { font: inherit; color: inherit; }
button { cursor: pointer; }
:focus-visible { outline: 4px solid var(--blue-soft); outline-offset: 3px; }
[hidden] { display: none !important; }
.muted { color: var(--muted); }