:root{--ink:#000;--graphite:#5a5a5a;--line:#e2e2e2;--gel-violet:#7a3cff;color-scheme:light}
*{box-sizing:border-box}
body{margin:0;background:#fff;color:var(--ink);font-family:'Archivo',ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;font-size:18px;line-height:1.65;-webkit-font-smoothing:antialiased}
a{color:inherit}
:focus-visible{outline:3px solid var(--gel-violet);outline-offset:3px;border-radius:4px}
header,main,footer{max-width:760px;margin:0 auto;padding:0 24px}
header{display:flex;justify-content:space-between;align-items:center;height:72px}
.mark{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink)}
.mark .pmark{height:28px;width:auto;aspect-ratio:308/320;fill:currentColor;flex:none}.mark .word{height:15px;width:auto}
header a.back{color:var(--graphite);text-decoration:none;font-size:16px}
header a.back:hover{color:var(--ink)}
h1{margin:48px 0 6px;font-weight:780;font-size:clamp(44px,8vw,72px);line-height:.95;letter-spacing:-.03em;font-variation-settings:'wdth' 78}
.updated{margin:0 0 36px;color:var(--graphite);font-size:16px}
h2{margin:40px 0 8px;font-size:22px;font-weight:700;letter-spacing:-.01em}
p,li{color:#1d1d1d}
ul{padding-left:22px}
li{margin:6px 0}
footer{margin-top:72px;padding-top:24px;padding-bottom:40px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:12px 24px;justify-content:space-between;font-size:15px;color:var(--graphite)}
footer nav{display:flex;gap:20px}
footer a{text-decoration:none;color:var(--ink)}
footer a:hover{text-decoration:underline}