:root{--bg:#fafafa;--surface:#fff;--subtle:#f4f4f5;--border:#e4e4e7;--text:#09090b;--muted:#71717a;--accent:#059669;--accent-bg:#ecfdf5;--warn:#d97706;--warn-bg:#fffbeb;--danger:#dc2626;--danger-bg:#fef2f2;--shadow:0 8px 30px rgba(9,9,11,.06)}
@media(prefers-color-scheme:dark){:root{--bg:#09090b;--surface:#111113;--subtle:#18181b;--border:#27272a;--text:#fafafa;--muted:#a1a1aa;--accent:#34d399;--accent-bg:rgba(16,185,129,.1);--warn:#fbbf24;--warn-bg:rgba(245,158,11,.1);--danger:#f87171;--danger-bg:rgba(239,68,68,.1);--shadow:0 12px 36px rgba(0,0,0,.35)}}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font:14px/1.65 -apple-system,BlinkMacSystemFont,"Inter","PingFang SC","Microsoft YaHei",system-ui,sans-serif;-webkit-font-smoothing:antialiased}code,pre{font-family:ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace}.shell{max-width:920px;margin:0 auto;padding:28px 20px 72px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:28px}.brand{display:flex;align-items:center;gap:9px;color:var(--muted);text-decoration:none}.brand img{width:30px;height:30px;padding:5px;border:1px solid var(--border);border-radius:9px;background:var(--surface)}.brand strong{color:var(--text)}.nav{display:flex;gap:4px;flex-wrap:wrap}.nav a{color:var(--muted);text-decoration:none;padding:7px 10px;border-radius:8px}.nav a:hover,.nav a.active{color:var(--text);background:var(--subtle)}.crumb{display:flex;gap:7px;color:var(--muted);font-size:12px;margin-bottom:24px}.crumb a{color:inherit;text-decoration:none}.hero{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:start;margin-bottom:24px}.hero-icon{width:58px;height:58px;display:grid;place-items:center;border-radius:15px;color:#fff;background:var(--client,#18181b);box-shadow:var(--shadow)}.hero-icon svg{width:30px;height:30px}.eyebrow{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);margin-bottom:5px}.hero h1{font-size:36px;line-height:1.15;letter-spacing:-.025em;margin:0 0 10px}.hero p{margin:0;color:var(--muted);font-size:15px;max-width:720px}.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:22px 0 26px}.fact{padding:13px 14px;border:1px solid var(--border);border-radius:12px;background:var(--surface)}.fact span{display:block;color:var(--muted);font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;margin-bottom:4px}.fact code{font-size:12px;word-break:break-all}.client-tabs{display:flex;gap:6px;overflow-x:auto;padding:6px;border:1px solid var(--border);border-radius:12px;background:var(--surface);margin-bottom:26px;scrollbar-width:thin}.client-tabs a{white-space:nowrap;color:var(--muted);text-decoration:none;font-size:12px;font-weight:700;padding:8px 10px;border-radius:8px}.client-tabs a:hover,.client-tabs a.active{color:var(--text);background:var(--subtle)}.client-tabs a.active::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--accent);margin-right:6px;vertical-align:1px}.summary{display:flex;gap:12px;padding:15px 16px;border:1px solid color-mix(in srgb,var(--accent) 55%,var(--border));border-radius:12px;background:var(--accent-bg);margin-bottom:24px}.summary svg{flex:0 0 auto;margin-top:2px;color:var(--accent)}.summary strong{display:block;margin-bottom:2px}.summary p{margin:0;color:var(--muted)}.step{border:1px solid var(--border);border-radius:14px;background:var(--surface);box-shadow:0 1px 2px rgba(0,0,0,.02);margin:14px 0;padding:20px}.step-head{display:flex;gap:12px;align-items:center;margin-bottom:12px}.step-num{width:28px;height:28px;display:grid;place-items:center;border-radius:9px;background:var(--accent-bg);color:var(--accent);font-weight:800}.step h2{font-size:18px;line-height:1.3;margin:0}.step h3{font-size:14px;margin:18px 0 8px}.step p{color:var(--muted);margin:8px 0}.step ul{color:var(--muted);padding-left:20px}.step li{margin:5px 0}.step code:not(pre code){padding:1px 5px;border:1px solid var(--border);border-radius:5px;background:var(--subtle);font-size:12px;color:var(--text)}.codeblock{position:relative;margin:12px 0;border:1px solid var(--border);border-radius:11px;overflow:hidden;background:#0d1117;color:#e6edf3}.codebar{display:flex;align-items:center;justify-content:space-between;padding:8px 10px;border-bottom:1px solid #30363d;color:#8b949e;font-size:11px}.copy{border:1px solid #3d444d;background:#161b22;color:#e6edf3;border-radius:7px;padding:5px 9px;font:inherit;cursor:pointer}.copy:hover{border-color:#8b949e}.copy.done{border-color:#2ea043;color:#3fb950}.codeblock pre{margin:0;padding:14px 16px;overflow:auto;font-size:12px;line-height:1.6;white-space:pre}.callout{padding:13px 14px;border-radius:10px;border:1px solid var(--border);margin:12px 0;color:var(--muted)}.callout strong{color:var(--text)}.callout.warn{background:var(--warn-bg);border-color:color-mix(in srgb,var(--warn) 45%,var(--border))}.callout.danger{background:var(--danger-bg);border-color:color-mix(in srgb,var(--danger) 45%,var(--border))}.model-row{display:grid;grid-template-columns:150px 1fr;gap:10px;padding:9px 0;border-bottom:1px solid var(--border)}.model-row:last-child{border-bottom:0}.model-row code{font-weight:700}.model-row span{color:var(--muted)}.source{margin-top:24px;padding:14px 16px;border-left:3px solid var(--accent);background:var(--accent-bg);color:var(--muted);font-size:12px}.source a{color:var(--accent)}.footer{margin-top:40px;padding-top:22px;border-top:1px solid var(--border);display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;color:var(--muted);font-size:12px}.footer a{color:inherit}.plain-table{width:100%;border-collapse:collapse;margin:12px 0;font-size:13px}.plain-table th,.plain-table td{text-align:left;padding:10px 11px;border-bottom:1px solid var(--border);vertical-align:top}.plain-table th{background:var(--subtle);color:var(--muted);font-size:11px}.plain-table code{word-break:break-all}
@media(max-width:720px){.shell{padding:20px 14px 52px}.topbar{align-items:flex-start;flex-direction:column}.hero{grid-template-columns:1fr}.hero h1{font-size:28px}.facts{grid-template-columns:1fr}.step{padding:17px 15px}.model-row{grid-template-columns:1fr}.nav{font-size:12px}.plain-table{display:block;overflow-x:auto}.codeblock pre{white-space:pre-wrap;word-break:break-word}}
@media(prefers-reduced-motion:no-preference){.step,.summary{animation:rise .35s ease both}.step:nth-of-type(2){animation-delay:.04s}.step:nth-of-type(3){animation-delay:.08s}@keyframes rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}}