/* Shared styling for every app's legal page.
   Deep Sea palette, lifted from the studio index so the legal pages read as part
   of Black Beacon rather than something bolted on. One file — change it here and
   all six pages follow. */

:root {
  --ground:#081519; --panel:#0c1e23; --line:#123039;
  --accent:#e2b24a; --accent-hi:#f6d788;
  --cream:#e9f0f2; --paper:#ccd9db; --muted:#88a0a4; --faint:#4f676c;
  --serif:Georgia,"Iowan Old Style","Times New Roman",serif;
  --sans:-apple-system,"Helvetica Neue","Segoe UI",Arial,sans-serif;
  --mono:ui-monospace,"SF Mono","SFMono-Regular",Menlo,monospace;
  --maxw:760px;
}

* { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }
body {
  margin:0; background:var(--ground); color:var(--paper);
  font-family:var(--sans); line-height:1.7;
  -webkit-font-smoothing:antialiased;
}

.wrap { max-width:var(--maxw); margin:0 auto; padding:0 24px; }

/* ── Header ─────────────────────────────────────────────────────────── */
header { border-bottom:1px solid var(--line); padding:28px 0; margin-bottom:48px; }
header .wrap { display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.brand {
  font-family:var(--mono); font-size:12px; letter-spacing:.28em;
  text-transform:uppercase; color:var(--muted); text-decoration:none;
}
.brand:hover { color:var(--accent); }
.app-tag {
  font-family:var(--mono); font-size:12px; letter-spacing:.18em;
  text-transform:uppercase; color:var(--accent);
}

/* ── Document ───────────────────────────────────────────────────────── */
h1 {
  font-family:var(--serif); font-weight:normal;
  font-size:clamp(30px, 6vw, 42px); line-height:1.2;
  color:var(--cream); margin:0 0 8px;
}
.updated { font-family:var(--mono); font-size:12px; color:var(--faint); margin:0 0 44px; }

h2 {
  font-family:var(--serif); font-weight:normal;
  font-size:clamp(20px, 4vw, 25px); line-height:1.3;
  color:var(--cream); margin:44px 0 12px;
}

p, li { font-size:16.5px; margin:0 0 16px; }
ul { padding-left:22px; margin:0 0 16px; }
li { margin-bottom:8px; }
strong { color:var(--cream); font-weight:600; }

a { color:var(--accent); text-decoration:none; border-bottom:1px solid rgba(226,178,74,.35); }
a:hover { color:var(--accent-hi); border-bottom-color:var(--accent-hi); }

/* The paragraph that matters most on these pages — what leaves the device. */
.callout {
  background:var(--panel); border:1px solid var(--line); border-left:3px solid var(--accent);
  border-radius:6px; padding:18px 20px; margin:0 0 20px;
}
.callout p:last-child { margin-bottom:0; }

/* ── Footer ─────────────────────────────────────────────────────────── */
footer {
  border-top:1px solid var(--line); margin-top:64px; padding:28px 0 56px;
  font-size:14px; color:var(--faint);
}
footer a { color:var(--muted); border-bottom-color:rgba(136,160,164,.3); }
footer .links { margin-bottom:10px; }
footer .links a { margin-right:18px; }

@media (prefers-reduced-motion:no-preference) { html { scroll-behavior:smooth; } }