:root { color-scheme: light; font-family: var(--font-text); color: #27354a; background: #f8f9fb; }
* { box-sizing: border-box; }
body { margin: 0; }
main { max-width: 760px; margin: 0 auto; padding: 40px max(24px, env(safe-area-inset-right)) 64px max(24px, env(safe-area-inset-left)); }
a { color: #356bb0; text-underline-offset: 3px; overflow-wrap: anywhere; }
a:focus-visible { outline: 3px solid #8bb5e9; outline-offset: 5px; border-radius: 3px; }
.back { display: inline-block; padding: 8px 0; font-size: 15px; text-decoration: none; }
header { margin: 40px 0; }
.eyebrow { margin: 20px 0 8px; font-size: 11px; font-weight: 650; letter-spacing: 2px; color: #6483a6; }
h1 { margin: 0; font-size: clamp(34px, 7vw, 48px); line-height: 1.15; letter-spacing: -1.5px; font-weight: 650; }
.intro { color: #687b92; font-size: 18px; }
.updated { color: #748197; font-size: 13px; }
section { margin: 28px 0; }
h2 { margin: 0 0 10px; font-size: 20px; font-weight: 600; letter-spacing: -.35px; }
p { margin: 10px 0; font-size: 16px; line-height: 1.75; }
@media (max-width: 480px) { main { padding-top: 20px; } header { margin-top: 28px; } }

body{background:radial-gradient(ellipse at 0 0,#dce5ef55,transparent 50%),#f4f5f7}
.back{border:1px solid #ffffffd9;border-radius:22px;padding:10px 16px;background:linear-gradient(135deg,#fffffff0,#ffffff80);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);box-shadow:0 4px 18px #25364e09,inset 0 1px 0 #fff}
@media(prefers-reduced-transparency:reduce),(prefers-contrast:more){.back{background:#fff;border-color:#a5b2c3;backdrop-filter:none;-webkit-backdrop-filter:none}}
@media(forced-colors:active){.back{background:Canvas;border-color:CanvasText;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}}