/* The coming-soon page (src/views/coming-soon.tsx). Same colours as the site. */
:root {
  color-scheme: dark;
  --bg: #0B0B0D;
  --surface: #141417;
  --text: #F5F5F7;
  --text-strong: #FFFFFF;
  --muted: #A1A1A8;
  --line: rgba(255, 255, 255, 0.08);
  --font: -apple-system, BlinkMacSystemFont, 'SF Pro Text', 'Inter', system-ui, sans-serif;
}
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; background: var(--bg); color: var(--text); }
body.cs {
  font-family: var(--font); line-height: 1.5; -webkit-font-smoothing: antialiased;
  min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column;
  background: radial-gradient(ellipse 80% 55% at 50% 0%, rgba(255, 255, 255, 0.07), transparent 70%), var(--bg);
}
.cs main { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 64px 16px 32px; }
.cs-logo { display: block; width: min(260px, 62vw); height: auto; margin-bottom: 56px; }
.cs-eyebrow { display: inline-block; padding: 6px 14px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, 0.12); background: var(--surface); font-size: 13px; font-weight: 600; letter-spacing: 0.02em; margin-bottom: 24px; }
.cs h1 { margin: 0 0 16px; color: var(--text-strong); font-size: clamp(36px, 7vw, 64px); font-weight: 700; letter-spacing: -0.035em; line-height: 1.05; }
.cs-lead { margin: 0 auto 40px; max-width: 34ch; color: var(--muted); font-size: clamp(17px, 2.2vw, 20px); }
.cs-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 52px; padding: 0 32px; border-radius: 999px; background: var(--text-strong); color: var(--bg); font-weight: 600; font-size: 17px; text-decoration: none; transition: background .15s; }
.cs-btn:hover { background: #E3E3E8; }
.cs-btn svg { width: 18px; height: 18px; }
.cs-note { margin: 14px 0 0; color: var(--muted); font-size: 14px; }
.cs :focus-visible { outline: 2px solid var(--text-strong); outline-offset: 3px; }
.cs footer { border-top: 1px solid var(--line); padding: 20px 16px; text-align: center; color: var(--muted); font-size: 14px; }
.cs footer a { color: var(--text); text-decoration: none; }
.cs footer a:hover { color: var(--text-strong); text-decoration: underline; }
.cs-links { display: block; margin-top: 6px; font-size: 13px; }