@import url(./fonts/fonts.css);
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#fff;color:#1D1D1F;font:17px/1.6 'Geist',-apple-system,BlinkMacSystemFont,'SF Pro Text',ui-sans-serif,sans-serif;-webkit-font-smoothing:antialiased}
a{color:#0066CC}a:hover{color:#004C99}
header.top{position:sticky;top:0;background:rgba(255,255,255,.8);-webkit-backdrop-filter:blur(20px) saturate(180%);backdrop-filter:blur(20px) saturate(180%);box-shadow:0 1px 0 rgba(0,0,0,.06)}
header.top div{max-width:760px;margin:0 auto;padding:0 22px;height:52px;display:flex;align-items:center;justify-content:space-between}
header.top a.brand{display:flex;align-items:center;gap:8px;font-weight:600;font-size:17px;letter-spacing:-.02em;color:#1D1D1F;text-decoration:none}
header.top nav a{font-size:14px;color:#1D1D1F;opacity:.75;text-decoration:none;margin-left:20px}
header.top nav a:hover{opacity:1}
main{max-width:760px;margin:0 auto;padding:64px 22px 96px}
h1{font-size:44px;line-height:1.08;letter-spacing:-.04em;margin:0 0 8px;font-weight:700;text-wrap:balance}
h2{font-size:24px;letter-spacing:-.02em;margin:44px 0 8px;font-weight:600}
p,li{color:#3A3A3C;text-wrap:pretty}
ul{padding-left:22px}li{margin:6px 0}
.meta{color:#6E6E73;font-size:15px;margin:0 0 32px}
.note{background:#F5F5F7;border-radius:16px;padding:16px 20px;margin:24px 0;font-size:15px}
table{width:100%;border-collapse:collapse;margin:16px 0;font-size:15px}
th,td{text-align:left;padding:10px 12px;border-bottom:1px solid #E5E5EA;vertical-align:top}
th{color:#6E6E73;font-weight:500;font-size:13px}
footer{background:#F5F5F7;font-size:13px;color:#6E6E73}
footer div{max-width:760px;margin:0 auto;padding:24px 22px}
footer a{color:inherit;margin-right:18px}
form.dr{display:flex;flex-wrap:wrap;gap:10px;margin:20px 0 8px}
form.dr input{flex:1 1 240px;min-width:0;height:48px;padding:0 18px;font:inherit;font-size:16px;border-radius:980px;border:1px solid #D2D2D7}
form.dr input:focus-visible{outline:2px solid #0071E3;outline-offset:2px}
form.dr button{height:48px;padding:0 24px;border:0;border-radius:980px;background:#0071E3;color:#fff;font:inherit;font-size:16px;font-weight:500;cursor:pointer}
form.dr button[disabled]{opacity:.6;cursor:default}
.msg{margin:10px 0 0;font-size:15px;min-height:1.4em}
.msg.ok{color:#0F5A2A}.msg.err{color:#C4271C}
@media (max-width:600px){h1{font-size:34px}}
header.top nav{display:flex;align-items:center}
header.top nav [data-theme-slot]{margin-left:14px}

/* dark mode */
html[data-theme=dark] body{background:#0E0E10;color:#F5F5F7}
html[data-theme=dark] a{color:#4DA3FF}html[data-theme=dark] a:hover{color:#7DBBFF}
html[data-theme=dark] svg rect[fill="#1D1D1F"]{fill:#2C2C2E}
html[data-theme=dark] header.top{background:rgba(22,22,24,.82);box-shadow:0 1px 0 rgba(255,255,255,.08)}
html[data-theme=dark] header.top a.brand,html[data-theme=dark] header.top nav a{color:#F5F5F7}
html[data-theme=dark] p,html[data-theme=dark] li{color:#C7C7CC}
html[data-theme=dark] .meta,html[data-theme=dark] th{color:#98989D}
html[data-theme=dark] .note,html[data-theme=dark] footer{background:#1C1C1E}
html[data-theme=dark] footer{color:#98989D}
html[data-theme=dark] th,html[data-theme=dark] td{border-color:#2C2C2E}
html[data-theme=dark] code{color:#F5F5F7}
html[data-theme=dark] pre{background:#1C1C1E}
html[data-theme=dark] form.dr input{background:#141416;border-color:#3A3A3C;color:#F5F5F7}
html[data-theme=dark] form.dr button{background:#0A84FF}
html[data-theme=dark] .msg.ok{color:#7EE2A0}html[data-theme=dark] .msg.err{color:#FF6B5E}
html[data-theme=dark] p code,html[data-theme=dark] li code,html[data-theme=dark] td code{background:#2C2C2E}