:root{--ink:#172640;--muted:#66758b;--blue:#2659d9;--blue-dark:#1945b7;--line:#e4eaf3;--soft:#f3f6fc;--white:#fff}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:28px}body{margin:0;background:var(--white);color:var(--ink);font-family:"PingFang SC","Microsoft YaHei",-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.65;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}a:focus-visible,summary:focus-visible{outline:3px solid #6d97f0;outline-offset:5px}svg{display:block;flex-shrink:0}h1,h2,h3,p{margin:0}h1,h2,h3{line-height:1.4}a:hover{color:var(--blue)}.skip-link{position:fixed;top:-100px;left:16px;background:#fff;z-index:20;padding:10px}.skip-link:focus{top:10px}
.site-top{border-bottom:1px solid var(--line);background:#fff}.top-inner{max-width:1240px;margin:auto;padding:24px 32px;display:flex;align-items:center;gap:42px}.brand{display:flex;align-items:center;gap:11px;font-size:21px;font-weight:750;letter-spacing:-.5px;min-width:0}.brand-mark{width:38px;height:42px;border-radius:10px;background:var(--blue);color:white;display:grid;place-items:center;flex-shrink:0}.brand-mark svg{width:27px;height:27px}.site-nav{display:flex;align-items:center;gap:26px;margin-left:auto;font-size:14px;white-space:nowrap}.site-nav a{color:#4f5e74;position:relative;padding:9px 0}.site-nav a[aria-current=page]{color:var(--blue);font-weight:650}.site-nav a[aria-current=page]:after{content:"";position:absolute;bottom:-24px;left:0;right:0;height:3px;background:var(--blue)}.about-link{font-size:13px;color:var(--muted);border-left:1px solid var(--line);padding-left:24px;white-space:nowrap}
.landing-page,.reading-page{max-width:1240px;margin:auto;padding:0 32px}.home-hero{display:grid;grid-template-columns:1.06fr 1fr;gap:76px;align-items:center;padding:66px 0 58px}.hero-copy{padding:12px 0}.hero-note{display:flex;align-items:center;gap:9px;color:#4c668f;font-size:14px;margin-bottom:21px}.hero-note>span{width:7px;height:7px;border-radius:50%;background:var(--blue)}.hero-copy h1{font-size:clamp(36px,4vw,53px);line-height:1.4;letter-spacing:-1.7px;font-weight:780}.hero-copy p{max-width:420px;color:var(--muted);font-size:17px;line-height:1.9;margin:22px 0 30px}.primary-link{background:var(--blue);color:white;display:inline-flex;align-items:center;gap:22px;padding:13px 21px;border-radius:8px;font-size:15px;font-weight:600}.primary-link:hover{background:var(--blue-dark);color:#fff}.primary-link svg{width:19px;height:19px}
.featured-tutorial{display:block;position:relative;border:1px solid #dce5f4;border-radius:20px;background:#f4f7fe;padding:27px 30px 25px;min-width:0;box-shadow:0 18px 35px -30px #718bb7}.featured-tutorial:hover{color:var(--ink);border-color:#a9bfea}.feature-top{display:flex;justify-content:space-between;gap:10px;font-size:12px;color:#647793}.feature-top>span:first-child{font-weight:600;color:var(--blue)}.feature-illustration{display:flex;justify-content:center;padding:24px 0 20px}.illustration-window{width:260px;max-width:90%;background:#fff;border:1px solid #cedcf3;border-radius:12px;transform:rotate(-3deg);box-shadow:9px 10px 0 #e2eafa}.window-bar{height:27px;display:flex;align-items:center;gap:5px;padding:0 11px;border-bottom:1px solid #e3eaf7}.window-bar i{width:5px;height:5px;border-radius:50%;background:#b8c8e2}.window-content{display:flex;align-items:center;position:relative;gap:18px;padding:21px}.window-content>svg{width:54px;height:54px;color:#4b77dc;stroke-width:1.15}.illustration-lines{flex:1;display:grid;gap:9px}.illustration-lines b{height:5px;background:#e0e8f6;border-radius:3px}.illustration-lines b:nth-child(2){width:82%}.illustration-lines b:nth-child(3){width:60%}.window-check{position:absolute;right:-14px;bottom:-8px;width:34px;height:34px;background:var(--blue);border:4px solid #f4f7fe;color:white;border-radius:50%;display:grid;place-items:center}.window-check svg{width:16px;height:16px}
.topic-label{font-size:12px;font-weight:600;color:var(--blue);background:#eaf0ff;border-radius:5px;padding:4px 9px;display:inline-block;line-height:1.5}.featured-tutorial h2{font-size:23px;letter-spacing:-.5px;margin:11px 0 10px}.featured-tutorial>p{font-size:14px;line-height:1.85;color:var(--muted)}.feature-read{display:flex;align-items:center;gap:10px;font-size:13px;font-weight:600;color:var(--blue);margin-top:18px}.feature-read svg{width:17px;height:17px}.hero-empty{background:var(--soft);border-radius:20px;padding:48px;color:var(--muted)}.hero-empty>svg{width:58px;height:58px;color:var(--blue);margin-bottom:24px}.hero-empty h2{color:var(--ink);font-size:26px;margin-bottom:12px}
.section-title{display:flex;justify-content:space-between;align-items:baseline;gap:20px;margin-bottom:23px}.section-title h2{font-size:23px;font-weight:700}.section-title>span{font-size:13px;color:var(--muted)}.topics-section{padding:29px 0 44px;border-top:1px solid var(--line);scroll-margin-top:30px}.topic-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.topic-tile{display:block;padding:24px;border:1px solid var(--line);border-radius:12px;min-width:0}.topic-tile:hover{border-color:#a8bce4;background:#f8faff;color:var(--ink)}.topic-icon{display:grid;place-items:center;width:42px;height:42px;background:#eef3ff;color:var(--blue);border-radius:10px;margin-bottom:17px}.topic-icon svg{width:24px;height:24px}.topic-tile h3{font-size:18px;margin-bottom:8px}.topic-tile p{font-size:13px;color:var(--muted)}.topic-tile>div{display:flex;align-items:center;justify-content:space-between;margin-top:22px;font-size:12px;color:#8190a5}.topic-tile>div svg{width:17px;height:17px;color:var(--blue)}
.home-about{display:flex;align-items:center;gap:24px;padding:28px 32px;background:var(--soft);border-radius:12px;margin:8px 0 56px}.about-symbol{color:var(--blue);background:#e3ebfc;border-radius:12px;padding:14px}.about-symbol svg{width:28px;height:28px}.home-about h2{font-size:20px;margin-bottom:7px}.home-about p{font-size:14px;color:var(--muted)}.home-about>a{display:flex;align-items:center;gap:12px;font-size:13px;color:var(--blue);margin-left:auto;white-space:nowrap}.home-about>a svg{width:18px;height:18px}.recent-section{padding:18px 0 40px}
.breadcrumb{display:flex;flex-wrap:wrap;gap:11px;color:#8090a5;font-size:12px;padding:28px 0}.breadcrumb a{color:#576c8a}.category-heading{display:flex;gap:24px;align-items:center;padding:15px 0 38px;border-bottom:1px solid var(--line)}.category-symbol{width:78px;height:78px;border-radius:20px;color:var(--blue);background:#edf2ff;display:grid;place-items:center;flex-shrink:0}.category-symbol svg{width:40px;height:40px}.category-heading h1{font-size:34px;margin-bottom:9px}.category-heading p{color:var(--muted);font-size:16px}.category-layout{display:grid;grid-template-columns:minmax(0,1fr) 255px;gap:75px;padding:36px 0 75px}.tutorial-row{display:flex;align-items:center;gap:30px;padding:27px 0;border-bottom:1px solid var(--line);min-width:0}.tutorial-row:hover{color:var(--ink)}.tutorial-row h3{font-size:23px;margin:12px 0 10px}.tutorial-row:hover h3{color:var(--blue)}.tutorial-row p{font-size:15px;color:var(--muted);max-width:730px;line-height:1.85}.row-date{display:block;color:#8090a5;font-size:12px;margin-top:17px}.row-open{display:grid;place-items:center;width:38px;height:38px;flex-shrink:0;margin-left:auto;background:var(--soft);border-radius:50%;color:var(--blue)}.row-open svg{width:19px;height:19px}.category-side{padding:5px 0}.category-side h2{font-size:16px;margin:0 0 19px}.category-side>a{display:flex;align-items:center;gap:12px;padding:15px 0;border-bottom:1px solid var(--line);font-size:14px}.category-side>a svg:first-child{color:var(--blue);width:19px;height:19px}.category-side>a svg:last-child{margin-left:auto;color:#8a9ab0;width:16px;height:16px}.empty-state{background:var(--soft);border-radius:12px;padding:38px;margin-top:26px}.empty-state>svg{color:#7897d5;width:40px;height:40px;margin-bottom:18px}.empty-state h3{font-size:22px;margin-bottom:10px}.empty-state p{color:var(--muted);font-size:15px;line-height:1.85}.text-link{display:inline-flex;align-items:center;gap:10px;color:var(--blue);font-size:14px;margin-top:22px}.text-link svg{width:18px;height:18px}
.reading-page{max-width:1140px}.article-heading{max-width:890px;padding:16px 0 36px;border-bottom:1px solid var(--line)}.article-heading h1{font-size:40px;letter-spacing:-1px;margin:17px 0 18px;line-height:1.45}.article-meta{display:flex;flex-wrap:wrap;gap:20px;color:#7a899d;font-size:12px}.article-meta a{text-decoration:underline;text-underline-offset:3px}.article-deck{color:#5d6e87;font-size:18px;line-height:1.9;margin-top:23px;max-width:810px}.reading-layout{display:grid;grid-template-columns:205px minmax(0,1fr);gap:65px;padding:34px 0 64px}.reading-layout-simple{display:block;max-width:740px}.reading-rail{min-width:0}.desktop-toc{position:sticky;top:30px;border-left:1px solid var(--line);padding-left:20px}.desktop-toc h2{font-size:13px;letter-spacing:.2px;margin-bottom:18px}.desktop-toc ol{list-style:none;margin:0;padding:0}.desktop-toc li{margin:0 0 14px;font-size:13px;line-height:1.6}.desktop-toc a{color:#65758c}.desktop-toc a:hover{color:var(--blue)}.source-jump{font-size:12px;display:block;margin-top:23px;padding-top:18px;border-top:1px solid var(--line)}.article-body{min-width:0;max-width:740px;font-size:17px;line-height:1.95;color:#34435b;overflow-wrap:anywhere}.article-body h2{color:var(--ink);font-size:25px;line-height:1.5;margin:0 0 20px;letter-spacing:-.4px}.prose-section{scroll-margin-top:30px;margin-bottom:43px}.article-body p{margin:15px 0}.article-body pre{max-width:100%;overflow-x:auto;white-space:pre;font-size:13px;line-height:1.85;padding:22px 24px;background:#f3f6fb;border:1px solid #e1e8f4;border-radius:9px;color:#2e486f;margin:22px 0}.article-body code{font-family:"SFMono-Regular",Consolas,"Liberation Mono",monospace}.step{color:var(--ink);font-weight:650;padding-top:14px}.step strong{display:inline-grid;place-items:center;min-width:26px;min-height:26px;margin-right:7px;color:var(--blue);background:#edf2ff;border-radius:5px;font-size:13px;vertical-align:middle}.mobile-toc{display:none}.sources{border-top:1px solid var(--line);padding-top:29px;scroll-margin-top:28px}.source-heading{display:flex;align-items:center;gap:12px}.source-heading>svg{width:20px;height:20px;color:var(--blue)}.source-heading h2{font-size:20px;margin:0}.sources>p{font-size:14px;color:var(--muted)}.sources ul{list-style:none;margin:18px 0 0;padding:0}.sources li>a{display:grid;grid-template-columns:minmax(0,1fr) 20px;gap:5px 12px;padding:18px 20px;background:var(--soft);border-radius:8px;font-size:13px;color:var(--blue)}.sources li strong{grid-row:1;grid-column:1;font-size:14px}.sources li span{grid-row:2;grid-column:1;color:#7084a3;font-size:12px;overflow-wrap:anywhere}.sources li svg{grid-row:1 / 3;grid-column:2;align-self:center;width:17px;height:17px}.article-body .notice{font-size:12px;color:#8591a2;line-height:1.8;margin-top:21px}.article-end{display:flex;justify-content:space-between;align-items:center;gap:20px;border-top:1px solid var(--line);padding-top:24px;margin-top:37px;font-size:13px;color:var(--muted)}.article-end a{display:flex;align-items:center;gap:10px;color:var(--blue)}.article-end svg{width:17px;height:17px}
.editorial-body{max-width:760px;margin:10px auto 70px;color:#34435b;font-size:17px;line-height:1.95}.editorial-body h1{font-size:38px;color:var(--ink);letter-spacing:-.7px;margin-top:18px}.editorial-body h2{font-size:23px;color:var(--ink);margin:36px 0 13px}.editorial-body p{margin:14px 0}.site-footer{border-top:1px solid var(--line);background:#f8faff;margin-top:6px;padding:33px 32px 24px}.footer-inner{max-width:1176px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:25px}.footer-brand{font-size:18px;font-weight:650}.footer-inner p{color:#8090a5;font-size:12px;margin-top:7px}.footer-inner nav{display:flex;gap:30px;color:#677a97;font-size:13px}.footer-note{max-width:1176px;margin:24px auto 0;border-top:1px solid var(--line);padding-top:15px;font-size:11px;color:#97a3b5}
@media(max-width:1100px){.top-inner{gap:24px}.site-nav{gap:18px}.about-link{display:none}.home-hero{gap:40px}.hero-copy h1{font-size:44px}.topic-tile{padding:20px}.reading-layout{gap:38px;grid-template-columns:180px minmax(0,1fr)}.category-layout{gap:40px}}
@media(max-width:800px){.top-inner{flex-wrap:wrap;gap:12px;padding:20px 24px 0}.brand{font-size:20px}.brand-mark{width:32px;height:35px;border-radius:8px}.brand-mark svg{width:23px;height:23px}.site-nav{width:100%;margin:0;gap:25px;overflow-x:auto;font-size:13px;padding:5px 0 14px}.site-nav a[aria-current=page]:after{bottom:-14px}.landing-page,.reading-page{padding:0 24px}.home-hero{padding:43px 0 38px;gap:28px}.hero-copy h1{font-size:35px;letter-spacing:-.9px}.hero-copy p{font-size:15px;line-height:1.8}.featured-tutorial{padding:22px}.featured-tutorial h2{font-size:20px}.feature-illustration{padding:22px 0}.topic-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.home-about{padding:24px;gap:17px;flex-wrap:wrap}.home-about>a{margin-left:0}.home-about h2{font-size:19px}.category-layout{grid-template-columns:minmax(0,1fr)}.category-side{border-top:1px solid var(--line);padding-top:25px}.reading-layout{display:block;padding-top:25px}.reading-rail{display:none}.article-body{max-width:none}.mobile-toc{display:block;border:1px solid var(--line);border-radius:8px;margin-bottom:29px;font-size:13px;background:#f8faff}.mobile-toc summary{cursor:pointer;padding:14px 17px;color:var(--blue);font-weight:600}.mobile-toc nav{padding:0 17px 15px}.mobile-toc ol{margin:0;padding-left:19px}.mobile-toc li{margin:8px 0}.article-heading h1{font-size:34px}.article-deck{font-size:17px}.category-heading h1{font-size:29px}.category-heading p{font-size:15px}}
@media(max-width:560px){.landing-page,.reading-page{padding:0 20px}.top-inner{padding:17px 20px 0}.brand{font-size:19px}.site-nav{gap:8px;font-size:12px;justify-content:space-between}.home-hero{grid-template-columns:minmax(0,1fr);gap:29px;padding:33px 0 31px}.hero-copy{padding:0}.hero-note{font-size:12px;margin-bottom:15px}.hero-copy h1{font-size:36px;line-height:1.35;letter-spacing:-1px}.hero-copy p{font-size:15px;margin:17px 0 22px;max-width:340px}.primary-link{padding:11px 17px;font-size:14px}.featured-tutorial{padding:22px;border-radius:15px}.feature-illustration{padding:18px 0}.illustration-window{width:235px}.window-content{padding:15px 20px}.window-content>svg{width:43px;height:43px}.featured-tutorial h2{font-size:21px}.featured-tutorial>p{font-size:13px;line-height:1.8}.topics-section{padding:26px 0 30px}.section-title{align-items:center;gap:10px;margin-bottom:18px}.section-title h2{font-size:20px}.section-title>span{font-size:11px}.topic-grid{gap:12px}.topic-tile{padding:18px 15px}.topic-tile h3{font-size:16px}.topic-tile p{font-size:12px;line-height:1.7}.topic-tile>div{margin-top:18px;font-size:11px}.topic-icon{width:35px;height:35px;border-radius:8px;margin-bottom:14px}.topic-icon svg{width:20px;height:20px}.home-about{margin-bottom:35px;padding:22px;gap:12px}.about-symbol{display:none}.home-about h2{font-size:17px}.home-about p{font-size:12px}.home-about>a{font-size:12px;margin-top:6px}.breadcrumb{font-size:11px;gap:8px;padding:22px 0}.article-heading{padding:8px 0 26px}.article-heading h1{font-size:29px;line-height:1.45;margin:14px 0 17px;letter-spacing:-.6px}.article-meta{gap:7px 15px;font-size:11px}.article-deck{font-size:16px;line-height:1.85;margin-top:19px}.article-body{font-size:16px;line-height:1.9}.article-body h2{font-size:22px;margin-bottom:17px}.prose-section{margin-bottom:34px}.article-body pre{padding:17px 18px;font-size:12px;line-height:1.8;border-radius:7px}.category-heading{gap:16px;padding:10px 0 29px}.category-symbol{width:56px;height:56px;border-radius:14px}.category-symbol svg{width:29px;height:29px}.category-heading h1{font-size:26px}.category-heading p{font-size:13px}.category-layout{padding:28px 0 45px;gap:30px}.tutorial-row{gap:15px;padding:22px 0}.tutorial-row h3{font-size:21px}.tutorial-row p{font-size:14px}.row-open{width:29px;height:29px}.row-open svg{width:15px;height:15px}.empty-state{padding:27px}.empty-state h3{font-size:20px}.empty-state p{font-size:14px}.editorial-body h1{font-size:29px}.editorial-body{font-size:16px}.site-footer{padding:26px 20px 22px}.footer-inner{align-items:flex-start;flex-direction:column;gap:20px}.footer-inner nav{gap:25px;font-size:12px}.footer-brand{font-size:17px}.footer-note{margin-top:21px;font-size:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}