:root { color-scheme: dark; --night: #121629; --panel: #1b2140; --fg: #ece8f6; --muted: #a9a3c2; --glow: #ffd27a; --pumpkin: #ff9447; --line: rgba(236, 232, 246, .14) }
* { box-sizing: border-box }
html, body { margin: 0; background: var(--night); color: var(--fg) }
body { font: 16px/1.6 "Nunito", "Avenir Next", system-ui, sans-serif; padding-top: env(safe-area-inset-top, 0px); padding-bottom: env(safe-area-inset-bottom, 0px) }
main { max-width: 720px; margin: 0 auto; padding-block: 40px 64px; padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)) }
.back { color: var(--glow); font-weight: 700; text-decoration: none }
.eyebrow { font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 13px; letter-spacing: .08em; color: var(--glow); text-transform: uppercase; margin: 28px 0 6px }
h1 { font-family: "Cinzel", Georgia, serif; font-size: clamp(30px, 6vw, 44px); line-height: 1.1; margin: 0 0 10px; text-wrap: balance }
h2 { font-family: "Cinzel", Georgia, serif; font-size: 21px; margin: 34px 0 8px; text-wrap: balance }
p, li { max-width: 68ch }
.muted { color: var(--muted) }
a { color: var(--glow) }
ul { padding-left: 20px }
li { margin-bottom: 6px }
.box { background: var(--panel); border-radius: 14px; padding: 14px 18px; box-shadow: inset 0 0 0 1px var(--line) }
table { border-collapse: collapse; width: 100%; font-size: 15px }
.table { overflow-x: auto }
th, td { text-align: left; vertical-align: top; padding: 10px 12px; border-bottom: 1px solid var(--line) }
th { color: var(--muted); font-weight: 700 }