:root {
  --bg:#0b1220; --panel:#101a30; --text:#e5e7eb; --muted:#94a3b8;
  --primary:#6366f1; --accent:#22d3ee; --success:#10b981; --warn:#f59e0b;
}
* { box-sizing: border-box; }
body { margin:0; font-family: -apple-system, "Segoe UI", system-ui, sans-serif; background: linear-gradient(180deg, #0b1220 0%, #0a0f1c 100%); color: var(--text); line-height: 1.65; min-height:100vh; }
.container { max-width: 880px; margin: 0 auto; padding: 0 24px; }
nav { padding: 22px 0; display:flex; justify-content: space-between; align-items: center; }
nav a { color: var(--muted); text-decoration: none; margin-left: 24px; transition: color .15s; }
nav a:hover { color: var(--text); }
.logo { font-weight: 800; font-size: 22px; letter-spacing: -.5px; background: linear-gradient(90deg, var(--primary), var(--accent)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.logo a { color: transparent; text-decoration: none; }
.legal { padding: 40px 0 80px; }
.legal h1 { font-size: clamp(28px, 4vw, 40px); margin: 0 0 8px; font-weight: 800; letter-spacing: -1px; }
.legal .updated { color: var(--muted); font-size: 14px; margin-bottom: 32px; }
.legal h2 { font-size: 22px; margin: 40px 0 12px; color: var(--accent); font-weight: 700; letter-spacing: -.3px; }
.legal h3 { font-size: 17px; margin: 24px 0 8px; color: var(--text); font-weight: 600; }
.legal p, .legal li { color: #cbd5e1; font-size: 15.5px; text-align: justify; text-justify: inter-word; hyphens: auto; -webkit-hyphens: auto; }
.legal ul, .legal ol { padding-left: 22px; }
.legal li { margin: 6px 0; }
.legal a { color: var(--accent); text-decoration: none; }
.legal a:hover { text-decoration: underline; }
.legal code { background: #050a18; padding: 2px 7px; border-radius: 5px; font-size: 13.5px; color: var(--accent); }
.legal blockquote { border-left: 3px solid var(--primary); margin: 16px 0; padding: 8px 0 8px 16px; color: var(--muted); font-style: italic; }
.box { background: var(--panel); border: 1px solid #1e293b; border-radius: 12px; padding: 20px 24px; margin: 24px 0; }
.box.warn { border-color: rgba(245,158,11,.5); background: rgba(245,158,11,.05); }
.box.warn h3 { color: var(--warn); margin-top: 0; }
.toc { background: var(--panel); border: 1px solid #1e293b; border-radius: 12px; padding: 16px 24px; margin: 24px 0; }
.toc h3 { margin: 0 0 8px; color: var(--accent); font-size: 14px; text-transform: uppercase; letter-spacing: 1px; }
.toc ul { padding-left: 18px; margin: 0; }
.toc li { margin: 3px 0; }
.toc a { color: var(--text); font-size: 14.5px; }
footer { padding: 40px 0; border-top: 1px solid #1e293b; text-align: center; color: var(--muted); font-size: 14px; margin-top: 60px; }
footer a { color: var(--accent); text-decoration: none; margin: 0 8px; }
.back { display: inline-block; margin-top: 8px; color: var(--accent); text-decoration: none; }
.back:hover { text-decoration: underline; }
@media (max-width: 600px) {
  nav a { margin-left: 14px; font-size: 14px; }
  .legal { padding: 20px 0 60px; }
}