		.material-detail{ max-width:980px;margin:0 auto}
		.md-paper{ background:var(--c-surface);border:1px solid var(--c-line);border-radius:18px;box-shadow:var(--sh-md);padding:34px 42px}
		.md-top{ display:flex;align-items:flex-start;justify-content:space-between;gap:18px;min-width:0;margin-bottom:18px}
		.md-top h1{ flex:1 1 auto;min-width:0;margin:0;font-size:28px;line-height:1.45;color:var(--c-ink);font-weight:700;font-family:var(--font-doc)}
		.md-top .ai-tag{ flex:none;white-space:nowrap}
		.md-tags{ display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 24px}
		.md-content{ position:relative;margin:28px 0 6px;padding:44px 54px 44px 64px;border:1px solid rgba(200,16,46,.14);border-left:6px solid var(--c-red);border-radius:20px;background:linear-gradient(135deg,#fff7f8 0,#fff 46%,#fffafa 100%);box-shadow:0 18px 46px rgba(200,16,46,.08),inset 0 0 0 1px rgba(255,255,255,.7);font-family:var(--font-doc);font-size:25px;line-height:1.95;color:var(--c-prose);white-space:pre-wrap;letter-spacing:.02em}
		.md-content:before{ content:"“";position:absolute;left:24px;top:2px;font-family:Georgia,serif;font-size:92px;line-height:1;color:rgba(200,16,46,.16);font-weight:700}
		.md-content:after{ content:"";position:absolute;right:28px;bottom:24px;width:110px;height:1px;background:linear-gradient(90deg,rgba(200,16,46,.28),rgba(200,16,46,0))}
		.md-char{ display:inline;color:inherit;transition:color .16s}
		.md-content.is-sweeping .md-char{ animation:mdKaraokeChar .36s ease forwards;animation-delay:calc(var(--i) * var(--karaoke-step, .08s))}
		.md-content.is-sweeping .md-char.is-gap{ animation:none}
		@keyframes mdKaraokeChar{ 0%{ color:var(--c-prose);text-shadow:none} 45%{ color:#f13f59;text-shadow:0 0 10px rgba(200,16,46,.22)} 100%{ color:var(--c-red);text-shadow:none} }
		@media (prefers-reduced-motion:reduce){ .md-content.is-sweeping .md-char{ animation:none;color:inherit} }
		.md-keyword{ margin:18px 0 0;color:var(--c-faint);font-size:13px;line-height:1.8}
		.md-keyword a{ display:inline-flex;align-items:center;height:24px;margin:0 5px 6px 0;padding:0 9px;border-radius:999px;background:var(--c-surface-2);border:1px solid var(--c-line);color:var(--c-muted);text-decoration:none;font-size:12px;font-weight:500}
		.md-keyword a:hover{ border-color:var(--c-red-line);background:#fff;color:var(--c-red)}
		.md-actions{ display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:24px}
		.md-note{ margin:22px 0 0;padding:14px 16px;border-radius:12px;background:var(--c-surface-2);color:var(--c-muted);line-height:1.8;font-size:13.5px}
		.md-related{ margin-top:16px;background:var(--c-surface);border:1px solid var(--c-line);border-radius:18px;box-shadow:var(--sh-sm);padding:18px 18px 20px}
		.md-related-head{ display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:14px}
		.md-related-head h2{ display:flex;align-items:center;gap:8px;margin:0;font-size:17px;color:var(--c-ink);font-weight:700}
		.md-related-head h2 .icon{ width:18px;height:18px;color:var(--c-red)}
		.md-tabs{ display:flex;align-items:center;gap:8px;overflow:auto;scrollbar-width:none}
		.md-tabs::-webkit-scrollbar{ display:none}
		.md-tab{ flex:none;height:30px;border:1px solid var(--c-line);border-radius:999px;background:var(--c-surface-2);color:var(--c-muted);padding:0 12px;cursor:pointer;font-size:12.5px;transition:.15s}
		.md-tab:hover,.md-tab.is-active{ color:var(--c-red);border-color:var(--c-red-line);background:var(--c-red-soft);font-weight:600}
		.md-rel-panel{ display:none}
		.md-rel-panel.is-active{ display:block}
		.md-rel-wrap{ position:relative}
		.md-rel-track{ display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x proximity;padding:2px 2px 10px;scrollbar-width:none}
		.md-rel-track::-webkit-scrollbar{ display:none}
		.md-rel-card{ flex:0 0 242px;min-height:142px;display:flex;flex-direction:column;gap:8px;padding:14px 14px 12px;border:1px solid var(--c-line);border-radius:14px;background:var(--c-surface-2);text-decoration:none;color:var(--c-ink);scroll-snap-align:start;transition:.15s}
		.md-rel-card:hover{ transform:translateY(-2px);border-color:var(--c-red-line);box-shadow:var(--sh-sm)}
		.md-rel-card h3{ margin:0;color:var(--c-faint);font-size:12px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
		.md-rel-card p{ flex:1;margin:0;color:var(--c-ink);font-size:14.5px;line-height:1.75;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
		.md-rel-meta{ display:flex;align-items:center;gap:6px;flex-wrap:wrap}
		.md-rel-meta span{ height:22px;display:inline-flex;align-items:center;border-radius:999px;padding:0 8px;background:var(--c-surface);color:var(--c-muted);font-size:11px}
		.md-rel-meta span:first-child{ color:var(--c-red);background:var(--c-red-soft)}
		.md-rel-arrow{ position:absolute;top:50%;transform:translateY(-50%);z-index:2;width:34px;height:34px;border:1px solid var(--c-line);border-radius:999px;background:rgba(255,255,255,.92);box-shadow:var(--sh-sm);color:var(--c-ink-2);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:.15s}
		.md-rel-arrow:hover{ color:var(--c-red);border-color:var(--c-red-line);background:var(--c-red-soft)}
		.md-rel-arrow.prev{ left:-6px}
		.md-rel-arrow.next{ right:-6px}
		.md-rel-arrow .icon{ width:15px;height:15px}
		@media(max-width:760px){ .md-paper{ padding:24px}.md-top{ display:block}.md-top h1{ font-size:23px}.md-top .ai-tag{ margin-top:12px}.md-content{ margin-top:22px;padding:34px 26px 32px 34px;border-left-width:4px;border-radius:16px;font-size:21px;line-height:1.85}.md-content:before{ left:13px;top:3px;font-size:62px}.md-actions .ai-btn{ width:100%}}
		@media(max-width:760px){ .md-related{ padding:14px}.md-related-head{ display:block}.md-tabs{ margin-top:12px}.md-rel-card{ flex-basis:82vw}.md-rel-arrow{ display:none}}
