:root { color-scheme: light dark; font: 17px/1.8 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color: #25222c; background: #faf9fc; }
* { box-sizing: border-box; }
body { margin: 0 auto; max-width: 820px; padding: 30px 24px 60px; }
header { display: flex; gap: 20px; flex-wrap: wrap; align-items: baseline; border-bottom: 1px solid #ddd7e7; padding-bottom: 18px; }
header a:first-child { font-size: 24px; font-weight: 700; margin-right: auto; text-decoration: none; }
a { color: #7051a3; text-underline-offset: 3px; }
main { margin-top: 40px; }
h1 { font-size: 32px; line-height: 1.3; letter-spacing: -.02em; margin: 0 0 12px; }
h2 { font-size: 22px; line-height: 1.45; margin: 36px 0 12px; }
h3 { font-size: 18px; margin-top: 26px; }
p, ul, ol { margin: 12px 0; }
li { padding-left: 3px; margin: 6px 0; }
.date, footer { color: #6b6574; font-size: 14px; }
footer { border-top: 1px solid #ddd7e7; margin-top: 48px; padding-top: 20px; }
@media (prefers-color-scheme: dark) { :root { color: #eeeaf4; background: #17151c; } a { color: #c6abf1; } header, footer { border-color: #433c4d; } .date, footer { color: #b5acbf; } }
@media (max-width: 420px) { body { padding: 22px 20px 40px; } header { gap: 14px; } header a:first-child { width: 100%; } h1 { font-size: 28px; } }