:root{
            --bg:#191b20;
            --panel:#23262b;
            --panel-strong:#181b22;
            --accent:#e63946;
            --gold:#d7b75b;
            --text:#f2f2f2;
            --muted:#b8bcc4;
            --border:rgba(255,255,255,.08);
            --shadow:0 20px 45px rgba(0,0,0,.32);
            --radius-lg:22px;
            --radius-md:16px;
            --max-width:1180px;
        }
        *{box-sizing:border-box}
        body{
            margin:0;
            min-height:100vh;
            background:
                radial-gradient(circle at top, rgba(230,57,70,.12), transparent 28%),
                linear-gradient(180deg, #15171b 0%, #191b20 38%, #16181c 100%);
            color:var(--text);
            font-family:'Roboto', Arial, sans-serif;
        }
        a{color:inherit}
        .topbar{
            background:linear-gradient(180deg, rgba(24,27,34,.98), rgba(24,27,34,.92));
            border-bottom:1px solid var(--border);
            box-shadow:0 14px 28px rgba(0,0,0,.16);
        }
        .topbar-inner{
            max-width:var(--max-width);
            margin:0 auto;
            padding:1rem 1.5rem;
            display:flex;
            justify-content:space-between;
            align-items:center;
            gap:1rem;
            flex-wrap:wrap;
        }
        .chip-link{
            display:inline-flex;
            align-items:center;
            justify-content:center;
            min-height:40px;
            padding:.75rem 1rem;
            text-decoration:none;
            color:var(--text);
            background:rgba(255,255,255,.03);
            border:1px solid rgba(255,255,255,.07);
            border-radius:999px;
            transition:transform .2s ease,border-color .2s ease,background .2s ease;
        }
        .chip-link:hover,.chip-link:focus-visible{
            transform:translateY(-1px);
            border-color:rgba(215,183,91,.38);
            background:rgba(215,183,91,.08);
            outline:none;
        }
        .topbar-note{color:var(--muted);font-size:.93rem;text-align:right}
        .page-shell{
            max-width:var(--max-width);
            margin:0 auto;
            padding:2rem 1.25rem 2.8rem;
        }
        .hero{
            margin-bottom:1.5rem;
            padding:1.8rem 1.6rem;
            background:linear-gradient(180deg, rgba(35,38,43,.96), rgba(24,27,34,.96));
            border:1px solid var(--border);
            border-radius:var(--radius-lg);
            box-shadow:var(--shadow);
            text-align:center;
        }
        .kicker{
            display:inline-block;
            margin-bottom:.8rem;
            padding:.35rem .85rem;
            border-radius:999px;
            background:rgba(215,183,91,.12);
            border:1px solid rgba(215,183,91,.26);
            color:var(--gold);
            font-size:.82rem;
            letter-spacing:.12em;
            text-transform:uppercase;
        }
        h1{
            margin:0;
            font-family:'Oswald', Arial, sans-serif;
            font-size:clamp(2.3rem, 4.8vw, 4rem);
            line-height:.98;
            letter-spacing:.04em;
            text-transform:uppercase;
        }
        .hero p{
            max-width:800px;
            margin:.9rem auto 0;
            color:var(--muted);
            line-height:1.7;
            font-size:1rem;
        }
        .layout{
            display:grid;
            grid-template-columns:minmax(0, 1.08fr) minmax(300px, .92fr);
            gap:1.35rem;
        }
        .panel{
            background:linear-gradient(180deg, rgba(35,38,43,.96), rgba(24,27,34,.96));
            border:1px solid var(--border);
            border-radius:var(--radius-lg);
            box-shadow:var(--shadow);
        }
        .main-panel{padding:1.45rem}
        .side-panel{padding:1.35rem;display:grid;gap:1rem;align-content:start}
        .section-title{
            margin:0 0 1rem;
            font-family:'Oswald', Arial, sans-serif;
            font-size:1.45rem;
            letter-spacing:.05em;
            text-transform:uppercase;
            color:var(--gold);
        }
        .intro-copy{
            margin:0 0 1.1rem;
            color:var(--muted);
            line-height:1.75;
        }
        .era{
            margin-bottom:1rem;
            padding:1rem 1rem 1.05rem;
            border-radius:var(--radius-md);
            background:rgba(255,255,255,.035);
            border:1px solid rgba(255,255,255,.06);
        }
        .era h2{
            margin:0 0 .45rem;
            font-family:'Oswald', Arial, sans-serif;
            font-size:1.15rem;
            letter-spacing:.05em;
            text-transform:uppercase;
            color:var(--gold);
        }
        .era p{
            margin:0;
            color:#e8ebef;
            line-height:1.75;
        }
        .facts{
            display:grid;
            grid-template-columns:repeat(2, minmax(0, 1fr));
            gap:.9rem;
        }
        .fact{
            padding:1rem 1rem 1.05rem;
            border-radius:var(--radius-md);
            background:rgba(255,255,255,.035);
            border:1px solid rgba(255,255,255,.06);
        }
        .fact h3{
            margin:0 0 .35rem;
            font-size:.82rem;
            text-transform:uppercase;
            letter-spacing:.12em;
            color:var(--gold);
            font-weight:700;
        }
        .fact p{
            margin:0;
            color:#eef1f5;
            line-height:1.65;
            font-size:1rem;
        }
        .note{
            padding:1rem 1rem 1.05rem;
            border-radius:var(--radius-md);
            background:rgba(255,255,255,.035);
            border:1px solid rgba(255,255,255,.06);
        }
        .note h2{
            margin:0 0 .5rem;
            font-family:'Oswald', Arial, sans-serif;
            font-size:1.15rem;
            letter-spacing:.05em;
            text-transform:uppercase;
            color:var(--gold);
        }
        .note p, .note li{margin:0;color:var(--muted);line-height:1.7}
        .note ul{margin:.4rem 0 0;padding-left:1rem}
        .footer{padding-top:1.5rem;text-align:center;color:#9ea4af;font-size:.92rem}
        @media (max-width: 920px){.layout{grid-template-columns:1fr}}
        @media (max-width: 640px){
            .page-shell{padding:1.35rem .9rem 2rem}
            .topbar-inner{flex-direction:column; align-items:stretch}
            .topbar-note{text-align:left}
            .facts{grid-template-columns:1fr}
        }