:root{--bg:#f6f7f9;--paper:#fff;--ink:#142135;--muted:#607087;--line:#dce2e8;--orange:#ef5a29;--teal:#16877c;--navy:#132b46;--soft:#edf3f5;--warn:#fff4e8}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.75 "Microsoft YaHei","PingFang SC","Segoe UI",sans-serif}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}button,input{font:inherit}.site-header{height:68px;padding:0 max(24px,calc((100vw - 1240px)/2));display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);background:rgba(255,255,255,.97);position:sticky;top:0;z-index:20}.brand{display:flex;align-items:center;gap:9px;font-size:17px;font-weight:700}.brand-mark{display:grid;place-items:center;width:42px;height:32px;background:var(--navy);color:#fff;font-weight:800}.site-header nav{display:flex;align-items:center;gap:26px;font-size:13px;color:#43536a}.site-header nav a:hover,.site-header nav a[aria-current=page]{color:var(--orange)}.login-link{padding:8px 14px;border:1px solid var(--line);background:#fff}.hub-intro{max-width:1240px;margin:0 auto;padding:52px 24px 42px;display:grid;grid-template-columns:minmax(0,.8fr) minmax(520px,1.2fr);gap:54px;align-items:center}.eyebrow,.section-kicker{margin:0 0 12px;color:var(--teal);font-size:11px;font-weight:800;letter-spacing:0}.hub-intro h1{font-size:46px;line-height:1.2;margin:0 0 22px;letter-spacing:0}.lead{font-size:18px;color:var(--muted);max-width:580px}.intro-actions{display:flex;gap:12px;margin-top:28px}.intro-actions a{display:inline-flex;align-items:center;justify-content:center;padding:11px 18px;border:1px solid var(--line);background:#fff;font-weight:700}.intro-actions .primary-action{border-color:var(--orange);background:var(--orange);color:#fff}.hub-intro figure,.article-screen{margin:0}.hub-intro figure{border:1px solid var(--line);background:#fff;padding:9px}.hub-intro figcaption,.article-screen figcaption{padding:9px 4px 2px;color:var(--muted);font-size:12px}.quick-start{background:var(--navy);color:#fff;padding:46px max(24px,calc((100vw - 1240px)/2))}.quick-start>div{display:flex;align-items:end;justify-content:space-between}.quick-start h2,.finder h2,.real-ui h2,.related h2{margin:0;font-size:27px;letter-spacing:0}.quick-start ol{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;margin:28px 0 0;padding:0;background:#38506a;list-style:none}.quick-start li{padding:24px;background:var(--navy);min-height:180px}.quick-start li>span{color:#62c8bd;font:700 12px Consolas,monospace}.quick-start strong{display:block;margin:22px 0 8px;font-size:16px}.quick-start li p{margin:0;color:#bdcad7;font-size:13px}.finder{max-width:1240px;margin:0 auto;padding:58px 24px}.finder-heading{display:flex;align-items:end;justify-content:space-between;gap:28px}.search-box{width:min(480px,45vw);display:flex;align-items:center;border:1px solid #bdc8d4;background:#fff}.search-box span{padding:0 13px;color:var(--teal);font-size:12px;font-weight:800}.search-box input{width:100%;border:0;padding:12px 14px 12px 0;outline:0;color:var(--ink)}.filters{display:flex;gap:8px;flex-wrap:wrap;margin:28px 0 12px}.filter-button{border:1px solid var(--line);background:#fff;padding:8px 12px;color:#46566c;cursor:pointer}.filter-button span{color:#8794a5;margin-left:4px}.filter-button.active{background:var(--navy);border-color:var(--navy);color:#fff}.result-count{margin:12px 0 18px;color:var(--muted);font-size:12px}.tutorial-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.tutorial-card{display:grid;grid-template-columns:52px 1fr 34px;gap:14px;align-items:start;background:#fff;border:1px solid var(--line);padding:20px;min-height:194px}.tutorial-card:hover{border-color:#9bacba}.tutorial-number{font:700 12px Consolas,monospace;color:var(--orange);padding-top:5px}.card-meta{display:flex;gap:8px}.card-meta span{font-size:10px;font-weight:700;color:var(--teal);background:#e8f4f2;padding:3px 7px}.tutorial-card h2{font-size:17px;line-height:1.5;margin:10px 0 6px;letter-spacing:0}.tutorial-card h2 a:hover{color:var(--orange)}.tutorial-card p{margin:0;color:var(--muted);font-size:13px}.card-target{margin-top:14px;display:flex;align-items:center;gap:9px;color:#69788d;font-size:11px}.card-target code,.article-facts code,code{font:12px Consolas,"Microsoft YaHei",monospace;background:#eef2f5;padding:3px 6px;color:#245a72;overflow-wrap:anywhere}.card-arrow{align-self:center;color:#8996a7;font-size:20px}.tutorial-card:hover .card-arrow{color:var(--orange)}.empty-result{padding:40px;text-align:center;border:1px dashed #b9c4ce;background:#fff}.empty-result p{color:var(--muted)}.real-ui{max-width:1240px;margin:0 auto;padding:0 24px 70px}.real-ui>div:first-child{max-width:700px;margin-bottom:25px}.real-ui>div:first-child>p:last-child{color:var(--muted)}.screen-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.screen-strip figure{margin:0;border:1px solid var(--line);background:#fff;padding:7px}.screen-strip img{aspect-ratio:16/10;object-fit:cover;object-position:top}.screen-strip figcaption{padding:9px 4px 3px;font-size:12px;color:var(--muted)}.site-footer{padding:30px max(24px,calc((100vw - 1240px)/2));border-top:1px solid var(--line);background:#fff;display:flex;justify-content:space-between;gap:20px}.site-footer strong{display:block}.site-footer span{display:block;color:var(--muted);font-size:12px}.site-footer>div:last-child{display:flex;gap:20px;font-size:12px;color:#506078}.article-shell{max-width:1240px;margin:0 auto;padding:30px 24px 70px}.breadcrumbs{display:flex;gap:9px;align-items:center;color:#758398;font-size:12px;white-space:nowrap;overflow:hidden}.breadcrumbs a:hover{color:var(--orange)}.article-header{padding:44px 0 34px;border-bottom:1px solid var(--line)}.article-meta{display:flex;gap:10px;margin-bottom:15px}.article-meta span{padding:4px 8px;background:#e8f4f2;color:var(--teal);font-size:10px;font-weight:700}.article-header h1{max-width:900px;margin:0 0 16px;font-size:38px;line-height:1.28;letter-spacing:0}.article-header>p{max-width:820px;margin:0;color:var(--muted);font-size:17px}.article-facts{display:grid;grid-template-columns:1fr 1fr 1.5fr;margin-top:30px;border:1px solid var(--line);background:#fff}.article-facts>div{padding:15px 18px;border-right:1px solid var(--line)}.article-facts>div:last-child{border-right:0}.article-facts small{display:block;color:#7d8999;font-size:10px}.article-facts strong,.article-facts code{display:block;margin-top:6px}.article-layout{display:grid;grid-template-columns:minmax(0,830px) 280px;gap:58px;align-items:start;margin-top:42px}.article-content section{margin-bottom:48px}.article-content h2{font-size:24px;margin:0 0 18px;letter-spacing:0}.article-content h3{font-size:16px;margin:0 0 5px}.article-content p{color:#45566c}.check-list{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0;padding:0;list-style:none}.check-list li{padding:14px 16px 14px 42px;border:1px solid var(--line);background:#fff;position:relative}.check-list li:before{content:"✓";position:absolute;left:16px;color:var(--teal);font-weight:800}.steps{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}.steps li{display:grid;grid-template-columns:46px 1fr;gap:14px;padding:20px 0;border-bottom:1px solid var(--line)}.steps li>span{display:grid;place-items:center;width:34px;height:34px;background:var(--navy);color:#fff;font:700 12px Consolas,monospace}.steps p{margin:0}.article-screen{margin:4px 0 48px;border:1px solid var(--line);padding:8px;background:#fff}.callout{border-left:4px solid var(--orange);background:var(--warn);padding:17px 19px;margin-bottom:20px}.callout p{margin:5px 0 0}.article-content ul{padding-left:21px;color:#45566c}.article-content li{margin:7px 0}.diagnosis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.diagnosis>div{border-top:3px solid var(--teal);background:#fff;padding:16px;border-left:1px solid var(--line);border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.diagnosis p{font-size:12px;margin:7px 0 0}.trouble-note{padding:15px 17px;background:#edf3f5}.faq details{border-top:1px solid var(--line);padding:15px 0}.faq details:last-child{border-bottom:1px solid var(--line)}.faq summary{font-weight:700;cursor:pointer}.faq p{margin:8px 0 0}.article-aside{position:sticky;top:94px}.toc,.aside-action{border:1px solid var(--line);background:#fff;padding:20px}.toc strong{display:block;margin-bottom:11px}.toc a{display:block;padding:7px 0;color:#637288;font-size:13px}.toc a:hover{color:var(--orange)}.aside-action{margin-top:14px;background:var(--navy);color:#fff}.aside-action>span{font-size:10px;color:#70d4c8}.aside-action strong{display:block;margin-top:10px}.aside-action p{color:#bcc9d5;font-size:12px}.aside-action a{display:inline-block;margin-top:5px;padding:8px 12px;background:var(--orange);font-size:12px;font-weight:700}.related{margin-top:55px;padding-top:40px;border-top:1px solid var(--line)}.related-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:22px}.related-grid a{display:flex;flex-direction:column;min-height:170px;padding:18px;border:1px solid var(--line);background:#fff}.related-grid span{font-size:10px;color:var(--teal)}.related-grid strong{margin:12px 0;line-height:1.55}.related-grid small{margin-top:auto;color:var(--orange)}[hidden]{display:none!important}@media(max-width:920px){.site-header nav a:not(.login-link):not(:first-child){display:none}.hub-intro{grid-template-columns:1fr;padding-top:35px}.hub-intro h1{font-size:38px}.quick-start ol{grid-template-columns:1fr 1fr}.tutorial-grid{grid-template-columns:1fr}.screen-strip{grid-template-columns:1fr}.article-layout{grid-template-columns:1fr}.article-aside{position:static;display:grid;grid-template-columns:1fr 1fr;gap:12px}.aside-action{margin:0}.related-grid{grid-template-columns:1fr 1fr}}@media(max-width:620px){.site-header{padding:0 16px}.site-header nav{gap:12px}.hub-intro{padding:30px 16px;gap:28px}.hub-intro h1{font-size:32px}.lead{font-size:16px}.quick-start{padding:34px 16px}.quick-start ol{grid-template-columns:1fr}.quick-start li{min-height:0}.finder{padding:42px 16px}.finder-heading{align-items:stretch;flex-direction:column}.search-box{width:100%}.tutorial-card{grid-template-columns:38px 1fr;padding:16px}.card-arrow{display:none}.screen-strip{grid-template-columns:1fr}.site-footer{padding:25px 16px;flex-direction:column}.article-shell{padding:22px 16px 50px}.article-header{padding:32px 0 25px}.article-header h1{font-size:29px}.article-facts{grid-template-columns:1fr}.article-facts>div{border-right:0;border-bottom:1px solid var(--line)}.article-facts>div:last-child{border-bottom:0}.article-layout{margin-top:30px;gap:20px}.check-list,.diagnosis,.related-grid,.article-aside{grid-template-columns:1fr}.breadcrumbs span:last-child{overflow:hidden;text-overflow:ellipsis}}