/* Shared by /terms and /privacy. Long-form reading, so this is deliberately plainer than site.html — narrow measure, generous line height, and none of the neon. The palette matches the marketing site so it still reads as us. */ :root { --cyan: #00f0ff; --pink: #ff2e88; --yellow: #ffd800; --purple: #b026ff; --bg0: #0a021a; --bg1: #14043a; --ink: #e9edf7; --dim: #9fb0cc; --line: rgba(176,38,255,0.28); --arcade: "Press Start 2P", monospace; } * { box-sizing: border-box; margin: 0; padding: 0; } /* Overscroll colour. Without a background on , rubber-banding past the top on a phone exposes the browser's default white canvas — the body's gradient is sized to the body box and does not extend into that area. This is the colour at the TOP of that gradient, so the seam is invisible. */ html { scroll-behavior: smooth; background: var(--bg1); } body { background: radial-gradient(ellipse at 50% -10%, var(--bg1) 0%, var(--bg0) 55%, #05010d 100%); color: var(--ink); min-height: 100%; font: 16px/1.75 system-ui, -apple-system, "Segoe UI", sans-serif; -webkit-font-smoothing: antialiased; } a { color: var(--cyan); } .wrap { width: min(760px, 92vw); margin: 0 auto; } header { position: sticky; top: 0; z-index: 30; backdrop-filter: blur(10px); background: rgba(10,2,26,0.75); border-bottom: 1px solid var(--line); } header .wrap { display: flex; align-items: center; gap: 20px; padding: 14px 0; } .logo { font-family: var(--arcade); font-size: 13px; color: var(--yellow); letter-spacing: 1px; text-decoration: none; } .logo span { color: var(--cyan); } header nav { margin-left: auto; display: flex; gap: 20px; } header nav a { color: var(--dim); text-decoration: none; font-size: 15px; } header nav a:hover { color: var(--ink); } main { padding: 56px 0 80px; } h1 { font-size: clamp(1.7rem, 4vw, 2.4rem); font-weight: 800; letter-spacing: -0.5px; } .updated { color: var(--dim); font-size: 14px; margin-top: 8px; } .intro { margin-top: 26px; font-size: 1.05rem; } h2 { font-size: 1.15rem; font-weight: 700; margin: 40px 0 12px; padding-top: 22px; border-top: 1px solid var(--line); } h3 { font-size: 1rem; font-weight: 700; margin: 22px 0 8px; color: var(--cyan); } p { margin: 12px 0; } ul, ol { margin: 12px 0 12px 22px; } li { margin: 7px 0; } strong { color: #fff; } code { font-family: ui-monospace, monospace; font-size: 0.92em; color: var(--yellow); } /* Definition-style rows for "what we collect" and "who we share with". */ table { width: 100%; border-collapse: collapse; margin: 16px 0; font-size: 15px; } th, td { text-align: left; padding: 10px 12px; border: 1px solid var(--line); vertical-align: top; } th { background: rgba(176,38,255,0.10); font-weight: 700; } .callout { margin: 22px 0; padding: 16px 18px; border-radius: 10px; background: rgba(255,216,0,0.07); border: 1px solid rgba(255,216,0,0.35); } .toc { margin: 30px 0 0; padding: 18px 20px; border: 1px solid var(--line); border-radius: 10px; background: rgba(20,4,58,0.35); } .toc ol { margin: 8px 0 0 20px; } .toc a { text-decoration: none; } .toc a:hover { text-decoration: underline; } footer { border-top: 1px solid var(--line); padding: 26px 0 44px; color: var(--dim); font-size: 14px; } footer .wrap { display: flex; gap: 18px; flex-wrap: wrap; align-items: center; } footer .spacer { flex: 1; }