/* One stylesheet for the three pages App Store Connect links to.
 *
 * Plain, readable, and theme-aware, because a privacy policy is read once by a reviewer
 * checking it exists and matches the App Privacy answers, and once by a person who has just
 * become suspicious about a fitness app that films them. Neither is helped by a design. */

:root {
  color-scheme: light dark;
  --ink: #16181d;
  --dim: #5b6270;
  --rule: #dfe3ea;
  --ground: #ffffff;
  --accent: #1b6dea;
  --panel: #f5f7fa;
}

@media (prefers-color-scheme: dark) {
  :root {
    --ink: #e9ecf2;
    --dim: #9aa2b1;
    --rule: #2b3038;
    --ground: #101318;
    --accent: #5c9bff;
    --panel: #171b22;
  }
}

* { box-sizing: border-box; }

body {
  margin: 0;
  padding-block: 48px;
  padding-inline: 20px;
  background: var(--ground);
  color: var(--ink);
  font: 16px/1.75 -apple-system, BlinkMacSystemFont, "Hiragino Sans", "Noto Sans JP",
        "Segoe UI", sans-serif;
  -webkit-text-size-adjust: 100%;
}

main { max-width: 44rem; margin: 0 auto; }

h1 { font-size: 1.9rem; line-height: 1.3; margin: 0 0 4px; letter-spacing: -0.01em; }
h2 { font-size: 1.15rem; margin: 40px 0 10px; padding-top: 20px; border-top: 1px solid var(--rule); }
h3 { font-size: 1rem; margin: 26px 0 6px; }

p, li { color: var(--ink); }
li { margin-bottom: 6px; }

a { color: var(--accent); }

.lede { color: var(--dim); margin: 0 0 6px; }
.updated { color: var(--dim); font-size: 0.85rem; margin: 0 0 8px; }

.lang {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin: 0 0 32px;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--rule);
  font-size: 0.9rem;
}

.callout {
  background: var(--panel);
  border: 1px solid var(--rule);
  border-radius: 10px;
  padding: 16px 18px;
  margin: 24px 0;
}
.callout p { margin: 0; }
.callout p + p { margin-top: 10px; }

table { border-collapse: collapse; width: 100%; margin: 16px 0; font-size: 0.95rem; }
th, td { text-align: left; padding: 9px 12px; border-bottom: 1px solid var(--rule); vertical-align: top; }
th { color: var(--dim); font-weight: 600; }

code {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.9em;
  background: var(--panel);
  padding: 1px 5px;
  border-radius: 4px;
}

footer {
  margin-top: 56px;
  padding-top: 20px;
  border-top: 1px solid var(--rule);
  color: var(--dim);
  font-size: 0.85rem;
}

.table-wrap { overflow-x: auto; }