/* Inter: fallback for non-Apple devices. Apple devices use San Francisco and never download these. */
@font-face {
  font-family:"Inter"; font-style:normal; font-display:swap; font-weight:100 900;
  src:url("../fonts/inter-latin-wght-normal.woff2") format("woff2-variations");
  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:"Inter"; font-style:normal; font-display:swap; font-weight:100 900;
  src:url("../fonts/inter-latin-ext-wght-normal.woff2") format("woff2-variations");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* Light: near-black text, gray accent. Dark: green accent. */
:root {
  color-scheme: light;
  --bg:#faf9f6; --fg:#111111; --muted:#6e6e73; --accent:#8e8e93;
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg:#121212; --fg:#f2f2f2; --muted:#9a9a9f; --accent:#6cc497;
}
/* No-JS fallback: follow the system setting. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
    color-scheme: dark;
    --bg:#121212; --fg:#f2f2f2; --muted:#9a9a9f; --accent:#6cc497;
  }
}

* { box-sizing:border-box; margin:0; }
html, body { height:100%; }
body { background:var(--bg); color:var(--fg); font-family:-apple-system,BlinkMacSystemFont,"Inter",sans-serif;
       transition:background-color .2s, color .2s; }

.theme-toggle { position:fixed; top:16px; right:16px; width:40px; height:40px; display:grid; place-items:center;
                border:0; border-radius:50%; background:transparent; color:var(--muted); cursor:pointer;
                transition:color .2s, background-color .2s; }
.theme-toggle:hover { color:var(--fg); background:color-mix(in srgb, var(--fg) 8%, transparent); }
.theme-toggle:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
.theme-toggle .icon-sun { display:none; }
:root[data-theme="dark"] .theme-toggle .icon-sun { display:block; }
:root[data-theme="dark"] .theme-toggle .icon-moon { display:none; }
:root:not([data-theme]) .theme-toggle { display:none; }

.splash { min-height:100%; display:grid; place-content:center; padding:24px; text-align:center; }
.splash h1 { font-size:clamp(2.2rem,7vw,4rem); font-weight:700; letter-spacing:-.03em; }
.splash h1 span { color:var(--accent); transition:color .2s; }
.splash p { margin-top:1rem; font-size:1.15rem; color:var(--muted); }
.dot { display:inline-block; width:.5em; height:.5em; border-radius:50%; background:var(--accent);
       margin-right:.5em; vertical-align:middle; animation:pulse 2s ease-in-out infinite; transition:background-color .2s; }
@keyframes pulse { 50% { opacity:.3; } }
@media (prefers-reduced-motion: reduce) { .dot { animation:none; } * { transition:none !important; } }