@font-face { font-family:"Big Shoulders Stencil"; src:url("/assets/fonts/big-shoulders-stencil-300-latin.woff2") format("woff2"); font-weight:300; font-display:swap; }
@font-face { font-family:"IBM Plex Sans"; src:url("/assets/fonts/ibm-plex-sans-latin.woff2") format("woff2"); font-weight:400 700; font-display:swap; }
:root { color-scheme:light; --ink:#171718; --paper:#f5f4f1; --cyan:#0077aa; --amber:#b66a00; font-family:"IBM Plex Sans","Malgun Gothic",sans-serif; color:var(--ink); background:var(--paper); }
* { box-sizing:border-box; }
body { margin:0; }
a { color:var(--cyan); text-underline-offset:.2em; }
:focus-visible { outline:3px solid #ffcf33; outline-offset:3px; }
header,main,footer { width:min(820px,calc(100% - 2.5rem)); margin:0 auto; }
header { padding:2rem 0 4rem; border-bottom:1px solid var(--ink); }
header nav,footer nav { display:flex; flex-wrap:wrap; gap:1rem; }
header h1 { max-width:13ch; margin:4rem 0 1rem; font-family:"Big Shoulders Stencil","Arial Narrow",sans-serif; font-size:clamp(3.6rem,10vw,7rem); font-weight:300; line-height:.88; letter-spacing:-.025em; }
header p { max-width:64ch; font-size:1.1rem; line-height:1.6; }
main { padding:3rem 0 6rem; }
section { margin-top:4rem; }
h2 { margin:0 0 1rem; font-size:clamp(1.8rem,4vw,2.8rem); line-height:1; }
h3 { margin-top:2rem; }
p,li,dd { max-width:72ch; line-height:1.7; }
li+li { margin-top:.55rem; }
.notice { padding:1rem 1.2rem; color:#432a00; border:1px solid #b66a00; background:#fff3cf; }
.method-table { width:100%; border-collapse:collapse; }
.method-table th,.method-table td { padding:.85rem .6rem; border-bottom:1px solid #a6a7a8; text-align:left; vertical-align:top; }
.method-table th { border-top:1px solid var(--ink); }
code { padding:.1rem .25rem; background:#e0e1df; }
footer { display:grid; gap:1rem; padding:2.5rem 0; border-top:1px solid var(--ink); font-size:.9rem; }
@media(max-width:560px){.method-table,.method-table tbody,.method-table tr,.method-table th,.method-table td{display:block}.method-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.method-table tr{padding:1rem 0;border-bottom:1px solid #a6a7a8}.method-table td{padding:.25rem 0;border:0}.method-table td::before{content:attr(data-label) ": ";font-weight:700}}
