.legacy{font-family:var(--sans);background:var(--bg);color:var(--text);line-height:1.6;}
.legacy header{ padding:28px 24px 16px; display:flex; gap:20px; align-items:center; border-bottom:1px solid var(--border); background:var(--surface); }
.legacy .brand{ display:flex; flex-direction:column; }
.legacy .brand h1{ margin:0; font-size:20px; letter-spacing:0.2px; }
.legacy .brand p{ margin:4px 0 0; color:var(--muted); font-size:13px; }
.legacy .container{display:grid;grid-template-columns:280px 1fr;gap:24px;}
.legacy nav.sidebar{ background: var(--surface); padding: 16px; border-radius: 12px; height: calc(100vh - 160px); overflow: auto; border: 1px solid var(--border); position: sticky; top: 20px; }
.legacy .toc{ list-style:none; padding:0; margin:8px 0; }
.legacy .toc li{ margin:6px 0; }
.legacy .toc a{ color:var(--text); text-decoration:none; font-size:14px; display:block; padding:4px 8px; border-radius:6px; transition:background 0.2s; }
.legacy .toc a:hover{ background:var(--accent-lt); text-decoration:none; }
.legacy .legacy-main{ padding:24px; border-radius:12px; background:var(--surface); border:1px solid var(--border); min-height:60vh; }
.legacy .intro{
        background:var(--accent-lt);
        border:1px solid var(--border);
        color:var(--text);
        padding:20px;
        border-radius:8px;
        margin-bottom:30px;
        font-size:15px;
    }
.legacy .intro strong{ color:var(--accent); }
.legacy .section{ margin-bottom:40px; }
.legacy .section h2{ margin:0 0 20px 0; font-size:24px; color:var(--accent); border-bottom:1px solid var(--border); padding-bottom:10px; }
.legacy h3{ font-size:18px; margin:24px 0 12px 0; color:var(--text); }
.legacy ul.resources{ list-style:none; padding:0; display:grid; gap:12px; }
.legacy ul.resources li{
        background:var(--surface);
        padding:12px 16px;
        border-radius:8px;
        border:1px solid var(--border);
        display:flex;
        flex-direction:column;
        gap:4px;
    }
.legacy ul.resources a{ color:var(--accent); text-decoration:none; font-weight:500; }
.legacy ul.resources a:hover{ text-decoration:underline; }
.legacy .date{ font-size:12px; color:var(--muted); display:inline-block; }
.legacy .back-link{
        color:var(--muted);
        text-decoration:none;
        font-size:14px;
        display:flex;
        align-items:center;
        gap:6px;
        padding:6px 12px;
        border-radius:6px;
        border:1px solid var(--border);
        transition:all 0.2s;
    }
.legacy .back-link:hover{ background:var(--accent-lt); color:var(--text); }
@media (max-width: 880px){.legacy .container{grid-template-columns:1fr;}.legacy .sidebar{ height: auto; position: static; }}