/* Reference-inspired article sidebar: all layout, lines and icons are native UI. */
.reading-layout{grid-template-columns:minmax(0,1fr) 338px;gap:16px}
.reading-aside{gap:14px}
.article-toc,.related-panel{padding:0;border-radius:8px;overflow:hidden;background:rgba(255,248,244,.88)}
.toc-title,.related-title{display:flex;align-items:center;gap:13px;height:52px;margin:0;padding:0 21px;background:rgba(255,216,200,.36);color:#821d0e;font-size:20px;font-weight:700;letter-spacing:.5px}
.toc-title svg,.related-title svg{width:23px;height:25px;flex-shrink:0;color:#ff4917;fill:currentColor;stroke:none}
.toc-body{position:relative;padding:10px 18px 12px;isolation:isolate;min-height:247px}
.article-toc ol{display:block;margin:0;padding:0;list-style:none}
.article-toc li{position:relative;margin:0;padding:0}
.article-toc li+li{margin:0}
.article-toc li::before{content:"";position:absolute;left:6px;top:0;bottom:0;width:1px;background:#cfbdb450;z-index:-1}
.article-toc a{position:relative;display:block;padding:6px 0 6px 26px;border:0;background:none;border-radius:0;font-size:16px;line-height:1.55;color:#39332e;transition:color .2s,translate .25s}
.article-toc a::before{content:"";position:absolute;width:6px;height:6px;left:3.5px;top:16px;border-radius:50%;background:#c5bfba;transition:background .2s,box-shadow .2s}
.article-toc a[aria-current="location"],.article-toc a.is-parent-active{color:#ac2713;background:none;border:0;font-weight:700}
.article-toc a[aria-current="location"]::before,.article-toc a.is-parent-active::before{background:#ff4e1b;box-shadow:0 0 0 2px #ff6b2a10}
.article-toc a:hover{color:#ed4e20;background:none;translate:2px 0}
.article-toc ol ol{padding-left:26px}
.article-toc ol ol a{padding-top:3px;padding-bottom:3px;font-size:15px;color:#8c8580;font-weight:400}
.article-toc ol ol a::before{top:12px;width:5px;height:5px;left:4px}
.toc-mascot{position:absolute;bottom:1px;right:-1px;width:130px;height:87px;object-fit:contain;object-position:right bottom;z-index:-1;pointer-events:none}
.read-progress{padding:8px 18px 11px;margin:0;border-top:1px solid #dba37e22;background:#ffeadf18;font-size:10px}
.read-progress-label{margin-bottom:5px}.read-progress-track{height:2px}
.related-list{padding:0 19px 3px}
.related-card{display:grid;grid-template-columns:108px minmax(0,1fr);gap:15px;align-items:center;position:relative;min-height:117px;padding:13px 0;transition:translate .25s,background .25s}
.related-card+.related-card{border-top:1px solid #e4b79c27}
.related-thumb{width:108px;height:91px;border-radius:5px;object-fit:cover;transition:filter .3s,transform .35s}
.related-copy{min-width:0}.related-copy .pill{font-size:12px;line-height:19px;height:21px;padding:0 9px;margin-bottom:6px}
.related-copy h3{font-size:16px;line-height:1.5;margin:0 0 7px;color:#201a17;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.related-meta{display:flex;align-items:center;gap:13px;flex-wrap:wrap;font-size:11px;color:#89847f;line-height:1.5}
.related-meta span{display:flex;align-items:center;gap:5px;white-space:nowrap}
.related-meta svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.related-card:hover{translate:2px 0}.related-card:hover h3{color:#db501e}.related-card:hover .related-thumb{filter:saturate(1.15);transform:scale(1.025)}
.article-content h3{font-size:17px;color:#8d4a28;margin:25px 0 13px;scroll-margin-top:102px}
body[data-theme="night"] .article-toc,body[data-theme="night"] .related-panel{background:rgba(35,28,26,.94)}
body[data-theme="night"] .toc-title,body[data-theme="night"] .related-title{background:#ee9d6610;color:#f1b38b}
body[data-theme="night"] .toc-title svg,body[data-theme="night"] .related-title svg{color:#ffa374}
body[data-theme="night"] .article-toc a{color:#e0cabb}
body[data-theme="night"] .article-toc ol ol a{color:#b49f91}
body[data-theme="night"] .article-toc a[aria-current="location"],body[data-theme="night"] .article-toc a.is-parent-active{color:#ffb88f;background:none}
body[data-theme="night"] .article-toc li::before{background:#d4ac8930}
body[data-theme="night"] .article-toc a::before{background:#766153}
body[data-theme="night"] .article-toc a[aria-current="location"]::before,body[data-theme="night"] .article-toc a.is-parent-active::before{background:#ffad7c}
body[data-theme="night"] .related-copy h3{color:#f0dacc}
body[data-theme="night"] .related-meta{color:#bda595}
body[data-theme="night"] .related-card+.related-card{border-color:#ecc59f18}
body[data-theme="night"] .article-content h3{color:#eeb78e}
@media(max-width:1200px){.reading-layout{grid-template-columns:minmax(0,1fr) 290px}.article-paper{padding:25px}.related-list{padding:0 14px 3px}.related-card{grid-template-columns:87px minmax(0,1fr);gap:12px}.related-thumb{width:87px;height:89px}.related-copy h3{font-size:14px}.related-meta{gap:8px;font-size:10px}.article-toc a{font-size:14px}.article-toc ol ol a{font-size:13px}.toc-mascot{width:111px}}
@media(max-width:1000px) and (min-width:851px){.article-view .page-shell{grid-template-columns:190px minmax(0,1fr)}.reading-layout{grid-template-columns:minmax(0,1fr) 240px}.related-card{grid-template-columns:73px minmax(0,1fr);gap:10px}.related-thumb{width:73px;height:80px}.related-meta{gap:3px;flex-wrap:wrap}.toc-title,.related-title{font-size:18px;padding:0 16px}.toc-body{padding-left:12px;padding-right:12px}.article-toc a{font-size:13px}}
@media(max-width:650px){.reading-layout{display:grid;grid-template-columns:minmax(0,1fr)}.reading-aside{display:contents}.article-toc{grid-row:1}.reading-main{grid-row:2}.related-panel{grid-row:3}.toc-body{min-height:0;padding-bottom:16px}.article-toc a{font-size:15px;padding-top:5px;padding-bottom:5px}.article-toc ol ol a{font-size:14px}.article-toc a::before{top:15px}.article-toc ol ol a::before{top:11px}.toc-mascot{width:118px;opacity:.96}.toc-title,.related-title{font-size:19px;height:49px}.related-card{grid-template-columns:108px minmax(0,1fr)}.related-thumb{width:108px;height:94px}.related-copy h3{font-size:16px}.related-meta{font-size:11px;gap:13px}.article-content h3{font-size:16px;scroll-margin-top:90px}}
/* Second comparison pass: tighter reference proportions, larger corner sticker. */
.toc-mascot{width:142px;height:100px}
.article-toc a{font-size:17px}
.article-toc ol ol a{font-size:16px}
.read-progress{height:3px;padding:0;margin:0;border:0;background:transparent}
.read-progress-label{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.read-progress-track{height:3px;border-radius:0}
@media(max-width:1200px){.article-toc a{font-size:14px}.article-toc ol ol a{font-size:13px}.toc-mascot{width:115px;height:85px}}
@media(max-width:1000px) and (min-width:851px){.article-toc a{font-size:13px}}
@media(max-height:880px) and (min-width:651px){.article-view .reading-aside{position:static}}
@media(max-width:650px){.article-toc a{font-size:16px}.article-toc ol ol a{font-size:15px}.toc-mascot{width:130px;height:92px}}
/* Reference detail polish: fuller mascot and stronger top-level hierarchy. */
.article-toc,.related-panel{background:rgba(255,250,247,.93)}
.article-toc> .toc-body>ol>li>a{font-weight:600}
.toc-mascot{object-fit:fill;transition:transform .4s var(--motion-ease);transform-origin:right bottom}
.article-toc:hover .toc-mascot{transform:translateY(-2px) rotate(-2deg)}
.related-meta{font-size:12px;gap:10px}
@media(max-width:1200px) and (min-width:651px){.related-meta{font-size:10px;gap:8px}}
body[data-theme="night"] .article-toc,body[data-theme="night"] .related-panel{background:rgba(35,28,26,.94)}
