:root{--coin:#F0C129;--ink:#2D3436;--night:#1B2022;--cream:#FFFBF0;--line:#ECE5D1;--muted:#5F676B;color-scheme:light;box-sizing:border-box}
*,*::before,*::after{box-sizing:inherit}
html{background:var(--night)}
body{margin:0;background:var(--cream);color:var(--ink);font-family:"Manrope",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;font-size:17px;line-height:1.65;-webkit-font-smoothing:antialiased}
header{background:var(--night);padding:calc(env(safe-area-inset-top,0px) + 16px) 20px 16px}
header .in,main,footer .in{max-width:760px;margin:0 auto}
header img{height:30px;width:auto;display:block}
main{padding:32px 20px 56px}
h1{font-family:"Bricolage Grotesque",ui-sans-serif,system-ui,sans-serif;font-weight:600;font-size:clamp(32px,7vw,44px);line-height:1.1;letter-spacing:-.02em;margin:0 0 6px}
.eff{color:var(--muted);margin:0 0 28px;font-size:15px}
h2{font-size:21px;margin:34px 0 8px;line-height:1.3}
h3{font-size:17px;margin:20px 0 6px}
p,li{margin:0 0 12px}
ul{padding-left:22px;margin:0 0 14px}
a{color:var(--ink);text-decoration-color:var(--coin);text-decoration-thickness:2px;text-underline-offset:3px}
.box{background:#fff;border-radius:18px;padding:18px 20px;box-shadow:0 1px 0 var(--line);margin:18px 0}
.toc{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 8px}
.toc a{background:#fff;border:1px solid var(--line);border-radius:999px;padding:6px 12px;text-decoration:none;font-weight:700;font-size:14px}
footer{background:var(--night);color:#AEB6B9;padding:24px 20px calc(24px + env(safe-area-inset-bottom,0px));font-size:14px}
footer a{color:var(--coin)}
a:focus-visible{outline:3px solid var(--coin);outline-offset:3px}
