:root {
  --bg: #050608;
  --text: #F2F4F8;
  --dim: #98A1B3;
  --faint: #5E6678;
  --steel: #4E7394;
  --steel-light: #9DB8D2;
  --glass: rgba(255, 255, 255, .045);
  --edge: rgba(255, 255, 255, .10);
  --edge-lit: rgba(255, 255, 255, .34);
}

* { box-sizing: border-box; }
html { background: var(--bg); -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  min-height: 100vh;
  color: var(--text);
  /* Transparent so the fixed light streaks (z-index -1) show; html carries the colour. */
  background: transparent;
  font: 17px/1.6 -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", "Segoe UI", Roboto, sans-serif;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
a { color: var(--steel-light); }
img { max-width: 100%; display: block; }

/* The app's background: near-black with blurred, rotated steel light. */
.streaks { position: fixed; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; }
.streaks i {
  position: absolute; display: block; border-radius: 999px;
  filter: blur(60px); transform: rotate(-28deg); opacity: .8;
}
.streaks i:nth-child(1) { width: 70vmax; height: 9vmax; left: -10vmax; top: 8vh; background: var(--steel); }
.streaks i:nth-child(2) { width: 55vmax; height: 5vmax; right: -18vmax; top: 42vh; background: var(--steel-light); opacity: .4; }
.streaks i:nth-child(3) { width: 60vmax; height: 7vmax; left: 10vmax; bottom: -6vh; background: var(--steel); opacity: .5; }

/* Clear glass with a lit top-left edge, as on every card in the app. */
.glass {
  position: relative;
  background: var(--glass);
  border-radius: 24px;
  backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
}
.glass::before {
  content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1px; pointer-events: none;
  background: linear-gradient(135deg, var(--edge-lit), var(--edge) 35%, rgba(255,255,255,.04) 70%, var(--edge));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
}

.headline { font-weight: 900; letter-spacing: -.035em; line-height: 1.02; font-stretch: condensed; }

/* Legal pages */
.doc { max-width: 680px; margin: 0 auto; padding: 40px 20px 80px; }
.doc h1 { font-size: 2.4rem; margin: 0 0 6px; }
.doc h2 { font-size: 1.15rem; margin: 36px 0 8px; }
.dim { color: var(--dim); font-size: .95rem; }
.doc ul { padding-left: 1.2em; }
.brand { display: inline-flex; align-items: center; gap: 10px; font-weight: 800; text-decoration: none; color: var(--text); font-size: 1.05rem; margin-bottom: 40px; }
.brand img { width: 32px; height: 32px; border-radius: 8px; }
.doc nav { display: flex; gap: 20px; margin-top: 48px; padding-top: 20px; border-top: 1px solid var(--edge); font-size: .95rem; }