:root{--bg:#07111d;--surface:#0d1c2c;--surface2:#11263a;--line:#24445e;--text:#e9f4fb;--muted:#92aabd;--teal:#47d6c5;--blue:#4f9cf9;--amber:#ffbd55;--danger:#fc776d;--shadow:0 18px 45px #01081166}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(900px 500px at 90% -10%,#154a713d,transparent),var(--bg);color:var(--text);font-family:"Microsoft YaHei UI","Microsoft YaHei",system-ui,sans-serif;line-height:1.55}.topbar{height:66px;position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:34px;padding:0 max(24px,calc((100% - 1240px)/2));background:#07111de8;backdrop-filter:blur(15px);border-bottom:1px solid #1d354c}.brand{display:flex;align-items:center;gap:10px;color:var(--text);font-weight:800;text-decoration:none;letter-spacing:.5px}.brand-mark{display:grid;place-items:center;width:31px;height:31px;border-radius:9px;background:linear-gradient(135deg,var(--teal),var(--blue));color:#062234;font-size:12px}.topbar nav{display:flex;gap:22px;flex:1}.topbar nav a{color:var(--muted);font-size:14px;text-decoration:none}.topbar nav a:hover{color:var(--teal)}.icon-button{border:1px solid var(--line);border-radius:8px;background:transparent;color:var(--text);width:35px;height:35px;font-size:17px;cursor:pointer}main{max-width:1240px;margin:auto;padding:0 24px 52px}.hero{display:flex;justify-content:space-between;gap:34px;padding:68px 0 44px}.eyebrow{color:var(--teal);font-weight:700;letter-spacing:1.5px;font-size:11px;margin:0 0 7px}.hero h1,.section-heading h2,.panel h2{margin:0;letter-spacing:.3px}.hero h1{font-size:46px;line-height:1.18}.hero-copy{max-width:650px;color:var(--muted);font-size:18px;margin:14px 0 0}.vendor-card{width:290px;align-self:center;padding:17px 18px;border:1px solid var(--line);border-radius:12px;background:linear-gradient(140deg,#102a3f,#0a1725);box-shadow:var(--shadow)}label{display:flex;flex-direction:column;gap:7px;font-size:13px;color:var(--muted)}select,input{border:1px solid var(--line);border-radius:8px;background:#071522;color:var(--text);height:42px;padding:0 11px;font:inherit;outline:none}select:focus,input:focus{border-color:var(--teal);box-shadow:0 0 0 3px #47d6c522}.vendor-card small{display:block;color:var(--muted);font-size:12px;margin-top:10px}.section{margin-top:30px}.grid-two{display:grid;grid-template-columns:1.25fr .95fr;gap:22px}.panel{border:1px solid var(--line);border-radius:14px;background:linear-gradient(150deg,#0f2234cc,#091522e8);box-shadow:var(--shadow);padding:24px}.panel-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:20px}.panel h2{font-size:22px}.chip{font-size:11px;color:var(--teal);border:1px solid #2e716e;border-radius:999px;padding:4px 8px;white-space:nowrap}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.hint,.note{color:var(--muted);font-size:12px}.result-card{margin:18px 0 13px;padding:17px;border:1px solid #31536a;border-radius:10px;background:#06121e}.result-title{color:var(--muted);font-size:12px}.result-address{display:flex;align-items:baseline;gap:10px;margin:3px 0 8px}.result-address strong{color:var(--teal);font-size:31px;letter-spacing:1px}.result-address span{color:var(--muted);font-family:ui-monospace,Consolas,monospace}.result-meta{display:flex;flex-wrap:wrap;gap:7px}.result-meta i{font-style:normal;font-size:12px;border-radius:6px;background:#173247;padding:3px 7px;color:#bee2ee}.result-error{color:var(--danger);font-weight:600}.quick-row{display:flex;gap:7px;flex-wrap:wrap}.quick,.tab{border:1px solid var(--line);border-radius:7px;background:#102336;color:var(--text);padding:7px 11px;cursor:pointer;font:inherit;font-size:13px}.quick:hover,.tab:hover,.tab.active{border-color:var(--teal);color:var(--teal);background:#10333a}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;font-size:13px}th,td{padding:8px;border-bottom:1px solid #1c3549;text-align:left;white-space:nowrap}th{color:var(--muted);font-weight:600}.section-heading{max-width:680px;margin:52px 0 21px}.section-heading p:last-child{color:var(--muted);margin-bottom:0}.code-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.code-grid article{position:relative;overflow:hidden;padding:17px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}.code-grid article:before{content:"";position:absolute;inset:auto -18px -25px auto;width:75px;height:75px;border-radius:50%;background:#47d6c514}.code-grid b{color:var(--teal);font:700 18px ui-monospace,Consolas,monospace}.code-grid h3{font-size:15px;margin:8px 0 3px}.code-grid p{font-size:12px;color:var(--muted);margin:0}.tabs{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:14px}.template-content{border-radius:10px;background:#06121e;border:1px solid #183449;padding:18px}.template-content h3{margin:0 0 8px}.template-content p{color:var(--muted);font-size:13px}.template-content code,.example code{display:block;overflow:auto;margin:12px 0;padding:12px;border-radius:7px;background:#020a12;color:#a9ede1;font-family:ui-monospace,Consolas,monospace;white-space:pre;font-size:13px}.template-content ul{color:var(--muted);font-size:13px;padding-left:19px}.frame{padding:13px 0;border-bottom:1px solid #1e3c52}.frame h3{font-size:15px;margin:0 0 9px}.frame p,.example p{color:var(--muted);font-size:13px;margin:9px 0 0}.frame-row{display:flex;overflow:auto;min-width:max-content}.frame-row span{padding:8px 12px;text-align:center;border:1px solid #2a5269;background:#112c3e;font-size:12px}.frame-row span:first-child{border-radius:7px 0 0 7px}.frame-row span:last-child{border-radius:0 7px 7px 0}.frame-row span:nth-child(2){background:#194258}.frame-row span:nth-child(3){background:#1a3649}.frame-row.ascii span:first-child,.frame-row.ascii span:last-child{background:#47351f;color:#ffd082}.example{margin-top:17px;padding:13px;background:#102436;border-radius:9px}.example strong{font-size:13px}.spec-list{margin:0}.spec-list div{padding:13px 0;border-bottom:1px solid #1c3549}.spec-list div:last-child{border:0}.spec-list dt{color:var(--teal);font-size:13px;font-weight:700}.spec-list dd{margin:3px 0 0;color:var(--muted);font-size:13px}.steps{list-style:none;padding:0;margin:0;counter-reset:step}.steps li{position:relative;padding:0 0 17px 42px;counter-increment:step}.steps li:before{content:counter(step);position:absolute;left:0;top:0;display:grid;place-items:center;width:27px;height:27px;background:#173447;border:1px solid #30607a;border-radius:50%;color:var(--teal);font-size:12px;font-weight:bold}.steps li:not(:last-child):after{content:"";position:absolute;left:13px;top:29px;height:22px;border-left:1px solid #315269}.steps b,.steps span{display:block}.steps b{font-size:14px}.steps span{font-size:13px;color:var(--muted);margin-top:2px}.source-strip{display:flex;align-items:center;gap:14px;margin-top:30px;padding:15px 18px;border:1px solid #24495d;border-radius:10px;background:#0d2633;font-size:13px}.source-strip>span:first-child{color:var(--teal);font-weight:700;white-space:nowrap}.source-strip p{margin:0;color:var(--muted);flex:1}.status-dot{white-space:nowrap;color:#8cebc9}.status-dot:before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:#49d88e;margin-right:5px}footer{text-align:center;padding:23px;color:#7790a2;border-top:1px solid #193248;font-size:12px}body.light{--bg:#edf4f8;--surface:#fff;--surface2:#f3f8fb;--line:#c4d6e2;--text:#152536;--muted:#557084;--shadow:0 15px 38px #55708424}body.light .topbar{background:#f7fbfdeb}body.light .vendor-card,body.light .panel{background:linear-gradient(150deg,#fff,#f5f9fc)}body.light select,body.light input,body.light .result-card,body.light .template-content{background:#f8fcff}body.light .quick,body.light .tab{background:#edf5f8}body.light .code-grid article{background:#fff}body.light .example{background:#e9f4fa}@media(max-width:850px){.topbar nav{display:none}.topbar{justify-content:space-between}.hero{display:block;padding-top:45px}.vendor-card{width:100%;margin-top:22px}.grid-two{grid-template-columns:1fr}.code-grid{grid-template-columns:repeat(2,1fr)}.source-strip{align-items:flex-start;flex-direction:column;gap:5px}}@media(max-width:520px){main{padding:0 15px 38px}.hero h1{font-size:36px}.form-grid{grid-template-columns:1fr}.code-grid{grid-template-columns:1fr}.panel{padding:18px}.topbar{padding:0 15px}}