/* MoyaiDelay design tokens, fonts and base styles (from the redesign mockup). */
@font-face { font-family: 'Chakra Petch'; font-weight: 500; font-display: swap; src: url('../assets/fonts/chakra-petch-500.woff2') format('woff2'); }
@font-face { font-family: 'Chakra Petch'; font-weight: 600; font-display: swap; src: url('../assets/fonts/chakra-petch-600.woff2') format('woff2'); }
@font-face { font-family: 'Chakra Petch'; font-weight: 700; font-display: swap; src: url('../assets/fonts/chakra-petch-700.woff2') format('woff2'); }
@font-face { font-family: 'Manrope'; font-weight: 400 800; font-display: swap; src: url('../assets/fonts/manrope-variable.woff2') format('woff2'); }
@font-face { font-family: 'JetBrains Mono'; font-weight: 500 600; font-display: swap; src: url('../assets/fonts/jetbrains-mono-variable.woff2') format('woff2'); }

:root {
  --bg: #09090b;
  --card: #101013;
  --card-2: #16161a;
  --card-3: #1e1e23;
  --line: rgba(255, 255, 255, 0.07);
  --line-2: rgba(255, 255, 255, 0.13);
  --text: #f3f3f0;
  --text-2: #a3a3ab;
  --text-3: #6d6d76;
  --accent: #FBBF24;
  --accent-2: #F59E0B;
  --accent-soft: rgba(251, 191, 36, 0.10);
  --accent-line: rgba(251, 191, 36, 0.45);
  --accent-glow: rgba(251, 191, 36, 0.28);
  --ok: #22c55e;
  --ok-soft: rgba(34, 197, 94, 0.12);
  --danger: #ef4444;
  --danger-soft: rgba(239, 68, 68, 0.12);
  --info: #60a5fa;
  --info-soft: rgba(96, 165, 250, 0.12);
  --warn: #fb923c;
  --font: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --display: 'Chakra Petch', 'Manrope', 'Segoe UI', sans-serif;
  --mono: 'JetBrains Mono', 'Cascadia Code', Consolas, monospace;
  --spring-soft: cubic-bezier(0.34, 1.45, 0.64, 1);
  --spring-hard: cubic-bezier(0.2, 1.9, 0.45, 1);
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
  --topH: 60px;
  color-scheme: dark;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html { height: 100%; }
/* body must grow with the content: a 100% body would end the sticky top bar after one screen */
body { min-height: 100%; background: var(--bg); color: var(--text); font-family: var(--font); font-size: 14px; line-height: 1.45; -webkit-font-smoothing: antialiased; user-select: none; -webkit-user-select: none; }
input, textarea, .copyf code { user-select: text; -webkit-user-select: text; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; border: 0; background: none; }
img { max-width: 100%; }
[hidden] { display: none !important; }
a { color: var(--accent); }
::selection { background: var(--accent); color: #111; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: var(--card-3); border-radius: 10px; border: 2px solid var(--bg); }
::-webkit-scrollbar-track { background: transparent; }
.eyebrow { display: inline-flex; align-items: center; gap: 10px; font-family: var(--display); font-size: 12px; font-weight: 600; letter-spacing: 1.8px; text-transform: uppercase; color: var(--text); }
.tick { width: 3px; height: 14px; background: var(--accent); border-radius: 1px; box-shadow: 0 0 8px var(--accent-glow); flex: none; }
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes riseIn { from { opacity: 0; transform: translateY(14px) scale(.985); } to { opacity: 1; transform: none; } }
