/* ── Self-hosted fonts ───────────────────────────────────────────── */

@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('/static/fonts/montserrat-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191,
    U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Archivo Black';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/static/fonts/archivo-black-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191,
    U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ── Color scheme ────────────────────────────────────────────────── */

html { color-scheme: dark; }

/* ── Page entrance ───────────────────────────────────────────────── */

@keyframes tn-rail-enter {
  from { opacity: 0; }
  to   { opacity: 1; }
}

.tn-shell-rail {
  animation: tn-rail-enter 1.2s cubic-bezier(0.25, 1, 0.5, 1) both;
}

/* ── Theme tokens ───────────────────────────────────────────────── */

:root {
  --bg: #09090b;
  --surface: #111114;
  --line: rgba(255, 255, 255, 0.08);
  --text: #ededef;
  --text-2: #a1a1aa;
  --text-3: #7c7c85;
  --accent: #e4e4e7;
  --accent-dim: rgba(255, 255, 255, 0.12);
  --danger: #f87171;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --font-ui: 'Montserrat', -apple-system, BlinkMacSystemFont, 'SF Pro Text',
    'Helvetica Neue', system-ui, sans-serif;
  --font-display: 'Montserrat', -apple-system, BlinkMacSystemFont, 'SF Pro Display',
    'Helvetica Neue', system-ui, sans-serif;
  --radius: 12px;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html,
body {
  height: 100%;
  width: 100%;
  overflow-x: hidden;
  background: var(--bg);
}

body {
  margin: 0;
  font-family: var(--font-ui);
  font-size: 14px;
  line-height: 1.45;
  font-weight: 400;
  background: var(--bg);
  color: var(--text);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-synthesis: none;
  font-optical-sizing: auto;
}

img { image-rendering: auto; }
svg { shape-rendering: geometricPrecision; }

h1, h2, h3 {
  font-family: var(--font-display);
  font-synthesis: none;
  font-weight: 700;
  letter-spacing: -0.03em;
}

a {
  color: inherit;
  text-decoration: none;
}

button, input, select, textarea {
  font: inherit;
  color: inherit;
}

button { cursor: pointer; }

::selection {
  background: var(--accent-dim);
  color: var(--text);
}

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.12);
  border-radius: 999px;
  border: 2px solid var(--bg);
}
::-webkit-scrollbar-track { background: transparent; }

/* ── Global autofill — kill Chromium's blue/navy wash everywhere ── */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
textarea:-webkit-autofill:active,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus,
select:-webkit-autofill:active {
  -webkit-text-fill-color: var(--text, #ededef) !important;
  caret-color: var(--text, #ededef) !important;
  -webkit-box-shadow: 0 0 0 9999px var(--surface, #111114) inset !important;
  box-shadow: 0 0 0 9999px var(--surface, #111114) inset !important;
  background-color: var(--surface, #111114) !important;
  border-color: inherit !important;
  transition: background-color 99999s ease-out 0s, color 99999s ease-out 0s;
}