:root {
  --bg: #09090b;
  --bg-raised: #111114;
  --bg-soft: #16161a;
  --ink: #f5f5f2;
  --ink-2: #c7c6cb;
  --muted: #7e7d86;
  --hairline: rgba(255,255,255,.105);
  --hairline-soft: rgba(255,255,255,.065);
  --g1: #ffb66e;
  --g1-soft: rgba(255,182,110,.18);
  --g2: #69d8ff;
  --g2-soft: rgba(105,216,255,.17);
  --g3: #a996ff;
  --g3-soft: rgba(169,150,255,.18);
  --ok: #86e6b6;
  --danger: #ff8f88;
  --sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --mono: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
  --max: 1540px;
}

* { box-sizing: border-box; }
html { background: var(--bg); color-scheme: dark; scroll-behavior: smooth; }
body {
  margin: 0;
  min-width: 320px;
  overflow-x: hidden;
  color: var(--ink);
  background:
    radial-gradient(1100px 700px at 72% 12%, rgba(118,101,255,.095), transparent 60%),
    radial-gradient(900px 540px at 28% 32%, rgba(64,200,255,.055), transparent 62%),
    #09090b;
  font-family: var(--sans);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
a { color: inherit; }
button, input { font: inherit; }
code { font-family: var(--mono); }

.skip-link {
  position: fixed; left: 16px; top: 16px; z-index: 1000;
  transform: translateY(-180%); border-radius: 999px;
  padding: 10px 14px; background: #fff; color: #09090b;
  text-decoration: none; font-weight: 700; font-size: 13px;
}
.skip-link:focus { transform: none; }

button:focus-visible, input:focus-visible, [tabindex]:focus-visible, a:focus-visible {
  outline: 2px solid var(--g2);
  outline-offset: 4px;
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}