/* تنظیمات اولیه و ریست کردن فاصله‌ها */
        * { margin: 0; padding: 0; box-sizing: border-box; }
        
        /* پالت رنگی اختصاصی تاریخ ایران */
        :root {
            --bg-dark: #121212;         /* پس‌زمینه اصلی - تیره */
            --bg-darker: #0a0a0a;       /* پس‌زمینه خیلی تاریک */
            --persian-gold: #D4AF37;    /* طلایی تاریخی */
            --persian-blue: #1C39BB;    /* آبی لاجوردی/کاشی‌کاری */
            --persian-red: #8B0000;     /* قرمز تیره/زرشکی */
            --text-main: #E0E0E0;       /* رنگ متن اصلی (روشن) */
            --text-muted: #A0A0A0;      /* رنگ متن فرعی */
        }

        html { scroll-behavior: smooth; }
        
        body {
            font-family: 'Vazirmatn', sans-serif;
            background: var(--bg-dark);
            color: var(--text-main);
            line-height: 1.8;
            overflow-x: hidden;
        }

        /* ================= منوی بالای صفحه ================= */
        nav {
            position: fixed;
            top: 0; width: 100%;
            padding: 15px 40px;
            background: rgba(18, 18, 18, 0.85);
            backdrop-filter: blur(20px);
            border-bottom: 1px solid rgba(212, 175, 55, 0.2);
            z-index: 9999;
            display: flex;
            justify-content: space-between;
            align-items: center;
        }

        .nav-brand {
            font-family: 'Lalezar', cursive;
            font-size: 1.5rem;
            color: var(--persian-gold);
            text-shadow: 0 0 10px rgba(212, 175, 55, 0.3);
        }

        .nav-links {
            display: flex;
            gap: 25px;
            list-style: none;
        }

        .nav-links a {
            color: var(--text-main);
            text-decoration: none;
            font-size: 0.9rem;
            font-weight: 500;
            transition: all 0.3s ease;
            position: relative;
        }

        .nav-links a:hover { color: var(--persian-gold); }
        
        .nav-links a::after {
            content: '';
            position: absolute;
            bottom: -5px; right: 0;
            width: 0; height: 2px;
            background: var(--persian-gold);
            transition: width 0.3s ease;
        }

        .nav-links a:hover::after { width: 100%; }

        .mobile-menu {
            display: none;
            font-size: 1.5rem;
            cursor: pointer;
            color: var(--persian-gold);
        }

        /* ================= نوار پیشرفت زمان ================= */
        .time-meter {
            position: fixed;
            right: 20px;
            top: 50%;
            transform: translateY(-50%);
            z-index: 1000;
        }

        .time-meter .track {
            width: 4px;
            height: 400px;
            background: linear-gradient(to bottom, var(--persian-gold), var(--persian-red), var(--bg-darker));
            border-radius: 2px;
            position: relative;
        }

        .time-meter .marker {
            position: absolute;
            right: -4px;
            width: 12px;
            height: 12px;
            background: #fff;
            border-radius: 50%;
            box-shadow: 0 0 10px var(--persian-gold), 0 0 20px var(--persian-gold);
            transition: all 0.3s ease;
            z-index: 2;
        }

        .era-marker {
            position: absolute;
            right: -8px;
            width: 20px;
            height: 2px;
            background: var(--persian-gold);
            opacity: 0.5;
        }

        .era-label {
            position: absolute;
            right: 35px;
            top: -10px;
            font-size: 11px;
            color: var(--persian-gold);
            white-space: nowrap;
            font-weight: bold;
        }

        @media (max-width: 768px) {
            .nav-links { display: none; }
            .mobile-menu { display: block; }
            .time-meter { display: none; }
        }

        /* استایل بخش هیرو (صفحه اول که باز میشه) */
        .hero {
            height: 100vh;
            display: flex;
            align-items: center;
            justify-content: center;
            position: relative;
            background: radial-gradient(ellipse at center bottom, #2b1b11 0%, var(--bg-darker) 70%);
            overflow: hidden;
        }

        .hero-content {
            text-align: center;
            z-index: 10;
            padding: 0 20px;
            max-width: 900px;
        }

        .hero-era {
            font-size: 1rem;
            color: var(--persian-gold);
            letter-spacing: 2px;
            margin-bottom: 20px;
            font-weight: 300;
            animation: glow 2s ease-in-out infinite alternate;
        }

        @keyframes glow {
            from { text-shadow: 0 0 5px var(--persian-gold); }
            to { text-shadow: 0 0 15px var(--persian-gold), 0 0 20px #fff; }
        }

        .hero h1 {
            font-family: 'Lalezar', cursive;
            font-size: clamp(3rem, 8vw, 6rem);
            margin-bottom: 10px;
            line-height: 1.2;
            background: linear-gradient(135deg, #FFDF73 0%, var(--persian-gold) 50%, #8B6508 100%);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
        }

        .hero-subtitle {
            font-size: clamp(1.1rem, 2.5vw, 1.4rem);
            color: var(--text-muted);
            margin-top: 20px;
            font-weight: 300;
            max-width: 700px;
            margin-left: auto;
            margin-right: auto;
        }

        /* ================= بخش‌های محتوایی ================= */
        section { padding: 100px 40px; position: relative; z-index: 10; }
        
        .section-header { text-align: center; margin-bottom: 60px; }
        
        .section-era {
            font-size: 0.9rem;
            color: var(--persian-gold);
            letter-spacing: 2px;
            font-weight: 700;
            margin-bottom: 10px;
            display: block;
        }
        
        .section-title {
            font-family: 'Lalezar', cursive;
            font-size: clamp(2rem, 5vw, 3rem);
            margin-bottom: 15px;
            color: #fff;
            text-shadow: 0 0 10px rgba(212, 175, 55, 0.2);
        }
        
        .section-subtitle {
            color: var(--text-muted);
            font-size: 1.1rem;
            max-width: 600px;
            margin: 0 auto;
        }

        .cards-grid {
            max-width: 1200px;
            margin: 0 auto;
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
            gap: 30px;
        }

        .card {
            background: linear-gradient(135deg, rgba(28, 57, 187, 0.1), rgba(10, 10, 10, 0.8));
            border: 1px solid rgba(212, 175, 55, 0.2);
            border-radius: 15px;
            padding: 30px;
            backdrop-filter: blur(10px);
            transition: all 0.4s ease;
            position: relative;
            overflow: hidden;
        }

        .card::before {
            content: '';
            position: absolute;
            top: 0; right: 0;
            width: 100%; height: 3px;
            background: linear-gradient(90deg, var(--persian-gold), var(--persian-red));
            opacity: 0;
            transition: opacity 0.4s ease;
        }

        .card:hover {
            transform: translateY(-5px);
            border-color: rgba(212, 175, 55, 0.5);
            box-shadow: 0 15px 30px rgba(0,0,0,0.6), 0 0 20px rgba(212, 175, 55, 0.1);
        }

        .card:hover::before { opacity: 1; }

        .card-icon {
            font-size: 2.5rem;
            margin-bottom: 20px;
            display: inline-block;
            background: linear-gradient(135deg, var(--persian-gold), #fff);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
        }

        .card h3 { 
            font-family: 'Lalezar', cursive;
            font-size: 1.5rem; 
            margin-bottom: 15px; 
            color: var(--persian-gold); 
        }

        .card p { 
            color: var(--text-main); 
            font-size: 0.95rem; 
            line-height: 1.9; 
            text-align: justify;
        }
        
        .card-date {
            display: inline-block;
            margin-top: 15px;
            padding: 5px 12px;
            background: rgba(212, 175, 55, 0.1);
            border-radius: 20px;
            font-size: 0.8rem;
            color: var(--persian-gold);
            border: 1px solid rgba(212, 175, 55, 0.3);
        }

        /* ================= انیمیشن‌های اسکرول و ذرات غبار ================= */
        .fade-in { 
            opacity: 0; 
            transform: translateY(40px); 
            transition: all 0.8s ease-out; 
        }
        
        .fade-in.visible { 
            opacity: 1; 
            transform: translateY(0); 
        }

        .particles {
            position: fixed;
            top: 0; left: 0;
            width: 100%; height: 100%;
            pointer-events: none;
            z-index: 1;
        }

        .particle {
            position: absolute;
            width: 3px; height: 3px;
            background: var(--persian-gold);
            border-radius: 50%;
            box-shadow: 0 0 6px var(--persian-gold), 0 0 12px var(--persian-gold);
            animation: float 8s ease-in-out infinite;
            opacity: 0.4;
        }

        @keyframes float {
            0%, 100% { transform: translateY(0) translateX(0); opacity: 0.2; }
            50% { transform: translateY(-30px) translateX(20px); opacity: 0.6; }
        }
        
        /* زیباسازی اسکرول‌بار مرورگر */
        ::-webkit-scrollbar { width: 8px; }
        ::-webkit-scrollbar-track { background: var(--bg-darker); }
        ::-webkit-scrollbar-thumb { background: #333; border-radius: 4px; }
        ::-webkit-scrollbar-thumb:hover { background: var(--persian-gold); }

/* ================= ورودی سینمایی PersiaVerse ================= */
body.intro-active { overflow: hidden; }

.cinematic-intro {
    position: fixed;
    inset: 0;
    z-index: 50000;
    display: grid;
    place-items: center;
    overflow: hidden;
    background: #030303;
    color: #fff;
    isolation: isolate;
    transition: opacity 1s ease, visibility 1s ease;
}

.cinematic-intro[hidden] { display: none; }
.cinematic-intro.leaving { opacity: 0; visibility: hidden; pointer-events: none; }

.intro-sky,
.intro-sky::before,
.intro-sky::after {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.intro-sky {
    z-index: -2;
    background:
        radial-gradient(circle at 50% 112%, rgba(212,175,55,.24), transparent 34%),
        radial-gradient(circle at 50% 42%, rgba(145,104,21,.08), transparent 30%),
        linear-gradient(180deg, #030303 0%, #070604 55%, #0c0803 100%);
}

.intro-sky::before {
    content: '';
    opacity: .55;
    background-image:
        radial-gradient(circle, rgba(255,230,155,.8) 0 1px, transparent 1.4px),
        radial-gradient(circle, rgba(255,255,255,.5) 0 1px, transparent 1.5px);
    background-size: 113px 113px, 179px 179px;
    background-position: 13px 9px, 62px 41px;
    animation: introStars 14s linear infinite alternate;
}

.intro-sky::after {
    content: '';
    background: linear-gradient(90deg, transparent, rgba(212,175,55,.07), transparent);
    transform: translateX(-110%) skewX(-18deg);
    animation: introLightSweep 8s ease-in-out infinite;
}

.intro-orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(90px);
    opacity: .18;
    animation: introOrbFloat 9s ease-in-out infinite alternate;
}
.intro-orb-one { width: 440px; height: 440px; top: -180px; right: -100px; background: #8b1e24; }
.intro-orb-two { width: 520px; height: 520px; bottom: -280px; left: -180px; background: #d4af37; animation-delay: -3s; }

.intro-horizon {
    position: absolute;
    right: -10%;
    bottom: -18%;
    width: 120%;
    height: 43%;
    border-radius: 50% 50% 0 0;
    background:
        linear-gradient(150deg, transparent 36%, rgba(212,175,55,.08) 37%, transparent 38%),
        linear-gradient(30deg, transparent 48%, rgba(212,175,55,.06) 49%, transparent 50%),
        #050403;
    box-shadow: 0 -35px 100px rgba(212,175,55,.08);
    transform: perspective(500px) rotateX(62deg);
}

.intro-grain {
    position: absolute;
    inset: -50%;
    opacity: .055;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.9'/%3E%3C/svg%3E");
    animation: introGrain .22s steps(2) infinite;
}

.intro-skip {
    position: absolute;
    top: 28px;
    left: 32px;
    z-index: 3;
    border: 0;
    border-bottom: 1px solid rgba(212,175,55,.35);
    padding: 8px 0;
    background: transparent;
    color: rgba(255,255,255,.58);
    font: inherit;
    font-size: .78rem;
    cursor: pointer;
    transition: .25s ease;
}
.intro-skip:hover,
.intro-skip:focus-visible { color: #f5d87b; border-color: #f5d87b; }

.intro-content {
    width: min(760px, calc(100% - 38px));
    text-align: center;
    padding: 32px 20px;
    transform: translateY(12px);
}

.intro-emblem {
    width: clamp(110px, 15vw, 160px);
    margin: 0 auto 18px;
    opacity: 0;
    transform: scale(.72) rotate(-8deg);
    animation: introEmblemReveal 1.5s .15s cubic-bezier(.2,.8,.2,1) forwards;
}
.intro-emblem svg { width: 100%; overflow: visible; filter: drop-shadow(0 0 20px rgba(212,175,55,.22)); }
.emblem-ring { fill: none; stroke: #d4af37; }
.emblem-ring-outer { stroke-width: 1; stroke-dasharray: 9 8; animation: emblemSpin 22s linear infinite; transform-origin: center; }
.emblem-ring-inner { stroke-width: 1.5; opacity: .6; stroke-dasharray: 2 6; animation: emblemSpin 16s linear infinite reverse; transform-origin: center; }
.emblem-wing { fill: rgba(212,175,55,.12); stroke: #efce66; stroke-width: 1.4; }
.emblem-center { fill: rgba(212,175,55,.2); stroke: #f5d87b; stroke-width: 1.4; }
.emblem-jewel { fill: #f9e5a2; filter: drop-shadow(0 0 9px #d4af37); }

.intro-overline {
    margin-bottom: 8px;
    color: rgba(244,221,151,.65);
    font-family: Georgia, serif;
    font-size: clamp(.6rem, 1.3vw, .78rem);
    letter-spacing: .38em;
    direction: ltr;
    opacity: 0;
    animation: introRise .9s .8s ease forwards;
}

.intro-title {
    width: 100%;
    margin: 0;
    display: flex;
    align-items: baseline;
    justify-content: center;
    direction: ltr;
    unicode-bidi: isolate;
    white-space: nowrap;
    text-align: center;
    font-family: Georgia, 'Times New Roman', serif;
    font-size: clamp(2.6rem, 9vw, 6.8rem);
    font-weight: 400;
    letter-spacing: .06em;
    line-height: 1;
    color: #f4e7bd;
    text-shadow: 0 0 35px rgba(212,175,55,.16);
    opacity: 0;
    transform: translateY(20px);
    animation: introTitleReveal 1.2s .95s cubic-bezier(.2,.8,.2,1) forwards;
}
.intro-title-light { color: #f4e7bd; }
.intro-title-gold { color: #c79b27; }

.intro-subtitle {
    margin-top: 14px;
    color: rgba(255,255,255,.75);
    font-size: clamp(1rem, 2.4vw, 1.35rem);
    letter-spacing: .1em;
    opacity: 0;
    animation: introRise .9s 1.25s ease forwards;
}

.intro-divider {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 13px;
    width: min(410px, 75%);
    margin: 25px auto;
    opacity: 0;
    animation: introRise .9s 1.4s ease forwards;
}
.intro-divider span { height: 1px; flex: 1; background: linear-gradient(90deg, transparent, rgba(212,175,55,.55)); }
.intro-divider span:last-child { transform: scaleX(-1); }
.intro-divider i { width: 7px; height: 7px; border: 1px solid #d4af37; transform: rotate(45deg); }

.intro-copy {
    max-width: 590px;
    margin: 0 auto;
    color: rgba(235,231,220,.65);
    font-size: clamp(.88rem, 1.7vw, 1rem);
    line-height: 2;
    opacity: 0;
    animation: introRise .9s 1.55s ease forwards;
}

.intro-enter {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    min-width: 185px;
    margin-top: 30px;
    padding: 13px 25px;
    border: 1px solid rgba(212,175,55,.55);
    border-radius: 2px;
    overflow: hidden;
    background: rgba(212,175,55,.04);
    color: #f8e8b4;
    font: inherit;
    cursor: pointer;
    opacity: 0;
    pointer-events: none;
    transform: translateY(12px);
    transition: color .3s ease, border-color .3s ease, box-shadow .3s ease;
}
.intro-enter::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    background: linear-gradient(100deg, #8b6510, #d4af37);
    transform: translateX(105%);
    transition: transform .4s cubic-bezier(.2,.8,.2,1);
}
.intro-enter svg { width: 18px; fill: none; stroke: currentColor; stroke-width: 1.6; transform: scaleX(-1); }
.cinematic-intro.ready .intro-enter { opacity: 1; pointer-events: auto; transform: none; transition: opacity .6s ease, transform .6s ease, color .3s ease, border-color .3s ease, box-shadow .3s ease; }
.intro-enter:hover::before,
.intro-enter:focus-visible::before { transform: translateX(0); }
.intro-enter:hover,
.intro-enter:focus-visible { color: #100d07; border-color: #f3d271; box-shadow: 0 0 35px rgba(212,175,55,.16); }

.intro-loader {
    width: min(260px, 70%);
    height: 2px;
    margin: 27px auto 0;
    overflow: hidden;
    background: rgba(255,255,255,.08);
}
.intro-loader span { display: block; width: 0; height: 100%; background: linear-gradient(90deg, #6c4a08, #f3d271); box-shadow: 0 0 14px rgba(212,175,55,.7); transition: width .2s ease; }
.cinematic-intro.ready .intro-loader { opacity: .35; }

.intro-hint {
    display: block;
    margin-top: 12px;
    color: rgba(255,255,255,.28);
    font-size: .7rem;
    opacity: 0;
    transition: opacity .5s ease;
}
.cinematic-intro.ready .intro-hint { opacity: 1; animation: introHint 1.8s ease-in-out infinite; }

.nav-brand { gap: 10px; }
.brand-mark {
    display: inline-grid;
    place-items: center;
    width: 32px;
    height: 32px;
    border: 1px solid rgba(212,175,55,.55);
    border-radius: 50%;
    color: #f5d87b;
    font-family: Georgia, serif;
    font-size: .65rem;
    letter-spacing: -.04em;
    box-shadow: inset 0 0 14px rgba(212,175,55,.08);
}

@keyframes introStars { to { transform: translate3d(14px,-10px,0); opacity: .8; } }
@keyframes introLightSweep { 0%,40% { transform: translateX(-110%) skewX(-18deg); } 68%,100% { transform: translateX(120%) skewX(-18deg); } }
@keyframes introOrbFloat { to { transform: translate3d(40px,30px,0) scale(1.08); } }
@keyframes introGrain { 0% { transform: translate(0,0); } 25% { transform: translate(2%,-1%); } 50% { transform: translate(-1%,2%); } 75% { transform: translate(1%,1%); } }
@keyframes emblemSpin { to { transform: rotate(360deg); } }
@keyframes introEmblemReveal { to { opacity: 1; transform: none; } }
@keyframes introRise { to { opacity: 1; transform: translateY(0); } }
@keyframes introTitleReveal { to { opacity: 1; transform: none; letter-spacing: .09em; } }
@keyframes introHint { 50% { opacity: .45; } }

@media (max-width: 600px) {
    .intro-skip { top: 15px; left: 18px; }
    .intro-content { padding-inline: 8px; }
    .intro-copy { max-width: 92%; }
    .intro-title { letter-spacing: .01em; }
    .intro-title span { display: block; }
}

@media (prefers-reduced-motion: reduce) {
    .cinematic-intro *,
    .cinematic-intro *::before,
    .cinematic-intro *::after { animation: none !important; transition-duration: .01ms !important; }
    .intro-emblem, .intro-overline, .intro-title, .intro-subtitle, .intro-divider, .intro-copy { opacity: 1; transform: none; }
}

.timeline-section{padding:90px 20px;background:#111;color:#fff}
.timeline-section h2{text-align:center;font-size:2.2rem;margin-bottom:50px;color:#d4af37}
.timeline{max-width:900px;margin:auto;border-right:3px solid #d4af37;padding-right:30px}
.timeline-item{opacity:0;transform:translateY(40px);transition:.7s;margin:45px 0;position:relative}
.timeline-item.show{opacity:1;transform:none}
.timeline-item::before{content:'';position:absolute;right:-39px;top:8px;width:14px;height:14px;background:#d4af37;border-radius:50%}
.year{font-weight:700;color:#d4af37}
.card{background:#1a1a1a;padding:18px;border-radius:12px;margin-top:10px;border:1px solid #333}

/* =========================================================
   v4.1 — Smart auto-hide navbar
   ========================================================= */
.nav-reveal-zone {
    position: fixed;
    inset: 0 0 auto;
    height: 18px;
    z-index: 10001;
    pointer-events: auto;
}

.smart-nav {
    min-height: 68px;
    transition:
        transform .34s cubic-bezier(.2,.8,.2,1),
        width .34s cubic-bezier(.2,.8,.2,1),
        padding .34s cubic-bezier(.2,.8,.2,1),
        background-color .34s ease,
        border-radius .34s ease,
        box-shadow .34s ease,
        opacity .25s ease;
    will-change: transform, width;
}

/* حالت جمع‌شده: فقط لوگوی کوچک در بالای صفحه باقی می‌ماند. */
.smart-nav.nav-collapsed {
    top: 10px;
    right: 50%;
    left: auto;
    width: auto;
    min-width: 176px;
    min-height: 48px;
    padding: 8px 16px;
    transform: translateX(50%);
    border: 1px solid rgba(212,175,55,.28);
    border-radius: 999px;
    background: rgba(10,10,10,.72);
    box-shadow: 0 10px 35px rgba(0,0,0,.38), 0 0 24px rgba(212,175,55,.08);
}

.smart-nav.nav-collapsed .nav-links,
.smart-nav.nav-collapsed .mobile-menu {
    width: 0;
    max-width: 0;
    opacity: 0;
    visibility: hidden;
    overflow: hidden;
    pointer-events: none;
}

.smart-nav.nav-collapsed .nav-brand {
    margin-inline: auto;
    white-space: nowrap;
}

.smart-nav.nav-collapsed:hover,
.smart-nav.nav-collapsed:focus-within {
    border-color: rgba(212,175,55,.55);
    background: rgba(12,12,12,.9);
}

/* برای لینک‌های لنگری، تیتر بخش زیر منو پنهان نمی‌شود. */
section[id] { scroll-margin-top: 92px; }

@media (max-width: 900px) {
    .nav-reveal-zone { display: none; }
    .smart-nav,
    .smart-nav.nav-collapsed {
        top: 0;
        right: 0;
        left: 0;
        width: 100%;
        min-width: 0;
        min-height: 60px;
        padding: 12px 20px;
        transform: none;
        border-width: 0 0 1px;
        border-radius: 0;
    }
    .smart-nav.nav-collapsed .nav-links,
    .smart-nav.nav-collapsed .mobile-menu {
        width: auto;
        max-width: none;
        opacity: 1;
        visibility: visible;
        overflow: visible;
        pointer-events: auto;
    }
    .smart-nav.nav-collapsed .nav-links { display: none; }
    .smart-nav.nav-collapsed .nav-brand { margin-inline: 0; }
}

/* =========================================================
   v5.2.1 — Compact collapsed brand + Time Travel nav item
   ========================================================= */
.nav-brand {
    display: inline-flex;
    align-items: center;
    flex-direction: row-reverse;
    gap: 10px;
    color: var(--persian-gold);
    text-decoration: none;
}

.nav-brand .brand-word {
    transition: opacity .22s ease, transform .3s ease, max-width .3s ease;
    max-width: 150px;
    overflow: hidden;
}

.smart-nav.nav-collapsed {
    width: 54px;
    min-width: 54px;
    height: 54px;
    min-height: 54px;
    padding: 0;
    border-radius: 50%;
    justify-content: center;
    background: rgba(8, 8, 8, .82);
    border-color: rgba(212,175,55,.45);
    box-shadow: 0 8px 26px rgba(0,0,0,.42), 0 0 18px rgba(212,175,55,.12);
}

.smart-nav.nav-collapsed .nav-brand {
    width: 100%;
    height: 100%;
    margin: 0;
    justify-content: center;
    gap: 0;
}

.smart-nav.nav-collapsed .nav-brand .brand-word {
    max-width: 0;
    opacity: 0;
    transform: translateY(-4px) scale(.92);
}

.smart-nav.nav-collapsed .brand-mark {
    width: 36px;
    height: 36px;
    display: inline-grid;
    place-items: center;
    border: 1px solid rgba(212,175,55,.65);
    border-radius: 50%;
    font-size: .72rem;
    letter-spacing: .04em;
    background: radial-gradient(circle at 35% 30%, rgba(212,175,55,.18), transparent 58%);
    box-shadow: inset 0 0 14px rgba(212,175,55,.08);
}

.smart-nav.nav-collapsed:hover {
    transform: translateX(50%) translateY(-1px) scale(1.04);
    box-shadow: 0 10px 30px rgba(0,0,0,.5), 0 0 24px rgba(212,175,55,.18);
}

@media (max-width: 900px) {
    .nav-brand .brand-word { max-width: 150px; opacity: 1; transform: none; }
    .smart-nav.nav-collapsed .brand-mark { width: auto; height: auto; border: 0; border-radius: 0; background: none; box-shadow: none; }
}


/* =========================================================
   v5.3 — Navigation polish and compact identity
   ========================================================= */
:root {
    --ui-radius-sm: 12px;
    --ui-radius-md: 20px;
    --ui-radius-lg: 26px;
    --ui-speed: 280ms;
    --ui-ease: cubic-bezier(.2,.8,.2,1);
}

.smart-nav:not(.nav-collapsed) {
    min-height: 66px;
    padding-inline: clamp(22px, 3.2vw, 48px);
}

.smart-nav:not(.nav-collapsed) .nav-links {
    align-items: center;
    gap: clamp(12px, 1.25vw, 22px);
}

.nav-links li { display: flex; align-items: center; }
.nav-links a,
.nav-search-button {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 7px 2px;
    white-space: nowrap;
}

.nav-links a::after {
    bottom: 1px;
    height: 1px;
    border-radius: 999px;
    box-shadow: 0 0 8px rgba(212,175,55,.35);
}

.nav-links a.is-active { color: #f0cd68; }
.nav-links a.is-active::after { width: 100%; }

.nav-time-travel {
    margin-inline-start: 5px;
    padding-inline-start: 13px;
    border-inline-start: 1px solid rgba(212,175,55,.18);
}
.nav-time-travel a { color: #e7c65d; }
.nav-time-travel a::before {
    content: '✦';
    margin-inline-end: 7px;
    font-size: .64rem;
    opacity: .78;
}

.smart-nav.nav-collapsed {
    width: 46px;
    min-width: 46px;
    height: 46px;
    min-height: 46px;
    border-color: rgba(212,175,55,.38);
    box-shadow: 0 7px 22px rgba(0,0,0,.42), 0 0 13px rgba(212,175,55,.09);
}
.smart-nav.nav-collapsed .brand-mark {
    width: 29px;
    height: 29px;
    font-size: .61rem;
    border-color: rgba(212,175,55,.58);
}
.smart-nav.nav-collapsed:hover {
    transform: translateX(50%) translateY(-1px) scale(1.035);
}

@media (max-width: 1200px) and (min-width: 901px) {
    .smart-nav:not(.nav-collapsed) { padding-inline: 18px; }
    .smart-nav:not(.nav-collapsed) .nav-links { gap: 11px; }
    .nav-links a, .nav-search-button { font-size: .78rem; }
    .brand-word { display: none; }
}

@media (max-width: 900px) {
    .nav-time-travel { margin: 0; padding: 0; border: 0; }
}
/* =========================================================
   PersiaVerse — Interactive Historical Map
   ========================================================= */
.history-map-section {
    padding-top: 120px;
    background:
        radial-gradient(circle at 50% 30%, rgba(212,175,55,.09), transparent 36%),
        linear-gradient(180deg, #121212 0%, #090806 52%, #121212 100%);
}

.map-story-layout {
    width: min(1320px, 100%);
    margin: 0 auto;
    display: grid;
    grid-template-columns: 190px minmax(260px, 340px) minmax(0, 1fr);
    gap: 28px;
    align-items: start;
}

.map-periods {
    display: flex;
    flex-direction: column;
    gap: 12px;
    position: sticky;
    top: 110px;
    align-self: start;
}

.map-scroll-steps {
    display: grid;
    gap: 22vh;
    padding-block: 6vh 34vh;
}

.map-story-step {
    min-height: 300px;
    padding: 28px;
    border: 1px solid rgba(212,175,55,.14);
    border-radius: 20px;
    background: linear-gradient(145deg, rgba(255,255,255,.035), rgba(255,255,255,.012));
    opacity: .38;
    transform: translateY(24px) scale(.97);
    transition: opacity .45s ease, transform .45s ease, border-color .45s ease, background .45s ease;
}

.map-story-step.active {
    opacity: 1;
    transform: none;
    border-color: rgba(212,175,55,.5);
    background: linear-gradient(145deg, rgba(212,175,55,.12), rgba(139,0,0,.055));
    box-shadow: 0 24px 55px rgba(0,0,0,.28);
}

.story-number {
    display: block;
    color: rgba(212,175,55,.32);
    font-family: 'Lalezar', cursive;
    font-size: 3.4rem;
    line-height: .9;
}
.story-era { display: block; margin-top: 18px; color: var(--persian-gold); font-size: .8rem; }
.map-story-step h3 { margin: 7px 0 12px; color: #fff3c6; font-size: 1.35rem; }
.map-story-step p { color: #c9c4b8; line-height: 2; text-align: justify; }
.story-facts { margin-top: 22px; padding-top: 16px; border-top: 1px solid rgba(212,175,55,.15); }
.story-facts span, .story-facts strong { display: block; }
.story-facts span { color: var(--text-muted); font-size: .72rem; }
.story-facts strong { margin-top: 4px; color: #f3dda0; font-size: .9rem; }

.period-button {
    width: 100%;
    padding: 18px;
    border: 1px solid rgba(212,175,55,.18);
    border-radius: 14px;
    color: var(--text-main);
    background: rgba(255,255,255,.025);
    font: inherit;
    text-align: right;
    cursor: pointer;
    transition: .3s ease;
}

.period-button span,
.period-button small { display: block; }
.period-button span { font-weight: 800; font-size: 1rem; }
.period-button small { margin-top: 4px; color: var(--text-muted); }
.period-button:hover,
.period-button.active {
    transform: translateX(-6px);
    color: var(--persian-gold);
    border-color: rgba(212,175,55,.65);
    background: linear-gradient(135deg, rgba(212,175,55,.16), rgba(139,0,0,.08));
    box-shadow: 0 14px 30px rgba(0,0,0,.28);
}

.map-stage {
    min-height: 650px;
    position: sticky;
    top: 92px;
    overflow: hidden;
    border: 1px solid rgba(212,175,55,.22);
    border-radius: 26px;
    background:
        linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px),
        radial-gradient(circle at 50% 45%, rgba(71,51,23,.34), transparent 48%),
        #090806;
    background-size: 44px 44px, 44px 44px, auto, auto;
    box-shadow: 0 35px 80px rgba(0,0,0,.55), inset 0 0 90px rgba(212,175,55,.035);
}

.map-story-progress {
    position: absolute;
    z-index: 8;
    top: 0;
    right: 0;
    left: 0;
    height: 3px;
    background: rgba(255,255,255,.035);
}
.map-story-progress span {
    display: block;
    width: 25%;
    height: 100%;
    background: linear-gradient(90deg, #8b0000, var(--persian-gold), #fff0ad);
    box-shadow: 0 0 18px rgba(212,175,55,.6);
    transition: width .55s cubic-bezier(.2,.8,.2,1);
}

.map-stage::before {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(130deg, rgba(255,255,255,.055), transparent 25%, transparent 72%, rgba(212,175,55,.04));
}

.map-ambient {
    position: absolute;
    width: 270px;
    height: 270px;
    border-radius: 50%;
    filter: blur(90px);
    opacity: .12;
    pointer-events: none;
}
.map-ambient-one { top: -90px; right: 5%; background: #d4af37; }
.map-ambient-two { bottom: -100px; left: 8%; background: #8b0000; }

.map-status {
    position: absolute;
    z-index: 5;
    top: 28px;
    right: 30px;
    display: grid;
    gap: 2px;
    padding-right: 16px;
    border-right: 2px solid var(--persian-gold);
}
.map-status-kicker { color: var(--text-muted); font-size: .75rem; }
.map-status strong { color: #fff1bd; font-size: 1.25rem; }
.map-status > span:last-child { color: var(--persian-gold); font-size: .85rem; }

.historical-map {
    position: absolute;
    z-index: 2;
    top: 145px;
    right: 0;
    bottom: 78px;
    left: 0;
    width: 100%;
    height: calc(100% - 223px);
    min-height: 400px;
    display: block;
    margin: 0;
    overflow: visible;
    pointer-events: auto;
}

.historical-map .region-base {
    fill: #17110b;
    fill: url(#landGradient);
}

.historical-map .city-layer,
.historical-map #empireLayers,
.historical-map .region-base,
.historical-map .terrain-line {
    visibility: visible;
}

.region-base {
    fill: url(#landGradient);
    stroke: rgba(212,175,55,.42);
    stroke-width: 2;
}

.terrain-line {
    fill: none;
    stroke: rgba(212,175,55,.13);
    stroke-width: 12;
    stroke-linecap: round;
    stroke-dasharray: 2 22;
}
.terrain-line-two { opacity: .55; }

.empire-shape {
    fill: url(#empireFill);
    stroke: #e3be47;
    stroke-width: 4;
    stroke-linejoin: round;
    filter: url(#goldGlow);
    opacity: 0;
    transform-origin: center;
    transform: scale(.94);
    stroke-dasharray: 2400;
    stroke-dashoffset: 2400;
    transition: opacity .65s ease, transform .9s cubic-bezier(.2,.8,.2,1), stroke-dashoffset 1.5s ease;
    pointer-events: none;
}
.empire-shape.active {
    opacity: 1;
    transform: scale(1);
    stroke-dashoffset: 0;
}

.map-city { cursor: pointer; outline: none; }
.city-hitbox { fill: transparent; }
.city-core { fill: #fff6ce; filter: url(#cityGlow); transition: .25s; }
.city-ring {
    fill: none;
    stroke: var(--persian-gold);
    stroke-width: 2;
    transform-box: fill-box;
    transform-origin: center;
    animation: cityPulse 2.3s ease-out infinite;
}
.map-city text {
    fill: #f4df98;
    font-family: 'Vazirmatn', sans-serif;
    font-size: 16px;
    font-weight: 700;
    pointer-events: none;
    paint-order: stroke;
    stroke: #090806;
    stroke-width: 5px;
    stroke-linejoin: round;
}
.map-city:hover .city-core,
.map-city:focus .city-core { r: 10; fill: white; }
.map-city:hover text,
.map-city:focus text { fill: white; }

@keyframes cityPulse {
    0% { transform: scale(.65); opacity: .95; }
    70%,100% { transform: scale(1.8); opacity: 0; }
}

.map-caption {
    position: absolute;
    right: 30px;
    left: 30px;
    bottom: 24px;
    z-index: 4;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 15px 18px;
    border: 1px solid rgba(212,175,55,.17);
    border-radius: 14px;
    background: rgba(8,7,6,.72);
    backdrop-filter: blur(12px);
}
.map-caption p { color: #c7c2b4; font-size: .9rem; }
.caption-dot { width: 8px; height: 8px; flex: 0 0 auto; border-radius: 50%; background: var(--persian-gold); box-shadow: 0 0 14px var(--persian-gold); }

.city-modal {
    position: fixed;
    inset: 0;
    z-index: 20000;
    display: grid;
    place-items: center;
    padding: 20px;
    opacity: 0;
    visibility: hidden;
    transition: .35s ease;
}
.city-modal.open { opacity: 1; visibility: visible; }
.city-modal-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,.76); backdrop-filter: blur(9px); }
.city-modal-panel {
    width: min(560px, 100%);
    position: relative;
    z-index: 1;
    padding: 42px;
    border: 1px solid rgba(212,175,55,.42);
    border-radius: 24px;
    background: linear-gradient(145deg, #18130d, #090806);
    box-shadow: 0 40px 100px rgba(0,0,0,.75), 0 0 50px rgba(212,175,55,.08);
    transform: translateY(24px) scale(.96);
    transition: .35s ease;
}
.city-modal.open .city-modal-panel { transform: none; }
.city-modal-close {
    position: absolute;
    top: 15px;
    left: 17px;
    width: 38px;
    height: 38px;
    border: 1px solid rgba(212,175,55,.25);
    border-radius: 50%;
    background: rgba(255,255,255,.04);
    color: white;
    font-size: 1.6rem;
    cursor: pointer;
}
.city-modal-eyebrow { color: var(--persian-gold); font-size: .85rem; }
.city-modal-panel h2 { margin: 6px 0; font-family: 'Lalezar', cursive; font-size: 2.4rem; color: #fff; }
.city-modal-date { color: #d6bd6d; margin-bottom: 20px; }
.city-modal-description { color: #d5d1c7; text-align: justify; }
.city-modal-facts { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin-top: 24px; }
.city-fact { padding: 12px; border: 1px solid rgba(212,175,55,.14); border-radius: 12px; background: rgba(255,255,255,.025); }
.city-fact strong, .city-fact span { display: block; }
.city-fact strong { color: var(--persian-gold); font-size: .76rem; }
.city-fact span { margin-top: 3px; color: #fff; font-size: .9rem; }

@media (max-width: 1100px) {
    .map-story-layout { grid-template-columns: 180px minmax(240px, 300px) minmax(0, 1fr); }
}

@media (max-width: 900px) {
    .map-story-layout { grid-template-columns: 1fr; }
    .map-periods { position: static; display: grid; grid-template-columns: repeat(2,1fr); }
    .map-scroll-steps { gap: 18px; padding-block: 10px; }
    .map-story-step { min-height: auto; opacity: 1; transform: none; }
    .map-stage { position: relative; top: auto; }
    .period-button:hover, .period-button.active { transform: translateY(-3px); }
}

@media (max-width: 600px) {
    .history-map-section { padding-inline: 15px; }
    .map-periods { grid-template-columns: 1fr 1fr; gap: 8px; }
    .period-button { padding: 12px; }
    .period-button small { font-size: .68rem; }
    .map-stage { min-height: 560px; border-radius: 18px; }
    .historical-map { top: 142px; bottom: 72px; height: calc(100% - 214px); min-height: 340px; transform: none; }
    .map-status { top: 18px; right: 18px; }
    .map-status strong { font-size: 1rem; }
    .map-city text { font-size: 14px; }
    .map-caption { right: 14px; left: 14px; bottom: 14px; }
    .city-modal-panel { padding: 35px 23px 25px; }
    .city-modal-facts { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
    .empire-shape, .city-ring, .city-modal-panel { animation: none; transition: none; }
}

/* v3.3 — city interaction polish */
body.modal-open { overflow: hidden; }

.map-city {
    cursor: pointer;
    outline: none;
    transition: opacity .25s ease;
}

.map-city .city-hitbox { pointer-events: all; }

.map-city:focus-visible .city-hitbox {
    fill: rgba(212,175,55,.12);
    stroke: rgba(255,242,177,.75);
    stroke-width: 2;
}

.map-city.active .city-core {
    r: 11;
    fill: #fff;
}

.map-city.active .city-ring {
    stroke-width: 3;
    animation-duration: 1.35s;
}

.map-city.active text {
    fill: #fff;
}

.map-caption > div { min-width: 0; }
.map-caption small {
    display: block;
    margin-top: 3px;
    color: rgba(244,223,152,.7);
    font-size: .72rem;
}

.city-modal-panel::before {
    content: '';
    position: absolute;
    top: 0;
    right: 34px;
    left: 34px;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(212,175,55,.85), transparent);
}

@media (max-width: 600px) {
    .map-caption small { display: none; }
}

/* v3.5 — interactive empire timeline control */
.map-time-control {
    position: absolute;
    z-index: 9;
    top: 104px;
    right: 28px;
    left: 28px;
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 14px;
    border: 1px solid rgba(212,175,55,.2);
    border-radius: 16px;
    background: rgba(8,7,6,.76);
    backdrop-filter: blur(14px);
    box-shadow: 0 12px 30px rgba(0,0,0,.25);
}

.map-play-button {
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(212,175,55,.48);
    border-radius: 50%;
    color: #fff1bd;
    background: linear-gradient(145deg, rgba(212,175,55,.18), rgba(139,0,0,.12));
    cursor: pointer;
    transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.map-play-button:hover,
.map-play-button:focus-visible {
    transform: scale(1.07);
    border-color: rgba(255,235,164,.9);
    box-shadow: 0 0 24px rgba(212,175,55,.2);
    outline: none;
}
.map-play-button .pause-icon { display: none; }
.map-play-button.playing .play-icon { display: none; }
.map-play-button.playing .pause-icon { display: inline; }

.map-range-wrap { min-width: 0; flex: 1; }
.map-period-range {
    --range-progress: 0%;
    width: 100%;
    height: 5px;
    display: block;
    appearance: none;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--persian-gold) var(--range-progress), rgba(255,255,255,.12) var(--range-progress));
    cursor: pointer;
}
.map-period-range::-webkit-slider-thumb {
    width: 18px;
    height: 18px;
    appearance: none;
    border: 3px solid #1a140b;
    border-radius: 50%;
    background: #ffe69a;
    box-shadow: 0 0 0 2px var(--persian-gold), 0 0 20px rgba(212,175,55,.55);
}
.map-period-range::-moz-range-thumb {
    width: 14px;
    height: 14px;
    border: 3px solid #1a140b;
    border-radius: 50%;
    background: #ffe69a;
    box-shadow: 0 0 0 2px var(--persian-gold), 0 0 20px rgba(212,175,55,.55);
}
.map-period-range:focus-visible { outline: 2px solid rgba(255,230,154,.75); outline-offset: 7px; }
.range-labels {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 8px;
    margin-top: 9px;
    color: rgba(244,223,152,.58);
    font-size: .68rem;
}
.range-labels span { text-align: center; transition: color .3s ease, transform .3s ease; }
.range-labels span.active { color: #fff0ad; transform: translateY(-1px); }

.map-stage.period-achaemenid { --period-glow: rgba(212,175,55,.22); }
.map-stage.period-parthian { --period-glow: rgba(203,119,62,.23); }
.map-stage.period-sasanian { --period-glow: rgba(188,202,119,.2); }
.map-stage.period-safavid { --period-glow: rgba(70,157,133,.2); }
.map-stage::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background: radial-gradient(circle at 55% 48%, var(--period-glow, rgba(212,175,55,.18)), transparent 43%);
    transition: background .7s ease;
}
.map-stage .map-story-progress { z-index: 8; }
.map-stage .map-ambient { z-index: 1; }
.map-stage .map-status { z-index: 5; }
.map-stage .map-time-control { z-index: 9; }
.map-stage .historical-map { z-index: 2; }
.map-stage .map-caption { z-index: 4; }

@media (max-width: 600px) {
    .map-time-control { top: 92px; right: 14px; left: 14px; gap: 9px; padding: 10px; }
    .map-play-button { width: 36px; height: 36px; flex-basis: 36px; }
    .range-labels { font-size: .58rem; gap: 3px; }
}


/* v3.6 — geographically grounded SVG map */
.historical-map {
    top: 158px;
    right: 22px;
    bottom: 84px;
    left: 22px;
    width: calc(100% - 44px);
    height: calc(100% - 242px);
    min-height: 365px;
    overflow: hidden;
}
.geo-basemap { opacity: .92; }
.map-grid-lines path {
    fill: none;
    stroke: rgba(212,175,55,.045);
    stroke-width: 1;
    vector-effect: non-scaling-stroke;
}
.empire-shape {
    fill: url(#empireFill);
    stroke: #e6bd3f;
    stroke-width: 2.6;
    vector-effect: non-scaling-stroke;
    filter: url(#goldGlow);
    opacity: 0;
    transform: none;
    stroke-dasharray: 1700;
    stroke-dashoffset: 1700;
    transition: opacity .55s ease, stroke-dashoffset 1.15s ease, fill .55s ease;
}
.empire-shape.active { opacity: 1; transform: none; stroke-dashoffset: 0; }
.map-city text { font-size: 14px; stroke-width: 4px; }
.map-compass circle { fill: rgba(9,8,6,.66); stroke: rgba(212,175,55,.28); }
.map-compass path { fill: #d4af37; opacity: .7; }
.map-compass text { fill: rgba(244,223,152,.65); text-anchor: middle; font: 700 13px sans-serif; }
.map-stage::after { background: radial-gradient(circle at 57% 55%, var(--period-glow, rgba(212,175,55,.14)), transparent 38%); }
@media (max-width: 600px) {
    .historical-map {
        top: 148px;
        right: 8px;
        left: 8px;
        bottom: 76px;
        width: calc(100% - 16px);
        height: calc(100% - 224px);
        min-height: 330px;
    }
    .map-city text { font-size: 12px; }
}

/* v3.7 — museum-style period header polish */
.map-status {
    top: 24px;
    right: 28px;
    left: 28px;
    display: grid;
    grid-template-columns: minmax(220px, .9fr) minmax(360px, 1.6fr);
    gap: 22px;
    align-items: stretch;
    padding: 0;
    border-right: 0;
}
.map-status-heading {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    min-width: 0;
    padding: 15px 17px;
    border: 1px solid rgba(212,175,55,.28);
    border-radius: 16px;
    background: linear-gradient(145deg, rgba(212,175,55,.09), rgba(255,255,255,.025));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}
.map-status-crown {
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    border: 1px solid rgba(212,175,55,.42);
    border-radius: 50%;
    color: #f5ce54;
    background: rgba(10,8,5,.62);
    font-size: 1.35rem;
    box-shadow: 0 0 22px rgba(212,175,55,.16);
}
.map-status-heading > div { min-width: 0; }
.map-status-kicker { display: block; }
.map-status strong {
    display: block;
    margin-top: 2px;
    font-size: clamp(1.05rem, 1.45vw, 1.42rem);
    line-height: 1.55;
    white-space: normal;
}
.map-status .map-status-date {
    display: block;
    margin-top: 4px;
    color: #e9be39;
    font-size: .82rem;
    line-height: 1.7;
    white-space: normal;
}
.map-status-facts {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}
.map-status-facts > span {
    min-width: 0;
    padding: 10px 12px;
    border: 1px solid rgba(212,175,55,.16);
    border-radius: 12px;
    background: rgba(8,7,5,.56);
}
.map-status-facts small,
.map-status-facts b { display: block; }
.map-status-facts small { color: rgba(231,222,198,.58); font-size: .66rem; }
.map-status-facts b {
    margin-top: 3px;
    color: #f2ddb0;
    font-size: .76rem;
    line-height: 1.55;
    font-weight: 750;
}
.map-time-control {
    top: 174px;
}
.historical-map {
    top: 264px;
    bottom: 84px;
    height: calc(100% - 348px);
    min-height: 300px;
}

@media (max-width: 1200px) {
    .map-status { grid-template-columns: 1fr; gap: 10px; }
    .map-status-facts { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .map-time-control { top: 226px; }
    .historical-map { top: 314px; height: calc(100% - 398px); min-height: 260px; }
}

@media (max-width: 900px) {
    .map-stage { min-height: 760px; }
    .map-status { top: 18px; right: 18px; left: 18px; }
    .map-status-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .map-time-control { top: 260px; }
    .historical-map { top: 350px; height: calc(100% - 434px); min-height: 310px; }
}

@media (max-width: 600px) {
    .map-stage { min-height: 840px; }
    .map-status { right: 12px; left: 12px; gap: 8px; }
    .map-status-heading { padding: 12px; gap: 10px; }
    .map-status-crown { width: 34px; height: 34px; flex-basis: 34px; font-size: 1.05rem; }
    .map-status strong { font-size: 1rem; }
    .map-status .map-status-date { font-size: .73rem; }
    .map-status-facts { grid-template-columns: 1fr 1fr; gap: 6px; }
    .map-status-facts > span { padding: 8px 9px; }
    .map-status-facts b { font-size: .69rem; }
    .map-time-control { top: 300px; right: 12px; left: 12px; }
    .historical-map {
        top: 390px;
        right: 6px;
        left: 6px;
        bottom: 76px;
        width: calc(100% - 12px);
        height: calc(100% - 466px);
        min-height: 350px;
    }
}

/* =========================================================
   v4.1 — Larger, clearer historical city markers
   ========================================================= */
.map-city .city-core {
    filter: url(#cityGlow) drop-shadow(0 0 5px rgba(255,232,151,.9));
}

.map-city .city-ring {
    stroke-width: 2.5;
}

.map-city text {
    font-size: 18px;
    stroke-width: 5px;
    letter-spacing: -.2px;
}

.map-city:hover .city-core,
.map-city:focus .city-core { r: 12; }

.map-city.active .city-core { r: 13; }
.map-city.active .city-ring { stroke-width: 3.5; }

@media (max-width: 900px) {
    .map-city text { font-size: 16px; }
}

@media (max-width: 600px) {
    .map-city text { font-size: 14px; stroke-width: 4px; }
}


/* =========================================================
   v6.0 — Interactive Empire Atlas
   ========================================================= */
.atlas-toolbar {
    position: absolute;
    z-index: 12;
    top: 24px;
    left: 28px;
    width: min(330px, calc(100% - 56px));
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 10px 12px;
    border: 1px solid rgba(212,175,55,.22);
    border-radius: 16px;
    background: rgba(8,7,6,.78);
    backdrop-filter: blur(16px);
    box-shadow: 0 14px 35px rgba(0,0,0,.28);
}
.atlas-toolbar-title { display:flex; align-items:center; gap:9px; min-width:0; }
.atlas-toolbar-title > span { color:#e7bf47; font-size:1.15rem; }
.atlas-toolbar-title small,
.atlas-toolbar-title strong { display:block; white-space:nowrap; }
.atlas-toolbar-title small { color:var(--text-muted); font-size:.62rem; }
.atlas-toolbar-title strong { color:#fff0b2; font-size:.8rem; }
.atlas-layer-controls { display:flex; gap:6px; flex-wrap:wrap; justify-content:flex-end; }
.atlas-layer-toggle {
    padding:7px 9px;
    border:1px solid rgba(212,175,55,.16);
    border-radius:999px;
    color:#c9c1ad;
    background:rgba(255,255,255,.025);
    font:inherit;
    font-size:.68rem;
    cursor:pointer;
    transition:.25s ease;
}
.atlas-layer-toggle:hover,
.atlas-layer-toggle:focus-visible,
.atlas-layer-toggle.active {
    color:#fff2bd;
    border-color:rgba(212,175,55,.58);
    background:rgba(212,175,55,.12);
    box-shadow:0 0 18px rgba(212,175,55,.08);
    outline:none;
}
.map-time-control { padding-inline: 10px; }
.map-step-button {
    width:36px;
    height:36px;
    flex:0 0 36px;
    display:grid;
    place-items:center;
    border:1px solid rgba(212,175,55,.24);
    border-radius:50%;
    color:#f1d67e;
    background:rgba(255,255,255,.025);
    font-size:1.35rem;
    cursor:pointer;
    transition:.25s ease;
}
.map-step-button:hover,
.map-step-button:focus-visible { border-color:rgba(255,235,164,.8); background:rgba(212,175,55,.12); outline:none; transform:scale(1.06); }
.route-layer { opacity:0; visibility:hidden; transition:opacity .35s ease; pointer-events:none; }
.route-layer.active { opacity:1; visibility:visible; }
.historical-route {
    fill:none;
    stroke:#87d2c0;
    stroke-width:3;
    stroke-linecap:round;
    stroke-dasharray:10 10;
    vector-effect:non-scaling-stroke;
    opacity:0;
    filter:drop-shadow(0 0 5px rgba(89,190,166,.45));
    transition:opacity .4s ease;
    animation:routeFlow 5s linear infinite;
}
.historical-route.period-active { opacity:.9; }
@keyframes routeFlow { to { stroke-dashoffset:-80; } }
.route-legend rect { fill:rgba(8,7,6,.78); stroke:rgba(135,210,192,.32); }
.route-legend path { fill:none; stroke:#87d2c0; stroke-width:3; stroke-dasharray:8 7; }
.route-legend text { fill:#cdeee6; font-family:'Vazirmatn',sans-serif; font-size:12px; }
.comparison-layer { opacity:0; visibility:hidden; pointer-events:none; transition:opacity .35s ease; }
.comparison-layer.active:not(.empty) { opacity:1; visibility:visible; }
.comparison-shape {
    fill:rgba(155,120,205,.075);
    stroke:#ad86de;
    stroke-width:2.2;
    stroke-dasharray:8 7;
    vector-effect:non-scaling-stroke;
    filter:drop-shadow(0 0 5px rgba(173,134,222,.3));
}
.city-layer.layer-hidden { opacity:0; visibility:hidden; pointer-events:none; }
.city-layer { transition:opacity .3s ease; }
.map-city.period-hidden { opacity:0; visibility:hidden; pointer-events:none !important; display:none; }
.map-city.period-hidden * { pointer-events:none !important; }
.map-city { transition:opacity .3s ease, visibility .3s ease; }
.map-stage:focus-visible { outline:2px solid rgba(255,230,154,.55); outline-offset:5px; }

@media (max-width: 1180px) {
    .atlas-toolbar { top: 118px; left: 28px; right: 28px; width:auto; }
    .historical-map { top: 206px; height:calc(100% - 290px); }
    .map-time-control { top:160px; }
}
@media (max-width: 900px) {
    .atlas-toolbar { position:relative; top:auto; right:auto; left:auto; width:auto; margin:14px; }
    .map-status { position:relative; top:auto; right:auto; left:auto; margin:14px; }
    .map-time-control { top:174px; }
    .historical-map { top:228px; height:calc(100% - 308px); }
}
@media (max-width: 600px) {
    .atlas-toolbar { align-items:flex-start; flex-direction:column; gap:8px; }
    .atlas-layer-controls { justify-content:flex-start; }
    .atlas-layer-toggle { font-size:.62rem; padding:6px 8px; }
    .map-time-control { top:206px; }
    .historical-map { top:260px; height:calc(100% - 336px); }
    .map-step-button { width:32px; height:32px; flex-basis:32px; }
    .route-legend { display:none; }
}
@media (prefers-reduced-motion: reduce) {
    .historical-route { animation:none; }
}

/* =========================================================
   v6.0.2 — stable RTL timeline + non-overlapping atlas header
   ========================================================= */
/* The historical order starts on the right in RTL. Explicitly defining
   the slider direction prevents browser-dependent thumb reversals. */
.map-period-range {
    direction: rtl;
    background: linear-gradient(
        to left,
        var(--persian-gold) 0%,
        var(--persian-gold) var(--range-progress),
        rgba(255,255,255,.12) var(--range-progress),
        rgba(255,255,255,.12) 100%
    );
}

/* Reserve distinct vertical rows for period summary, atlas layers,
   timeline controls and the map. Nothing is allowed to overlap. */
@media (min-width: 1201px) {
    .map-stage { min-height: 790px; }
    .map-status { top: 24px; right: 28px; left: 28px; }
    .atlas-toolbar {
        top: 172px;
        right: 28px;
        left: 28px;
        width: auto;
        min-height: 52px;
    }
    .map-time-control { top: 238px; right: 28px; left: 28px; }
    .historical-map {
        top: 326px;
        bottom: 74px;
        height: calc(100% - 400px);
        min-height: 360px;
    }
}

@media (min-width: 901px) and (max-width: 1200px) {
    .map-stage { min-height: 900px; }
    .map-status { top: 22px; right: 24px; left: 24px; }
    .atlas-toolbar {
        top: 244px;
        right: 24px;
        left: 24px;
        width: auto;
    }
    .map-time-control { top: 310px; right: 24px; left: 24px; }
    .historical-map {
        top: 398px;
        bottom: 72px;
        height: calc(100% - 470px);
        min-height: 390px;
    }
}

/* On smaller layouts, keep all header blocks in normal document flow.
   This is more robust than stacking absolute offsets. */
@media (max-width: 900px) {
    .map-stage {
        min-height: 0;
        padding: 14px;
        overflow: hidden;
    }
    .map-status,
    .atlas-toolbar,
    .map-time-control,
    .historical-map {
        position: relative;
        inset: auto;
        top: auto;
        right: auto;
        bottom: auto;
        left: auto;
        width: auto;
        height: auto;
        margin: 0 0 12px;
    }
    .map-status { margin-top: 4px; }
    .atlas-toolbar { margin-inline: 0; }
    .map-time-control { margin-inline: 0; }
    .historical-map {
        display: block;
        width: 100%;
        min-height: 420px;
        aspect-ratio: 1000 / 620;
        margin-bottom: 62px;
    }
}

/* =========================================================
   PersiaVerse v6.1 — Smooth empire boundary morph
   ========================================================= */
#empireLayers {
    opacity: 0;
    pointer-events: none;
}

.empire-morph-shape {
    fill: url(#empireFill);
    stroke: #e3be47;
    stroke-width: 4;
    stroke-linejoin: round;
    filter: url(#goldGlow);
    pointer-events: none;
    vector-effect: non-scaling-stroke;
    opacity: 1;
}

.map-stage.map-is-morphing .empire-morph-shape {
    filter: url(#goldGlow);
}

.map-stage.map-is-morphing .map-status-heading,
.map-stage.map-is-morphing .map-caption {
    animation: atlasContentPulse .9s ease both;
}

@keyframes atlasContentPulse {
    0% { opacity: .68; transform: translateY(3px); }
    45% { opacity: .86; }
    100% { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
    .map-stage.map-is-morphing .map-status-heading,
    .map-stage.map-is-morphing .map-caption {
        animation: none;
    }
}

/* Phase 6.2 — guided Play History */
.map-time-control {
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
}
.map-playback-actions {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    direction: ltr;
}
.map-range-wrap { position: relative; min-width: 0; }
.map-playback-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-bottom: 7px;
    color: rgba(255,240,190,.74);
    font-size: .68rem;
}
#mapPlaybackCounter { color: rgba(255,255,255,.52); font-variant-numeric: tabular-nums; }
.map-playback-sweep {
    position: absolute;
    right: 0;
    left: 0;
    bottom: -7px;
    height: 2px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(255,255,255,.06);
    opacity: 0;
    transition: opacity .25s ease;
}
.map-playback-sweep::after {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    transform-origin: right center;
    transform: scaleX(0);
    background: linear-gradient(90deg, #bd2c1d, #f2d565);
}
.map-time-control.is-playing .map-playback-sweep { opacity: 1; }
.map-time-control.is-playing .map-playback-sweep::after {
    animation: mapPlaybackSweep var(--playback-duration, 2600ms) linear forwards;
}
.map-time-control.is-paused .map-playback-sweep::after { animation-play-state: paused; }
@keyframes mapPlaybackSweep { to { transform: scaleX(1); } }
.map-speed-control {
    display: grid;
    gap: 4px;
    min-width: 74px;
    color: rgba(255,240,190,.62);
    font-size: .62rem;
}
.map-speed-control select {
    border: 1px solid rgba(226,183,61,.28);
    border-radius: 12px;
    padding: 7px 9px;
    color: #f7e8b7;
    background: rgba(11,10,8,.82);
    font: inherit;
    cursor: pointer;
}
.map-speed-control select:focus-visible { outline: 2px solid rgba(255,230,154,.72); outline-offset: 3px; }
.map-stage.play-history-active .map-status,
.map-stage.play-history-active .historical-map { transition-duration: .55s; }
@media (max-width: 760px) {
    .map-time-control { grid-template-columns: 1fr; }
    .map-playback-actions { justify-content: center; }
    .map-speed-control { grid-template-columns: auto auto; justify-content: center; align-items: center; }
    .map-playback-meta { font-size: .62rem; }
}


/* v6.4 — Atlas Pro camera and contextual city tooltip */
.historical-map {
    --map-zoom: 1;
    --map-pan-x: 0%;
    --map-pan-y: 0%;
    transform: translate(var(--map-pan-x), var(--map-pan-y)) scale(var(--map-zoom));
    transform-origin: 50% 50%;
    transition: transform 900ms cubic-bezier(.2,.8,.2,1), opacity .55s ease;
    will-change: transform;
}
.map-camera-controls {
    position: absolute;
    z-index: 12;
    left: 26px;
    top: 28px;
    display: grid;
    grid-template-columns: repeat(4, 38px);
    gap: 7px;
    padding: 7px;
    border: 1px solid rgba(226,183,61,.22);
    border-radius: 16px;
    background: rgba(8,7,6,.72);
    box-shadow: 0 14px 34px rgba(0,0,0,.32);
    backdrop-filter: blur(14px);
}
.map-camera-controls button {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(226,183,61,.2);
    border-radius: 11px;
    color: #f5e5b0;
    background: rgba(255,255,255,.035);
    font: 700 1.05rem/1 inherit;
    cursor: pointer;
    transition: .22s ease;
}
.map-camera-controls button:hover,
.map-camera-controls button:focus-visible,
.map-camera-controls button.active {
    color: #fff5cf;
    border-color: rgba(242,206,100,.62);
    background: rgba(212,175,55,.16);
    box-shadow: 0 0 18px rgba(212,175,55,.12);
}
.map-city-tooltip {
    position: absolute;
    z-index: 15;
    min-width: 170px;
    padding: 10px 13px;
    border: 1px solid rgba(242,206,100,.34);
    border-radius: 12px;
    background: rgba(10,9,7,.92);
    box-shadow: 0 18px 42px rgba(0,0,0,.48);
    backdrop-filter: blur(12px);
    opacity: 0;
    visibility: hidden;
    transform: translate(-50%, -100%) translateY(8px);
    pointer-events: none;
    transition: opacity .2s ease, transform .2s ease, visibility .2s ease;
}
.map-city-tooltip.visible {
    opacity: 1;
    visibility: visible;
    transform: translate(-50%, -100%) translateY(0);
}
.map-city-tooltip::after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: -6px;
    width: 10px;
    height: 10px;
    transform: translateX(-50%) rotate(45deg);
    border-right: 1px solid rgba(242,206,100,.34);
    border-bottom: 1px solid rgba(242,206,100,.34);
    background: rgba(10,9,7,.92);
}
.map-city-tooltip strong,
.map-city-tooltip span { display: block; }
.map-city-tooltip strong { color: #fff1bd; font-size: .86rem; }
.map-city-tooltip span { margin-top: 3px; color: rgba(255,240,190,.65); font-size: .67rem; line-height: 1.65; }
@media (max-width: 760px) {
    .map-camera-controls { top: 18px; left: 18px; grid-template-columns: repeat(2, 36px); }
    .map-camera-controls button { width: 36px; height: 36px; }
}
@media (prefers-reduced-motion: reduce) {
    .historical-map { transition-duration: .01ms; }
}


/* v9.0 — Expanded historical atlas */
.map-periods {
    max-height: calc(100vh - 128px);
    overflow-y: auto;
    padding-left: 6px;
    scrollbar-width: thin;
    scrollbar-color: rgba(212,175,55,.45) transparent;
}
.map-period-group-title {
    position: sticky;
    top: 0;
    z-index: 2;
    padding: 9px 10px 6px;
    color: #d8b94f;
    background: linear-gradient(180deg,#0b0906 72%,transparent);
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .04em;
}
.map-period-group-title:not(:first-child){ margin-top: 6px; }
.map-periods .period-button { padding: 12px 14px; }
.map-periods .period-button span { font-size: .9rem; }
.map-periods .period-button small { font-size: .68rem; }
.range-labels { grid-template-columns: repeat(13,minmax(36px,1fr)); overflow: hidden; }
.range-labels span { font-size: .52rem; white-space: nowrap; }
@media (max-width: 1100px){
  .map-periods { max-height: none; overflow: visible; }
  .map-period-group-title { position: static; grid-column: 1/-1; background: none; padding: 12px 4px 2px; }
  .range-labels span:nth-child(even){ opacity:.45; }
}
@media (max-width: 700px){
  .range-labels span { display:none; }
  .range-labels span:first-child,.range-labels span:nth-child(5),.range-labels span:nth-child(8),.range-labels span:last-child { display:block; }
  .range-labels { grid-template-columns: repeat(4,1fr); }
}

/* v9.5 — hard-disable inactive SVG city hitboxes */
.map-city[data-active-city="false"] { display:none !important; visibility:hidden !important; pointer-events:none !important; }
.map-city[data-active-city="false"] * { pointer-events:none !important; }
/* PersiaVerse v4.0 — Kings Module */
.kings-section{position:relative;padding:110px 6vw;background:radial-gradient(circle at 15% 15%,rgba(212,175,55,.08),transparent 28%),linear-gradient(180deg,#0d0c09,#121008 52%,#0b0a08);overflow:hidden}
.kings-section::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(212,175,55,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(212,175,55,.025) 1px,transparent 1px);background-size:64px 64px;mask-image:linear-gradient(to bottom,transparent,#000 18%,#000 82%,transparent)}
.kings-grid{position:relative;z-index:1;max-width:1240px;margin:52px auto 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.king-card{position:relative;min-height:390px;border:1px solid rgba(212,175,55,.22);border-radius:24px;overflow:hidden;background:linear-gradient(160deg,rgba(255,255,255,.035),rgba(212,175,55,.025) 45%,rgba(0,0,0,.25));box-shadow:0 20px 70px rgba(0,0,0,.25);transition:transform .35s ease,border-color .35s ease,box-shadow .35s ease}
.king-card:hover,.king-card:focus-within{transform:translateY(-8px);border-color:rgba(243,210,113,.62);box-shadow:0 25px 80px rgba(0,0,0,.35),0 0 35px rgba(212,175,55,.08)}
.king-card::after{content:"";position:absolute;inset:auto -20% -45% -20%;height:70%;background:radial-gradient(circle,rgba(212,175,55,.16),transparent 65%);pointer-events:none}
.king-portrait{height:205px;display:grid;place-items:center;position:relative;background:radial-gradient(circle at 50% 42%,rgba(212,175,55,.25),transparent 38%),linear-gradient(180deg,rgba(212,175,55,.07),transparent)}
.king-portrait::before{content:"";position:absolute;width:126px;height:126px;border:1px solid rgba(212,175,55,.36);border-radius:50%;box-shadow:inset 0 0 35px rgba(212,175,55,.08),0 0 40px rgba(212,175,55,.06)}
.king-monogram{position:relative;z-index:1;font-family:Georgia,serif;font-size:3.6rem;color:#f4d77b;text-shadow:0 0 28px rgba(212,175,55,.35)}
.king-era-chip{position:absolute;top:18px;right:18px;padding:7px 11px;border:1px solid rgba(212,175,55,.28);border-radius:999px;background:rgba(8,7,5,.72);color:#d7bd6a;font-size:.72rem}
.king-card-body{position:relative;z-index:1;padding:22px 22px 24px}
.king-card h3{margin:0 0 5px;color:#fff2c4;font-size:1.45rem}
.king-reign{display:block;color:#a99555;font-size:.82rem;margin-bottom:13px}
.king-card p{margin:0;color:rgba(245,241,228,.68);line-height:1.95;font-size:.91rem}
.king-card-footer{display:flex;align-items:center;justify-content:space-between;margin-top:20px;padding-top:17px;border-top:1px solid rgba(212,175,55,.13)}
.king-title{color:#c6ad61;font-size:.78rem}
.king-open{border:0;background:transparent;color:#f0cf68;font:inherit;font-size:.82rem;cursor:pointer;display:inline-flex;align-items:center;gap:7px;padding:7px 0}
.king-open::after{content:"←";transition:transform .25s ease}.king-open:hover::after{transform:translateX(-4px)}
.kings-note{max-width:900px;margin:28px auto 0;text-align:center;color:rgba(255,255,255,.42);font-size:.78rem;line-height:1.9}
.king-modal{position:fixed;inset:0;z-index:5000;display:grid;place-items:center;padding:24px;opacity:0;visibility:hidden;transition:opacity .28s ease,visibility .28s ease}
.king-modal.open{opacity:1;visibility:visible}
.king-modal-backdrop{position:absolute;inset:0;background:rgba(3,3,2,.82);backdrop-filter:blur(12px)}
.king-modal-panel{position:relative;width:min(920px,96vw);max-height:min(820px,90vh);overflow:auto;border:1px solid rgba(212,175,55,.32);border-radius:26px;background:linear-gradient(160deg,#17140d,#0d0c09 72%);box-shadow:0 35px 120px rgba(0,0,0,.7),0 0 55px rgba(212,175,55,.08);transform:translateY(22px) scale(.98);transition:transform .35s ease}
.king-modal.open .king-modal-panel{transform:none}
.king-modal-close{position:absolute;top:17px;left:17px;z-index:3;width:42px;height:42px;border-radius:50%;border:1px solid rgba(212,175,55,.28);background:rgba(0,0,0,.3);color:#f0d271;font-size:1.55rem;cursor:pointer}
.king-modal-hero{display:grid;grid-template-columns:270px 1fr;gap:30px;padding:42px;background:radial-gradient(circle at 15% 30%,rgba(212,175,55,.16),transparent 34%)}
.king-modal-emblem{min-height:270px;display:grid;place-items:center;border:1px solid rgba(212,175,55,.18);border-radius:22px;background:radial-gradient(circle,rgba(212,175,55,.16),transparent 60%)}
.king-modal-emblem span{font-family:Georgia,serif;font-size:6rem;color:#f0d06a;text-shadow:0 0 50px rgba(212,175,55,.35)}
.king-modal-eyebrow{color:#c8aa52;font-size:.8rem;letter-spacing:.06em}
.king-modal h2{margin:9px 0 4px;color:#fff2c4;font-size:2.3rem}.king-modal-reign{color:#9d8950;margin:0 0 20px}.king-modal-summary{color:rgba(248,243,226,.72);line-height:2.15;margin:0}
.king-modal-content{padding:0 42px 42px}.king-facts{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:28px}.king-fact{padding:16px;border:1px solid rgba(212,175,55,.15);border-radius:14px;background:rgba(255,255,255,.02)}.king-fact small{display:block;color:#8f8056;font-size:.72rem;margin-bottom:6px}.king-fact strong{color:#f0dfaa;font-size:.9rem}
.king-columns{display:grid;grid-template-columns:1fr 1fr;gap:24px}.king-panel{padding:22px;border-top:1px solid rgba(212,175,55,.16);background:linear-gradient(180deg,rgba(212,175,55,.025),transparent)}.king-panel h3{margin:0 0 15px;color:#e5c765;font-size:1rem}.king-panel ul{margin:0;padding:0 18px 0 0;color:rgba(245,240,224,.68);line-height:2.05;font-size:.9rem}
body.king-modal-open{overflow:hidden}
@media(max-width:980px){.kings-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.king-modal-hero{grid-template-columns:210px 1fr}.king-facts{grid-template-columns:repeat(2,1fr)}}
@media(max-width:650px){.kings-section{padding:82px 18px}.kings-grid{grid-template-columns:1fr}.king-card{min-height:0}.king-modal{padding:10px}.king-modal-panel{max-height:94vh}.king-modal-hero{grid-template-columns:1fr;padding:28px 22px 22px}.king-modal-emblem{min-height:155px}.king-modal-emblem span{font-size:4.4rem}.king-modal h2{font-size:1.8rem}.king-modal-content{padding:0 22px 28px}.king-facts,.king-columns{grid-template-columns:1fr}.king-modal-close{top:12px;left:12px}}

/* v4.2 — Data-driven encyclopedia states */
.kings-loading,.kings-error{grid-column:1/-1;min-height:220px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;text-align:center;border:1px solid rgba(212,175,55,.18);border-radius:22px;background:rgba(255,255,255,.018);color:rgba(245,241,228,.72)}
.kings-loading-ring{width:38px;height:38px;border-radius:50%;border:2px solid rgba(212,175,55,.18);border-top-color:#e3c55f;animation:kings-spin .85s linear infinite}
.kings-error strong{color:#f0d77f;font-size:1rem}.kings-error span{color:rgba(245,241,228,.55);font-size:.86rem}
.kings-retry{border:1px solid rgba(212,175,55,.38);border-radius:999px;background:rgba(212,175,55,.08);color:#f0d271;padding:10px 18px;font:inherit;cursor:pointer;transition:transform .2s ease,border-color .2s ease,background .2s ease}
.kings-retry:hover,.kings-retry:focus-visible{transform:translateY(-2px);border-color:rgba(243,210,113,.75);background:rgba(212,175,55,.14)}
@keyframes kings-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.kings-loading-ring{animation-duration:1.8s}}
.monuments-section{position:relative;padding:110px 5vw;background:radial-gradient(circle at 15% 20%,rgba(212,175,55,.09),transparent 31%),linear-gradient(180deg,#0b0b09,#11100c 50%,#0a0a08);overflow:hidden}.monuments-section::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(212,175,55,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(212,175,55,.025) 1px,transparent 1px);background-size:56px 56px;mask-image:linear-gradient(to bottom,transparent,#000 20%,#000 80%,transparent);pointer-events:none}.monuments-toolbar{position:relative;z-index:1;max-width:1120px;margin:0 auto 34px;display:flex;justify-content:center;gap:10px;flex-wrap:wrap}.monument-filter{border:1px solid rgba(212,175,55,.22);border-radius:999px;background:rgba(255,255,255,.025);color:rgba(245,239,218,.65);padding:10px 17px;font:inherit;font-size:.82rem;cursor:pointer;transition:.25s ease}.monument-filter:hover,.monument-filter:focus-visible,.monument-filter.active{color:#f3d77e;border-color:rgba(212,175,55,.62);background:rgba(212,175,55,.11);transform:translateY(-2px)}.monuments-grid{position:relative;z-index:1;max-width:1180px;margin:auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.monument-card{position:relative;min-height:390px;border:1px solid rgba(212,175,55,.16);border-radius:22px;overflow:hidden;background:linear-gradient(155deg,rgba(31,27,17,.96),rgba(10,10,8,.98));transition:transform .35s ease,border-color .35s ease,box-shadow .35s ease}.monument-card:hover{transform:translateY(-8px);border-color:rgba(212,175,55,.48);box-shadow:0 22px 60px rgba(0,0,0,.42),0 0 35px rgba(212,175,55,.08)}.monument-visual{height:190px;display:grid;place-items:center;position:relative;background:radial-gradient(circle at 50% 50%,rgba(212,175,55,.22),transparent 40%),linear-gradient(180deg,rgba(212,175,55,.06),transparent)}.monument-visual::before,.monument-visual::after{content:"";position:absolute;border:1px solid rgba(212,175,55,.24);border-radius:50%}.monument-visual::before{width:128px;height:128px}.monument-visual::after{width:94px;height:94px;border-style:dashed;animation:monument-orbit 15s linear infinite}.monument-icon{position:relative;z-index:1;font-family:Georgia,serif;font-size:3.8rem;color:#f0d06a;text-shadow:0 0 35px rgba(212,175,55,.36)}.monument-era-chip{position:absolute;top:16px;right:16px;z-index:2;padding:7px 11px;border:1px solid rgba(212,175,55,.28);border-radius:999px;background:rgba(8,7,5,.74);color:#d7bd6a;font-size:.72rem}.monument-card-body{padding:22px;position:relative;z-index:1}.monument-card h3{margin:0 0 4px;color:#fff0bd;font-size:1.35rem}.monument-location{display:block;color:#9c8954;font-size:.78rem;margin-bottom:12px}.monument-card p{margin:0;color:rgba(245,241,228,.67);line-height:1.95;font-size:.89rem}.monument-card-footer{display:flex;align-items:center;justify-content:space-between;margin-top:18px;padding-top:16px;border-top:1px solid rgba(212,175,55,.12)}.monument-period{color:#baa35d;font-size:.75rem}.monument-open{border:0;background:transparent;color:#f0cf68;font:inherit;font-size:.8rem;cursor:pointer;display:inline-flex;gap:6px;align-items:center}.monument-open::after{content:"←";transition:transform .25s ease}.monument-open:hover::after{transform:translateX(-4px)}.monuments-note{position:relative;z-index:1;max-width:900px;margin:28px auto 0;text-align:center;color:rgba(255,255,255,.4);font-size:.78rem;line-height:1.9}.monument-modal{position:fixed;inset:0;z-index:5100;display:grid;place-items:center;padding:24px;opacity:0;visibility:hidden;transition:.28s ease}.monument-modal.open{opacity:1;visibility:visible}.monument-modal-backdrop{position:absolute;inset:0;background:rgba(3,3,2,.84);backdrop-filter:blur(12px)}.monument-modal-panel{position:relative;width:min(920px,96vw);max-height:min(820px,90vh);overflow:auto;border:1px solid rgba(212,175,55,.32);border-radius:26px;background:linear-gradient(160deg,#17140d,#0d0c09 72%);box-shadow:0 35px 120px rgba(0,0,0,.72),0 0 55px rgba(212,175,55,.08);transform:translateY(22px) scale(.98);transition:transform .35s ease}.monument-modal.open .monument-modal-panel{transform:none}.monument-modal-close{position:absolute;top:17px;left:17px;z-index:3;width:42px;height:42px;border-radius:50%;border:1px solid rgba(212,175,55,.28);background:rgba(0,0,0,.3);color:#f0d271;font-size:1.55rem;cursor:pointer}.monument-modal-hero{display:grid;grid-template-columns:270px 1fr;gap:30px;padding:42px;background:radial-gradient(circle at 15% 30%,rgba(212,175,55,.16),transparent 34%)}.monument-modal-emblem{min-height:270px;display:grid;place-items:center;border:1px solid rgba(212,175,55,.18);border-radius:22px;background:radial-gradient(circle,rgba(212,175,55,.16),transparent 60%)}.monument-modal-emblem span{font-family:Georgia,serif;font-size:5rem;color:#f0d06a;text-shadow:0 0 50px rgba(212,175,55,.35)}.monument-modal-eyebrow{color:#c8aa52;font-size:.8rem}.monument-modal h2{margin:9px 0 4px;color:#fff2c4;font-size:2.3rem}.monument-modal-location{color:#9d8950;margin:0 0 20px}.monument-modal-summary{color:rgba(248,243,226,.72);line-height:2.15;margin:0}.monument-modal-content{padding:0 42px 42px}.monument-facts{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:28px}.monument-fact{padding:16px;border:1px solid rgba(212,175,55,.15);border-radius:14px;background:rgba(255,255,255,.02)}.monument-fact small{display:block;color:#8f8056;font-size:.72rem;margin-bottom:6px}.monument-fact strong{color:#f0dfaa;font-size:.88rem}.monument-columns{display:grid;grid-template-columns:1fr 1fr;gap:24px}.monument-panel{padding:22px;border-top:1px solid rgba(212,175,55,.16);background:linear-gradient(180deg,rgba(212,175,55,.025),transparent)}.monument-panel h3{margin:0 0 15px;color:#e5c765;font-size:1rem}.monument-panel ul{margin:0;padding:0 18px 0 0;color:rgba(245,240,224,.68);line-height:2.05;font-size:.9rem}.monuments-loading,.monuments-error{grid-column:1/-1;min-height:220px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;text-align:center;border:1px solid rgba(212,175,55,.18);border-radius:22px;background:rgba(255,255,255,.018);color:rgba(245,241,228,.72)}.monuments-loading-ring{width:38px;height:38px;border-radius:50%;border:2px solid rgba(212,175,55,.18);border-top-color:#e3c55f;animation:monuments-spin .85s linear infinite}.monuments-retry{border:1px solid rgba(212,175,55,.38);border-radius:999px;background:rgba(212,175,55,.08);color:#f0d271;padding:10px 18px;font:inherit;cursor:pointer}.monument-card[hidden]{display:none}@keyframes monument-orbit{to{transform:rotate(360deg)}}@keyframes monuments-spin{to{transform:rotate(360deg)}}body.monument-modal-open{overflow:hidden}@media(max-width:980px){.monuments-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.monument-modal-hero{grid-template-columns:210px 1fr}.monument-facts{grid-template-columns:repeat(2,1fr)}}@media(max-width:650px){.monuments-section{padding:82px 18px}.monuments-grid{grid-template-columns:1fr}.monument-modal{padding:10px}.monument-modal-panel{max-height:94vh}.monument-modal-hero{grid-template-columns:1fr;padding:28px 22px 22px}.monument-modal-emblem{min-height:150px}.monument-modal-emblem span{font-size:4rem}.monument-modal h2{font-size:1.8rem}.monument-modal-content{padding:0 22px 28px}.monument-facts,.monument-columns{grid-template-columns:1fr}}@media(prefers-reduced-motion:reduce){.monument-visual::after,.monuments-loading-ring{animation:none}}

/* Phase 7.2 — artwork upgrade */
.monument-visual.has-artwork{display:block}.monument-visual.has-artwork>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .65s cubic-bezier(.2,.7,.2,1);filter:saturate(.9) contrast(1.04)}.monument-card:hover .monument-visual.has-artwork>img{transform:scale(1.06);filter:saturate(1.08) contrast(1.06)}.monument-visual.has-artwork::before{inset:0;width:auto;height:auto;border:0;border-radius:0;background:linear-gradient(to top,rgba(5,5,4,.72),transparent 58%);z-index:1}.monument-visual.has-artwork::after{display:none}.monument-visual.has-artwork .monument-icon{position:absolute;left:18px;bottom:12px;font-size:2.2rem;z-index:2}.monument-modal-emblem{overflow:hidden;position:relative}.monument-modal-emblem span{width:100%;height:100%;display:block;position:relative}.monument-modal-emblem img{width:100%;height:100%;object-fit:cover}.monument-modal-emblem i{position:absolute;left:18px;bottom:12px;font-style:normal;font-size:2.4rem;color:#f0d06a;text-shadow:0 0 20px #000}
.events-section{position:relative;padding:110px 6vw;scroll-margin-top:100px;overflow:hidden;background:radial-gradient(circle at 15% 20%,rgba(212,165,68,.09),transparent 28%),linear-gradient(180deg,rgba(5,7,11,.97),rgba(10,10,12,.98))}.events-section:before{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(212,165,68,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(212,165,68,.035) 1px,transparent 1px);background-size:56px 56px;mask-image:linear-gradient(to bottom,transparent,black 18%,black 82%,transparent)}.events-section>*{position:relative;z-index:1}.events-toolbar{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin:34px auto 38px}.event-filter{border:1px solid rgba(214,172,75,.28);background:rgba(255,255,255,.025);color:#cfc5ae;padding:10px 18px;border-radius:999px;font-family:inherit;cursor:pointer;transition:.25s ease}.event-filter:hover,.event-filter.active{color:#111;background:linear-gradient(135deg,#f2d17d,#b98a2f);border-color:transparent;box-shadow:0 8px 30px rgba(201,153,54,.2)}.events-grid{width:min(1220px,100%);margin:auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.event-card{position:relative;display:flex;flex-direction:column;min-height:440px;border:1px solid rgba(214,172,75,.19);border-radius:24px;overflow:hidden;background:linear-gradient(155deg,rgba(26,24,21,.94),rgba(8,9,12,.96));box-shadow:0 24px 65px rgba(0,0,0,.28);transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease}.event-card:hover{transform:translateY(-8px);border-color:rgba(234,190,87,.55);box-shadow:0 30px 80px rgba(0,0,0,.42),0 0 32px rgba(198,146,45,.09)}.event-card[hidden]{display:none}.event-visual{height:155px;position:relative;display:grid;place-items:center;background:radial-gradient(circle at center,rgba(224,176,70,.18),transparent 58%),linear-gradient(145deg,#18140e,#0c0d10);border-bottom:1px solid rgba(214,172,75,.15)}.event-icon{font-size:58px;filter:drop-shadow(0 10px 20px rgba(222,171,62,.24));transition:transform .3s ease}.event-card:hover .event-icon{transform:scale(1.08) rotate(-3deg)}.event-era-chip,.event-date{position:absolute;top:15px;font-size:.74rem;border:1px solid rgba(230,190,100,.23);background:rgba(5,6,8,.68);backdrop-filter:blur(9px);color:#e5c979;border-radius:999px;padding:6px 10px}.event-era-chip{right:15px}.event-date{left:15px}.event-card-body{display:flex;flex-direction:column;flex:1;padding:23px}.event-type{align-self:flex-start;color:#d8ad55;font-size:.78rem;letter-spacing:.04em}.event-card h3{font-family:Lalezar,Vazirmatn,sans-serif;font-size:1.55rem;color:#f2ead9;margin:8px 0 4px}.event-location{color:#9f9788;font-size:.84rem}.event-card p{color:#bbb3a5;line-height:1.9;font-size:.91rem;margin:14px 0 20px}.event-open{margin-top:auto;width:100%;border:1px solid rgba(216,170,65,.35);border-radius:14px;background:rgba(216,170,65,.06);color:#e8c56f;padding:11px 14px;font-family:inherit;cursor:pointer;transition:.25s ease}.event-open:hover{background:linear-gradient(135deg,#e7c268,#a97b27);color:#12100b;border-color:transparent}.events-note{text-align:center;color:#7f796e;font-size:.84rem;margin-top:24px}.events-loading,.events-error{grid-column:1/-1;min-height:250px;border:1px dashed rgba(215,172,74,.3);border-radius:22px;display:flex;align-items:center;justify-content:center;gap:14px;flex-direction:column;color:#bdb39e}.events-loading-ring{width:34px;height:34px;border:3px solid rgba(214,170,66,.16);border-top-color:#d7aa42;border-radius:50%;animation:eventSpin .8s linear infinite}.events-retry{border:1px solid #b98b32;background:transparent;color:#e2be68;padding:9px 18px;border-radius:10px;font-family:inherit;cursor:pointer}@keyframes eventSpin{to{transform:rotate(360deg)}}.event-modal{position:fixed;inset:0;z-index:1300;display:grid;place-items:center;padding:24px;opacity:0;visibility:hidden;transition:.28s ease}.event-modal.open{opacity:1;visibility:visible}.event-modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.78);backdrop-filter:blur(12px)}.event-modal-panel{position:relative;width:min(900px,100%);max-height:min(86vh,820px);overflow:auto;border:1px solid rgba(223,179,74,.32);border-radius:28px;background:linear-gradient(150deg,#1a1711,#090a0d 52%,#11100d);box-shadow:0 40px 110px rgba(0,0,0,.65);transform:translateY(22px) scale(.98);transition:.3s ease}.event-modal.open .event-modal-panel{transform:none}.event-modal-close{position:absolute;left:18px;top:16px;z-index:3;width:40px;height:40px;border-radius:50%;border:1px solid rgba(224,180,76,.34);background:rgba(0,0,0,.36);color:#ead081;font-size:1.6rem;cursor:pointer}.event-modal-hero{display:grid;grid-template-columns:120px 1fr;gap:24px;align-items:center;padding:42px 42px 30px;background:radial-gradient(circle at 10% 20%,rgba(213,164,55,.15),transparent 38%);border-bottom:1px solid rgba(219,175,74,.14)}.event-modal-emblem{width:110px;height:110px;border-radius:30px;display:grid;place-items:center;font-size:52px;background:linear-gradient(145deg,rgba(227,181,73,.16),rgba(255,255,255,.02));border:1px solid rgba(224,178,69,.25);box-shadow:inset 0 0 35px rgba(210,156,42,.08)}.event-modal-eyebrow{color:#d6aa50;font-size:.82rem}.event-modal h2{font-family:Lalezar,Vazirmatn,sans-serif;font-size:2.35rem;color:#f1e8d6;margin:4px 0}.event-modal-location{color:#a49b8b}.event-modal-summary{color:#c7bfb0;line-height:1.95;margin-top:14px}.event-modal-content{padding:28px 42px 42px}.event-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:24px}.event-fact{padding:16px;border:1px solid rgba(220,174,70,.16);border-radius:16px;background:rgba(255,255,255,.025)}.event-fact small{display:block;color:#928a7c;margin-bottom:6px}.event-fact strong{color:#e7d7b5;font-size:.92rem}.event-columns{display:grid;grid-template-columns:1fr 1fr;gap:18px}.event-panel{padding:22px;border:1px solid rgba(220,174,70,.14);border-radius:20px;background:rgba(255,255,255,.02)}.event-panel h3{color:#e1bb63;margin-bottom:15px}.event-panel ul{padding-right:20px;color:#beb5a5;line-height:1.9}.event-panel li::marker{color:#c99737}body.event-modal-open{overflow:hidden}@media(max-width:900px){.events-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:650px){.events-section{padding:85px 18px}.events-grid{grid-template-columns:1fr}.event-modal{padding:10px}.event-modal-hero{grid-template-columns:1fr;padding:55px 22px 24px;text-align:center}.event-modal-emblem{margin:auto}.event-modal h2{font-size:1.9rem}.event-modal-content{padding:22px}.event-facts,.event-columns{grid-template-columns:1fr}.event-filter{padding:9px 13px;font-size:.82rem}}
/* PersiaVerse v4.5 — Global encyclopedia search */
.nav-search-button{display:flex;align-items:center;gap:7px;padding:8px 12px;border:1px solid rgba(212,175,55,.24);border-radius:999px;background:rgba(212,175,55,.07);color:#eee4c8;font:inherit;cursor:pointer;transition:.25s ease}.nav-search-button:hover,.nav-search-button:focus-visible{border-color:rgba(212,175,55,.72);background:rgba(212,175,55,.14);color:#fff;outline:none}.nav-search-button kbd{padding:2px 6px;border:1px solid rgba(255,255,255,.14);border-radius:5px;background:rgba(0,0,0,.25);font-size:.65rem;color:#bcae89;direction:ltr}
body.global-search-open{overflow:hidden}.global-search{position:fixed;inset:0;z-index:4000;display:grid;place-items:start center;padding:8vh 20px 24px;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .22s ease,visibility .22s ease}.global-search.open{opacity:1;visibility:visible;pointer-events:auto}.global-search-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.78);backdrop-filter:blur(11px)}.global-search-panel{position:relative;width:min(820px,100%);max-height:84vh;overflow:hidden;border:1px solid rgba(212,175,55,.34);border-radius:26px;background:linear-gradient(145deg,rgba(22,20,16,.98),rgba(7,7,7,.98));box-shadow:0 28px 100px rgba(0,0,0,.75),0 0 55px rgba(212,175,55,.08);transform:translateY(-16px) scale(.985);transition:transform .25s ease}.global-search.open .global-search-panel{transform:none}.global-search-header{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;padding:24px 26px 14px}.global-search-eyebrow{display:block;margin-bottom:4px;color:#d4af37;font-size:.78rem;letter-spacing:.08em}.global-search-header h2{margin:0;color:#fff4d6;font-size:clamp(1.35rem,3vw,2rem)}.global-search-close{width:42px;height:42px;border:1px solid rgba(212,175,55,.25);border-radius:50%;background:rgba(255,255,255,.035);color:#d9c78e;font-size:1.7rem;line-height:1;cursor:pointer}.global-search-close:hover{background:rgba(212,175,55,.12);color:#fff}.global-search-field{display:flex;align-items:center;gap:12px;margin:0 26px;padding:4px 15px;border:1px solid rgba(212,175,55,.34);border-radius:15px;background:rgba(0,0,0,.28);box-shadow:inset 0 0 20px rgba(0,0,0,.18)}.global-search-field>span{font-size:1.55rem;color:#d4af37}.global-search-field input{min-width:0;flex:1;padding:13px 0;border:0;outline:0;background:transparent;color:#fff;font:inherit;font-size:1rem}.global-search-field input::placeholder{color:#897f68}.global-search-field kbd{padding:4px 8px;border:1px solid rgba(255,255,255,.14);border-radius:6px;color:#9c927b;background:rgba(255,255,255,.04);font-size:.72rem}.global-search-hint,.global-search-status{margin:10px 28px 0;color:#8e8777;font-size:.78rem}.global-search-status{color:#c9b66e}.global-search-results{max-height:55vh;overflow:auto;padding:16px 18px 24px;scrollbar-width:thin;scrollbar-color:#8b6f1f transparent}.search-empty{padding:35px 18px;text-align:center;color:#a9a08d}.search-empty strong{display:block;margin-bottom:8px;color:#e7d8b0;font-size:1.08rem}.search-group{margin-top:10px}.search-group-title{display:flex;align-items:center;gap:9px;margin:8px 8px;color:#d5bb67;font-size:.8rem}.search-group-title::after{content:"";height:1px;flex:1;background:linear-gradient(90deg,rgba(212,175,55,.22),transparent)}.search-result{width:100%;display:grid;grid-template-columns:48px 1fr auto;align-items:center;gap:13px;padding:12px 13px;margin:6px 0;border:1px solid transparent;border-radius:14px;background:rgba(255,255,255,.025);color:inherit;text-align:right;font:inherit;cursor:pointer;transition:.2s ease}.search-result:hover,.search-result:focus-visible,.search-result.is-active{outline:none;border-color:rgba(212,175,55,.35);background:rgba(212,175,55,.08);transform:translateX(-3px)}.search-result-icon{display:grid;place-items:center;width:46px;height:46px;border:1px solid rgba(212,175,55,.24);border-radius:13px;background:radial-gradient(circle,rgba(212,175,55,.16),rgba(212,175,55,.025));color:#e4c85e;font-weight:900;font-size:1.12rem}.search-result-copy{min-width:0}.search-result-copy strong{display:block;color:#f7edd3;font-size:.96rem}.search-result-copy span{display:block;margin-top:3px;overflow:hidden;color:#a9a08c;font-size:.78rem;white-space:nowrap;text-overflow:ellipsis}.search-result-type{padding:4px 8px;border-radius:999px;background:rgba(212,175,55,.08);color:#c9b66e;font-size:.68rem;white-space:nowrap}.search-count{color:#7f7766;font-size:.74rem;margin-right:4px}
@media(max-width:900px){.nav-search-button kbd,.nav-search-button span:last-of-type{display:none}.nav-search-button{padding:7px 10px}.global-search{padding:4vh 10px 10px}.global-search-panel{max-height:92vh;border-radius:20px}.global-search-header{padding:20px 18px 12px}.global-search-field{margin:0 18px}.global-search-results{max-height:62vh;padding-inline:10px}.search-result{grid-template-columns:42px 1fr}.search-result-type{display:none}}

/* PersiaVerse v4.6 — Professional search upgrade */
.global-search-clear{display:grid;place-items:center;width:28px;height:28px;flex:0 0 auto;border:0;border-radius:50%;background:rgba(255,255,255,.08);color:#c9bea2;font-size:1.15rem;cursor:pointer}.global-search-clear:hover{background:rgba(212,175,55,.18);color:#fff}.global-search-toolbar{display:flex;gap:7px;margin:12px 26px 0;overflow:auto;padding-bottom:2px;scrollbar-width:none}.global-search-toolbar::-webkit-scrollbar{display:none}.search-filter{flex:0 0 auto;padding:7px 13px;border:1px solid rgba(212,175,55,.18);border-radius:999px;background:rgba(255,255,255,.025);color:#9d947f;font:inherit;font-size:.76rem;cursor:pointer;transition:.2s ease}.search-filter:hover,.search-filter:focus-visible{outline:none;border-color:rgba(212,175,55,.45);color:#e7d9b4}.search-filter.is-active{border-color:rgba(212,175,55,.66);background:rgba(212,175,55,.13);color:#ffe8a0;box-shadow:inset 0 0 0 1px rgba(212,175,55,.06)}.global-search-hint b{color:#bca765;font-weight:600}.search-result-copy small{display:-webkit-box;margin-top:6px;overflow:hidden;color:#787263;font-size:.72rem;line-height:1.55;-webkit-line-clamp:1;-webkit-box-orient:vertical}.search-result-copy mark{padding:0 2px;border-radius:3px;background:rgba(212,175,55,.25);color:#fff1b6}.search-result-side{display:flex;flex-direction:column;align-items:flex-end;gap:6px}.search-result-side em{color:#756d5d;font-size:.62rem;font-style:normal;white-space:nowrap}.search-discovery{padding:10px 12px 6px}.search-discovery-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.search-discovery-head h3{margin:0;color:#cbb673;font-size:.82rem}.search-discovery-head button{border:0;background:transparent;color:#7f7767;font:inherit;font-size:.7rem;cursor:pointer}.search-discovery-head button:hover{color:#d9c47c}.search-pills{display:flex;flex-wrap:wrap;gap:8px}.search-pills button,.search-empty button{padding:8px 12px;border:1px solid rgba(212,175,55,.2);border-radius:999px;background:rgba(212,175,55,.055);color:#cfc1a0;font:inherit;font-size:.78rem;cursor:pointer}.search-pills button:hover,.search-empty button:hover{border-color:rgba(212,175,55,.55);background:rgba(212,175,55,.12);color:#fff}.search-keyboard-guide{display:flex;justify-content:center;gap:18px;margin:24px 12px 4px;padding-top:16px;border-top:1px solid rgba(255,255,255,.06);color:#6e685b;font-size:.67rem}.search-keyboard-guide span{display:flex;align-items:center;gap:4px}.search-keyboard-guide kbd{padding:2px 5px;border:1px solid rgba(255,255,255,.11);border-radius:4px;background:rgba(255,255,255,.035);color:#9f9682}.search-empty-icon{display:block;margin-bottom:8px;color:#766c51;font-size:2rem}.search-empty p{margin:5px 0 14px}.search-target-flash{animation:searchTargetFlash 1.4s ease}@keyframes searchTargetFlash{0%,100%{box-shadow:inherit}35%{box-shadow:0 0 0 3px rgba(212,175,55,.32),0 0 40px rgba(212,175,55,.25)}}
@media(max-width:900px){.global-search-toolbar{margin-inline:18px}.search-result-side{display:none}.search-result-copy small{-webkit-line-clamp:2}.search-keyboard-guide{display:none}}

/* PersiaVerse v4.7 — Immersive search */
.nav-search-button kbd{display:none!important}
.global-search{padding:0;place-items:stretch;transition:opacity .28s ease,visibility .28s ease}
.global-search-backdrop{background:radial-gradient(circle at 50% 12%,rgba(86,67,16,.22),transparent 34%),rgba(3,3,3,.94);backdrop-filter:blur(18px)}
.global-search-panel{width:100%;height:100%;max-height:none;border:0;border-radius:0;background:linear-gradient(180deg,rgba(15,14,11,.98),rgba(4,4,4,.995));box-shadow:none;transform:translateY(-22px);display:flex;flex-direction:column}
.global-search.open .global-search-panel{transform:none}
.global-search-header{width:min(1120px,calc(100% - 40px));margin:0 auto;padding:clamp(28px,6vh,70px) 0 20px;align-items:center}
.global-search-eyebrow{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase}
.global-search-header h2{font-size:clamp(1.45rem,4vw,3.2rem);font-weight:700;max-width:820px;line-height:1.25}
.global-search-close{width:50px;height:50px;flex:0 0 auto}
.global-search-field{width:min(1120px,calc(100% - 40px));margin:0 auto;padding:8px 20px;border-radius:20px;background:rgba(255,255,255,.035);box-shadow:0 18px 60px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.02)}
.global-search-field input{padding:18px 0;font-size:clamp(1rem,2vw,1.35rem)}
.global-search-field>span{font-size:2rem}
.global-search-toolbar,.global-search-hint,.global-search-status{width:min(1120px,calc(100% - 40px));margin-left:auto;margin-right:auto}
.global-search-toolbar{margin-top:16px}
.global-search-hint{margin-top:12px}
.global-search-status{margin-top:8px}
.global-search-results{width:min(1120px,100%);margin:0 auto;max-height:none;flex:1;padding:20px 20px 42px}
.search-result{grid-template-columns:58px minmax(0,1fr) auto;padding:15px 16px;border-radius:18px}
.search-result-icon{width:56px;height:56px;border-radius:16px;font-size:1.35rem}
.search-result-copy strong{font-size:1.02rem}
.search-discovery{padding:18px 12px}
.search-popular .search-discovery-head span{color:#6f6758;font-size:.68rem}
.search-popular .search-pills{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.search-popular .search-pills button{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:14px;text-align:right}
.search-popular .search-pills b{color:#665c45;font-size:.68rem;font-weight:500;direction:ltr}
.search-empty-suggestions{display:flex;justify-content:center;flex-wrap:wrap;gap:8px}
@media(max-width:700px){
  .global-search-header{width:calc(100% - 28px);padding-top:24px;align-items:flex-start}
  .global-search-header h2{font-size:1.55rem;max-width:80%}
  .global-search-close{width:42px;height:42px}
  .global-search-field,.global-search-toolbar,.global-search-hint,.global-search-status{width:calc(100% - 28px)}
  .global-search-field{padding-inline:14px}
  .global-search-results{padding-inline:10px}
  .search-popular .search-pills{grid-template-columns:1fr}
  .search-result{grid-template-columns:46px minmax(0,1fr)}
  .search-result-icon{width:44px;height:44px;border-radius:13px}
}


/* PersiaVerse v4.8 — viewport-aware immersive search */
.global-search-panel{min-height:100dvh;height:100dvh}
.global-search-results{overscroll-behavior:contain}

/* لپ‌تاپ‌ها و مرورگرهایی که نوار تب و آدرس ارتفاع مفید صفحه را کم می‌کنند */
@media (min-width:701px) and (max-height:920px){
  .global-search-header{padding-top:22px;padding-bottom:12px}
  .global-search-header h2{font-size:clamp(1.45rem,3.2vw,2.45rem);line-height:1.18}
  .global-search-close{width:44px;height:44px}
  .global-search-field{padding:4px 16px;border-radius:17px}
  .global-search-field input{padding:13px 0;font-size:1.08rem}
  .global-search-field>span{font-size:1.65rem}
  .global-search-toolbar{margin-top:10px}
  .global-search-hint{margin-top:7px}
  .global-search-status{margin-top:5px}
  .global-search-results{padding-top:8px;padding-bottom:18px}
  .search-discovery{padding-top:8px}
  .search-discovery-head{margin-bottom:7px}
  .search-popular .search-pills{gap:8px}
  .search-popular .search-pills button{padding:11px 14px}
}

@media (min-width:701px) and (max-height:760px){
  .global-search-header{padding-top:14px;padding-bottom:8px}
  .global-search-eyebrow{margin-bottom:2px}
  .global-search-header h2{font-size:1.75rem}
  .global-search-field input{padding:10px 0}
  .global-search-hint{display:none}
  .global-search-toolbar{margin-top:8px}
  .global-search-results{padding-top:6px}
}
:root{--timeline-accent:#d4af37;--timeline-accent-rgb:212,175,55}.reading-progress{position:fixed;inset:0 0 auto;z-index:1800;height:3px;background:rgba(255,255,255,.035);pointer-events:none}.reading-progress span{display:block;width:0;height:100%;background:linear-gradient(90deg,var(--timeline-accent),#fff0b3);box-shadow:0 0 16px rgba(var(--timeline-accent-rgb),.75)}
.cinematic-timeline-section{position:relative;isolation:isolate;min-height:100vh;padding:140px clamp(20px,5vw,84px);overflow:clip;background:radial-gradient(circle at 72% 18%,rgba(var(--timeline-accent-rgb),.1),transparent 34%),linear-gradient(180deg,#080806,#0b0a08 48%,#070707);transition:background .8s}.timeline-atmosphere,.timeline-pattern,.timeline-particles{position:absolute;inset:0;pointer-events:none}.timeline-atmosphere{z-index:-1}.timeline-pattern{opacity:.1;background-image:linear-gradient(30deg,transparent 24%,rgba(var(--timeline-accent-rgb),.13) 25%,rgba(var(--timeline-accent-rgb),.13) 26%,transparent 27%,transparent 74%,rgba(var(--timeline-accent-rgb),.1) 75%,rgba(var(--timeline-accent-rgb),.1) 76%,transparent 77%);background-size:68px 118px;mask-image:linear-gradient(to bottom,transparent,#000 16%,#000 88%,transparent)}.timeline-orb{position:absolute;border-radius:50%;filter:blur(90px);opacity:.14;background:var(--timeline-accent);transition:background .8s}.timeline-orb-a{width:420px;height:420px;right:-100px;top:16%}.timeline-orb-b{width:320px;height:320px;left:-100px;bottom:16%}.timeline-particle{position:absolute;width:2px;height:2px;border-radius:50%;background:rgba(var(--timeline-accent-rgb),.7);box-shadow:0 0 8px rgba(var(--timeline-accent-rgb),.55);animation:timelineFloat var(--duration,12s) linear infinite;animation-delay:var(--delay,0s)}@keyframes timelineFloat{from{transform:translate3d(0,40px,0);opacity:0}15%{opacity:.8}to{transform:translate3d(var(--drift,40px),-160px,0);opacity:0}}
.cinematic-timeline-header{max-width:900px;margin:0 auto 88px;text-align:center}.cinematic-timeline-header .section-title{font-size:clamp(2.6rem,5.5vw,5.7rem);line-height:1.12;margin:.22em 0}.cinematic-timeline-header p{color:#aaa28f;line-height:1.9}.timeline-scroll-cue{display:flex;flex-direction:column;align-items:center;gap:9px;margin-top:30px;color:#92876c}.timeline-scroll-cue span{width:1px;height:48px;background:linear-gradient(var(--timeline-accent),transparent);animation:cuePulse 1.8s ease-in-out infinite}@keyframes cuePulse{50%{transform:scaleY(.55);opacity:.45}}
.timeline-experience{position:relative;display:grid;grid-template-columns:72px minmax(0,1fr) minmax(260px,330px);gap:clamp(26px,4vw,64px);max-width:1480px;margin:auto;direction:ltr}.timeline-rail{position:relative}.timeline-rail-track{position:sticky;top:120px;height:calc(100vh - 200px);width:2px;margin:auto;background:rgba(255,255,255,.08);overflow:hidden}.timeline-rail-track span{display:block;width:100%;height:0;background:linear-gradient(var(--timeline-accent),rgba(var(--timeline-accent-rgb),.28));box-shadow:0 0 16px var(--timeline-accent)}.timeline-rail-status{position:sticky;top:calc(100vh - 62px);display:flex;align-items:center;gap:7px;color:#aa9e82}.timeline-rail-status span{width:18px;height:1px;background:currentColor}.timeline-rail-status strong{color:var(--timeline-accent);font-size:1.12rem}
.timeline-chapters{direction:rtl}.timeline-chapter{position:relative;min-height:74vh;display:flex;align-items:center;padding-right:88px;opacity:.28;transform:translateY(34px) scale(.985);filter:saturate(.55);transition:opacity .65s,transform .65s,filter .65s}.timeline-chapter.is-active{opacity:1;transform:none;filter:none}.timeline-date{position:absolute;right:0;top:50%;transform:translateY(-50%);width:70px;color:var(--era-accent);font-weight:800;text-align:left}.timeline-date span{position:absolute;right:-6px;bottom:23px;white-space:nowrap;font-size:.9rem}.timeline-date i{position:absolute;right:0;width:17px;height:17px;border-radius:50%;background:var(--era-accent);box-shadow:0 0 20px rgba(var(--era-rgb),.65)}.timeline-date:after{content:"";position:absolute;right:7px;top:16px;width:1px;height:calc(74vh - 16px);background:linear-gradient(rgba(var(--era-rgb),.7),rgba(255,255,255,.07))}
.timeline-card{position:relative;width:100%;min-height:360px;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(220px,.85fr);border:1px solid rgba(var(--era-rgb),.25);border-radius:26px;background:linear-gradient(135deg,rgba(24,23,20,.96),rgba(9,9,8,.84));box-shadow:0 22px 75px rgba(0,0,0,.38);overflow:visible;backdrop-filter:blur(16px)}.timeline-card-copy{padding:clamp(28px,4vw,52px)}.timeline-card-eyebrow{color:var(--era-accent);font-size:.82rem}.timeline-card h3{font-size:clamp(2.2rem,4.4vw,4.7rem);line-height:1.08;margin:14px 0 8px;color:#fff2d2}.timeline-card h4{font-size:clamp(1.15rem,1.8vw,1.55rem);color:#e7dcc4;margin:26px 0 12px}.timeline-card p{max-width:700px;color:#b7b1a5;line-height:2;font-size:1rem}.timeline-card-facts{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}.timeline-card-facts span{padding:8px 12px;border:1px solid rgba(var(--era-rgb),.24);border-radius:999px;background:rgba(var(--era-rgb),.05);color:#d4cbb8;font-size:.78rem}.timeline-card-visual{position:relative;min-height:100%;display:flex;align-items:flex-end;padding:28px;overflow:hidden;border-radius:0 26px 26px 0;background:radial-gradient(circle at 60% 30%,rgba(var(--era-rgb),.32),transparent 45%),linear-gradient(145deg,rgba(var(--era-rgb),.18),rgba(0,0,0,.58))}.timeline-card-visual:before{content:"";position:absolute;inset:0;background:repeating-radial-gradient(circle at 80% 20%,transparent 0 19px,rgba(255,255,255,.025) 20px 21px)}.timeline-card-visual span{position:relative;color:#efe1bd;font-size:1.05rem}.timeline-card-visual b{position:absolute;left:22px;top:12px;font-size:clamp(5rem,9vw,9rem);line-height:1;color:rgba(var(--era-rgb),.13)}.timeline-chapter.is-active .timeline-card{border-color:rgba(var(--era-rgb),.55);box-shadow:0 30px 100px rgba(0,0,0,.48),0 0 55px rgba(var(--era-rgb),.09)}
.era-action-wrap{position:absolute;left:-25px;top:50%;transform:translateY(-50%);z-index:15}.era-coin{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(var(--era-rgb),.78);background:#11100d;color:var(--era-accent);cursor:pointer;box-shadow:0 0 0 7px rgba(var(--era-rgb),.055),0 0 22px rgba(var(--era-rgb),.22);transition:.25s}.era-coin span{font-family:Georgia,serif;font-size:.74rem;border:1px solid currentColor;border-radius:50%;width:25px;height:25px;display:grid;place-items:center}.era-action-wrap:hover .era-coin,.era-coin:focus-visible{transform:scale(1.08) rotate(12deg);background:var(--era-accent);color:#15120a;box-shadow:0 0 28px rgba(var(--era-rgb),.6)}.era-quick-tabs{position:absolute;left:62px;top:50%;width:205px;padding:9px;border:1px solid rgba(var(--era-rgb),.28);border-radius:17px;background:rgba(13,13,12,.94);backdrop-filter:blur(18px);box-shadow:0 20px 60px rgba(0,0,0,.48);opacity:0;visibility:hidden;transform:translate(-10px,-50%) scale(.97);transition:.2s;pointer-events:none}.era-action-wrap:hover .era-quick-tabs,.era-action-wrap:focus-within .era-quick-tabs{opacity:1;visibility:visible;transform:translate(0,-50%) scale(1);pointer-events:auto}.era-quick-tabs:before{content:"";position:absolute;right:100%;top:0;width:68px;height:100%}.era-quick-tabs button{width:100%;display:flex;align-items:center;gap:10px;padding:10px 12px;border:0;border-radius:11px;background:transparent;color:#d8cfbb;font-family:inherit;text-align:right;cursor:pointer}.era-quick-tabs button:hover{background:rgba(var(--era-rgb),.13);color:var(--era-accent)}.era-quick-tabs i{width:22px;color:var(--era-accent);font-style:normal;text-align:center}
.timeline-sticky-summary{direction:rtl;position:sticky;top:120px;align-self:start;min-height:390px;padding:30px;border:1px solid rgba(var(--timeline-accent-rgb),.2);border-radius:24px;background:rgba(12,12,11,.72);backdrop-filter:blur(20px);box-shadow:0 25px 80px rgba(0,0,0,.3)}.timeline-summary-kicker{font-size:.76rem;color:var(--timeline-accent)}.timeline-sticky-summary>strong{display:block;font-size:1.8rem;color:#fff0ce;margin:13px 0 4px}.timeline-sticky-summary>small{color:#9f947c}.timeline-sticky-summary>p{line-height:1.95;color:#aaa498;margin:27px 0}.timeline-summary-facts{display:grid;gap:13px}.timeline-summary-facts span{padding:13px 0;border-top:1px solid rgba(255,255,255,.07)}.timeline-summary-facts small,.timeline-summary-facts b{display:block}.timeline-summary-facts small{color:#817b6d;font-size:.7rem}.timeline-summary-facts b{color:#ded3bc;margin-top:5px;font-size:.87rem}.timeline-loading{padding:80px;text-align:center;color:#a89b7d}
.era-drawer{position:fixed;inset:0;z-index:1700;pointer-events:none;visibility:hidden}.era-drawer.is-open{pointer-events:auto;visibility:visible}.era-drawer-backdrop{position:absolute;inset:0;border:0;background:rgba(0,0,0,.68);backdrop-filter:blur(5px);opacity:0;transition:.35s}.era-drawer.is-open .era-drawer-backdrop{opacity:1}.era-drawer-panel{position:absolute;inset:0 0 0 auto;width:min(470px,92vw);padding:26px;background:linear-gradient(160deg,rgba(22,21,18,.98),rgba(8,8,8,.99));border-right:1px solid rgba(var(--timeline-accent-rgb),.28);box-shadow:-25px 0 80px rgba(0,0,0,.55);transform:translateX(105%);transition:transform .42s cubic-bezier(.2,.8,.2,1);overflow:auto;direction:rtl}.era-drawer.is-open .era-drawer-panel{transform:none}.era-drawer-header{display:flex;align-items:flex-start;justify-content:space-between;padding:14px 6px 24px;border-bottom:1px solid rgba(255,255,255,.08)}.era-drawer-header span{color:var(--timeline-accent);font-size:.82rem}.era-drawer-header h2{font-size:2.1rem;color:#fff0ce;margin:7px 0 0}.era-drawer-close{width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);color:#fff;font-size:1.5rem;cursor:pointer}.era-drawer-tabs{display:grid;grid-template-columns:repeat(5,1fr);gap:5px;padding:18px 0}.era-drawer-tabs button{min-width:0;padding:10px 4px;border:1px solid transparent;border-radius:12px;background:transparent;color:#918a7b;font-family:inherit;cursor:pointer}.era-drawer-tabs i,.era-drawer-tabs span{display:block}.era-drawer-tabs i{font-style:normal;font-size:1.15rem;margin-bottom:5px}.era-drawer-tabs span{font-size:.63rem;white-space:nowrap}.era-drawer-tabs button.is-active{border-color:rgba(var(--timeline-accent-rgb),.3);background:rgba(var(--timeline-accent-rgb),.1);color:var(--timeline-accent)}.era-drawer-content{padding:18px 2px}.era-panel-lead span{color:var(--timeline-accent);font-size:.8rem}.era-panel-lead h3{font-size:1.55rem;color:#f4e7c8;margin:10px 0 14px}.era-panel-lead p{color:#b4ad9f;line-height:2}.era-meta{display:grid;gap:0;margin:26px 0;border-block:1px solid rgba(255,255,255,.08)}.era-meta div{display:flex;justify-content:space-between;gap:20px;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.06)}.era-meta div:last-child{border-bottom:0}.era-meta dt{color:#817b6d}.era-meta dd{color:#ddd1b8;margin:0;text-align:left}.era-panel-list{display:grid;gap:10px;padding:0;list-style:none}.era-panel-list li{padding:13px 15px;border-radius:12px;background:rgba(255,255,255,.035);color:#c9c1b0}.era-panel-link{width:100%;margin-top:25px;padding:13px;border-radius:13px;border:1px solid rgba(var(--timeline-accent-rgb),.4);background:rgba(var(--timeline-accent-rgb),.09);color:#f4e6c4;font-family:inherit;cursor:pointer}.era-panel-link:hover{background:var(--timeline-accent);color:#111}body.era-drawer-open{overflow:hidden}body.timeline-theme-active{--gold:var(--timeline-accent)}
@media(max-width:1100px){.timeline-experience{grid-template-columns:54px minmax(0,1fr)}.timeline-sticky-summary{display:none}.timeline-chapter{padding-right:76px}.timeline-card{grid-template-columns:minmax(0,1.25fr) minmax(190px,.75fr)}}
@media(max-width:760px){.cinematic-timeline-section{padding:105px 14px 65px}.cinematic-timeline-header{margin-bottom:48px}.timeline-experience{grid-template-columns:18px minmax(0,1fr);gap:10px}.timeline-rail-status{display:none}.timeline-rail-track{top:85px;height:calc(100vh - 140px)}.timeline-chapter{min-height:68vh;padding-right:38px}.timeline-date{width:32px}.timeline-date span{right:-8px;bottom:21px;font-size:.68rem}.timeline-date i{width:12px;height:12px}.timeline-date:after{right:5px;height:calc(68vh - 12px)}.timeline-card{min-height:0;display:block;border-radius:21px}.timeline-card-copy{padding:27px 21px}.timeline-card h3{font-size:2.15rem}.timeline-card h4{font-size:1.05rem;margin-top:22px}.timeline-card p{font-size:.9rem}.timeline-card-visual{min-height:130px;border-radius:0 0 21px 21px;padding:18px}.era-action-wrap{left:14px;top:auto;bottom:104px;transform:none}.era-coin{width:42px;height:42px}.era-quick-tabs{display:none}.timeline-card-facts span{font-size:.7rem}.era-drawer-panel{padding:18px}.era-drawer-tabs{overflow-x:auto;display:flex}.era-drawer-tabs button{min-width:75px}.era-drawer-header h2{font-size:1.75rem}}
@media(prefers-reduced-motion:reduce){.timeline-particle,.timeline-scroll-cue span{animation:none}.timeline-chapter,.era-drawer-panel,.era-drawer-backdrop{transition:none}}


/* =========================================================
   v5.3 — Timeline and era drawer polish
   ========================================================= */
.timeline-card {
    border-radius: 24px;
    box-shadow: 0 24px 70px rgba(0,0,0,.34);
    transition: border-color .32s ease, box-shadow .32s ease, transform .32s ease;
}
.timeline-chapter.is-active .timeline-card {
    transform: translateY(-2px);
    box-shadow: 0 32px 92px rgba(0,0,0,.48), 0 0 42px rgba(var(--era-rgb),.07);
}
.timeline-card-copy { padding: clamp(28px,3.6vw,48px); }
.timeline-card h3 { letter-spacing: -.025em; }
.timeline-card p { max-width: 650px; }
.timeline-card-facts { gap: 7px; }
.timeline-card-facts span { padding: 7px 11px; }

.era-action-wrap { left: -20px; }
.era-coin {
    width: 40px;
    height: 40px;
    border-color: rgba(var(--era-rgb),.62);
    box-shadow: 0 0 0 5px rgba(var(--era-rgb),.045), 0 0 16px rgba(var(--era-rgb),.16);
}
.era-coin span { width: 21px; height: 21px; font-size: .62rem; }
.era-action-wrap:hover .era-coin, .era-coin:focus-visible { transform: scale(1.07) rotate(9deg); }
.era-quick-tabs { left: 52px; width: 196px; border-radius: 15px; }
.era-quick-tabs:before { width: 57px; }
.era-quick-tabs button { padding: 9px 11px; }

.era-drawer-panel {
    width: min(500px,92vw);
    padding: 30px;
    background:
      radial-gradient(circle at 100% 0, rgba(var(--timeline-accent-rgb),.10), transparent 30%),
      linear-gradient(160deg,rgba(21,20,17,.985),rgba(7,7,7,.995));
    border-right-color: rgba(var(--timeline-accent-rgb),.34);
    box-shadow: -30px 0 90px rgba(0,0,0,.62);
}
.era-drawer-header { position: sticky; top: -30px; z-index: 4; margin-inline: -6px; padding: 24px 6px 20px; background: linear-gradient(180deg,rgba(17,16,14,.98) 75%,transparent); }
.era-drawer-close { width: 36px; height: 36px; font-size: 1.25rem; transition: transform .22s ease, border-color .22s ease, color .22s ease; }
.era-drawer-close:hover { transform: rotate(8deg); border-color: rgba(var(--timeline-accent-rgb),.5); color: var(--timeline-accent); }
.era-drawer-tabs { position: sticky; top: 78px; z-index: 3; padding: 14px 0 16px; background: linear-gradient(180deg,rgba(13,13,12,.97) 82%,transparent); }
.era-drawer-tabs button { transition: background .22s ease, color .22s ease, border-color .22s ease, transform .22s ease; }
.era-drawer-tabs button:hover { transform: translateY(-1px); color: #d8cdb5; }
.era-drawer-content { animation: eraContentIn .28s ease both; }
@keyframes eraContentIn { from { opacity:0; transform:translateY(7px); } to { opacity:1; transform:none; } }

@media(max-width:760px){
    .era-action-wrap{left:12px;bottom:100px}
    .era-coin{width:38px;height:38px}
    .era-drawer-panel{padding:18px}
    .era-drawer-header{top:-18px;padding-top:18px}
    .era-drawer-tabs{top:70px}
}


/* =========================================================
   v5.3.1 — Reliable time-travel scrolling
   ========================================================= */
.timeline-chapter{
    min-height:68vh;
    transform:translateY(22px) scale(.992);
    transition:opacity .42s ease,transform .42s ease,filter .42s ease;
    scroll-margin-top:18vh;
}
.timeline-date:after{height:calc(68vh - 16px)}
.timeline-chapter.is-active .timeline-card{transform:translateY(-1px)}
@media(max-height:760px) and (min-width:761px){
    .timeline-chapter{min-height:76vh}
    .timeline-date:after{height:calc(76vh - 16px)}
}
@media(max-width:760px){
    .timeline-chapter{min-height:62vh;transform:translateY(14px) scale(.995)}
    .timeline-date:after{height:calc(62vh - 12px)}
}

.timeline-era-title-link{color:inherit;text-decoration:none;transition:color .25s}.timeline-era-title-link:hover{color:var(--era-accent)}.era-profile-link{display:flex;align-items:center;justify-content:center;margin-top:22px;padding:14px 18px;border-radius:16px;text-decoration:none;font-weight:800;color:#0a0b0f;background:var(--timeline-accent,#d6ad60);transition:transform .25s,filter .25s}.era-profile-link:hover{transform:translateY(-2px);filter:brightness(1.08)}

/* =========================================================
   v5.4.1 — Timeline side-panel breathing room
   Prevent the sticky summary card from colliding with date labels.
   ========================================================= */
@media (min-width: 1181px){
    .timeline-experience{
        grid-template-columns:72px minmax(0,1fr) minmax(250px,310px);
        column-gap:clamp(42px,4.4vw,76px);
        max-width:1540px;
    }
    .timeline-sticky-summary{
        margin-left:clamp(18px,1.8vw,34px);
    }
    .timeline-chapter{
        padding-right:112px;
    }
    .timeline-date{
        width:92px;
    }
    .timeline-date span{
        right:18px;
        max-width:150px;
        text-align:right;
    }
    .timeline-date i{
        right:4px;
    }
    .timeline-date:after{
        right:11px;
    }
}

@media (min-width: 901px) and (max-width: 1180px){
    .timeline-experience{
        grid-template-columns:56px minmax(0,1fr) minmax(225px,270px);
        gap:32px;
    }
    .timeline-sticky-summary{
        margin-left:14px;
        padding:24px;
    }
    .timeline-chapter{
        padding-right:100px;
    }
    .timeline-date{
        width:84px;
    }
    .timeline-date span{
        right:15px;
        font-size:.82rem;
        text-align:right;
    }
    .timeline-date i{right:3px}
    .timeline-date:after{right:10px}
}

/* =========================================================
   v5.4.2 — Mobile timeline date gutter
   Keep the historical axis and year labels completely outside
   the information card on narrow viewports.
   ========================================================= */
@media (max-width: 760px){
    .timeline-experience{
        grid-template-columns:18px minmax(0,1fr);
        gap:8px;
    }
    .timeline-chapter{
        padding-right:88px;
    }
    .timeline-date{
        right:0;
        width:76px;
        text-align:right;
    }
    .timeline-date span{
        right:16px;
        bottom:20px;
        max-width:58px;
        font-size:.64rem;
        line-height:1.35;
        text-align:right;
    }
    .timeline-date i{
        right:1px;
    }
    .timeline-date:after{
        right:6px;
    }
}

@media (max-width: 440px){
    .cinematic-timeline-section{
        padding-inline:10px;
    }
    .timeline-experience{
        grid-template-columns:14px minmax(0,1fr);
        gap:6px;
    }
    .timeline-chapter{
        padding-right:70px;
    }
    .timeline-date{
        width:60px;
    }
    .timeline-date span{
        right:14px;
        max-width:44px;
        font-size:.56rem;
    }
}
/* =========================================================
   PersiaVerse v6.3 — Unified Design System & UI Refresh
   Loaded last so it can normalize the visual language safely.
   ========================================================= */
:root {
  color-scheme: dark;
  --pv-bg-0: #070706;
  --pv-bg-1: #0d0c0a;
  --pv-bg-2: #14110c;
  --pv-surface: rgba(18, 16, 12, .78);
  --pv-surface-strong: rgba(24, 20, 13, .92);
  --pv-surface-soft: rgba(255, 255, 255, .028);
  --pv-line: rgba(212, 175, 55, .17);
  --pv-line-strong: rgba(212, 175, 55, .42);
  --pv-gold: #d8b84e;
  --pv-gold-bright: #f3d77c;
  --pv-cream: #fff2c7;
  --pv-copy: #dfd8ca;
  --pv-muted: #a69e90;
  --pv-danger: #8f2117;
  --pv-radius-sm: 12px;
  --pv-radius-md: 18px;
  --pv-radius-lg: 24px;
  --pv-radius-xl: 30px;
  --pv-shadow-sm: 0 10px 28px rgba(0, 0, 0, .22);
  --pv-shadow-md: 0 22px 60px rgba(0, 0, 0, .34);
  --pv-shadow-lg: 0 34px 90px rgba(0, 0, 0, .52);
  --pv-glow: 0 0 0 1px rgba(212,175,55,.08), 0 0 28px rgba(212,175,55,.08);
  --pv-ease: cubic-bezier(.22, .8, .24, 1);
  --pv-fast: 180ms;
  --pv-normal: 320ms;
  --pv-slow: 620ms;
  --pv-container: 1240px;
  --pv-space-1: 8px;
  --pv-space-2: 12px;
  --pv-space-3: 16px;
  --pv-space-4: 24px;
  --pv-space-5: 32px;
  --pv-space-6: 48px;
  --pv-space-7: 64px;

  /* Backwards-compatible aliases */
  --bg-dark: var(--pv-bg-1);
  --bg-darker: var(--pv-bg-0);
  --persian-gold: var(--pv-gold);
  --persian-red: var(--pv-danger);
  --text-main: var(--pv-copy);
  --text-muted: var(--pv-muted);
}

html { scrollbar-gutter: stable; }
body {
  background:
    radial-gradient(circle at 50% -10%, rgba(212,175,55,.055), transparent 34rem),
    var(--pv-bg-1);
  color: var(--pv-copy);
  font-feature-settings: "ss01" 1, "kern" 1;
  text-rendering: optimizeLegibility;
}

::selection { background: rgba(212,175,55,.26); color: #fff8df; }
:focus-visible {
  outline: 2px solid var(--pv-gold-bright);
  outline-offset: 4px;
}

/* Unified page rhythm */
section { padding-inline: clamp(18px, 4vw, 56px); }
.section-header {
  width: min(760px, 100%);
  margin-inline: auto;
  margin-bottom: clamp(38px, 6vw, 68px);
}
.section-era {
  letter-spacing: .09em;
  color: var(--pv-gold);
  opacity: .9;
}
.section-title {
  color: var(--pv-cream);
  line-height: 1.25;
  text-shadow: 0 8px 34px rgba(0,0,0,.45);
}
.section-subtitle { color: var(--pv-muted); line-height: 2; }

/* Navigation */
nav.smart-nav,
nav#mainNav {
  top: 14px;
  right: 18px;
  left: 18px;
  width: auto;
  min-height: 66px;
  padding: 10px 18px;
  border: 1px solid var(--pv-line);
  border-radius: var(--pv-radius-lg);
  background: rgba(9, 8, 7, .78);
  box-shadow: var(--pv-shadow-sm), inset 0 1px rgba(255,255,255,.025);
  backdrop-filter: blur(22px) saturate(120%);
}
.nav-links { align-items: center; gap: clamp(10px, 1.5vw, 23px); }
.nav-links a,
.nav-search-button {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 7px 10px;
  border-radius: 10px;
  transition: color var(--pv-fast) ease, background var(--pv-fast) ease, transform var(--pv-fast) ease;
}
.nav-links a::after { bottom: 1px; right: 12%; height: 1px; border-radius: 999px; }
.nav-links a:hover,
.nav-links a.active,
.nav-search-button:hover {
  color: var(--pv-gold-bright);
  background: rgba(212,175,55,.06);
  transform: translateY(-1px);
}
.nav-brand { color: var(--pv-gold-bright); }

/* Universal surfaces */
.card,
.map-story-step,
.period-button,
.map-stage,
.timeline-card,
.timeline-info-panel,
.king-card,
.monument-card,
.event-card,
.search-result-card,
.dynasty-card,
.dynasty-panel {
  border-color: var(--pv-line) !important;
  box-shadow: var(--pv-shadow-sm);
}
.card,
.king-card,
.monument-card,
.event-card,
.search-result-card,
.dynasty-card {
  border-radius: var(--pv-radius-md) !important;
  background:
    linear-gradient(145deg, rgba(255,255,255,.035), rgba(255,255,255,.01)),
    rgba(12,11,9,.76) !important;
  transition:
    transform var(--pv-normal) var(--pv-ease),
    border-color var(--pv-normal) ease,
    box-shadow var(--pv-normal) ease,
    background var(--pv-normal) ease;
}
.card:hover,
.king-card:hover,
.monument-card:hover,
.event-card:hover,
.search-result-card:hover,
.dynasty-card:hover {
  transform: translateY(-6px);
  border-color: var(--pv-line-strong) !important;
  box-shadow: var(--pv-shadow-md), var(--pv-glow);
}
.cards-grid { gap: clamp(18px, 2vw, 28px); }

/* Buttons, pills and filters */
button,
[role="button"] { -webkit-tap-highlight-color: transparent; }
.monument-filter,
.event-filter,
.atlas-layer-toggle,
.map-step-button,
.map-play-button,
.period-button,
.timeline-tab,
.timeline-open-page,
.dynasty-link {
  border-color: var(--pv-line) !important;
  border-radius: var(--pv-radius-sm) !important;
  transition:
    transform var(--pv-fast) var(--pv-ease),
    color var(--pv-fast) ease,
    border-color var(--pv-fast) ease,
    background var(--pv-fast) ease,
    box-shadow var(--pv-fast) ease !important;
}
.monument-filter:hover,
.event-filter:hover,
.atlas-layer-toggle:hover,
.map-step-button:hover,
.map-play-button:hover,
.timeline-tab:hover,
.timeline-open-page:hover,
.dynasty-link:hover {
  transform: translateY(-2px);
  border-color: var(--pv-line-strong) !important;
  box-shadow: 0 10px 26px rgba(0,0,0,.24);
}
.monument-filter.active,
.event-filter.active,
.atlas-layer-toggle.active,
.period-button.active,
.timeline-tab.active {
  color: var(--pv-cream) !important;
  border-color: rgba(243,215,124,.58) !important;
  background: linear-gradient(135deg, rgba(212,175,55,.18), rgba(139,33,23,.08)) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.05), 0 12px 32px rgba(0,0,0,.25);
}

/* Atlas normalization */
.history-map-section { background:
  radial-gradient(circle at 48% 28%, rgba(212,175,55,.07), transparent 34%),
  linear-gradient(180deg, var(--pv-bg-1), var(--pv-bg-0) 52%, var(--pv-bg-1));
}
.map-story-layout { gap: clamp(20px, 2vw, 32px); }
.map-stage {
  border-radius: var(--pv-radius-xl);
  box-shadow: var(--pv-shadow-lg), inset 0 0 90px rgba(212,175,55,.025);
}
.map-story-step { border-radius: var(--pv-radius-lg); }
.map-story-step.active { box-shadow: var(--pv-shadow-md), var(--pv-glow); }
.period-button { border-radius: var(--pv-radius-sm); }
.map-controls,
.map-playback-controls,
.atlas-layer-panel {
  border-radius: var(--pv-radius-md) !important;
  border-color: var(--pv-line) !important;
  backdrop-filter: blur(18px);
}

/* Timeline polish */
.timeline-card,
.timeline-info-panel { border-radius: var(--pv-radius-lg) !important; }
.timeline-card.is-active,
.timeline-card.active { box-shadow: var(--pv-shadow-lg), var(--pv-glow); }
.timeline-progress span,
.map-story-progress span { transition-timing-function: var(--pv-ease); }

/* Typographic consistency */
.card h3,
.king-card h3,
.monument-card h3,
.event-card h3,
.map-story-step h3,
.timeline-card h3,
.dynasty-card h3 { color: var(--pv-cream); line-height: 1.55; }
.card p,
.king-card p,
.monument-card p,
.event-card p,
.map-story-step p,
.timeline-card p,
.dynasty-card p { color: var(--pv-muted); }

/* Scrollbar */
* { scrollbar-width: thin; scrollbar-color: rgba(212,175,55,.45) rgba(255,255,255,.025); }
*::-webkit-scrollbar { width: 10px; height: 10px; }
*::-webkit-scrollbar-track { background: rgba(255,255,255,.018); }
*::-webkit-scrollbar-thumb {
  border: 3px solid transparent;
  border-radius: 999px;
  background: linear-gradient(var(--pv-gold), #7c5412) padding-box;
}

@media (max-width: 1100px) {
  nav.smart-nav, nav#mainNav { top: 10px; right: 12px; left: 12px; }
  .nav-links { gap: 8px; }
  .nav-links a, .nav-search-button { padding-inline: 7px; }
}

@media (max-width: 768px) {
  nav.smart-nav, nav#mainNav {
    min-height: 58px;
    padding: 8px 14px;
    border-radius: 18px;
  }
  section { padding-inline: 16px; }
  .card, .map-story-step { border-radius: 16px !important; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* =========================================================
   v6.3.1 — Smart navbar collapsed-state compatibility fix
   Keeps the Design System from overriding the compact PV badge.
   ========================================================= */
@media (min-width: 901px) {
  nav.smart-nav.nav-collapsed,
  nav#mainNav.nav-collapsed {
    top: 10px;
    right: 50%;
    left: auto;
    width: 46px;
    min-width: 46px;
    max-width: 46px;
    height: 46px;
    min-height: 46px;
    padding: 0;
    justify-content: center;
    overflow: hidden;
    transform: translateX(50%);
    border-radius: 50%;
    background: rgba(8, 8, 8, .88);
    border-color: rgba(212,175,55,.42);
    box-shadow: 0 7px 22px rgba(0,0,0,.46), 0 0 14px rgba(212,175,55,.10);
  }

  nav.smart-nav.nav-collapsed .nav-links,
  nav#mainNav.nav-collapsed .nav-links,
  nav.smart-nav.nav-collapsed .mobile-menu,
  nav#mainNav.nav-collapsed .mobile-menu {
    display: none;
    width: 0;
    max-width: 0;
    opacity: 0;
    visibility: hidden;
    overflow: hidden;
    pointer-events: none;
  }

  nav.smart-nav.nav-collapsed .nav-brand,
  nav#mainNav.nav-collapsed .nav-brand {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    justify-content: center;
  }

  nav.smart-nav.nav-collapsed .brand-word,
  nav#mainNav.nav-collapsed .brand-word {
    display: none;
    max-width: 0;
    opacity: 0;
  }

  nav.smart-nav.nav-collapsed .brand-mark,
  nav#mainNav.nav-collapsed .brand-mark {
    width: 29px;
    height: 29px;
    display: inline-grid;
    place-items: center;
    border: 1px solid rgba(212,175,55,.60);
    border-radius: 50%;
    font-size: .61rem;
    background: radial-gradient(circle at 35% 30%, rgba(212,175,55,.18), transparent 58%);
  }

  nav.smart-nav.nav-collapsed:hover,
  nav#mainNav.nav-collapsed:hover,
  nav.smart-nav.nav-collapsed:focus-within,
  nav#mainNav.nav-collapsed:focus-within {
    transform: translateX(50%) translateY(-1px) scale(1.035);
  }
}
.time-machine-section{position:relative;padding:110px 5vw 120px;overflow:hidden;background:radial-gradient(circle at 18% 18%,rgba(212,175,55,.10),transparent 31%),radial-gradient(circle at 82% 70%,rgba(126,87,194,.13),transparent 34%),linear-gradient(180deg,#09080d 0%,#0d0b14 100%)}
.time-machine-section::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);background-size:44px 44px;mask-image:linear-gradient(to bottom,transparent,#000 18%,#000 82%,transparent)}
.time-machine-shell{position:relative;max-width:1180px;margin:auto;border:1px solid rgba(212,175,55,.22);border-radius:32px;padding:32px;background:linear-gradient(145deg,rgba(26,22,38,.9),rgba(11,10,16,.82));box-shadow:0 28px 90px rgba(0,0,0,.42);backdrop-filter:blur(18px)}
.time-machine-top{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(340px,.95fr);gap:28px;align-items:stretch}
.time-machine-console,.time-machine-result{border:1px solid rgba(255,255,255,.08);border-radius:24px;background:rgba(255,255,255,.035);padding:26px}
.time-machine-kicker{display:inline-flex;align-items:center;gap:9px;color:#e8c969;font-weight:800;font-size:.9rem}.time-machine-kicker::before{content:"";width:24px;height:1px;background:currentColor}
.time-machine-console h3{font-size:clamp(1.7rem,3vw,2.7rem);margin:16px 0 10px}.time-machine-console p{color:#bdb8c9;line-height:1.95;margin:0 0 24px}
.time-machine-form{display:grid;grid-template-columns:minmax(0,1fr) 150px auto;gap:12px}.time-machine-form input,.time-machine-form select{min-height:54px;border:1px solid rgba(255,255,255,.11);border-radius:16px;background:#111019;color:#fff;padding:0 16px;font:inherit;outline:none}.time-machine-form input:focus,.time-machine-form select:focus{border-color:rgba(212,175,55,.7);box-shadow:0 0 0 4px rgba(212,175,55,.1)}
.time-machine-submit{border:0;border-radius:16px;padding:0 23px;background:linear-gradient(135deg,#e6c95e,#aa7d1f);color:#17120a;font:inherit;font-weight:900;cursor:pointer;transition:.25s transform,.25s box-shadow}.time-machine-submit:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(212,175,55,.22)}
.time-machine-examples{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}.time-example{border:1px solid rgba(255,255,255,.08);border-radius:999px;background:rgba(255,255,255,.035);color:#d4cfdb;padding:8px 12px;font:inherit;font-size:.82rem;cursor:pointer}.time-example:hover{border-color:rgba(212,175,55,.45);color:#f0d66d}
.time-machine-result{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:center;min-height:330px}.time-machine-result::after{content:"";position:absolute;width:220px;height:220px;border:1px solid rgba(var(--tm-accent-rgb,212,175,55),.18);border-radius:50%;left:-90px;bottom:-100px;box-shadow:0 0 55px rgba(var(--tm-accent-rgb,212,175,55),.12)}
.tm-result-empty{color:#aca7b6;text-align:center}.tm-result-empty strong{display:block;color:#fff;font-size:1.35rem;margin-bottom:10px}.tm-result-content{position:relative;z-index:1}.tm-result-era{color:rgb(var(--tm-accent-rgb,212,175,55));font-weight:900}.tm-result-content h3{font-size:clamp(1.8rem,3vw,2.8rem);margin:10px 0}.tm-result-range{color:#c8c3cf}.tm-result-summary{color:#b9b4c1;line-height:1.9;margin:18px 0}.tm-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.tm-fact{padding:13px 14px;border-radius:15px;background:rgba(0,0,0,.18);border:1px solid rgba(255,255,255,.06)}.tm-fact span{display:block;font-size:.76rem;color:#9993a4;margin-bottom:5px}.tm-fact strong{font-size:.92rem}.tm-result-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}.tm-action{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 15px;border-radius:13px;text-decoration:none;font-weight:800;font-size:.88rem;border:1px solid rgba(212,175,55,.32);color:#ead36f;background:rgba(212,175,55,.07)}
.time-machine-details{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:18px}.tm-detail-card{border:1px solid rgba(255,255,255,.07);border-radius:20px;padding:20px;background:rgba(255,255,255,.025)}.tm-detail-card h4{margin:0 0 12px;font-size:1rem;color:#f2dc82}.tm-detail-card p,.tm-detail-card li{color:#b7b1c0;font-size:.9rem;line-height:1.75}.tm-detail-card ul{margin:0;padding-right:18px}.tm-detail-card .muted{color:#827d8a}
.time-machine-section.is-travelling .time-machine-shell{animation:tmPulse .75s ease}@keyframes tmPulse{0%{filter:brightness(1)}45%{filter:brightness(1.25);box-shadow:0 28px 110px rgba(212,175,55,.16)}100%{filter:brightness(1)}}
@media(max-width:900px){.time-machine-top{grid-template-columns:1fr}.time-machine-details{grid-template-columns:1fr}.time-machine-form{grid-template-columns:1fr 130px}.time-machine-submit{grid-column:1/-1;min-height:50px}}
@media(max-width:560px){.time-machine-section{padding:85px 16px}.time-machine-shell{padding:16px;border-radius:24px}.time-machine-console,.time-machine-result{padding:19px;border-radius:19px}.time-machine-form{grid-template-columns:1fr}.time-machine-submit{grid-column:auto}.tm-facts{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.time-machine-section.is-travelling .time-machine-shell{animation:none}}
/* PersiaVerse 8.0 — Historical Stories */
.stories-section{position:relative;overflow:hidden;padding:clamp(5rem,9vw,8rem) 0;background:radial-gradient(circle at 15% 25%,rgba(209,170,91,.11),transparent 30%),linear-gradient(180deg,rgba(12,10,20,.2),rgba(7,6,12,.92))}.stories-section:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);background-size:52px 52px;mask-image:linear-gradient(to bottom,transparent,#000 25%,#000 75%,transparent);pointer-events:none}.stories-shell{width:min(1180px,calc(100% - 40px));margin:auto;position:relative}.stories-feature{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(300px,.92fr);min-height:520px;border:1px solid rgba(224,189,117,.22);border-radius:30px;overflow:hidden;background:rgba(16,13,25,.76);box-shadow:0 35px 100px rgba(0,0,0,.42);backdrop-filter:blur(18px)}.stories-visual{position:relative;min-height:500px;background:radial-gradient(circle at 70% 32%,rgba(223,183,101,.24),transparent 18%),linear-gradient(145deg,#171021,#08070d);isolation:isolate}.stories-visual:before{content:"";position:absolute;inset:8%;border:1px solid rgba(222,187,111,.18);border-radius:50%;transform:rotate(-8deg)}.stories-visual:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 65%,rgba(16,13,25,.92));z-index:2}.stories-orbit{position:absolute;inset:15%;border:1px solid rgba(223,184,102,.25);border-radius:50%;animation:storyOrbit 18s linear infinite}.stories-orbit:nth-child(2){inset:27%;animation-duration:12s;animation-direction:reverse}.stories-city{position:absolute;left:30%;top:47%;width:18px;height:18px;border:2px solid #e0bb70;border-radius:50%;box-shadow:0 0 0 14px rgba(224,187,112,.08),0 0 45px rgba(224,187,112,.65)}.stories-route{position:absolute;left:18%;top:64%;width:48%;height:2px;background:linear-gradient(90deg,transparent,#dfb970);transform:rotate(-16deg);transform-origin:left}.stories-route:after{content:"";position:absolute;right:0;top:50%;width:8px;height:8px;border-radius:50%;background:#f3d89b;box-shadow:0 0 18px #e0bb70;transform:translate(50%,-50%)}.stories-content{padding:clamp(2rem,5vw,4.6rem);display:flex;flex-direction:column;justify-content:center;position:relative;z-index:3}.stories-label{font-size:.78rem;letter-spacing:.22em;text-transform:uppercase;color:#d9b56d}.stories-content h3{font-family:var(--font-display,serif);font-size:clamp(2.2rem,5vw,4.4rem);margin:.8rem 0 1rem;color:#fff}.stories-content p{color:rgba(255,255,255,.69);line-height:2;font-size:1rem}.stories-meta{display:flex;flex-wrap:wrap;gap:.65rem;margin:1.5rem 0 2rem}.stories-meta span{border:1px solid rgba(255,255,255,.1);border-radius:999px;padding:.5rem .8rem;color:rgba(255,255,255,.78);font-size:.82rem}.stories-actions{display:flex;gap:.8rem;flex-wrap:wrap}.story-primary,.story-secondary{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;min-height:48px;padding:.7rem 1.15rem;border-radius:14px;text-decoration:none;transition:.25s ease}.story-primary{background:linear-gradient(135deg,#e0bd76,#b9873d);color:#17100a;font-weight:800;box-shadow:0 12px 35px rgba(188,137,59,.22)}.story-primary:hover{transform:translateY(-2px);box-shadow:0 17px 40px rgba(188,137,59,.32)}.story-secondary{border:1px solid rgba(255,255,255,.13);color:#fff;background:rgba(255,255,255,.035)}.story-secondary:hover{background:rgba(255,255,255,.075)}@keyframes storyOrbit{to{transform:rotate(360deg)}}@media(max-width:850px){.stories-feature{grid-template-columns:1fr}.stories-visual{min-height:300px}.stories-visual:after{background:linear-gradient(180deg,transparent 55%,rgba(16,13,25,.95))}.stories-content{margin-top:-70px}.stories-shell{width:min(100% - 24px,680px)}}@media(prefers-reduced-motion:reduce){.stories-orbit{animation:none}}

/* v8.4 — stories library */
.stories-library{display:grid;grid-template-columns:1.25fr .75fr;gap:18px;margin-top:20px}.story-card{position:relative;min-height:310px;padding:clamp(24px,4vw,42px);border:1px solid rgba(224,189,117,.17);border-radius:26px;overflow:hidden;background:linear-gradient(145deg,rgba(24,18,31,.94),rgba(10,8,15,.96));box-shadow:0 24px 65px rgba(0,0,0,.28)}.story-card-copy{position:relative;z-index:3;max-width:620px}.story-card h3{font-family:var(--font-display,serif);font-size:clamp(2rem,4vw,3.4rem);margin:.65rem 0 .8rem;color:#fff}.story-card p{color:rgba(255,255,255,.67);line-height:1.95}.story-card-number{position:absolute;left:24px;top:20px;color:rgba(255,255,255,.22);font-size:.76rem;letter-spacing:.12em}.story-card-live{padding-left:34%}.story-card-art{position:absolute;left:0;top:0;bottom:0;width:32%;background:radial-gradient(circle at 45% 45%,rgba(204,146,73,.23),transparent 26%),linear-gradient(160deg,#1b111c,#09080d)}.story-card-art i{position:absolute;left:18%;right:12%;height:7px;border-radius:999px;background:repeating-linear-gradient(90deg,#c99555 0 8px,transparent 8px 14px);box-shadow:0 0 16px rgba(201,149,85,.25)}.story-card-art i:first-child{top:38%;transform:rotate(-8deg)}.story-card-art i:nth-child(2){top:61%;transform:rotate(7deg);background:repeating-linear-gradient(90deg,#d7d0c5 0 7px,transparent 7px 13px)}.story-card-art b{position:absolute;left:49%;top:28%;width:2px;height:46%;background:linear-gradient(transparent,#e1ba70,transparent);transform:rotate(12deg);box-shadow:0 0 14px #c58c47}.story-card-coming{opacity:.6;display:flex;align-items:center}.story-card-coming:after{content:"به‌زودی";position:absolute;left:24px;bottom:22px;border:1px solid rgba(255,255,255,.13);border-radius:999px;padding:7px 11px;color:rgba(255,255,255,.55);font-size:.78rem}@media(max-width:850px){.stories-library{grid-template-columns:1fr}.story-card-live{padding-left:clamp(24px,4vw,42px);padding-top:230px}.story-card-art{width:100%;height:205px;bottom:auto}.story-card-number{z-index:4}}


/* v8.5 — بازگشت دقیق به کتابخانه روایت‌ها */
#stories{scroll-margin-top:88px}
.stories-feature,.story-card{outline:none}
.story-return-highlight{animation:storyReturnGlow 2.6s ease both;z-index:5}
@keyframes storyReturnGlow{
  0%{border-color:rgba(244,205,119,.25);box-shadow:0 24px 65px rgba(0,0,0,.28)}
  18%,68%{border-color:rgba(244,205,119,.92);box-shadow:0 0 0 2px rgba(224,189,117,.18),0 0 52px rgba(212,166,76,.42),0 30px 85px rgba(0,0,0,.46);transform:translateY(-3px)}
  100%{border-color:rgba(224,189,117,.22);box-shadow:0 24px 65px rgba(0,0,0,.28);transform:none}
}
@media(prefers-reduced-motion:reduce){.story-return-highlight{animation:none;box-shadow:0 0 0 2px rgba(224,189,117,.38)}}

/* =========================================================
   v4.1.1 — Sticky navigation overlap fix
   Keeps page content from bleeding through the expanded nav.
   ========================================================= */
.smart-nav:not(.nav-collapsed) {
  background: #0b0b0a !important;
  isolation: isolate;
  z-index: 10020;
  box-shadow: 0 10px 30px rgba(0,0,0,.28);
}
.smart-nav:not(.nav-collapsed)::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: #0b0b0a;
  pointer-events: none;
}
.nav-reveal-zone { z-index: 10021; }
@media (max-width: 900px) {
  .smart-nav,
  .smart-nav.nav-collapsed,
  .smart-nav:not(.nav-collapsed) {
    background: #0b0b0a !important;
  }
}