/* Privacy policy and terms (/privacy, /terms): the same sand & sea as the app, light and dark. */
:root {
  --sand: #f7f4ee; --sand-2: #efeae0; --paper: #fffdf9; --ink: #22303a; --ink-soft: #5b6873;
  --muted: #97a0a8; --line: #e6e0d4; --sea: #2b6f77; --sea-soft: #e2eeec;
  --font: "Inter", -apple-system, system-ui, sans-serif;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --sand: #141b20; --sand-2: #222c33; --paper: #1b242a; --ink: #e7e3db; --ink-soft: #b0b9c0;
    --muted: #7c8790; --line: #2d3940; --sea: #6cc0c8; --sea-soft: #1c3a3e;
  }
}
:root[data-theme="dark"] {
  --sand: #141b20; --sand-2: #222c33; --paper: #1b242a; --ink: #e7e3db; --ink-soft: #b0b9c0;
  --muted: #7c8790; --line: #2d3940; --sea: #6cc0c8; --sea-soft: #1c3a3e;
}
* { box-sizing: border-box; }
html { background: var(--sand); }
body { margin: 0; background: var(--sand); color: var(--ink); font: 16px/1.7 var(--font); -webkit-font-smoothing: antialiased; }
.wrap { max-width: 760px; margin: 0 auto; padding: 32px 16px 64px; }
header { display: flex; align-items: center; gap: 12px; margin-bottom: 28px; flex-wrap: wrap; }
.logo { display: flex; align-items: center; gap: 10px; color: var(--ink); text-decoration: none; font: 600 22px "Sora", "Inter", system-ui, sans-serif; }
.logo i { width: 34px; height: 34px; border-radius: 10px; background: #2b6f77; display: grid; place-items: center; }
.langs { margin-left: auto; display: flex; gap: 4px; background: var(--sand-2); padding: 3px; border-radius: 999px; }
.langs button { border: 0; background: none; color: var(--ink-soft); font: 500 13px var(--font); padding: 5px 12px; border-radius: 999px; cursor: pointer; }
.langs button.on { background: var(--paper); color: var(--ink); box-shadow: 0 1px 3px rgba(34,48,58,.12); }
article { background: var(--paper); border: 1px solid var(--line); border-radius: 20px; padding: 32px 36px; }
h1 { font: 600 32px/1.2 "Sora", "Inter", system-ui, sans-serif; margin: 0 0 6px; }
.updated { color: var(--muted); font-size: 14px; margin: 0 0 24px; }
h2 { font: 600 20px/1.3 "Sora", "Inter", system-ui, sans-serif; margin: 30px 0 8px; }
p, li { color: var(--ink-soft); }
strong { color: var(--ink); font-weight: 600; }
ul { padding-left: 1.3em; } li { margin: 4px 0; }
a { color: var(--sea); text-underline-offset: 2px; }
.box { background: var(--sea-soft); border-radius: 14px; padding: 14px 18px; margin: 16px 0; }
.box p { margin: 0; color: var(--ink); }
footer { text-align: center; margin-top: 28px; font-size: 14px; color: var(--muted); }
footer a { color: var(--muted); }
[hidden] { display: none !important; }
@media (max-width: 600px) { article { padding: 22px 18px; border-radius: 16px; } h1 { font-size: 26px; } }
