:root{
  --red:#7b1113; --gold:#d6a73a; --black:#111; --cream:#fff8e8; --parchment:#f4e7c6; --ink:#21180f; --muted:#6b6254;
}
*{box-sizing:border-box} html{scroll-behavior:smooth} body{margin:0;font-family:Inter,system-ui,sans-serif;background:var(--cream);color:var(--ink)}
a{color:inherit}.hero{min-height:100vh;background:radial-gradient(circle at 72% 18%,rgba(214,167,58,.25),transparent 24%),linear-gradient(135deg,#080404,#28100f 48%,#050505);color:white;padding:24px;overflow:hidden;position:relative}.hero::after{content:"";position:absolute;inset:auto -10% -25% -10%;height:360px;background:radial-gradient(ellipse at center,rgba(214,167,58,.18),transparent 62%);pointer-events:none}.topbar{display:flex;align-items:center;justify-content:space-between;gap:20px;max-width:1280px;margin:0 auto;position:relative;z-index:3}.brand{display:flex;gap:12px;align-items:center;font-weight:800}.brand-mark{background:var(--gold);color:#160808;padding:10px 12px;border-radius:999px}.navlinks{display:flex;gap:18px;align-items:center}.navlinks a{text-decoration:none;opacity:.9;font-weight:700}.menu-btn{display:none;background:transparent;color:white;border:1px solid rgba(255,255,255,.35);border-radius:8px;padding:8px 12px}.hero-grid{display:grid;grid-template-columns:1fr .95fr .55fr;gap:28px;max-width:1280px;margin:54px auto 0;align-items:center;position:relative;z-index:2}.hero-copy{padding-bottom:50px}.eyebrow{text-transform:uppercase;letter-spacing:.16em;color:var(--gold);font-weight:800;font-size:.8rem}.hero h1,.section h2{font-family:'Playfair Display',serif}.hero h1{font-size:clamp(2.7rem,6.2vw,5.9rem);line-height:.94;margin:10px 0}.hero-text{font-size:1.15rem;max-width:640px;line-height:1.7}.btn,.earn-btn{border:0;border-radius:999px;padding:14px 20px;font-weight:800;cursor:pointer;text-decoration:none;display:inline-block}.primary{background:var(--gold);color:#160808}.secondary{border:1px solid rgba(255,255,255,.35);color:white;background:rgba(255,255,255,.04)}.hero-actions{display:flex;gap:14px;flex-wrap:wrap}.bishop-feature{position:relative;min-width:0}.bishop-feature img{width:100%;display:block;filter:drop-shadow(0 28px 45px rgba(0,0,0,.65));border-radius:18px}.bishop-caption{position:absolute;left:22px;right:22px;bottom:18px;background:linear-gradient(180deg,rgba(9,5,4,.72),rgba(9,5,4,.95));border:1px solid rgba(214,167,58,.5);border-radius:20px;padding:18px;backdrop-filter:blur(6px)}.bishop-caption h2{font-family:'Playfair Display',serif;margin:0 0 4px;font-size:1.8rem;color:var(--gold)}.bishop-caption p{margin:0}.score-card{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.25);backdrop-filter:blur(10px);padding:24px;border-radius:24px;height:max-content}.progress-wrap{height:16px;background:rgba(255,255,255,.18);border-radius:999px;overflow:hidden}.progress-wrap div{height:100%;width:0;background:var(--gold);transition:.4s}.badge-shelf{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}.badge{background:var(--gold);color:#130808;border-radius:999px;padding:8px 10px;font-size:.8rem;font-weight:800}.section{max-width:1200px;margin:0 auto;padding:80px 24px}.intro{font-size:1.5rem;text-align:center}.intro p{max-width:850px;margin:0 auto 24px;line-height:1.6}.section h2{font-size:clamp(2rem,4vw,3.6rem);margin:.1rem 0 1.2rem}.large-text{font-size:1.25rem;line-height:1.7}.bishop-section{max-width:1280px}.bishop-panel{display:grid;grid-template-columns:.82fr 1fr;gap:34px;align-items:center;background:linear-gradient(135deg,#130909,#27100d);color:white;border:1px solid rgba(214,167,58,.45);border-radius:36px;padding:28px;box-shadow:0 22px 60px rgba(30,10,8,.22)}.bishop-panel-image img{width:100%;border-radius:26px;display:block;border:1px solid rgba(214,167,58,.35)}.bishop-values{display:flex;gap:10px;flex-wrap:wrap;margin:24px 0}.bishop-values span{background:rgba(214,167,58,.14);border:1px solid rgba(214,167,58,.38);border-radius:999px;padding:10px 13px;font-weight:800}.timeline-layout{display:grid;grid-template-columns:300px 1fr;gap:22px}.timeline-tabs{display:flex;flex-direction:column;gap:10px}.tab{padding:14px;border:2px solid #e2cf9d;background:white;border-radius:16px;text-align:left;font-weight:800;cursor:pointer}.tab.active{background:var(--red);color:white;border-color:var(--red)}.period-card,.culture-card,.person-card,.map-card{background:white;border:1px solid #ead9ad;border-radius:24px;box-shadow:0 14px 40px rgba(68,45,18,.08)}.period-card{padding:30px;min-height:420px}.period-card h3{font-size:2rem;margin:0 0 8px}.tag{display:inline-block;background:var(--parchment);padding:8px 12px;border-radius:999px;font-weight:800;margin:5px}.split{display:grid;grid-template-columns:1.2fr .8fr;gap:28px;align-items:center}.fact-grid,.culture-grid,.people-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.fact-card{background:white;border:2px solid #ead9ad;border-radius:18px;padding:18px;text-align:left;font-weight:800;cursor:pointer}.fact-display{margin-top:18px;background:#1d0d0d;color:white;border-left:8px solid var(--gold);padding:22px;border-radius:16px}.map-card{min-height:360px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:linear-gradient(135deg,#fff,#f1dfb5)}.map-pin{font-size:5rem}.culture-card,.person-card{padding:22px}.culture-card h3,.person-card h3{margin-top:0}.filters{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:22px}.filter{border:1px solid #d4b971;background:white;border-radius:999px;padding:10px 13px;font-weight:800;cursor:pointer}.filter.active{background:var(--black);color:white}.person-card .period{color:var(--red);font-weight:800}.rewards{background:#1a0d0d;color:white;border-radius:36px;margin-bottom:40px}.reward-path{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}.reward-path div{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);border-radius:18px;padding:18px;text-align:center}.reward-path span{font-size:3rem;color:var(--gold)}.reward-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}.earn-btn{background:var(--red);color:white}.quizBox label{display:block}.question{background:white;border-radius:20px;border:1px solid #ead9ad;padding:20px;margin-bottom:16px}.question h3{margin-top:0}.question label{display:block;margin:10px 0}.quiz #quizResult{margin-top:20px;font-weight:800;font-size:1.2rem}footer{text-align:center;background:#120707;color:white;padding:30px}footer a{color:var(--gold);font-weight:800}
@media(max-width:1050px){.hero-grid{grid-template-columns:1fr}.bishop-feature{max-width:720px;margin:0 auto}.score-card{max-width:720px;width:100%;margin:0 auto}.hero-copy{text-align:center;padding-bottom:0}.hero-text{margin-left:auto;margin-right:auto}.hero-actions{justify-content:center}.bishop-panel{grid-template-columns:1fr}.bishop-panel-image{max-width:620px;margin:0 auto}}
@media(max-width:800px){.menu-btn{display:block}.navlinks{display:none;position:absolute;top:70px;left:24px;right:24px;background:#1b0b0b;padding:18px;border-radius:18px;flex-direction:column;z-index:5}.navlinks.open{display:flex}.timeline-layout,.split{grid-template-columns:1fr}.fact-grid,.culture-grid,.people-grid,.reward-path{grid-template-columns:1fr}.hero{padding:18px}.hero-grid{margin-top:40px}.bishop-caption{position:static;border-radius:0 0 18px 18px}.bishop-feature img{border-radius:18px 18px 0 0}.bishop-panel{padding:18px;border-radius:24px}}