:root { color-scheme: dark; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color: #f8f3ff; background: #100b1d; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; background: radial-gradient(circle at 50% -15%, #392657 0, #100b1d 38rem); }
a { color: #ffe1a1; }
:focus-visible { outline: 3px solid #fff0bd; outline-offset: 3px; }
.shell { width: min(780px, calc(100% - 2rem)); margin: 0 auto; padding: 2rem 0 4rem; }
.brand { display: inline-flex; gap: .65rem; align-items: center; color: #fff; font: 700 1rem/1 Georgia, serif; text-decoration: none; }
.mark { display: grid; place-items: center; width: 2.2rem; height: 2.2rem; border: 1px solid rgba(245,189,88,.4); border-radius: .65rem; background: #2d1d43; color: #f5bd58; font: 800 .72rem/1 ui-monospace, monospace; }
main { margin-top: 2.5rem; padding: clamp(1.25rem, 5vw, 2.8rem); border: 1px solid rgba(245,189,88,.22); border-radius: 1.25rem; background: rgba(28,19,43,.9); box-shadow: 0 2rem 5rem rgba(0,0,0,.3); }
h1, h2 { font-family: Georgia, "Times New Roman", serif; text-wrap: balance; }
h1 { margin: 0 0 1rem; font-size: clamp(2.1rem, 7vw, 3.4rem); }
h2 { margin-top: 2rem; color: #ffe0a0; }
p, li { color: #cfc4dd; line-height: 1.75; }
.callout { padding: 1rem; border-left: 3px solid #f5bd58; border-radius: .4rem; background: rgba(245,189,88,.08); }
.settings-button { min-height: 2.8rem; border: 1px solid #f5bd58; border-radius: 999px; background: #f5bd58; color: #29180a; padding: .7rem 1rem; cursor: pointer; font: 800 .85rem/1 system-ui, sans-serif; }
footer { display: flex; flex-wrap: wrap; gap: .9rem; margin-top: 1.5rem; color: #9e92ad; font-size: .83rem; }
footer a { color: #d9cde5; }