/* Splash v2 shared base. Palette: #060a10 base, #5fd4f0 accent (sparingly), #e8eef4 / #a6b5c5 text, #1c2c3c hairlines. */
@font-face { font-family: "YF Mono"; src: url("fonts/yf-mono-400.woff2") format("woff2"); font-weight: 400; font-display: swap; }
:root { --base: #060a10; --accent: #5fd4f0; --text: #e8eef4; --text-2: #a6b5c5; --text-3: #8496a9; --line: #1c2c3c; --line-2: #132130;
  --mono: "YF Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; --sans: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; background: var(--base); color: var(--text); }
body { font-family: var(--sans); -webkit-font-smoothing: antialiased; -webkit-tap-highlight-color: transparent; overflow: hidden; }
.field { position: fixed; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.micro { font-family: var(--mono); font-size: 11px; line-height: 16px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--text-2); }
.micro.dim { color: var(--text-3); }
.login { display: inline-flex; align-items: center; gap: 14px; min-height: 48px; padding: 0 22px; border: 1px solid var(--text-2); border-radius: 0;
  font-family: var(--mono); font-size: 12px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--text); text-decoration: none; background: rgba(6,10,16,0.6);
  transition: border-color 180ms ease, background-color 180ms ease, color 180ms ease; }
.login::after { content: "→"; color: var(--accent); letter-spacing: 0; }
.login:hover, .login:focus-visible { border-color: var(--accent); background: rgba(95,212,240,0.08); outline: none; }
.login:focus-visible { box-shadow: 0 0 0 2px var(--base), 0 0 0 3px var(--accent); }
.motto { font-family: var(--mono); font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--text-2); margin: 0; }
.motto .sep { color: var(--accent); opacity: 0.7; padding: 0 0.6em; letter-spacing: 0; }
.yf-spin { transform-origin: 0 0; animation: yfspin 360s linear infinite; }
@keyframes yfspin { to { transform: rotate(360deg); } }
.yf-paused .yf-spin { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } }