.article-header{background:var(--color-surface);border-bottom:1px solid var(--color-border);padding:2rem 2rem 1.75rem}.breadcrumb{gap:.4rem;font-size:.75rem;margin-bottom:1.25rem}.article-meta{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap;margin-bottom:.875rem}.article-header .vol-badge{display:inline-block;font-size:.75rem;font-weight:700;padding:.18rem .875rem;border-radius:4px;background:var(--color-accent);color:#fff;letter-spacing:.06em}.article-period{font-size:.83rem;color:var(--color-text-muted)}.article-tags{display:flex;gap:.35rem;flex-wrap:wrap;margin-bottom:1rem}.article-header .tag-pill{display:inline-block;font-size:.72rem;font-weight:700;padding:.18rem .75rem;border-radius:4px;background:var(--color-tag-bg);color:var(--color-tag-text);border:1px solid #B8D8C8}.article-title{font-size:1.6rem;font-weight:900;line-height:1.4;color:var(--color-text);letter-spacing:.02em}.version-toggle{display:inline-flex;border:1.5px solid var(--color-accent);border-radius:6px;overflow:hidden}.version-btn{padding:.45rem 1.25rem;font-size:.83rem;font-weight:700;color:var(--color-accent-dark);background:transparent;border:none;cursor:pointer;font-family:var(--font-sans);transition:background .12s,color .12s;letter-spacing:.04em}.version-btn.active{background:var(--color-accent);color:#fff}.version-btn:not(.active):hover{background:var(--color-accent-pale)}.article-layout{max-width:1160px;margin:0 auto;padding:2rem;display:grid;grid-template-columns:220px 1fr;gap:2.5rem;align-items:start}.toc-sidebar{position:sticky;top:calc(60px + 1.5rem);display:flex;flex-direction:column;gap:1rem}.toc-toggle-area{display:flex;justify-content:center}.toc-toggle{display:none}.toc-label{font-size:.68rem;font-weight:700;letter-spacing:.18em;color:var(--color-accent-dark);margin-bottom:.5rem}.toc-list{display:none;flex-direction:column;gap:0;border-left:2px solid var(--color-border-light)}.toc-list.active{display:flex}.toc-item{display:flex;align-items:baseline;gap:.5rem;padding:.45rem 0 .45rem .875rem;font-size:.8rem;color:var(--color-text-muted);border-left:2px solid transparent;margin-left:-2px;cursor:pointer;transition:color .12s,border-color .12s;line-height:1.5;text-decoration:none}.toc-item:hover{color:var(--color-accent-dark);border-left-color:var(--color-accent)}.toc-item.active{color:var(--color-accent);font-weight:700;border-left-color:var(--color-accent)}.toc-item.sub{padding-left:1.5rem;font-size:.75rem}.toc-num{font-size:.68rem;color:var(--color-text-faint);flex-shrink:0;font-weight:700}.toc-text{flex:1;min-width:0}.article-body{background:var(--color-surface);border-radius:10px;border:1px solid var(--color-border-light);padding:2.25rem 2.5rem;min-width:0}.article-body .prose{counter-reset:section}.article-body .prose h2{position:sticky;top:var(--header-h);z-index:10;background:var(--color-surface);padding:.75rem 2.5rem;margin-left:-2.5rem;margin-right:-2.5rem;margin-bottom:1.25rem;border-bottom:1px solid var(--color-border-light)}.article-body .prose>h2:first-child{margin-top:0}.article-body .prose h2:before{counter-increment:section;content:counter(section);display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;background:var(--color-accent);color:#fff;font-size:.72rem;font-weight:900;flex-shrink:0;margin-right:.5rem}.version-content{display:none}.version-content.active{display:block}.version-placeholder{text-align:center;padding:3rem 2rem;color:var(--color-text-faint);font-size:.92rem;line-height:2;background:var(--color-bg);border-radius:8px;border:1px dashed var(--color-border)}.article-nav{max-width:1160px;margin:1.5rem auto 0;padding:0 2rem 2rem;display:grid;grid-template-columns:1fr 1fr;gap:1rem}.nav-btn{display:flex;align-items:center;gap:.875rem;background:var(--color-surface);border:1px solid var(--color-border-light);border-radius:8px;padding:1rem 1.25rem;transition:box-shadow .12s,border-color .12s;text-decoration:none;color:inherit}.nav-btn:hover{box-shadow:0 2px 10px #2d88601a;border-color:#b0d4c0}.nav-btn.next{justify-content:flex-end;text-align:right}.nav-arrow{font-size:1.25rem;color:var(--color-accent);flex-shrink:0}.nav-label{font-size:.68rem;font-weight:700;letter-spacing:.12em;color:var(--color-text-faint);margin-bottom:.2rem}.nav-title{font-size:.85rem;font-weight:700;color:var(--color-text);line-height:1.45}@media (max-width: 1024px){.article-layout{grid-template-columns:1fr;padding:0 1.5rem 1.5rem;gap:1.5rem}.article-body .prose h2{top:calc(var(--header-h) + 58px)}.toc-sidebar{order:-1;position:sticky;top:var(--header-h);z-index:99;flex-direction:row;align-items:center;justify-content:space-between;gap:.5rem;padding:1.03125rem 1.5rem .5rem;margin:0 -1.5rem;background:var(--color-bg);border-bottom:1px solid var(--color-border-light);box-shadow:0 2px 6px #0000000f;overflow:visible}.toc-toggle-area{position:static;background:transparent;border:none;box-shadow:none;padding:0;justify-content:flex-start;order:2}.toc-toggle-area .version-btn{font-size:.75rem;padding:.3rem .875rem;min-height:32px}.toc-toggle{display:flex;align-items:center;gap:.375rem;padding:.375rem .75rem;background:var(--color-surface);border:1px solid var(--color-border);border-radius:6px;font-family:var(--font-sans);font-size:.8rem;font-weight:600;color:var(--color-text);cursor:pointer;min-height:32px;white-space:nowrap;flex-shrink:0;order:1}.toc-toggle-icon{transition:transform .2s;font-size:.75rem;color:var(--color-text-muted)}.toc-toggle[aria-expanded=true] .toc-toggle-icon{transform:rotate(180deg)}.toc-content{display:none;position:absolute;top:100%;left:0;right:0;z-index:98;background:var(--color-bg);border-bottom:1px solid var(--color-border-light);box-shadow:0 4px 12px #00000014;padding:.75rem 1rem 1rem;max-height:50vh;overflow-y:auto}.toc-toggle[aria-expanded=true]+.toc-content{display:block}}@media (max-width: 900px){.article-nav{grid-template-columns:1fr;gap:.75rem}}@media (max-width: 768px){.article-header,.article-layout{padding:1.25rem}.toc-sidebar{margin:0 -1.25rem;padding-left:1.25rem;padding-right:1.25rem}.article-body{padding:1.25rem}.article-nav{padding:0 1.25rem 1.25rem}.article-title{font-size:1.25rem}.article-meta{gap:.5rem}.breadcrumb{flex-wrap:wrap}.article-body .prose h2{padding-left:1.25rem;padding-right:1.25rem;margin-left:-1.25rem;margin-right:-1.25rem}}@media (max-width: 640px){.article-header,.article-layout{padding:1rem}.toc-sidebar{margin:0 -1rem;padding-left:1rem;padding-right:1rem}.article-body{padding:1rem}.article-body .prose h2{padding-left:1rem;padding-right:1rem;margin-left:-1rem;margin-right:-1rem}.article-body p{font-size:.92rem;line-height:1.8}.article-nav{padding:0 1rem 1rem}.article-title{font-size:1.1rem;line-height:1.5}.breadcrumb li:not(:last-child):not(:nth-last-child(2)){display:none}}
