:root{--bg:#f7f8fa;--card:#fff;--ink:#1a1f2c;--muted:#5b657a;--brand:#2b6cb0;--brand2:#f0b429;--line:#e3e7ef;--max:1100px;--radius:12px;--shadow:0 1px 2px rgba(16,24,40,.06),0 8px 24px rgba(16,24,40,.06)}
*{box-sizing:border-box} body{margin:0;font:16px/1.65 system-ui,-apple-system,"Segoe UI",Roboto,Ubuntu,sans-serif;color:var(--ink);background:var(--bg)}
img{max-width:100%;height:auto;display:block} a{color:var(--brand);text-decoration-thickness:1px;text-underline-offset:2px} a:hover{color:#1a4f8a}
.skip-link{position:absolute;left:-9999px;top:auto} .skip-link:focus{left:1rem;top:1rem;z-index:99;background:#fff;padding:.5rem .75rem;border-radius:8px}
.container{width:min(100% - 2rem,var(--max));margin-inline:auto}
.site-header{background:#1f2937;color:#fff;position:sticky;top:0;z-index:40;box-shadow:0 2px 12px rgba(0,0,0,.18)}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.7rem 0}
.brand{display:flex;align-items:baseline;gap:.35rem;color:#fff;text-decoration:none;font-weight:700;letter-spacing:.02em}
.brand b{color:var(--brand2)}.brand-brace{color:var(--brand2)} .brand span{font-weight:500;color:#cbd5e1;font-size:.85rem;margin-left:.5rem}
.menu-toggle{display:none;background:transparent;border:1px solid #4b5563;color:#fff;border-radius:8px;padding:.4rem .55rem}
.site-nav{display:flex;flex-wrap:wrap;gap:.15rem .9rem}
.site-nav a{color:#e5e7eb;text-decoration:none;font-size:.92rem;padding:.25rem 0;border-bottom:2px solid transparent}
.site-nav a[aria-current="page"],.site-nav a:hover{color:#fff;border-bottom-color:var(--brand2)}
.layout{display:grid;grid-template-columns:220px 1fr;gap:1.5rem;padding:1.5rem 0 2.5rem}
.sidebar{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:1rem;height:fit-content;position:sticky;top:4.5rem;box-shadow:var(--shadow)}
.sidebar h2{font-size:.85rem;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin:0 0 .6rem}
.sidebar ul{list-style:none;margin:0;padding:0} .sidebar li{margin:.2rem 0}
.sidebar a{color:var(--ink);text-decoration:none;font-size:.92rem} .sidebar a:hover{color:var(--brand)}
.main{min-width:0}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:1.25rem 1.4rem 1.6rem;box-shadow:var(--shadow)}
.breadcrumbs{font-size:.85rem;color:var(--muted);margin:0 0 1rem} .breadcrumbs a{color:var(--muted)}
h1{font-size:clamp(1.45rem,1.2rem + 1.1vw,2rem);line-height:1.25;margin:.2rem 0 1rem;font-weight:750}
h2{font-size:clamp(1.22rem,1.1rem + .55vw,1.48rem);font-weight:700;margin:1.85rem 0 .75rem;line-height:1.28;letter-spacing:-.01em}
h3{font-size:1.05rem;margin:1.2rem 0 .5rem}
.hero{margin:0 0 1.1rem;border-radius:10px;overflow:hidden;background:#eef2f7}
.hero img{width:100%;aspect-ratio:16/9;object-fit:cover}
.hero figcaption{font-size:.78rem;color:var(--muted);padding:.4rem .2rem 0}
.toc{margin:0 0 1.2rem;border:1px solid var(--line);border-radius:10px;background:#fafbfd}
.toc summary{cursor:pointer;padding:.7rem 1rem;font-weight:600;list-style:none}
.toc summary::-webkit-details-marker{display:none}
.toc[open] summary{border-bottom:1px solid var(--line)}
.toc ol{margin:0;padding:.6rem 1rem 1rem 2rem}
.toc li{margin:.25rem 0}
.article-toc,.egs-toc{margin:1.25rem 0 1.5rem;border:1px solid var(--line);border-radius:10px;background:#fafbfd;padding:0}
.article-toc>summary,.egs-toc>summary{cursor:pointer;padding:.75rem 1rem;font-weight:650;list-style:none}
.article-toc>summary::-webkit-details-marker,.egs-toc>summary::-webkit-details-marker{display:none}
.article-toc[open]>summary,.egs-toc[open]>summary{border-bottom:1px solid var(--line)}
.article-toc>ol,.egs-toc>ol{margin:0;padding:.7rem 1rem 1rem 2rem}
.article-toc li,.egs-toc li{margin:.28rem 0}
.article-toc ul,.egs-toc ul{margin:.2rem 0;padding-left:1.15rem}

.entry p{margin:.65rem 0} .entry ul,.entry ol{padding-left:1.25rem} .entry li{margin:.3rem 0}
.entry pre,.entry .dm-code-snippet,.entry code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.entry pre{background:#0f172a;color:#e2e8f0;padding:1rem 1.1rem;border-radius:10px;overflow:auto;font-size:.9rem;line-height:1.5}
.entry code{background:#eef2ff;padding:.1rem .35rem;border-radius:5px;font-size:.9em}
.entry pre code{background:transparent;padding:0;color:inherit}
.entry table{width:100%;border-collapse:collapse;margin:1rem 0;font-size:.92rem}
.entry th,.entry td{border:1px solid var(--line);padding:.45rem .6rem;text-align:left}
.entry th{background:#f1f5f9}
.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.partner-keep{margin-top:1.5rem} .partner-keep img{max-width:min(100%,420px);border-radius:8px}
.related{margin-top:1.75rem} .related h2{margin-bottom:.8rem}
.related-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:.9rem}
.related a{display:block;background:#fff;border:1px solid var(--line);border-radius:10px;padding:.85rem 1rem;text-decoration:none;color:var(--ink);box-shadow:var(--shadow)}
.related a:hover{border-color:#bfdbfe}
.home-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.25rem}
.home-sec{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:1rem 1.1rem;box-shadow:var(--shadow)}
.home-sec h2{margin-top:0} .home-sec ul{margin:.4rem 0 0;padding-left:1.1rem}
.site-footer{background:#111827;color:#cbd5e1;padding:2rem 0 1.5rem;margin-top:1rem}
.site-footer a{color:#e5e7eb} .footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:1.5rem}
.footer-grid h2{color:#fff;font-size:1rem;margin:0 0 .6rem} .footer-grid ul{list-style:none;margin:0;padding:0} .footer-grid li{margin:.3rem 0}
.footer-bottom{margin-top:1.4rem;padding-top:1rem;border-top:1px solid #374151;display:flex;flex-wrap:wrap;gap:.6rem 1.2rem;font-size:.85rem;color:#9ca3af}
@media (max-width:980px){.layout{grid-template-columns:1fr}.sidebar{position:static}.home-grid{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.menu-toggle{display:inline-flex}.site-nav{display:none;width:100%;flex-direction:column;padding:.4rem 0 .8rem}.site-nav.is-open{display:flex}.topbar{flex-wrap:wrap}.footer-grid{grid-template-columns:1fr}.card{padding:1rem}}
