:root{color-scheme:light dark;--fg:#1b1b2f;--bg:#fff7ef;--muted:#6b6b7a;--accent:#3a6fe6;--border:#e5e0d8;--code-bg:#f1efe9;--sidebar-bg:#edf1fc}@media (prefers-color-scheme:dark){:root{--fg:#ececf0;--bg:#16161f;--muted:#9a9aa8;--border:#2c2c38;--code-bg:#2d2d3d;--sidebar-bg:#1a1e2c}}*{box-sizing:border-box}body{background:var(--bg);color:var(--fg);margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;line-height:1.55}header{border-bottom:1px solid var(--border);align-items:baseline;gap:.75rem;padding:1rem 1.5rem;display:flex}header a{color:var(--fg);font-size:1.1rem;font-weight:700;text-decoration:none}header .tag{color:var(--muted);font-size:.8rem}.layout{align-items:flex-start;display:flex}.sidebar{background:var(--sidebar-bg);border-right:1px solid var(--border);flex-shrink:0;width:300px;height:100vh;padding:1.5rem 1rem;position:sticky;top:0;overflow-y:auto}.sidebar .group{margin-bottom:1.4rem}.sidebar h3{text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin:0 0 .4rem .3rem;font-size:.72rem}.sidebar ul{margin:0;padding:0}.sidebar li{margin-left:1.2rem}.sidebar li a{color:var(--fg);border-radius:6px;padding:.28rem .5rem;font-size:.85rem;text-decoration:none;display:block}.sidebar li a:hover{background:var(--code-bg)}.sidebar li a.active{background:var(--accent);color:#fff;font-weight:600}.section-label{border-top:1px solid var(--border);text-transform:uppercase;letter-spacing:.05em;color:var(--fg);margin:1.8rem 0 .8rem;padding-top:1.2rem;font-size:.72rem;font-weight:700}.pinned-group{border-bottom:1px solid var(--border);margin-bottom:1.2rem;padding-bottom:1rem}.pinned-link{color:var(--fg);border-radius:6px;padding:.4rem .5rem;font-size:.95rem;font-weight:700;text-decoration:none;display:block}.pinned-link:hover{background:var(--code-bg)}.pinned-link.active{background:var(--accent);color:#fff}main{flex:1;min-width:0;max-width:760px;margin:0 auto;padding:2rem 1.5rem 4rem}@media (width<=720px){.layout{flex-direction:column}.sidebar{border-right:none;border-bottom:1px solid var(--border);width:100%;height:auto;position:static}}h1{margin-bottom:.25rem;font-size:1.6rem}h2{color:var(--accent);margin-top:2rem;margin-bottom:.5rem;font-size:1.05rem}h3{margin-top:1.4rem;margin-bottom:.4rem;font-size:.95rem}p,ul,ol{font-size:.95rem}main li{margin-bottom:.5rem}code{background:var(--code-bg);border-radius:4px;padding:.1em .35em;font-size:.85em}pre{background:var(--code-bg);border-radius:8px;padding:.75rem 1rem;font-size:.82rem;overflow-x:auto}pre code{background:0 0;padding:0}a{color:var(--accent)}.meta{color:var(--muted);margin-bottom:1.5rem;font-size:.85rem}.tag-badge{background:var(--code-bg);border:1px solid var(--border);border-radius:999px;margin-right:.3rem;padding:.1rem .6rem;font-size:.75rem;display:inline-block}ul.card-list{margin:0;padding:0;list-style:none}ul.card-list li{border:1px solid var(--border);border-radius:10px;margin-bottom:.7rem;padding:.9rem 1.1rem}ul.card-list a{font-weight:600;text-decoration:none}.diagram{background:var(--code-bg);border:1px solid var(--border);border-radius:12px;margin:1.2rem 0 2rem;padding:1.2rem}.diagram-row{flex-wrap:wrap;justify-content:center;align-items:center;gap:.6rem;display:flex}.diagram-box{background:var(--bg);border:1px solid var(--border);text-align:center;border-radius:8px;padding:.5rem .9rem;font-size:.85rem;font-weight:600;line-height:1.35}.diagram-box small{color:var(--muted);font-size:.75rem;font-weight:400}.diagram-box.centered{width:fit-content;margin:0 auto}.diagram-box.hub{border-color:var(--accent);color:var(--accent)}.diagram-box.small{padding:.4rem .7rem;font-size:.78rem}.diagram-arrow{text-align:center;color:var(--muted);margin:.3rem 0;font-size:.8rem}.diagram-arrow-h{color:var(--muted);font-size:.9rem}.diagram-note{color:var(--muted);text-align:center;margin:.8rem 0 0;font-size:.78rem;font-style:italic}.diagram-label{color:var(--muted);text-align:center;text-transform:uppercase;letter-spacing:.04em;margin:0 0 .7rem;font-size:.75rem}table{border-collapse:collapse;width:100%;margin:.8rem 0;font-size:.82rem}th,td{text-align:left;border:1px solid var(--border);padding:.4rem .6rem}th{background:var(--code-bg);color:var(--muted);font-weight:600}blockquote{border-left:3px solid var(--accent);background:var(--code-bg);border-radius:0 8px 8px 0;margin:.8rem 0;padding:.6rem 1rem;font-size:.88rem}blockquote p{margin:0}
