:root { color-scheme: dark; }
* { box-sizing: border-box; }
body {
  margin: 0; background: #06070b; color: #dfe2ec;
  font: 16px/1.65 "Segoe UI Variable Text", "Segoe UI", -apple-system, BlinkMacSystemFont, Roboto, Arial, sans-serif;
}
a { color: #a58bff; }
.top { max-width: 860px; margin: 0 auto; padding: 22px 20px 0; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.logo { display: flex; align-items: center; gap: 10px; color: #fff; text-decoration: none; font-weight: 700; font-size: 18px; }
.logo img { width: 30px; height: 30px; border-radius: 8px; }
.top nav { display: flex; gap: 18px; font-size: 14px; }
.top nav a { color: #9aa0b5; text-decoration: none; }
.top nav a.on, .top nav a:hover { color: #fff; }
main { max-width: 860px; margin: 0 auto; padding: 30px 20px 60px; }
h1 { font-size: clamp(28px, 4vw, 38px); line-height: 1.15; margin: 10px 0 6px; color: #fff; letter-spacing: -0.01em; }
.updated { color: #646a80; font-size: 14px; margin: 0 0 30px; }
h2 { font-size: 20px; margin: 34px 0 10px; color: #fff; }
p, li { color: #c3c7d4; }
ul { padding-left: 22px; }
li { margin: 6px 0; }
.card { padding: 16px 18px; border-radius: 14px; background: rgba(255, 255, 255, 0.04); border: 1px solid rgba(255, 255, 255, 0.08); }
.card p { margin: 4px 0; }
.missing { color: #ffb020; }
footer { max-width: 860px; margin: 0 auto; padding: 24px 20px 40px; border-top: 1px solid rgba(255, 255, 255, 0.08); color: #646a80; font-size: 14px; }