:root{--bg:#fbfaf7;--fg:#1f2a33;--muted:#5b6b78;--accent:#2f6f8f;--line:#d9dfe3;--card:#eef3f6;color-scheme:light dark}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#14191d;--fg:#e3e8ec;--muted:#9aa8b3;--accent:#7fb6d1;--line:#2b343b;--card:#1c2328}}
:root[data-theme=dark]{--bg:#14191d;--fg:#e3e8ec;--muted:#9aa8b3;--accent:#7fb6d1;--line:#2b343b;--card:#1c2328}
*,*::before,*::after{box-sizing:border-box}
html{scrollbar-gutter:stable}
body{margin:0;background:var(--bg);color:var(--fg);font:1.0625rem/1.65 system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif}
h1,h2,h3,.sn-brand{font-family:system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;line-height:1.2;text-wrap:balance}
h1{font-size:clamp(1.8rem,4vw,2.6rem);margin:.5rem 0 1rem}
a{color:var(--accent);text-underline-offset:.18em}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.sn-skip{position:absolute;left:-999px}
.sn-skip:focus{left:1rem;top:1rem;background:var(--card);padding:.5rem 1rem}
.sn-brand{font-size:1.25rem;font-weight:700;color:var(--fg);text-decoration:none}
.sn-tag{color:var(--muted);margin:.25rem 0 0;font-size:.95rem}
nav ul{list-style:none;display:flex;flex-wrap:wrap;gap:.25rem 1.1rem;margin:.5rem 0 0;padding:0}
nav a{color:var(--fg);text-decoration:none;padding:.4rem 0;display:inline-block}
nav a[aria-current]{color:var(--accent);font-weight:600}
main{padding:1.5rem 0 3rem}
.sn-meta{color:var(--muted);font-size:.9rem}
.sn-list{list-style:none;padding:0;margin:0}
.sn-list li{padding:1rem 0;border-bottom:1px solid var(--line)}
.sn-list h2,.sn-list h3{font-size:1.2rem;margin:0 0 .25rem}
.sn-thumb{float:right;width:7.5rem;height:auto;margin:0 0 .5rem 1rem;border-radius:4px}
.sn-fig{margin:1.5rem 0}
.sn-fig img{max-width:100%;height:auto;display:block;border-radius:4px;background:var(--card)}
.sn-fig figcaption{color:var(--muted);font-size:.9rem;margin-top:.4rem}
pre{background:var(--card);padding:1rem;overflow:auto;border-radius:6px;font:.9rem/1.5 ui-monospace, "SFMono-Regular", Menlo, Consolas, "Liberation Mono", monospace;position:relative}
code{font-family:ui-monospace, "SFMono-Regular", Menlo, Consolas, "Liberation Mono", monospace;font-size:.92em}
.sn-tags a{margin-right:.6rem}
.sn-pager{display:flex;justify-content:space-between;margin-top:2rem}
.sn-foot{border-top:1px solid var(--line);color:var(--muted);font-size:.9rem;padding:1.5rem 0 2.5rem}
table{border-collapse:collapse;margin:1rem 0}
th,td{border:1px solid var(--line);padding:.35rem .7rem;text-align:left}
.sn-tool{background:var(--card);padding:1rem;border-radius:6px;margin:1.5rem 0}
.sn-tool label{display:inline-block;margin:.25rem 1rem .25rem 0}
input{font:inherit;color:inherit;background:var(--bg);border:1px solid var(--line);padding:.3rem .5rem;border-radius:4px}
button{font:inherit;color:var(--fg);background:var(--card);border:1px solid var(--line);border-radius:4px;padding:.25rem .7rem;cursor:pointer}
.sn-copy{position:absolute;top:.4rem;right:.4rem;font-size:.8rem}
.sn-downloads li{margin:.4rem 0}
.sn-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(14rem,1fr));gap:1rem;list-style:none;padding:0}
.sn-gallery img{width:100%;height:auto;display:block;border-radius:4px}
[hidden]{display:none!important}
.sn-wrap{max-width:46rem;margin:0 auto;padding:0 1.25rem}
.sn-head{border-bottom:1px solid var(--line);padding:1.25rem 0}
.sn-head .sn-wrap{display:flex;flex-wrap:wrap;gap:.75rem 1.5rem;align-items:baseline;justify-content:space-between}