:root { color-scheme: dark; --sky: #241c58; --indigo: #272060; --cream: #fff0e2; --paper: #fff8ee; --yarn: #df4552; }
* { box-sizing: border-box; }
html, body { margin: 0; background: var(--sky); color: var(--cream); font: 18px/1.6 -apple-system, "SF Pro Text", "Helvetica Neue", Arial, sans-serif; }
main { max-width: 620px; margin: 0 auto; padding: 56px 20px 40px; }
h1 { font-size: 46px; line-height: 1.1; margin: 0 0 8px; text-align: center; }
.sub { text-align: center; opacity: .85; margin: 0 0 28px; font-size: 20px; }
.art { display: block; width: min(100%, 420px); margin: 0 auto -28px; position: relative; }
.paper { background: var(--paper); color: var(--indigo); border-radius: 30px; padding: 40px 28px 28px; border-top: 3px dashed #f0757a; background-clip: padding-box; }
.paper h2 { font-size: 22px; margin: 28px 0 6px; }
.paper h2:first-child { margin-top: 0; }
.paper ul { padding-inline-start: 22px; margin: 6px 0; }
.paper p { margin: 6px 0; }
a { color: var(--yarn); }
.lang { margin-top: 44px; padding-top: 28px; border-top: 1px solid rgba(39,32,96,.15); }
footer { text-align: center; margin-top: 24px; font-size: 15px; opacity: .8; }
footer a { color: var(--cream); }