:root {
  --void: #0a0c10;
  --void-2: #12161d;
  --panel: #171c25;
  --rule: rgba(255, 255, 255, .09);
  --rule-hi: rgba(255, 255, 255, .17);
  --paper: #ecf2f8;
  --dim: #9aa5b5;
  --dimmer: #7e8c9c;
  --ui: #4cc9f0;
  --cta: #f26b3a;
  --mono: ui-monospace, "SF Mono", "JetBrains Mono", "DejaVu Sans Mono", Menlo, Consolas, monospace;
  --sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
  --display: "Bahnschrift", "DIN Alternate", "Roboto Condensed", "Liberation Sans Narrow", "Arial Narrow", var(--sans);
}

* { box-sizing: border-box; }
html { color-scheme: dark; background: var(--void); }
body {
  min-height: 100vh;
  margin: 0;
  background:
    radial-gradient(circle at 14% 8%, rgba(76, 201, 240, .09), transparent 34rem),
    linear-gradient(180deg, #0d1118, var(--void));
  color: var(--paper);
  font-family: var(--sans);
  -webkit-font-smoothing: antialiased;
}
a { color: var(--ui); text-underline-offset: 3px; }
a:hover { color: var(--paper); }
a:focus-visible,
button:focus-visible { outline: 2px solid var(--ui); outline-offset: 3px; }

.privacy-topbar {
  width: min(880px, calc(100% - 32px));
  margin: 0 auto;
  padding: max(20px, env(safe-area-inset-top)) 0 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
}
.privacy-back {
  color: var(--dim);
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: .1em;
  text-decoration: none;
  text-transform: uppercase;
}
.privacy-languages { display: flex; gap: 7px; }
.privacy-languages button {
  width: 38px;
  height: 30px;
  display: grid;
  place-items: center;
  border: 1px solid var(--rule);
  border-radius: 6px;
  background: rgba(10, 12, 16, .72);
  cursor: pointer;
}
.privacy-languages button[aria-pressed="true"] {
  border-color: var(--ui);
  box-shadow: 0 0 0 1px rgba(76, 201, 240, .16);
}
.privacy-languages svg { width: 21px; height: 14px; }

main {
  width: min(880px, calc(100% - 32px));
  margin: 22px auto 34px;
}
.privacy-card {
  padding: clamp(24px, 5vw, 52px);
  border: 1px solid var(--rule);
  border-radius: 10px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .035), rgba(255, 255, 255, .01)),
    var(--void-2);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05), 0 28px 70px -42px #000;
}
.privacy-card[hidden] { display: none; }
.eyebrow {
  margin: 0 0 8px;
  color: var(--cta);
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: .18em;
  text-transform: uppercase;
}
h1 {
  margin: 0;
  font-family: var(--display);
  font-size: clamp(42px, 8vw, 74px);
  font-weight: 620;
  letter-spacing: -.025em;
  line-height: .95;
}
.lead {
  max-width: 54ch;
  margin: 22px 0 34px;
  color: var(--paper);
  font-size: clamp(17px, 2.4vw, 20px);
  line-height: 1.5;
}
section {
  padding: 22px 0 0;
  border-top: 1px solid var(--rule);
}
section + section { margin-top: 22px; }
h2 {
  margin: 0 0 10px;
  color: var(--paper);
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
}
p {
  max-width: 72ch;
  margin: 0 0 12px;
  color: var(--dim);
  font-size: 15px;
  line-height: 1.65;
}
.updated {
  color: var(--dimmer);
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.privacy-credit {
  width: min(880px, calc(100% - 32px));
  margin: 0 auto;
  padding: 0 0 max(24px, env(safe-area-inset-bottom));
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  color: var(--dimmer);
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: .07em;
  text-transform: uppercase;
}
.privacy-credit a { color: var(--paper); text-decoration: none; }
.privacy-credit i { color: #3fd68f; font-style: normal; }

@media (max-width: 560px) {
  .privacy-topbar,
  main,
  .privacy-credit { width: min(100% - 24px, 880px); }
  .privacy-card { padding: 24px 20px; }
  .privacy-back span:last-child { display: none; }
  .lead { margin-bottom: 28px; }
}

@media (prefers-reduced-motion: reduce) {
  * { scroll-behavior: auto !important; }
}