/* 本站教程扩展，保留模版8的颜色、栏目与响应式结构。 */
.skip-link{position:fixed;top:-90px;left:16px;z-index:300;background:#312e81;color:#fff;padding:12px 20px;border-radius:10px}
.skip-link:focus{top:12px}
a:focus-visible,button:focus-visible{outline:3px solid #7c3aed;outline-offset:5px}
.card h3 a,.extra-card h3 a,.drama-item h4 a{color:inherit;text-decoration:none}
.card h3 a:hover,.extra-card h3 a:hover,.drama-item h4 a:hover{text-decoration:underline;text-underline-offset:4px;color:#4f46e5}
.hero{padding-left:24px;padding-right:24px}
.hero h1{font-size:clamp(2rem,3.6vw,3.1rem);line-height:1.3}
.hero p{font-size:1.05rem;line-height:1.9}
.nav{gap:18px}
.logo span{font-size:1.2rem}
.logo img{max-width:84px;object-fit:contain}
.hero-image img,.card-img,.community-images img,.timeline-right img{object-fit:contain;background:#eef2ff}
.drama-item .info h4{white-space:normal}
.reading-page{padding-top:30px;padding-bottom:80px}
.breadcrumbs{margin:0 0 28px;color:#64748b;font-size:.9rem}
.breadcrumbs ol{display:flex;list-style:none;gap:8px;flex-wrap:wrap}
.breadcrumbs li:not(:last-child)::after{content:'›';margin-left:10px;color:#94a3b8}
.breadcrumbs a{color:#4f46e5;text-underline-offset:4px}
.article-layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:32px;align-items:start}
.article-body{background:#fff;border:1px solid #e0e7ff;border-radius:28px;padding:42px;min-width:0}
.article-body h1{font-size:2.25rem;line-height:1.45;margin-bottom:24px}
.article-body h2{font-size:1.5rem;line-height:1.5;margin-bottom:14px}
.article-body h3{font-size:1.1rem;line-height:1.7;margin-top:20px}
.article-body section{margin:38px 0;scroll-margin-top:110px}
.article-body p{font-size:1rem;line-height:1.95;color:#475569;margin:14px 0}
.article-body ul,.article-body ol{padding-left:1.4em;line-height:1.9;color:#475569}
.article-body li{margin:8px 0}
.article-body a,.article-aside a{color:#4f46e5;text-underline-offset:4px;overflow-wrap:anywhere}
.article-body .btn-primary{color:white}
.quick-answer{background:linear-gradient(135deg,#eef2ff,#f5f3ff);border-left:4px solid #6366f1;border-radius:8px 18px 18px 8px;padding:20px 24px;margin:24px 0}
.quick-answer strong{color:#4338ca;font-size:1.1rem}
.quick-answer p{margin-bottom:0}
.article-body figure{margin:30px 0;background:#f5f3ff;border-radius:20px;overflow:hidden}
.article-body figure img{display:block;width:100%;height:auto;max-height:350px;object-fit:contain}
.article-body figcaption{padding:12px;text-align:center;color:#64748b;font-size:.85rem;background:#f8fafc}
.article-toc{border:1px solid #e2e8f0;border-radius:16px;padding:24px;background:#f8fafc}
.article-toc strong{color:#1e293b}
.article-toc ol{margin-top:10px}
.table-scroll{overflow-x:auto;border:1px solid #e2e8f0;border-radius:14px;margin:20px 0}
table{width:100%;border-collapse:collapse;font-size:.92rem;line-height:1.8}
th,td{text-align:left;padding:14px;border-bottom:1px solid #e2e8f0;vertical-align:top;min-width:120px}
th{background:#eef2ff;color:#4338ca}tr:last-child td{border-bottom:0}
.aside-card{background:#fff;border:1px solid #e0e7ff;border-radius:24px;padding:24px}
.aside-card h2{font-size:1.3rem}.aside-card ul{list-style:none;margin:20px 0}.aside-card li{border-bottom:1px solid #eef2ff;padding:12px 0;font-size:.95rem}.aside-card p{font-size:.85rem;color:#64748b;margin-top:20px;line-height:1.8}
.takeaways{padding:24px;background:#f5f3ff;border-radius:18px}
.sources{font-size:.9rem}.sources a{font-size:.9rem}
.reading-card{max-width:900px;margin:auto}
.record-field{border-bottom:1px solid #e2e8f0;padding-bottom:20px}
.writing-lines{height:80px;background:repeating-linear-gradient(transparent,transparent 38px,#e2e8f0 39px,#e2e8f0 40px)}
@media(min-width:769px) and (max-width:1190px){.header-inner{flex-wrap:wrap;gap:16px}.nav{width:100%;justify-content:space-between}.hero{gap:28px}.process-flow{gap:10px}.process-step{padding:20px 12px}.grid-4{gap:14px}.card{padding:18px}.drama-list{grid-template-columns:repeat(2,1fr)}}
@media(max-width:768px){.hero{padding-left:16px;padding-right:16px}.hero h1{font-size:1.85rem}.hero p{font-size:.95rem}.logo span{font-size:1rem}.logo img{max-width:64px}.reading-page{padding-top:18px;padding-bottom:45px}.article-layout{display:block}.article-body{padding:24px 20px;border-radius:20px}.article-body h1{font-size:1.7rem}.article-body h2{font-size:1.3rem}.article-body p{font-size:.95rem}.article-body section{margin:28px 0;scroll-margin-top:80px}.article-aside{margin-top:24px}.quick-answer{padding:16px}.article-toc{padding:18px}.article-body .btn-primary{font-size:.95rem;padding:14px 22px}.breadcrumbs{font-size:.8rem}.hero-actions a{font-size:.9rem}.community-stats{gap:16px}}
@media print{.header,.nav-drawer,.overlay,.bottom-bar,.hot-search,.footer,.breadcrumbs,.skip-link,.article-aside,.btn-primary,.btn-secondary{display:none!important}body{background:#fff;padding:0}.reading-page{padding:0}.article-body{border:0;padding:0}.article-layout{display:block}.article-body section{break-inside:avoid}.writing-lines{background:none;border-bottom:1px solid #aaa}.quick-answer{background:#fff}.article-body a{color:#111}}
