:root{--ink:#172824;--muted:#697871;--line:#e6ece9;--accent:#087f6c;--pale:#eef8f3;--bg:#fff}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;color:var(--ink);background:var(--bg);font:15px/1.8 Arial,"Microsoft YaHei",sans-serif}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #5cb8a6;outline-offset:4px}::selection{background:#cceee2}.skip{position:fixed;top:-100px;padding:10px 20px;background:var(--ink);color:white;z-index:100}.skip:focus{top:12px}.topbar{height:72px;position:sticky;top:0;z-index:10;background:rgba(255,255,255,.96);border-bottom:1px solid var(--line);backdrop-filter:blur(12px)}.top-inner{max-width:1180px;margin:auto;padding:0 32px;height:100%;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:13px}.brand-icon{display:grid;place-content:center;width:34px;height:34px;background:var(--accent);color:white;border-radius:10px;font-weight:bold;position:relative;padding-right:9px;font-size:17px;line-height:1}.brand-icon span{position:absolute;right:5px;top:7px;font-size:23px;color:#c5f4ce}.brand strong{font-size:18px;letter-spacing:-.5px}.divider{color:#d1d9d4;padding:0 4px}.brand-note,.source{font-size:13px;color:var(--muted)}.source:hover{color:var(--accent)}.source span{margin-left:7px}.shell{max-width:1180px;padding:0 32px;margin:auto;display:grid;grid-template-columns:200px minmax(0,1fr);gap:65px}.sidebar{position:sticky;top:112px;align-self:start;padding-top:4px}.side-label{font-size:11px;color:#8b9690;letter-spacing:1px;padding:0 13px;margin-bottom:17px}nav a{display:flex;gap:14px;align-items:center;font-size:13px;padding:11px 13px;margin:5px 0;border-radius:7px;border-left:2px solid transparent}nav a span{font-size:11px;color:#8b9690;width:18px}nav a:hover{background:#f7faf8}nav a.active{background:var(--pale);color:var(--accent);border-left-color:var(--accent);font-weight:bold}nav a.active span{color:var(--accent)}.side-foot{border-top:1px solid var(--line);margin-top:36px;padding:22px 13px;color:var(--muted);font-size:11px}.status-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#17ae8d;margin-right:7px;box-shadow:0 0 0 3px #e6f6ee}.side-foot p{margin:6px 0 17px;color:#91a096}.side-foot a{color:var(--accent)}main{min-width:0;padding-top:53px;max-width:840px}.eyebrow{font-size:12px;color:var(--accent);letter-spacing:2px;font-weight:bold}h1{font-size:44px;font-weight:700;letter-spacing:-2px;line-height:1.25;margin:16px 0 20px}.lead{font-size:15px;line-height:1.9;color:var(--muted);margin:0}.badges{display:flex;flex-wrap:wrap;gap:9px;margin-top:22px}.badges span{font-size:11px;border:1px solid var(--line);padding:3px 10px;border-radius:5px;color:#56685f}.journey{display:flex;align-items:center;gap:24px;padding:27px 0 34px;margin-top:21px;border-bottom:1px solid var(--line)}.journey a{display:flex;align-items:center;gap:10px;font-size:12px}.journey b{color:var(--accent);font-size:11px;letter-spacing:1px}.journey i{font-style:normal;color:#b4c4bc;font-size:15px}.step{padding:37px 0 40px;border-bottom:1px solid var(--line);scroll-margin-top:0}.step-title{display:flex;gap:14px;align-items:flex-start;margin-bottom:22px}.step-num{display:grid;place-items:center;flex:0 0 29px;height:29px;border-radius:7px;background:var(--pale);color:var(--accent);font-size:11px;line-height:1;margin-top:4px}.step h2{font-size:23px;line-height:1.5;letter-spacing:-.7px;margin:0}.step-title p{color:var(--muted);font-size:13px;margin:6px 0 0}.code-card{background:#142d27;color:#f0f9f4;border-radius:12px;overflow:hidden;box-shadow:0 9px 24px #1335290a}.code-head{padding:15px 22px 10px;display:flex;justify-content:space-between;align-items:center;font-size:10px;color:#95b4a6;letter-spacing:1px}.code-head small{color:#a8d6b8;background:#29483c;padding:3px 6px;margin-left:7px;border-radius:4px;font-size:10px;letter-spacing:0}.code-head button{border:1px solid #3b5a4e;color:#edf9f2;border-radius:6px;padding:5px 10px;background:#ffffff08;font-size:11px;letter-spacing:0}.code-head button:hover{background:#355244}.code-head button span{margin-left:9px}pre{margin:0;padding:15px 22px 22px;white-space:pre-wrap;overflow-wrap:anywhere;font-size:13px}code{font-family:Consolas,Arial,"Microsoft YaHei",monospace;overflow-wrap:anywhere}.code-foot{border-top:1px solid #ffffff12;font-size:11px;color:#9bb6aa;padding:11px 22px}.note{font-size:12px;color:var(--muted);margin:16px 0}.note strong{font-weight:500;color:#314b40}.note code,.step-title p code{background:#f1f5f3;padding:2px 5px;border-radius:3px;color:#375e4f}.alternatives{margin-top:23px}.download{display:flex;align-items:center;gap:14px;border:1px solid var(--line);border-radius:9px;padding:16px 19px}.download:hover{border-color:#9dc8b7;background:#fbfefc}.download-icon{width:31px;height:31px;display:grid;place-items:center;background:var(--pale);color:var(--accent);border-radius:8px;font-size:19px}.download div{flex:1}.download strong{font-size:13px;display:block;font-weight:600}.download div span{display:block;color:var(--muted);font-size:11px;margin-top:2px}.download>span:last-child{color:var(--accent)}details{border-bottom:1px solid var(--line)}summary{cursor:pointer;list-style:none;padding:17px 0;color:#4f6258;font-size:13px;display:flex;align-items:center;justify-content:space-between;gap:15px}summary::-webkit-details-marker{display:none}summary::after{content:'+';color:#8c9c93;font-size:19px;line-height:1}details[open]>summary::after{content:'−'}details>p{font-size:13px;color:var(--muted);margin:0 0 18px}details .small-code{margin:0 0 18px}.alternatives details{border-bottom:0}.small-code{background:#f5f8f6;border:1px solid var(--line);border-radius:8px;padding:15px 18px;display:flex;align-items:center;justify-content:space-between;gap:18px}.small-code code{font-size:13px;min-width:0}.small-code button{flex-shrink:0;font-size:11px;border:1px solid #dbe5df;border-radius:5px;background:white;color:var(--accent);padding:4px 11px}.small-code button:hover{background:var(--pale)}.login-flow{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:23px 0}.login-flow div{display:flex;align-items:center;gap:9px}.login-flow span{border:1px solid #dce8e1;border-radius:50%;font-size:10px;width:21px;height:21px;display:grid;place-items:center;color:var(--accent);flex-shrink:0}.login-flow p{margin:0;font-size:12px;color:#5e7167}.tip{display:flex;gap:13px;align-items:flex-start;background:#f1f8f3;padding:15px 18px;border-radius:8px}.tip>span{color:var(--accent)}.tip p{font-size:12px;color:#61756a;margin:0}.tip strong{font-weight:500;color:#335746}.example{margin:22px 0;border:1px solid var(--line);border-radius:10px;padding:20px 23px;background:#fcfdfc}.example-title{display:flex;align-items:center;font-size:11px;color:#7b8d80}.example-tag{margin-left:auto;font-size:10px;background:#eff3f0;padding:1px 7px;border-radius:4px}.example p{font-size:16px;line-height:1.9;margin:17px 0 14px;letter-spacing:.1px}.example button{border:0;background:none;padding:0;color:var(--accent);font-size:12px}.example button span{margin-left:8px}.shortcuts{display:flex;gap:30px;border-top:1px dashed var(--line);padding-top:17px;margin-top:21px}.shortcuts div{display:flex;flex-direction:column;gap:3px}.shortcuts code{font-size:12px;color:#486757}.shortcuts span{font-size:11px;color:#89958e}.faq{border-bottom:0}.faq details:last-child{border-bottom:0}footer{padding:29px 0 35px;border-top:1px solid var(--line);color:#89968e;font-size:11px}footer strong{font-size:13px;color:#3e584c}footer>span{margin-left:13px}footer p{line-height:1.9;margin:12px 0 0;font-size:10px}footer a{color:var(--accent)}.toast{position:fixed;bottom:26px;left:50%;transform:translate(-50%,15px);padding:10px 20px;background:#183b2d;color:white;border-radius:8px;opacity:0;pointer-events:none;font-size:13px;transition:opacity .15s,transform .15s;z-index:30}.toast.visible{opacity:1;transform:translate(-50%,0)}@media(min-width:1500px){.shell,.top-inner{max-width:1240px}.shell{gap:86px}}@media(max-width:1000px){.shell{grid-template-columns:170px minmax(0,1fr);gap:32px}.journey{gap:17px}h1{font-size:39px}.login-flow{gap:10px}.login-flow div{align-items:flex-start}}@media(max-width:760px){.topbar{height:62px}.top-inner{padding:0 22px}.brand{gap:9px}.brand-note,.divider{display:none}.source{font-size:11px}.shell{display:block;padding:0 22px}.sidebar{position:sticky;top:62px;background:white;z-index:9;padding:5px 0;border-bottom:1px solid var(--line);margin:0 -22px}.side-label,.side-foot{display:none}nav{display:flex;justify-content:space-around;padding:0 8px}nav a{font-size:11px;padding:9px 8px;gap:0;margin:0;border-left:0;border-radius:5px;white-space:nowrap}nav a span{display:none}main{padding-top:32px}h1{font-size:35px;letter-spacing:-1.6px;margin:14px 0 17px}.lead{font-size:13px}.desktop{display:none}.badges{gap:6px}.badges span{font-size:10px;padding:3px 7px}.journey{gap:14px;justify-content:space-between;padding:23px 0;margin-top:14px}.journey a{gap:7px;font-size:11px}.journey i{font-size:12px}.step{padding:28px 0 30px;scroll-margin-top:0}.step h2{font-size:20px;letter-spacing:-.5px}.step-title{gap:10px}.step-title p{font-size:12px}.step-num{flex-basis:25px;height:25px}.code-head{padding:13px 16px 8px}.code-head small{display:none}pre{padding:14px 16px 20px;font-size:12px}.code-foot{font-size:10px;padding:10px 16px}.login-flow{grid-template-columns:1fr;gap:12px;margin:19px 0}.login-flow p{font-size:12px}.small-code{padding:13px 14px;gap:12px}.small-code code{font-size:12px}.example{padding:17px}.example p{font-size:14px}.shortcuts{gap:20px;flex-wrap:wrap}.note{font-size:11px}footer>span{font-size:10px}.toast{max-width:90%;width:max-content;text-align:center}html{scroll-padding-top:120px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.toast{transition:none}}
