:root{--blue:#1A2740;--blue-deep:#0E1420;--wool:#EFE6D2;--parch:#F8F4EA;--gold:#C9A227;--gold-soft:#E3C770;--crimson:#8E2B2B;--crimson-soft:#A84848;--olive:#5E7D4A;--ink:#121826;--stone:#6B645A;--night:#0E1420;--night2:#1C2333;
--display:"Cormorant Garamond",Georgia,serif;--body:"Source Serif 4",Georgia,serif;--mono:"IBM Plex Mono",ui-monospace,monospace;--ui:Inter,system-ui,sans-serif;--r:14px;--shadow:0 1px 2px rgba(18,24,38,.06),0 8px 30px rgba(18,24,38,.1)}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--parch);color:var(--ink);font:18px/1.65 var(--body);
background-image:radial-gradient(rgba(201,162,39,.05) 1px,transparent 1px),radial-gradient(rgba(107,100,90,.04) 1px,transparent 1px);background-size:22px 22px,13px 13px;background-position:0 0,7px 11px}
a{color:var(--blue)}a:hover{color:var(--blue-deep)}
h1,h2,h3{font-family:var(--display);font-weight:600;color:var(--blue-deep);line-height:1.1;letter-spacing:.005em}
h1{font-size:clamp(2.6rem,6vw,4.6rem);margin:.2em 0}h2{font-size:2.1rem;margin:1.2em 0 .4em}h3{font-size:1.45rem;margin:.6em 0 .3em}
.mono,cite,code{font-family:var(--mono);font-size:.78em;font-style:normal}
.eyebrow{font:600 .72rem/1 var(--ui);letter-spacing:.22em;text-transform:uppercase;color:var(--gold)}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px}
/* header */
.site-head{position:sticky;top:0;z-index:30;background:rgba(248,244,234,.88);backdrop-filter:blur(10px);border-bottom:1px solid rgba(201,162,39,.35)}
.site-head .wrap{display:flex;align-items:center;gap:24px;height:64px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--blue-deep);font:600 1.5rem var(--display)}
.brand svg{width:34px;height:34px}
.brand small{font:500 .6rem var(--ui);letter-spacing:.15em;text-transform:uppercase;color:var(--stone);display:block;margin-top:-4px}
nav.main{margin-left:auto;display:flex;gap:4px;flex-wrap:wrap}
nav.main a{font:500 .88rem var(--ui);text-decoration:none;color:var(--ink);padding:8px 12px;border-radius:999px}
nav.main a:hover{background:var(--wool)}nav.main a[aria-current]{background:var(--blue);color:var(--parch)}
.menu-btn{display:none}
@media(max-width:820px){nav.main{display:none;position:absolute;top:64px;left:0;right:0;background:var(--parch);flex-direction:column;padding:12px;border-bottom:1px solid var(--gold)}nav.main.open{display:flex}.menu-btn{display:block;margin-left:auto;background:none;border:1px solid var(--stone);border-radius:8px;padding:6px 10px;font:500 .85rem var(--ui)}}
/* hero */
.hero{position:relative;overflow:hidden;background:linear-gradient(160deg,var(--blue-deep),var(--blue) 55%,#3b6e9e);color:var(--wool)}
.hero .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center;padding-top:90px;padding-bottom:110px}
.hero h1{color:var(--parch)}.hero h1 em{color:var(--gold-soft);font-style:italic}
.hero p.lede{font-size:1.25rem;max-width:34em;opacity:.92}
.hero .verse{font:italic 1.1rem var(--display);color:var(--gold-soft);border-left:2px solid var(--gold);padding-left:14px;margin:28px 0}
.hero:after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:60px;background:var(--parch);clip-path:ellipse(70% 100% at 50% 100%)}
.hero-tree{width:100%;max-width:460px;justify-self:center;filter:drop-shadow(0 20px 40px rgba(0,0,0,.25))}
@media(max-width:820px){.hero .wrap{grid-template-columns:1fr;padding-top:50px}.hero-tree{max-width:300px}}
.btn{display:inline-flex;align-items:center;gap:8px;font:600 .95rem var(--ui);padding:13px 22px;border-radius:999px;text-decoration:none;border:1px solid transparent;cursor:pointer;transition:.2s}
.btn.gold{background:var(--gold);color:var(--night)}.btn.gold:hover{background:var(--gold-soft);color:var(--night)}
.btn.ghost{border-color:rgba(239,230,210,.5);color:var(--wool)}.btn.ghost:hover{background:rgba(239,230,210,.1);color:#fff}
.btn.blue{background:var(--blue);color:var(--parch)}
.row{display:flex;gap:12px;flex-wrap:wrap}
/* cards */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px}
.card{background:var(--wool);border:1px solid rgba(201,162,39,.35);border-radius:var(--r);padding:22px;box-shadow:var(--shadow);position:relative}
.card.link{text-decoration:none;color:inherit;transition:transform .2s,box-shadow .2s}.card.link:hover{transform:translateY(-3px);box-shadow:0 14px 40px rgba(31,27,22,.14)}
.card .ico{width:38px;height:38px;color:var(--blue)}
.card h3{margin-top:.4em}
.tag{display:inline-block;font:600 .7rem var(--ui);letter-spacing:.08em;text-transform:uppercase;padding:4px 10px;border-radius:999px;color:#fff}
.rule{height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent);border:0;margin:48px 0}
section{padding:24px 0}
.note{font:.85rem/1.55 var(--ui);color:var(--stone);background:rgba(239,230,210,.6);border-left:3px solid var(--gold);padding:12px 16px;border-radius:0 8px 8px 0}
.note.crimson{border-color:var(--crimson)}
footer.site-foot{margin-top:80px;background:var(--night);color:var(--wool);padding:48px 0 32px;font:.9rem var(--ui)}
footer.site-foot a{color:var(--gold-soft)}footer .cols{display:grid;grid-template-columns:2fr 1fr 1fr;gap:32px}
@media(max-width:700px){footer .cols{grid-template-columns:1fr}}
/* map */
.map-shell{display:grid;grid-template-columns:1fr 400px;height:calc(100vh - 64px)}
.map-stage{position:relative;overflow:hidden;background:radial-gradient(ellipse at 15% 50%,rgba(47,93,140,.08),transparent 60%)}
.map-stage svg{width:100%;height:100%;cursor:grab;touch-action:none}.map-stage svg:active{cursor:grabbing}
.map-tools{position:absolute;top:16px;left:16px;display:flex;gap:8px;flex-wrap:wrap;z-index:2}
.chip{font:500 .8rem var(--ui);border:1px solid rgba(31,27,22,.18);background:rgba(248,244,234,.92);padding:7px 13px;border-radius:999px;cursor:pointer;color:var(--ink)}
.chip[aria-pressed=true]{background:var(--crimson);color:#fff;border-color:var(--crimson)}
.node text{font:500 12.5px var(--ui);fill:var(--ink);paint-order:stroke;stroke:var(--parch);stroke-width:4px}
.node{cursor:pointer}.node circle.halo{transition:r .2s}.node:hover circle.halo,.node.sel circle.halo{r:20}
.node.dim{opacity:.18}.link-path{fill:none;stroke:var(--gold);stroke-linecap:round}.link-halo{pointer-events:none}
.era-band text{font:600 10px var(--ui);letter-spacing:.2em;fill:var(--stone);text-transform:uppercase}
.panel{background:var(--parch);border-left:1px solid rgba(201,162,39,.4);overflow:auto;padding:28px}
@media(max-width:900px){.map-shell{grid-template-columns:1fr;height:auto}.map-stage{height:70vh}.panel{border-left:0;border-top:1px solid var(--gold)}}
/* tradition card */
.tcard header{display:flex;gap:14px;align-items:center}.tcard header svg{width:48px;height:48px;flex:none}
.tcard h2{margin:.1em 0}.meta{font:.82rem var(--ui);color:var(--stone)}
dl.axes{display:grid;grid-template-columns:auto 1fr;gap:8px 16px;margin:16px 0}
dl.axes dt{font:600 .72rem var(--ui);letter-spacing:.1em;text-transform:uppercase;color:var(--blue);padding-top:4px}dl.axes dd{margin:0;font-size:.95rem}
ul.src{list-style:none;padding:0}ul.src li{margin:6px 0;padding-left:22px;position:relative;font-size:.9rem}ul.src li:before{content:"¶";position:absolute;left:0;color:var(--gold)}
ul.src a{font-family:var(--mono);font-size:.8rem;word-break:break-word}
.pills{display:flex;flex-wrap:wrap;gap:6px;padding:0;list-style:none}.pills li{font:.8rem var(--ui);background:rgba(94,125,74,.12);color:#3e5631;padding:4px 10px;border-radius:999px}
/* timeline */
.tl{position:relative;margin:30px 0 0;padding-left:0}
.tl:before{content:"";position:absolute;left:110px;top:0;bottom:0;width:2px;background:linear-gradient(var(--gold),var(--olive),var(--blue))}
.ev{display:grid;grid-template-columns:96px 28px 1fr;gap:0 0;align-items:start;padding:10px 0;transition:opacity .3s}
.ev .yr{font:600 1.05rem var(--mono);text-align:right;color:var(--blue-deep);padding-top:3px;padding-right:4px}
.ev .dot{width:16px;height:16px;border-radius:50%;margin:6px 0 0 7px;border:3px solid var(--parch);box-shadow:0 0 0 1px var(--stone);z-index:1}
.ev .dot.council{border-radius:3px;transform:rotate(45deg)}.ev .dot.schism{background:var(--crimson)!important}
.ev .body{background:var(--wool);border-radius:10px;padding:10px 16px;border:1px solid rgba(201,162,39,.25)}
.ev .body small{font:600 .68rem var(--ui);letter-spacing:.1em;text-transform:uppercase;color:var(--stone)}
.ev.hide{display:none}
/* compare */
.cmp-pick{display:flex;gap:16px;flex-wrap:wrap;align-items:center}
select{font:500 1rem var(--ui);padding:10px 14px;border-radius:10px;border:1px solid var(--stone);background:var(--wool);min-width:260px}
table.cmp{width:100%;border-collapse:separate;border-spacing:0;margin-top:24px;background:var(--wool);border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow)}
table.cmp th,table.cmp td{padding:16px 18px;vertical-align:top;border-bottom:1px solid rgba(201,162,39,.25);text-align:left}
table.cmp thead th{background:var(--blue-deep);color:var(--wool);font:600 1.3rem var(--display)}
table.cmp tbody th{font:600 .72rem var(--ui);letter-spacing:.12em;text-transform:uppercase;color:var(--blue);width:160px}
td.same{background:rgba(94,125,74,.1)}
.contested-zone{background:linear-gradient(180deg,#ece8df,#e4dfd4);border:1px dashed var(--stone);border-radius:var(--r);padding:28px}
/* ===== Glory layer ===== */
:focus-visible{outline:3px solid var(--gold);outline-offset:3px;border-radius:6px}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--night);color:var(--gold-soft);padding:10px 16px;border-radius:8px;font:600 .9rem var(--ui);transition:top .2s}.skip:focus{top:12px}
main:focus{outline:none}
.site-head{box-shadow:0 1px 0 rgba(201,162,39,.25),0 6px 24px rgba(31,27,22,.04)}
.site-head:after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:linear-gradient(90deg,transparent,var(--crimson),var(--gold),transparent)}
nav.main a{transition:background .2s,color .2s}
/* hero */
.hero{background:radial-gradient(ellipse 60% 70% at 72% 85%,rgba(227,199,112,.32),transparent 60%),radial-gradient(ellipse 50% 60% at 15% 10%,rgba(239,230,210,.12),transparent 60%),linear-gradient(165deg,#13263f,var(--blue-deep) 35%,var(--blue) 75%,#3b6e9e)}
.hero:before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.22;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.6'/%3E%3C/svg%3E")}
.hero-glow{position:absolute;right:8%;bottom:-10%;width:640px;height:640px;border-radius:50%;background:radial-gradient(circle,rgba(227,199,112,.35),rgba(201,162,39,.08) 45%,transparent 70%);pointer-events:none;animation:breathe 7s ease-in-out infinite}
.hero .wrap{position:relative;z-index:2;padding-top:120px;padding-bottom:150px;min-height:min(88vh,820px)}
.hero h1{font-size:clamp(3rem,8vw,6.4rem);font-weight:600;letter-spacing:-.01em;text-shadow:0 2px 30px rgba(0,0,0,.25)}
.hero h1 em{background:linear-gradient(100deg,#E3C770,#fff3c4 40%,#C9A227 70%);-webkit-background-clip:text;background-clip:text;color:transparent;background-size:200% 100%;animation:sheen 9s ease-in-out infinite}
.hero .eyebrow{display:flex;align-items:center;gap:14px}.hero .eyebrow:before,.hero .eyebrow:after{content:"";height:1px;width:48px;background:linear-gradient(90deg,transparent,var(--gold))}.hero .eyebrow:after{transform:scaleX(-1)}
.hero .wrap>div:first-child>*{animation:rise .9s both cubic-bezier(.2,.7,.2,1)}.hero .wrap>div:first-child>*:nth-child(2){animation-delay:.12s}.hero .wrap>div:first-child>*:nth-child(3){animation-delay:.24s}.hero .wrap>div:first-child>*:nth-child(4){animation-delay:.36s}.hero .wrap>div:first-child>*:nth-child(5){animation-delay:.48s}
.hero-tree{max-width:520px;filter:drop-shadow(0 0 40px rgba(227,199,112,.25)) drop-shadow(0 20px 40px rgba(0,0,0,.3))}
.hero-tree .pulse{transform-origin:200px 360px;animation:halo 3.6s ease-out infinite}
.motes{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:1}
.motes span{position:absolute;bottom:-20px;width:var(--s);height:var(--s);animation:float var(--t) linear var(--dl) infinite}
.motes .mote{border-radius:50%;background:radial-gradient(circle,#fff6d0,rgba(227,199,112,.6) 40%,transparent 70%);box-shadow:0 0 8px rgba(227,199,112,.6)}
.motes .leaf{background:#9fbf86;opacity:.5;border-radius:0 100% 0 100%}
.btn.gold{box-shadow:0 0 0 1px rgba(255,243,196,.4) inset,0 8px 24px rgba(201,162,39,.35)}.btn.gold:hover{transform:translateY(-2px);box-shadow:0 0 0 1px #fff3c4 inset,0 12px 30px rgba(201,162,39,.5)}
.btn.line{border-color:var(--blue);color:var(--blue);background:transparent}.btn.line:hover{background:var(--blue);color:var(--parch)}
.btn.sm{padding:8px 14px;font-size:.82rem}.btn.blue:hover{background:var(--blue-deep);color:#fff}
@keyframes float{0%{transform:translate(0,0) rotate(0);opacity:0}10%{opacity:.9}90%{opacity:.7}100%{transform:translate(var(--x),-95vh) rotate(260deg);opacity:0}}
@keyframes breathe{50%{transform:scale(1.08);opacity:.8}}
@keyframes sheen{50%{background-position:100% 0}}
@keyframes rise{from{opacity:0;transform:translateY(18px)}}
@keyframes halo{0%{transform:scale(.8);opacity:.9}100%{transform:scale(1.9);opacity:0}}
h2{position:relative}.wrap section>h2:after{content:"";display:block;width:64px;height:2px;margin-top:12px;background:linear-gradient(90deg,var(--gold),transparent)}
/* reveal */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .8s cubic-bezier(.2,.7,.2,1) var(--d,0ms),transform .8s cubic-bezier(.2,.7,.2,1) var(--d,0ms)}.reveal.in{opacity:1;transform:none}
.card{transition:transform .3s cubic-bezier(.2,.7,.2,1),box-shadow .3s,border-color .3s}
.card.link:before{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(circle at 50% 0,rgba(227,199,112,.25),transparent 60%);opacity:0;transition:opacity .3s;pointer-events:none}
.card.link:hover{transform:translateY(-6px);border-color:var(--gold);box-shadow:0 0 0 1px rgba(201,162,39,.4),0 20px 50px rgba(31,27,22,.16)}.card.link:hover:before{opacity:1}
.card.link .ico{transition:transform .3s}.card.link:hover .ico{transform:scale(1.12) rotate(-4deg)}
footer.site-foot{position:relative;background:radial-gradient(ellipse at 50% 0,rgba(201,162,39,.12),transparent 60%),var(--night)}footer.site-foot:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent)}
/* map */
.map-stage{background:radial-gradient(ellipse at 4% 50%,rgba(227,199,112,.22),transparent 35%),radial-gradient(ellipse at 15% 50%,rgba(47,93,140,.08),transparent 60%)}
.node{transition:opacity .45s ease,filter .3s}.node.dim{opacity:.12;filter:grayscale(1)}.link-path{transition:opacity .45s}.link-path.dim{opacity:.1}
.pre .node{opacity:0}
.node.sel circle:not(.halo):not(.aura):not(.ring){stroke:var(--gold);stroke-width:3.5}.node.sel text{font-weight:700;fill:var(--blue-deep)}
.node.sel circle.halo{opacity:.35;animation:selp 2s ease-in-out infinite}
@keyframes selp{50%{r:24}}
.node.root .aura{animation:breathe 5s ease-in-out infinite;transform-box:fill-box;transform-origin:center}.node.root .ring{transform-box:fill-box;transform-origin:center;animation:halo 3.6s ease-out infinite}
.node:focus-visible{outline:none}.node:focus-visible circle.halo{r:22;opacity:.5;stroke:var(--gold);stroke-width:2}
.map-search input{font:500 .85rem var(--ui);padding:8px 14px;border-radius:999px;border:1px solid var(--gold);background:rgba(248,244,234,.96);min-width:200px;box-shadow:var(--shadow)}
.map-search input.miss{animation:shake .4s}@keyframes shake{25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
.chip{transition:background .2s,color .2s,transform .15s,box-shadow .2s}.chip:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(31,27,22,.1)}
.zoom-ctl{position:absolute;right:16px;bottom:16px;display:flex;flex-direction:column;gap:6px;z-index:3}
.zoom-ctl button{width:42px;height:42px;border-radius:12px;border:1px solid rgba(201,162,39,.6);background:rgba(248,244,234,.95);font:600 1.2rem var(--ui);color:var(--blue-deep);cursor:pointer;box-shadow:var(--shadow)}.zoom-ctl .fit{font-size:.72rem;letter-spacing:.06em}.zoom-ctl button:hover{background:var(--blue);color:#fff}
.map-tip{position:absolute;z-index:4;width:220px;pointer-events:none;background:rgba(18,24,38,.94);color:var(--wool);border:1px solid rgba(201,162,39,.5);border-radius:10px;padding:10px 12px 10px 16px;font:.8rem/1.35 var(--ui);box-shadow:0 10px 30px rgba(0,0,0,.25);display:flex;flex-direction:column;overflow:hidden;animation:rise .2s both}
.map-tip .bar{position:absolute;left:0;top:0;bottom:0;width:4px}.map-tip b{font:600 1.05rem var(--display);color:var(--parch)}.map-tip .yr{font:500 .72rem var(--mono);color:var(--gold-soft)}.map-tip em{color:#c9c1ad;font-size:.72rem}
.map-hint{position:absolute;left:16px;bottom:16px;font:.72rem var(--ui);color:var(--stone);background:rgba(248,244,234,.85);padding:6px 10px;border-radius:8px;z-index:2}
@media(max-width:900px){.map-hint{display:none}}
.panel.enter .tcard{animation:panelIn .5s both cubic-bezier(.2,.7,.2,1)}@keyframes panelIn{from{opacity:0;transform:translateX(24px)}}
.panel .tcard header{position:relative}
.tcard header>span:first-child{display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:radial-gradient(circle,rgba(227,199,112,.3),transparent 70%);flex:none}
.tcard .tag{box-shadow:0 2px 8px rgba(0,0,0,.12)}
/* timeline */
.tl:before{left:110px;width:3px;border-radius:3px;box-shadow:0 0 12px rgba(201,162,39,.4)}
.cent{position:sticky;top:72px;z-index:5;margin:22px 0 6px;padding-left:60px}
.cent span{display:inline-block;font:600 .72rem var(--ui);letter-spacing:.2em;text-transform:uppercase;color:var(--blue-deep);background:var(--parch);border:1px solid var(--gold);padding:6px 14px;border-radius:999px;box-shadow:var(--shadow)}
.cent.hide{display:none}
.ev .dot{width:22px;height:22px;margin:3px 0 0 4px;display:grid;place-items:center;font-size:10px;color:#fff;box-shadow:0 0 0 1px var(--stone),0 0 0 6px rgba(201,162,39,.0);transition:box-shadow .3s}
.ev .dot i{font-style:normal;line-height:1}.ev .dot.council i{transform:rotate(-45deg)}
.ev .dot.schism{box-shadow:0 0 0 1px var(--crimson),0 0 12px rgba(142,43,43,.5)}
.ev:hover .dot,.ev.open .dot{box-shadow:0 0 0 1px var(--gold),0 0 0 6px rgba(201,162,39,.2)}
.ev .body{padding:0;overflow:hidden;transition:box-shadow .3s,border-color .3s}.ev.schism .body{border-left:3px solid var(--crimson)}.ev.council .body{border-left:3px solid var(--gold)}
.ev:hover .body{border-color:var(--gold);box-shadow:0 8px 24px rgba(31,27,22,.08)}
.ev-head{all:unset;box-sizing:border-box;display:grid;grid-template-columns:1fr auto;width:100%;padding:10px 16px;cursor:pointer}.ev-head small{grid-column:1}.ev-head .lbl{grid-column:1;font-size:1.02rem}.ev-head .chev{grid-row:1/3;grid-column:2;align-self:center;font:1.4rem var(--display);color:var(--gold);transition:transform .3s}
.ev-head:focus-visible{outline:3px solid var(--gold);outline-offset:-3px}
.ev.open .chev{transform:rotate(90deg)}
.ev-more{display:block;max-height:0;padding:0 16px;overflow:hidden;transition:max-height .45s ease,padding .3s}.ev.open .ev-more{max-height:600px;padding-bottom:14px}.ev-more p{margin:.5em 0;font-size:.95rem}.ev-more .row{gap:8px}
@media(max-width:600px){.tl:before{left:58px}.ev{grid-template-columns:48px 26px 1fr}.ev .yr{font-size:.85rem}.cent{padding-left:10px}}
/* compare */
.cmp-pick select{transition:border-color .2s,box-shadow .2s}.cmp-pick select:hover{border-color:var(--gold)}
.cmp-pick .amp{font:italic 1.4rem var(--display);color:var(--gold)}
.swap{width:40px;height:40px;border-radius:50%;border:1px solid var(--gold);background:var(--wool);color:var(--blue-deep);cursor:pointer;font-size:1.1rem;transition:transform .3s}.swap:hover{transform:rotate(180deg)}
.cmp-scroll{overflow-x:auto}
table.cmp thead th{position:relative;border-top:5px solid var(--fc,var(--blue-deep))}table.cmp thead th:first-child{border-top-color:var(--blue-deep)}
td.same{background:rgba(94,125,74,.12);box-shadow:inset 3px 0 0 var(--olive)}td.diff{background:rgba(201,162,39,.08);box-shadow:inset 3px 0 0 var(--gold)}
table.cmp tbody tr{transition:background .2s}table.cmp tbody tr:hover td{filter:brightness(.98)}
table.cmp.pop{animation:rise .5s both}
.cmp-legend{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:20px;font:.8rem var(--ui);color:var(--stone)}.cmp-legend .sw{width:14px;height:14px;border-radius:4px;display:inline-block}.sw.same{background:rgba(94,125,74,.35)}.sw.diff{background:rgba(201,162,39,.35)}
.cmp-empty{text-align:center;padding:48px 20px;margin-top:24px;border:1px dashed var(--gold);border-radius:var(--r);background:radial-gradient(circle at 50% 0,rgba(227,199,112,.2),transparent 60%),var(--wool)}.cmp-empty svg{width:140px}
@media(max-width:700px){select{min-width:0;width:100%}.cmp-pick .amp{display:none}}
/* reduced motion */
@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.motes,.hero-glow{display:none}.reveal{opacity:1;transform:none}.hero-tree path{stroke-dashoffset:0!important}.hero-tree circle{opacity:1!important}}

.zoom-ctl .zoom-pct{display:block;text-align:center;font:600 .72rem var(--mono);color:var(--blue-deep);padding:2px 0 4px;min-width:3.2em}
.map-stage{touch-action:none;-webkit-user-select:none;user-select:none}
.map-stage svg{-webkit-touch-callout:none}
@media (max-width:900px){.map-hint{font-size:.72rem}.zoom-ctl{bottom:18px}}

@media (max-width:900px){
  .zoom-ctl{right:12px;bottom:24px;z-index:6}
  .zoom-ctl button{width:48px;height:48px;font-size:1.35rem}
  .map-stage,.map-stage svg{touch-action:none;-ms-touch-action:none}
}


/* ===== Timeline zoom + H/V layout ===== */
.tl-stage{position:relative;overflow:auto;max-height:min(78vh,920px);margin:16px 0 32px;padding:12px 12px 72px;border:1px solid rgba(201,162,39,.35);border-radius:var(--r);background:rgba(239,230,210,.35);touch-action:none;-webkit-user-select:none;user-select:none;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;--tl-z:1}
.tl-stage.is-zoomed{cursor:grab}.tl-stage.is-zoomed:active{cursor:grabbing}
.tl-scaler{position:relative;min-width:100%}
.tl-zoom{transform-origin:0 0;will-change:transform;backface-visibility:hidden}
/* keep labels legible when zoomed out: floor font via inverse of mild shrink */
.tl-zoom .ev .yr,.tl-zoom .ev-head .lbl,.tl-zoom .cent span{text-rendering:geometricPrecision}
.tl-zoom .cent span{-webkit-font-smoothing:antialiased}
.tl-hint{margin:8px 0 0;font-size:.82rem}
.tl-lay{display:inline-flex;gap:6px;margin-left:4px}
.tl-zoom-ctl{position:absolute;right:12px;bottom:12px;display:flex;flex-direction:column;align-items:stretch;gap:6px;z-index:6;padding:8px;border-radius:16px;background:rgba(248,244,234,.92);border:1px solid rgba(201,162,39,.45);box-shadow:var(--shadow);backdrop-filter:blur(8px)}
.tl-zoom-ctl button{width:44px;height:44px;border-radius:12px;border:1px solid rgba(142,43,43,.4);background:var(--parch);font:600 1.25rem var(--ui);color:var(--blue-deep);cursor:pointer;line-height:1}
.tl-zoom-ctl .fit{font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;font-weight:700}
.tl-zoom-ctl button:hover,.tl-zoom-ctl button:focus-visible{background:var(--crimson);color:#fff;border-color:var(--crimson);outline:none}
.tl-zoom-ctl .zoom-pct{display:block;text-align:center;font:700 .75rem var(--mono);color:var(--crimson);padding:4px 0 0;min-width:3.2em}
html[data-theme="dark"] .tl-zoom-ctl{background:rgba(28,35,51,.94);border-color:rgba(201,162,39,.35)}
html[data-theme="dark"] .tl-zoom-ctl button{background:#121826;color:var(--gold-soft);border-color:rgba(201,162,39,.35)}

/* vertical (default) — keep existing .tl rules */
.tl.is-v{position:relative;contain:layout}

/* horizontal layout */
.tl.is-h{display:flex;flex-direction:row;align-items:flex-start;gap:0;min-width:max-content;padding:56px 24px 28px;margin:0;contain:layout}
.tl.is-h:before{left:24px;right:24px;top:78px;bottom:auto;width:auto;height:3px;background:linear-gradient(90deg,var(--gold),var(--olive),var(--crimson),var(--blue))}
.tl.is-h .cent{position:static;top:auto;margin:0 8px 0 0;padding:0;flex:none;align-self:flex-start;transform:translateY(-42px)}
.tl.is-h .cent span{writing-mode:horizontal-tb;white-space:nowrap}
.tl.is-h .ev{display:flex;flex-direction:column;align-items:center;width:240px;flex:none;padding:0 10px;gap:8px;grid-template-columns:none}
.tl.is-h .ev .yr{text-align:center;padding:0;font-size:.95rem;order:0}
.tl.is-h .ev .dot{margin:0;order:1}
.tl.is-h .ev .body{width:100%;order:2}
.tl.is-h .ev-head{grid-template-columns:1fr;padding:10px 12px}
.tl.is-h .ev-head .chev{grid-row:auto;grid-column:auto;justify-self:end}
.tl.is-h .ev.open .chev{transform:rotate(90deg)}
@media(max-width:600px){
  .tl.is-h .ev{width:200px}
  .tl-stage{max-height:70vh;padding-bottom:72px}
  .tl-zoom-ctl button{width:48px;height:48px;font-size:1.35rem}
  .tl-hint{font-size:.75rem}
}
@media (prefers-reduced-motion: reduce){
  .tl-zoom{transition:none}
}


/* ===== Glossary tooltips ===== */
.gloss{all:unset;cursor:help;border-bottom:1px dotted var(--crimson);color:inherit;font:inherit;border-radius:2px}
.gloss:hover,.gloss:focus-visible{background:rgba(142,43,43,.12);outline:none}
.gloss-icon{border-bottom:none;display:inline-grid;place-items:center;cursor:help;border-radius:8px}
.gloss-icon:hover,.gloss-icon:focus-visible{background:rgba(201,162,39,.18);outline:2px solid var(--gold);outline-offset:2px}
.gloss-icon svg{width:1em;height:1em}
.tcard header .gloss-icon svg,.brand .gloss-icon svg{width:48px;height:48px}
.brand .gloss-icon svg{width:34px;height:34px}
.gloss-tip{position:fixed;z-index:80;max-width:280px;padding:12px 14px;border-radius:12px;background:rgba(14,20,32,.96);color:var(--wool);border:1px solid rgba(201,162,39,.55);box-shadow:0 12px 36px rgba(0,0,0,.35);font:.82rem/1.45 var(--ui);pointer-events:auto}
.gloss-tip b{display:block;font:600 1.05rem var(--display);color:var(--gold-soft);margin-bottom:6px}
.gloss-tip .gloss-body{display:block;color:var(--wool)}
.gloss-tip .gloss-note{display:block;margin-top:8px;font-size:.72rem;color:#c9c1ad;font-style:italic}

/* ===== Theme toggle ===== */
.theme-btn{font:600 .78rem var(--ui);letter-spacing:.04em;border:1px solid rgba(201,162,39,.55);background:rgba(248,244,234,.92);color:var(--blue-deep);padding:7px 12px;border-radius:999px;cursor:pointer;margin-left:auto}
.theme-btn:hover{background:var(--crimson);color:#fff;border-color:var(--crimson)}
@media(max-width:820px){.theme-btn{margin-left:8px;order:2}.menu-btn{order:3}}

/* ===== Dark mode ===== */
html[data-theme="dark"]{color-scheme:dark}
html[data-theme="dark"] body{background:var(--night);color:#E8E2D4;background-image:radial-gradient(rgba(201,162,39,.04) 1px,transparent 1px),radial-gradient(rgba(232,226,212,.03) 1px,transparent 1px)}
html[data-theme="dark"]{--parch:#0E1420;--wool:#1C2333;--ink:#E8E2D4;--stone:#A39E92;--blue:#E3C770;--blue-deep:#EFE6D2;--shadow:0 1px 2px rgba(0,0,0,.35),0 8px 30px rgba(0,0,0,.45)}
html[data-theme="dark"] h1,html[data-theme="dark"] h2,html[data-theme="dark"] h3{color:var(--gold-soft)}
html[data-theme="dark"] a{color:var(--gold-soft)}html[data-theme="dark"] a:hover{color:#fff3c4}
html[data-theme="dark"] .site-head{background:rgba(14,20,32,.92);border-bottom-color:rgba(201,162,39,.35)}
html[data-theme="dark"] nav.main a{color:#E8E2D4}html[data-theme="dark"] nav.main a:hover{background:#1C2333}
html[data-theme="dark"] nav.main a[aria-current]{background:var(--crimson);color:#fff}
html[data-theme="dark"] .card,.ev .body,html[data-theme="dark"] .panel,html[data-theme="dark"] select,html[data-theme="dark"] table.cmp{background:#1C2333;color:#E8E2D4;border-color:rgba(201,162,39,.3)}
html[data-theme="dark"] .chip{background:rgba(28,35,51,.95);color:#E8E2D4;border-color:rgba(201,162,39,.35)}
html[data-theme="dark"] .chip[aria-pressed=true]{background:var(--crimson);color:#fff}
html[data-theme="dark"] .theme-btn{background:#1C2333;color:var(--gold-soft)}
html[data-theme="dark"] .note{background:rgba(28,35,51,.8);color:#C9C1AD}
html[data-theme="dark"] .tl-stage{background:rgba(28,35,51,.5);border-color:rgba(201,162,39,.3)}
html[data-theme="dark"] .cent span{background:#0E1420;color:var(--gold-soft)}
html[data-theme="dark"] .map-stage{background:radial-gradient(ellipse at 4% 50%,rgba(227,199,112,.12),transparent 35%),#121826}
html[data-theme="dark"] .node text{fill:#E8E2D4;stroke:#0E1420}
html[data-theme="dark"] .btn.line{border-color:var(--gold);color:var(--gold-soft)}
html[data-theme="dark"] .btn.blue{background:var(--crimson);color:#fff}
html[data-theme="dark"] .meta{color:#A39E92}
html[data-theme="dark"] footer.site-foot{background:radial-gradient(ellipse at 50% 0,rgba(201,162,39,.1),transparent 60%),#070b12}

/* ===== Tradition / event art ===== */
.art-fig{margin:14px 0 6px;padding:0;border-radius:12px;overflow:hidden;border:1px solid rgba(201,162,39,.35);background:rgba(239,230,210,.35)}
.art-fig img{display:block;width:100%;max-height:220px;object-fit:cover;background:#1C2333}
.art-fig figcaption{font:.72rem/1.4 var(--ui);color:var(--stone);padding:8px 12px 10px}
.art-fig figcaption strong{color:var(--blue-deep);font-weight:600}
html[data-theme="dark"] .art-fig{background:#121826;border-color:rgba(201,162,39,.3)}
html[data-theme="dark"] .art-fig figcaption{color:#A39E92}
html[data-theme="dark"] .art-fig figcaption strong{color:var(--gold-soft)}
.ev-more .art-fig{max-width:100%}
.ev-more .art-fig img{max-height:160px}

.ev button.dot{appearance:none;-webkit-appearance:none;padding:0;cursor:help;font:inherit;color:#fff}
.tl.is-h .ev button.dot{margin:0}


/* ===== Timeline chrome below stage ===== */
.tl-chrome{margin:18px 0 40px;display:grid;gap:14px;max-width:720px}
.tl-key{list-style:none;margin:0;padding:12px 16px;border:1px solid rgba(201,162,39,.4);border-radius:var(--r);background:var(--wool);display:flex;flex-direction:column;gap:8px}
.tl-key li{display:flex;align-items:center;gap:10px;font:500 .95rem var(--ui);color:var(--ink)}
.tl-key .k-ico{display:inline-grid;place-items:center;width:1.6em;font-size:1.05rem;color:var(--blue-deep)}
.tl-key .k-ico.schism{color:var(--crimson)}
.tl-key .k-ico.council{color:var(--gold)}
.tl-instruct{margin:0;font:1rem/1.55 var(--body);color:var(--ink)}
.tl-chrome .tl-hint{margin:0}
html[data-theme="dark"] .tl-key{background:#1C2333;border-color:rgba(201,162,39,.3)}
html[data-theme="dark"] .tl-key li{color:#E8E2D4}

/* Primary labels stay readable when zoomed out (inverse of --tl-z) */
.tl-stage{--tl-z:1;--tl-inv:1}
.tl-stage.is-zoomed-out .tl-zoom .yr{
  font-size:calc(0.95rem * min(var(--tl-inv), 3.2));
  line-height:1.1;
}
.tl-stage.is-zoomed-out .tl-zoom .ev-head .lbl{
  font-size:calc(1.02rem * min(var(--tl-inv), 3.2));
  line-height:1.2;
  font-weight:600;
}
.tl-stage.is-zoomed-out .tl-zoom .cent span{
  font-size:calc(0.72rem * min(var(--tl-inv), 2.6));
}
/* hide secondary chrome on cards when far out */
.tl-stage.is-zoomed-out .tl-zoom .ev-meta,
.tl-stage.is-zoomed-out .tl-zoom .chev{opacity:.35}
.tl-stage.is-zoomed-far .tl-zoom .ev-meta,
.tl-stage.is-zoomed-far .tl-zoom .chev,
.tl-stage.is-zoomed-far .tl-zoom .ev-more{display:none!important}
.tl-stage.is-zoomed-far .tl-zoom .ev.open .body{/* keep year+label only */}
.tl-stage.is-zoomed-far .tl-zoom .ev .body{padding:6px 8px}
.tl-stage.is-zoomed-far .tl-zoom .ev{width:180px}


/* ===== Membership / access ===== */
.price-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;margin:28px 0}
.price-card{background:var(--wool);border:1px solid rgba(201,162,39,.35);border-radius:var(--r);padding:22px;box-shadow:var(--shadow);position:relative}
.price-card.featured{border-color:var(--gold);box-shadow:0 0 0 2px rgba(201,162,39,.35),var(--shadow)}
.price-card.founding{border-color:rgba(142,43,43,.45)}
.price-badge{position:absolute;top:-10px;right:16px;font:700 .68rem var(--ui);letter-spacing:.08em;text-transform:uppercase;background:var(--gold);color:var(--night);padding:4px 10px;border-radius:999px}
.price-card h2{margin:.2em 0;font-size:2.4rem}.price-card .per{font-size:1rem;color:var(--stone);font-weight:500}
.price-list{padding-left:1.1em;margin:12px 0 18px;font:.95rem var(--body)}.price-list li{margin:.35em 0}
.btn.crimson{background:var(--crimson);color:#fff}.btn.crimson:hover{background:var(--crimson-soft);color:#fff}
.access-gate,.access-banner{margin:16px 0;padding:16px 18px;border-radius:12px;border:1px solid rgba(201,162,39,.45);background:rgba(239,230,210,.55)}
.access-dim{opacity:.28;filter:grayscale(.4);pointer-events:none}
.access-pill{display:inline-block;font:600 .68rem var(--ui);letter-spacing:.06em;text-transform:uppercase;padding:4px 10px;border-radius:999px;text-decoration:none}
.access-pill.member{background:var(--crimson);color:#fff}
.access-pill.free{background:var(--wool);color:var(--blue-deep);border:1px solid var(--gold)}
.map-access{max-width:320px;font-size:.85rem}
html[data-theme="dark"] .price-card,html[data-theme="dark"] .access-gate,html[data-theme="dark"] .access-banner{background:#1C2333;border-color:rgba(201,162,39,.3)}

/* ===== Branch media sidebar ===== */
.media-side{margin:16px 0;padding:14px;border-radius:12px;border:1px solid rgba(201,162,39,.35);background:rgba(239,230,210,.4)}
.media-side h3{margin:.2em 0 .6em;font-size:1.15rem}
.media-side .media-item{display:grid;grid-template-columns:88px 1fr;gap:10px;margin:10px 0;align-items:start}
.media-side .media-item img{width:88px;height:88px;object-fit:cover;border-radius:8px;background:#1C2333}
.media-side .media-meta{font:.75rem/1.4 var(--ui);color:var(--stone)}
.media-side .media-meta b{display:block;font:600 .9rem var(--display);color:var(--blue-deep);margin-bottom:2px}
.media-side .music-item{grid-template-columns:40px 1fr}
.media-side .music-ico{font-size:1.4rem;line-height:1;color:var(--gold)}
.media-side .teaser-label{font:600 .68rem var(--ui);letter-spacing:.1em;text-transform:uppercase;color:var(--gold)}
.media-side .member-pack{opacity:.95;border-top:1px dashed rgba(201,162,39,.4);padding-top:10px;margin-top:10px}
html[data-theme="dark"] .media-side{background:#121826}
html[data-theme="dark"] .media-side .media-meta b{color:var(--gold-soft)}

/* Art & music sidebar — content-expansion pack */
.media-tabs{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 10px}
.media-tab{font:600 .72rem var(--ui);letter-spacing:.06em;text-transform:uppercase;border:1px solid rgba(201,162,39,.45);background:transparent;color:var(--stone);border-radius:999px;padding:6px 12px;cursor:pointer}
.media-tab[aria-selected="true"]{background:var(--blue-deep);color:#F8F4EA;border-color:var(--blue-deep)}
html[data-theme="dark"] .media-tab[aria-selected="true"]{background:#C9A227;color:#121826;border-color:#C9A227}
.media-chips{display:flex;flex-wrap:wrap;gap:4px;margin:4px 0 6px}
.media-rel,.media-access,.media-origin{font:.65rem/1.2 var(--ui);padding:2px 7px;border-radius:999px;border:1px solid rgba(201,162,39,.35);color:var(--stone)}
.media-access.free{border-color:#5E7D4A;color:#5E7D4A}
.media-access.member{border-color:#4A6B8A;color:#4A6B8A}
.media-fit{display:block;margin:4px 0;font-style:italic}
.media-caution{margin-top:6px;padding:6px 8px;border-left:3px solid #A0522D;background:rgba(160,82,45,.08);font:.7rem/1.35 var(--ui)}
.media-ph{width:88px;height:88px;border-radius:8px;display:grid;place-items:center;background:#1C2333;color:var(--gold);font-size:1.6rem}
.media-item.media-hilite{outline:2px solid var(--gold);outline-offset:2px;border-radius:10px}
.media-src{margin:0;padding-left:1.1em}
.media-side .btn.sm{margin-top:6px;display:inline-block}
.media-miss{margin:0 0 10px}

/* ===== Dark mode contrast pass (Derek 2026-11-06) ===== */
html[data-theme="dark"] .node.dim{opacity:.55;filter:grayscale(.35)}
html[data-theme="dark"] .link-path.dim,html[data-theme="dark"] .link-halo.dim{opacity:.35}
html[data-theme="dark"] .node text{fill:#F4EFE3;stroke:#0A0E18;stroke-width:4.5px;paint-order:stroke}
html[data-theme="dark"] .node.sel text{fill:#FFF8E7;font-weight:700}
html[data-theme="dark"] .era-band text,html[data-theme="dark"] .map-years text{fill:#D2C9B5}
html[data-theme="dark"] .chip{background:#243044;color:#F4EFE3;border-color:#E3C770}
html[data-theme="dark"] .chip[aria-pressed=true]{background:#A84848;color:#fff;border-color:#A84848}
html[data-theme="dark"] .map-tools,html[data-theme="dark"] .map-search input{background:#1C2333;color:#F4EFE3;border-color:#C9A227}
html[data-theme="dark"] .panel{border-color:rgba(227,199,112,.55)}
html[data-theme="dark"] .btn.ghost{border-color:rgba(244,239,227,.55);color:#F4EFE3}
html[data-theme="dark"] .btn.gold{background:#E3C770;color:#0E1420}
html[data-theme="dark"] .btn.line{border-color:#E3C770;color:#F0D978;background:transparent}
html[data-theme="dark"] .btn.line:hover{background:#E3C770;color:#0E1420}
html[data-theme="dark"] .pills li{background:rgba(94,125,74,.28);color:#C8DBB5}
html[data-theme="dark"] dl.axes dt{color:#E3C770}
html[data-theme="dark"] .brand{color:#F4EFE3}html[data-theme="dark"] .brand small{color:#C9C1AD}
html[data-theme="dark"] .menu-btn{border-color:#C9A227;color:#F4EFE3;background:#1C2333}
html[data-theme="dark"] .tl-instruct,html[data-theme="dark"] .tl-chrome .tl-hint{color:#E8E2D4}
html[data-theme="dark"] .ev .yr{color:#E3C770}
html[data-theme="dark"] .ev .body small{color:#C9C1AD}
html[data-theme="dark"] .cent span{border:1px solid rgba(227,199,112,.45)}
html[data-theme="dark"] .media-tab{color:#E8E2D4;border-color:#C9A227}
html[data-theme="dark"] .media-rel,html[data-theme="dark"] .media-access,html[data-theme="dark"] .media-origin{color:#D2C9B5;border-color:rgba(227,199,112,.45)}
html[data-theme="dark"] .media-access.free{color:#A8C98A;border-color:#A8C98A}
html[data-theme="dark"] .media-side .media-meta{color:#C9C1AD}
html[data-theme="dark"] .node circle[stroke="#F8F4EA"]{stroke:#F4EFE3}
html[data-theme="dark"] .link-path{stroke:#E3C770}
html[data-theme="dark"] .access-dim{opacity:.4;filter:grayscale(.25)}

/* Contested / dim strokes readable on dark maps */
html[data-theme="dark"] .link-path[stroke="#8A8070"],
html[data-theme="dark"] .link-path[stroke="#A89870"]{stroke:#C9C1AD !important;opacity:.9}
html[data-theme="dark"] .link-path.dim{opacity:.45}
html[data-theme="dark"] .era-band text{fill:#D9D2C3}
html[data-theme="dark"] .map-years{fill:#E8E2D4 !important}
html[data-theme="dark"] .map-hint{color:#E8E2D4;background:rgba(14,20,32,.9)}
html[data-theme="dark"] .map-tip{background:#1C2333;color:#F4EFE3;border-color:rgba(201,162,39,.45)}
html[data-theme="dark"] .map-tip .yr,html[data-theme="dark"] .map-tip em{color:#D9D2C3}
html[data-theme="dark"] .chip{color:#F4EFE3;border-color:rgba(227,199,112,.55)}
html[data-theme="dark"] .meta,html[data-theme="dark"] .note{color:#D9D2C3}
html[data-theme="dark"] .media-side .media-meta{color:#D9D2C3}
html[data-theme="dark"] .media-tab{color:#F4EFE3;border-color:rgba(227,199,112,.55)}

