:root {
  --bg: #0d1116;
  --text: #eef3f7;
  --muted: #b8c5cf;
  --surface: #151d25;
  --line: rgba(255, 255, 255, 0.08);
  --max: 980px;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: "Segoe UI", Arial, sans-serif;
  color: var(--text);
  background: var(--bg);
  line-height: 1.6;
}

.container { width: min(var(--max), 92%); margin: 0 auto; }

header {
  padding: 26px 0;
  border-bottom: 1px solid var(--line);
  background: #0a0e13;
}

.back {
  color: #a8d6ff;
  text-decoration: none;
  font-weight: 600;
}

h1 { margin: 8px 0 0; font-size: clamp(1.8rem, 3.8vw, 2.8rem); }
h2 { margin: 0 0 8px; font-size: clamp(1.35rem, 2.8vw, 1.9rem); }
.sub { color: var(--muted); margin: 0; max-width: 760px; }

section {
  padding: 36px 0;
  border-bottom: 1px solid var(--line);
}

p, ul {
  margin: 0;
  color: var(--muted);
}

ul {
  padding-left: 18px;
}

a {
  color: #a8d6ff;
  text-decoration: none;
}

footer {
  padding: 18px 0 28px;
  color: var(--muted);
}

.footer-note {
  margin: 8px 0 0;
  font-size: 0.86rem;
}

.footer-note a {
  margin-left: 8px;
}