/* Base theme for utility pages (privacy, terms, accessibility, 404). Extracted from /cra inline styles. */
  :root {
    --ct-bg: #080c10;
    --ct-surface: #0d1520;
    --ct-surface2: #111d2b;
    --ct-border: rgba(0, 200, 255, 0.12);
    --ct-border-bright: rgba(0, 200, 255, 0.35);
    --ct-cyan: #00c8ff;
    --ct-cyan-dim: rgba(0, 200, 255, 0.6);
    --ct-yellow: #f5d020;
    --ct-yellow-dim: rgba(245, 208, 32, 0.7);
    --ct-blue: #2a6bcc;
    --ct-blue-bright: #4a8fe8;
    --ct-text: #c8d8e8;
    --ct-text-dim: #6a8898;
    --ct-text-bright: #eaf4ff;
    --ct-red: #ff3c3c;
    --ct-green: #00ff88;
    --font-mono: 'Share Tech Mono', monospace;
    --font-display: 'Rajdhani', sans-serif;
    --font-body: 'IBM Plex Sans', sans-serif;
  }

  *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
  html { scroll-behavior: smooth; }

  body {
    background: var(--ct-bg);
    color: var(--ct-text);
    font-family: var(--font-body);
    font-size: 18px;
    line-height: 1.7;
    overflow-x: hidden;
  }

  body::before {
    content: '';
    position: fixed;
    inset: 0;
    background-image:
      linear-gradient(rgba(0,200,255,0.025) 1px, transparent 1px),
      linear-gradient(90deg, rgba(0,200,255,0.025) 1px, transparent 1px);
    background-size: 40px 40px;
    pointer-events: none;
    z-index: 0;
  }

  body::after {
    content: '';
    position: fixed;
    inset: 0;
    background: repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(0,0,0,0.04) 2px, rgba(0,0,0,0.04) 4px);
    pointer-events: none;
    z-index: 0;
  }

  nav {
    position: fixed; top: 0; left: 0; right: 0; z-index: 100;
    background: rgba(8, 12, 16, 0.92);
    border-bottom: 1px solid var(--ct-border);
    backdrop-filter: blur(8px);
    padding: 0 2rem;
    display: flex; align-items: center; justify-content: space-between;
    height: 64px;
  }

  .nav-logo { display: flex; align-items: center; gap: 12px; text-decoration: none; }
  .nav-logo img { height: 44px; width: auto; }
  .nav-links { display: flex; gap: 2rem; list-style: none; }
  .nav-links a {
    font-family: var(--font-mono); font-size: 0.9rem; color: var(--ct-text-dim);
    text-decoration: none; letter-spacing: 0.08em; text-transform: uppercase; transition: color 0.2s;
  }
  .nav-links a:hover { color: var(--ct-cyan); }
  .nav-cta {
    font-family: var(--font-mono); font-size: 0.9rem; color: var(--ct-yellow) !important;
    border: 1px solid var(--ct-yellow-dim); padding: 6px 16px; transition: background 0.2s, color 0.2s !important;
  }
  .nav-cta:hover { background: var(--ct-yellow); color: #000 !important; }
  .nav-brand { font-family: var(--font-display); font-size: 1.1rem; font-weight: 700; letter-spacing: 0.1em; color: var(--ct-cyan); text-transform: uppercase; }

  .btn-primary {
    display: inline-block; font-family: var(--font-mono); font-size: 1rem; font-weight: 400;
    letter-spacing: 0.1em; text-transform: uppercase; color: #000; background: var(--ct-cyan);
    border: none; padding: 14px 36px; text-decoration: none; transition: background 0.2s, transform 0.15s;
    clip-path: polygon(8px 0%, 100% 0%, calc(100% - 8px) 100%, 0% 100%);
  }
  .btn-primary:hover { background: #fff; transform: translateY(-2px); }

  footer {
    position: relative; z-index: 1; background: var(--ct-bg); border-top: 1px solid var(--ct-border);
    padding: 2rem; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1rem;
  }
  .footer-logo { display: flex; align-items: center; gap: 10px; }
  .footer-logo img { height: 32px; }
  .footer-brand { font-family: var(--font-display); font-size: 0.9rem; font-weight: 700; color: var(--ct-text-dim); text-transform: uppercase; letter-spacing: 0.1em; }
  .footer-copy { font-family: var(--font-mono); font-size: 0.85rem; color: var(--ct-text-dim); letter-spacing: 0.08em; line-height: 1.9; }
  .footer-copy a { color: var(--ct-text-dim); text-decoration: none; }
  .footer-copy a:hover { color: var(--ct-cyan); }
  .footer-keywords { font-family: var(--font-mono); font-size: 0.78rem; color: rgba(100,120,140,0.4); max-width: 400px; line-height: 1.6; }
  .footer-disclaimer { font-family: var(--font-body); font-size: 0.78rem; color: rgba(100,120,140,0.5); max-width: 480px; line-height: 1.6; }

  @media (max-width: 900px) {
    .nav-links { display: none; }
    .page-header { padding-top: 3.5rem; }
  }