.article-page .shell{display:block;max-width:1240px;margin:auto}.article-page .sidebar,.article-page .menu{display:none}.article-page .main{padding:32px 36px 56px}.article-page .breadcrumb{max-width:1168px;margin:0 auto 24px;font-size:13px;color:#8a857b;overflow-wrap:anywhere}.article-page .reader-grid{max-width:1168px;grid-template-columns:minmax(0,820px) 232px;gap:44px;margin:0 auto;align-items:start}.article-page .lesson{max-width:none;padding:42px 48px;background:#fffdf9;border:1px solid #e5dfd5;border-radius:18px;box-shadow:0 8px 28px #34291504}.article-page .lesson h1{font-size:clamp(30px,3vw,43px);line-height:1.35;letter-spacing:-.7px;margin:15px 0 18px;text-wrap:balance}.article-page .lesson .lead{font-size:18px;line-height:1.8;color:#746c60;margin:0 0 20px}.article-page .reading-meta{display:flex;flex-wrap:wrap;gap:9px 18px;padding:16px 0;border-top:1px solid #e9e3d9;font-size:12px;color:#81776a}.article-page .article-cover{margin:12px auto 32px;max-width:560px}.article-page .article-cover img{display:block;border-radius:10px}.article-page figcaption{font-size:12px;text-align:center;color:#8a8073;margin-top:8px}.article-page .article-body{font-size:17px;line-height:1.9;color:#403d36;overflow-wrap:break-word}.article-page .article-body p{font-size:17px;line-height:1.95;margin:17px 0;color:#504c43}.article-page .article-body h2{font-size:25px;line-height:1.5;margin:42px 0 18px;padding-top:24px;border-top:1px solid #ece6dc;scroll-margin-top:110px}.article-page .article-body h3{font-size:20px;line-height:1.6;margin:27px 0 12px;color:#3e4035}.article-page .article-summary{background:#f1f3ea;border:1px solid #dce2cd;border-left:4px solid #89966d;border-radius:10px;padding:20px 24px;margin:0 0 28px}.article-page .article-summary>span{font-size:12px;font-weight:600;color:#69754e;letter-spacing:.08em}.article-page .article-summary p{margin:10px 0 0;color:#3e4931}.article-page .article-body a{color:#a6543c;text-decoration:underline;text-underline-offset:4px}.article-page .article-body ol{list-style:none;padding:0;counter-reset:steps}.article-page .article-body ol>li{position:relative;counter-increment:steps;padding:18px 20px 18px 57px;background:#f6f3ec;border:1px solid #e9e1d6;border-radius:10px;margin:12px 0;font-size:16px;line-height:1.8}.article-page .article-body ol>li:before{content:counter(steps);position:absolute;left:18px;top:20px;width:25px;height:25px;display:grid;place-items:center;background:#bc7257;color:white;font-size:12px;font-weight:700;border-radius:50%}.article-page .article-body ul{padding-left:24px}.article-page .article-body li{font-size:16px;line-height:1.9;margin:9px 0}.article-page .article-body li::marker{color:#ae694e}.article-page .article-body blockquote{margin:24px 0;padding:18px 24px;border-left:3px solid #bf795f;background:#f9f0e9;border-radius:0 10px 10px 0;color:#5b4739}.article-page .article-body blockquote p{margin:0}.article-page code{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:.87em;background:#eee9e0;border:1px solid #e4ddcf;border-radius:5px;padding:2px 6px;overflow-wrap:anywhere}.article-page .code-frame{margin:24px 0;border:1px solid #d9d6cc;border-radius:12px;overflow:hidden;background:#272c28}.article-page .code-tools{display:flex;align-items:center;justify-content:space-between;padding:9px 16px;background:#343b35;color:#d6ddd3;font-size:12px}.article-page .code-tools button{padding:4px 11px;border:1px solid #647160;border-radius:5px;background:transparent;color:#e1e9dd;font-size:12px;cursor:pointer}.article-page pre{margin:0;padding:20px;overflow-x:auto;color:#ecf0e7;background:#272c28;line-height:1.75;font-size:14px;tab-size:2;max-width:100%}.article-page pre code{color:inherit;background:none;border:0;padding:0;white-space:pre;overflow-wrap:normal;font-size:inherit}.article-page .table-scroll{overflow:auto;border:1px solid #deded2;border-radius:10px;margin:24px 0;max-width:100%;overscroll-behavior-x:contain}.article-page table{width:100%;min-width:500px;border-collapse:collapse;font-size:14px}.article-page th{background:#edeee5;text-align:left;font-weight:600;color:#46503a}.article-page td,.article-page th{padding:13px 16px;border:0;border-bottom:1px solid #e5e4dc;line-height:1.7;vertical-align:top}.article-page tbody tr:nth-child(even){background:#f8f7f1}.article-page .article-faq{margin:13px 0;border:1px solid #e4dfd4;border-radius:10px;background:#faf8f1;padding:0 20px}.article-page .article-faq summary{font-size:16px;font-weight:600;cursor:pointer;padding:18px 0;line-height:1.65;color:#4b493e}.article-page .faq-answer{border-top:1px solid #e5dfd2;padding:2px 0 12px}.article-page .source-section{margin-top:38px;padding:24px;background:#f5f3ed;border-radius:12px}.article-page .source-section h2,.article-page .related h2{font-size:20px;margin:0 0 17px;border:0;padding:0}.article-page .source-list{padding:0;list-style:none;margin:0}.article-page .source-list li{margin:10px 0;font-size:14px;overflow-wrap:anywhere}.article-page .source-list a{color:#78604a}.article-page .related{margin-top:34px;border-top:1px solid #e5dfd5;padding-top:26px}.article-page .related>a{display:block;padding:13px 16px;border:1px solid #e9e2d6;border-radius:8px;background:#f9f7f0;margin:9px 0;font-size:15px;color:#7e533e}.article-page .toc{top:110px;margin:0;background:#f8f5ed;border:1px solid #e4ddcf;border-radius:12px;padding:20px;max-height:calc(100vh - 140px);overflow:auto;font-size:13px}.article-page .toc summary{font-size:14px;font-weight:600;color:#4c4d3f;cursor:pointer}.article-page .toc a{display:block;font-size:13px;line-height:1.65;margin:10px 0;padding:7px 10px;border-left:2px solid transparent;color:#827a6e}.article-page .toc a.is-active{color:#98583f;background:#eee6da;border-left-color:#b56c50;border-radius:0 5px 5px 0}.article-page .reading-progress{position:fixed;top:0;left:0;right:0;z-index:100;height:3px;pointer-events:none}.article-page .reading-progress span{display:block;height:100%;width:0;background:#ba7255}.article-page .main>footer{max-width:1168px;margin:36px auto 0}.article-page :focus-visible{outline:2px solid #a5684b;outline-offset:4px}
@media(max-width:1000px){.article-page .main{padding:28px 24px}.article-page .reader-grid{grid-template-columns:minmax(0,1fr) 195px;gap:22px}.article-page .lesson{padding:30px}.article-page .toc{padding:16px}.article-page .lesson h1{font-size:34px}}
@media(max-width:760px){.article-page .main{padding:22px 16px 40px}.article-page .breadcrumb{margin-bottom:15px;font-size:12px}.article-page .reader-grid{grid-template-columns:minmax(0,1fr);gap:16px}.article-page .toc{grid-row:1;position:static;max-height:300px;margin:0;padding:14px 18px}.article-page .toc a{margin:5px 0}.article-page .lesson{padding:25px 22px;border-radius:12px}.article-page .lesson h1{font-size:29px;letter-spacing:-.4px}.article-page .lesson .lead{font-size:16px}.article-page .article-body p{font-size:16px;line-height:1.95}.article-page .article-body h2{font-size:22px;margin-top:32px;padding-top:22px}.article-page .article-body h3{font-size:18px}.article-page .article-summary{padding:17px 18px}.article-page .article-body ol>li{padding:15px 15px 15px 49px;font-size:15px}.article-page .article-body ol>li:before{left:14px;top:18px}.article-page .article-cover{margin-bottom:25px}.article-page .reading-meta{font-size:11px;gap:8px 14px}.article-page .source-section{padding:20px}.article-page pre{font-size:13px;padding:16px}.article-page .article-faq{padding:0 15px}.article-page .article-faq summary{font-size:15px}}
@media(prefers-reduced-motion:reduce){.article-page{scroll-behavior:auto}}