:root {
  --bg: #061428;
  --card: #0c1a30;
  --text: #e8eefc;
  --muted: #9aa8c7;
  --yellow: #FFC72C;
  --navy: #0B1F3A;
  --border: #2a4a58;
  --link: #3dd6c6;
}
* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: "Segoe UI", system-ui, -apple-system, Roboto, sans-serif;
  background: linear-gradient(180deg, #07122a 0%, #061428 50%);
  color: var(--text);
  line-height: 1.55;
  min-height: 100vh;
}
a { color: var(--link); }
header.legal-top {
  max-width: 720px; margin: 0 auto; padding: 20px 18px 8px;
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
}
header.legal-top .logo {
  width: 40px; height: 40px; border-radius: 10px;
  background: var(--navy); color: var(--yellow);
  display: grid; place-items: center;
  border: 1px solid color-mix(in srgb, var(--yellow) 35%, var(--navy));
}
header.legal-top strong { color: var(--yellow); letter-spacing: .02em; }
nav.legal-nav { display: flex; gap: 12px; flex-wrap: wrap; font-size: .9rem; }
main.legal {
  max-width: 720px; margin: 0 auto; padding: 8px 18px 48px;
}
.draft-banner {
  background: color-mix(in srgb, var(--yellow) 14%, var(--card));
  border: 1px solid color-mix(in srgb, var(--yellow) 40%, var(--border));
  border-radius: 12px; padding: 12px 14px; font-size: .9rem; margin: 12px 0 20px;
}
.placeholder {
  background: color-mix(in srgb, #ff6b6b 18%, transparent);
  border: 1px dashed #ff6b6b; border-radius: 4px;
  padding: 0 .2em; font-family: ui-monospace, monospace; font-size: .92em;
}
h1 { font-size: 1.55rem; margin: 0 0 8px; }
h2 { font-size: 1.1rem; margin: 22px 0 8px; color: var(--yellow); }
p, li { color: var(--text); font-size: .95rem; }
ul { padding-left: 1.2em; }
.meta { color: var(--muted); font-size: .85rem; margin-bottom: 16px; }
footer.legal-foot {
  max-width: 720px; margin: 0 auto; padding: 0 18px 40px;
  color: var(--muted); font-size: .82rem;
}