/* Zogam History — design tokens. Weave: Zopuan — deep maroon ground with fine dark pinstripes, white lines, a green/red/gold centre band and a navy-black edge */
:root{
  --mist:#ECEEE7; --paper:#F6F7F2; --ink:#1B1626; --ink-2:#3A3C35; --stone:#66655C;
  --line:#CDD1C4; --green:#2E7A3E; --green-2:#1F5A2C; --red:#7A1830; --gold:#E3A92B;
  --oral:#6A3D78; --doc:#2E7A3E; --sch:#8A6418;
  --font:"Literata",Georgia,"Times New Roman",serif;
  --measure:42rem; --wide:74rem; --r:6px;
  --weave:repeating-linear-gradient(90deg,#1B1626 0 10px,#EDE6E3 10px 12px,#7A1830 12px 28px,#2A0A16 28px 29px,#7A1830 29px 36px,#2A0A16 36px 37px,#7A1830 37px 44px,#EDE6E3 44px 47px,#2E7A3E 47px 50px,#C8283C 50px 54px,#E3A92B 54px 56px,#C8283C 56px 60px,#2E7A3E 60px 63px,#EDE6E3 63px 66px,#7A1830 66px 73px,#2A0A16 73px 74px,#7A1830 74px 81px,#2A0A16 81px 82px,#7A1830 82px 98px,#EDE6E3 98px 100px);
}
@media (prefers-color-scheme:dark){:root{
  --mist:#121411; --paper:#1A1D18; --ink:#E6E8E0; --ink-2:#C6C9BD; --stone:#9C9D92;
  --line:#2E332B; --green:#7FCB8E; --green-2:#A3DDAE; --red:#E07A8E; --gold:#EEC25A;
  --oral:#C8A2D6; --doc:#7FCB8E; --sch:#E2BC6A;
}}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:5rem}
body{margin:0;background:var(--mist);color:var(--ink);font:400 1.1rem/1.72 var(--font);font-optical-sizing:auto;-webkit-font-smoothing:antialiased}
a{color:var(--green);text-decoration-thickness:1px;text-underline-offset:.2em}
a:hover{color:var(--green-2);text-decoration-thickness:2px}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:2px}
::selection{background:color-mix(in srgb,var(--gold) 40%,transparent)}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* The selvedge: woven edge down the left of every page */
.selvedge{position:fixed;left:0;top:0;bottom:0;width:10px;background:repeating-linear-gradient(180deg,#1B1626 0 10px,#EDE6E3 10px 12px,#7A1830 12px 28px,#2A0A16 28px 29px,#7A1830 29px 36px,#2A0A16 36px 37px,#7A1830 37px 44px,#EDE6E3 44px 47px,#2E7A3E 47px 50px,#C8283C 50px 54px,#E3A92B 54px 56px,#C8283C 56px 60px,#2E7A3E 60px 63px,#EDE6E3 63px 66px,#7A1830 66px 73px,#2A0A16 73px 74px,#7A1830 74px 81px,#2A0A16 81px 82px,#7A1830 82px 98px,#EDE6E3 98px 100px);z-index:1100}
@media (max-width:640px){.selvedge{width:6px}}
.skip{position:absolute;left:-9999px;top:0;background:var(--ink);color:var(--mist);padding:.6rem 1rem;z-index:3000}
.skip:focus{left:16px;top:12px}

/* Header */
header.site{position:sticky;top:0;z-index:1000;background:color-mix(in srgb,var(--mist) 94%,transparent);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.bar{max-width:var(--wide);margin:0 auto;padding:.8rem 24px;display:flex;align-items:center;justify-content:space-between;gap:1.5rem}
.brand{font:650 1.3rem/1 var(--font);font-variation-settings:"opsz" 48;letter-spacing:-.01em;color:var(--ink);text-decoration:none;white-space:nowrap}
.brand em{font-weight:350;font-style:italic}
nav.main{display:flex;flex-wrap:wrap;gap:.2rem 1.2rem;font-size:.95rem}
nav.main a{color:var(--ink-2);text-decoration:none;padding:.4rem 0;border-bottom:2px solid transparent}
nav.main a:hover{color:var(--green)}
nav.main a[aria-current]{color:var(--ink);border-bottom-color:var(--green)}
.navtoggle{display:none;min-height:44px;padding:0 1rem;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);color:var(--ink);font:500 .95rem var(--font)}
@media (max-width:1100px){
  .navtoggle{display:block}
  nav.main{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;gap:0;background:var(--paper);border-bottom:1px solid var(--line);padding:.4rem 24px 1rem}
  nav.main.open{display:flex}
  nav.main a{padding:.85rem 0;border-bottom:1px solid var(--line)}
}

/* Type & layout */
main{max-width:var(--measure);margin:0 auto;padding:3.2rem 24px 5rem}
main.wide{max-width:var(--wide)}
h1,h2,h3{font-family:var(--font);color:var(--ink);font-optical-sizing:auto;text-wrap:balance}
h1{font-weight:300;font-size:clamp(2.5rem,6.5vw,4.25rem);line-height:1.04;letter-spacing:-.025em;margin:.2rem 0 1.4rem}
h2{font-weight:500;font-size:clamp(1.55rem,3vw,2rem);line-height:1.2;letter-spacing:-.01em;margin:3.2rem 0 .9rem;display:flex;flex-wrap:wrap;align-items:center;gap:.5rem .9rem}
h3{font-weight:600;font-size:1.25rem;line-height:1.3;margin:2rem 0 .5rem}
p{margin:0 0 1.1rem;text-wrap:pretty}
ul,ol{padding-left:1.3rem}
li{margin:.35rem 0}
.lede{font-size:1.28rem;line-height:1.6;color:var(--ink-2);font-weight:350}
.small{font-size:.88rem;color:var(--stone)}
.chapter-eyebrow{margin:0;font-style:italic;color:var(--stone);font-size:1rem}
blockquote{margin:1.6rem 0;padding:.2rem 0 .2rem 1.2rem;border-left:3px solid var(--ink)}
blockquote.oral-note{border-left-color:var(--oral);color:var(--ink-2);font-style:italic}

/* Evidence labels */
.tag{display:inline-flex;align-items:center;font:600 .78rem/1 var(--font);padding:.38em .75em;border-radius:999px;white-space:nowrap;vertical-align:middle;color:#fff}
.tag.oral{background:var(--oral)}.tag.doc{background:var(--doc)}.tag.sch{background:var(--sch)}.tag.contested{background:var(--red)}
@media (prefers-color-scheme:dark){.tag{color:#121411}}

/* Footnotes */
sup.fn{font-size:.66em;line-height:0;margin-left:.08em;font-weight:600}
sup.fn a{text-decoration:none;color:var(--green);padding:0 .1em}
sup.fn a:hover{text-decoration:underline}
a.cite{font-size:.8rem;text-decoration:none;color:var(--ink);background:color-mix(in srgb,var(--gold) 22%,transparent);padding:.1em .5em;border-radius:4px;white-space:nowrap}

/* Callouts */
.caution{background:var(--paper);border:1px solid var(--line);border-left:4px solid var(--gold);border-radius:var(--r);padding:1rem 1.2rem;margin:1.6rem 0;font-size:1rem}
.placeholder{display:flex;gap:1.1rem;align-items:center;margin:2rem 0;padding:1.1rem 1.2rem;border:1.5px dashed var(--stone);border-radius:var(--r);background:var(--paper)}
.placeholder .ico{flex:0 0 54px;height:54px;border-radius:4px;background:var(--weave);font-size:0}
.placeholder p{margin:0;font-size:1rem}
.placeholder strong{display:block;font-style:italic;font-weight:600;color:var(--ink-2)}
.placeholder-box,.pending{color:var(--stone);font-style:italic}

/* Buttons */
.btn{display:inline-flex;align-items:center;min-height:48px;padding:0 1.4rem;background:var(--green);color:#fff;text-decoration:none;font:600 1rem var(--font);border-radius:var(--r)}
.btn:hover{background:var(--green-2);color:#fff}
@media (prefers-color-scheme:dark){.btn,.btn:hover{color:#121411}}
.contact-cta{margin:1.8rem 0}

/* Home */
.hero{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:2.5rem 4rem;align-items:stretch;padding:1rem 0 2.5rem}
.hero h1{font-size:clamp(2.8rem,6.6vw,5rem);line-height:1.02;letter-spacing:-.03em;margin-top:0}
.weave{min-height:22rem;border-radius:var(--r);background:var(--weave);background-size:100px 100%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.15);position:relative;overflow:hidden}
.weave::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 3px,rgba(0,0,0,.09) 3px 4px)}
.legend{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:.8rem 2.4rem;font-size:.98rem;color:var(--ink-2)}
.legend p{display:flex;gap:.7rem;align-items:center;margin:0}
@media (max-width:820px){.hero{grid-template-columns:1fr}.weave{min-height:5rem;order:-1}}
.grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,20rem),1fr));gap:1rem;margin-top:3.5rem}
.card{display:flex;flex-direction:column;gap:.35rem;padding:1.3rem 1.4rem 1.4rem;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);text-decoration:none;color:var(--ink)}
.card h3{margin:0;font-size:1.4rem;font-weight:500}
.card p{margin:0;font-size:1rem;color:var(--stone)}
.card:hover{border-color:var(--green)}
.card:hover h3{color:var(--green)}
.contribute{margin-top:4rem;background:var(--green);color:#fff;padding:2.4rem clamp(1.2rem,4vw,3rem);border-radius:var(--r)}
.contribute h2{color:#fff;margin-top:0}
.contribute p{max-width:36rem;opacity:.92}
.contribute .btn{background:#fff;color:var(--green-2)}
@media (prefers-color-scheme:dark){.contribute{background:#1F3A2C}.contribute .btn{background:var(--green);color:#121411}}
.faq{margin-top:4rem}
.faq details{border-top:1px solid var(--line)}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:1rem;min-height:56px;font-weight:600;font-size:1.12rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:1.5rem;font-weight:300;color:var(--green)}
.faq details[open] summary::after{content:"−"}
.faq details p{color:var(--ink-2)}

/* Map */
.map{height:500px;border-radius:var(--r);border:1px solid var(--line);margin:1.2rem 0 .4rem;background:var(--paper)}
@media (max-width:600px){.map{height:360px}}

/* Timeline */
.filters{display:flex;flex-direction:column;gap:.6rem;margin:1.2rem 0 1.6rem}
.fgroup{display:flex;flex-wrap:wrap;gap:.4rem}
.filters button{min-height:40px;padding:0 1rem;font:500 .92rem var(--font);border:1px solid var(--line);border-radius:999px;background:var(--paper);color:var(--ink);cursor:pointer}
.filters button:hover{border-color:var(--green)}
.filters button.on{background:var(--ink);border-color:var(--ink);color:var(--mist)}
.tl-list{list-style:none;margin:0 0 0 .5rem;padding:0;border-left:3px solid var(--line)}
.tl-item{position:relative;margin:0;padding-left:1.6rem}
.tl-item::before{content:"";position:absolute;left:-9.5px;top:1.15rem;width:16px;height:16px;border-radius:50%;background:var(--doc);border:3px solid var(--mist)}
.tl-item.ev-oral::before{background:var(--oral)}.tl-item.ev-sch::before{background:var(--sch)}
.tl-head{all:unset;box-sizing:border-box;cursor:pointer;display:grid;grid-template-columns:8.5rem 1fr auto;gap:.2rem 1.2rem;align-items:baseline;width:100%;padding:.85rem .6rem;min-height:44px;border-radius:var(--r)}
.tl-head:hover{background:var(--paper)}
.tl-head:focus-visible{outline:2px solid var(--gold)}
.tl-year{font-weight:600;color:var(--green)}
.tl-body{display:none;padding:0 .6rem 1rem 10.3rem;font-size:.98rem;color:var(--ink-2)}
.tl-item.open .tl-body{display:block}
.tl-body p{margin:.2rem 0}
@media (max-width:640px){.tl-head{grid-template-columns:1fr}.tl-body{padding-left:.6rem}}

/* Names */
.names{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,17rem),1fr));gap:1rem;margin:2rem 0}
.namecard{padding:1.2rem 1.3rem 1.3rem;background:var(--paper);border:1px solid var(--line);border-radius:var(--r)}
.namecard h2,.namecard h3{margin:0 0 .4rem;font-weight:400;font-size:2rem;color:var(--green)}
.namecard p{margin:0;font-size:1rem}

/* Tables */
.table-wrap{overflow-x:auto;margin:1.4rem 0;border:1px solid var(--line);border-radius:var(--r);background:var(--paper)}
table.evidence{border-collapse:collapse;width:100%;min-width:620px;font-size:.95rem}
table.evidence th{text-align:left;font-weight:600;font-size:.88rem;color:var(--stone);padding:.8rem 1rem;border-bottom:1px solid var(--line)}
table.evidence td{padding:1rem;border-bottom:1px solid var(--line);vertical-align:top}
table.evidence tr:last-child td{border-bottom:0}
table.evidence td:first-child{font-weight:600;white-space:nowrap}

/* Chapter navigation */
.chapter-nav{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:4rem 0 0}
.chapter-nav a{display:flex;flex-direction:column;gap:.15rem;padding:1rem 1.2rem;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);text-decoration:none;color:var(--ink);font-size:1.2rem;font-weight:500}
.chapter-nav a span{font-size:.9rem;font-weight:400;font-style:italic;color:var(--stone)}
.chapter-nav a:hover{border-color:var(--green);color:var(--green)}
.chapter-nav .next{text-align:right;align-items:flex-end}

/* References */
.refs{margin-top:3.5rem;padding-top:.5rem;border-top:1px solid var(--line)}
.refs h2{font-size:1.4rem}
.refs ol{padding-left:1.7rem;font-size:.92rem;line-height:1.6}
.refs li{margin:.9rem 0}
.refs li::marker{font-weight:600;color:var(--green)}
.refs li:target{background:color-mix(in srgb,var(--gold) 18%,transparent);outline:2px solid var(--gold);outline-offset:6px;border-radius:2px}
.badge{display:inline-block;font-size:.76rem;line-height:1.6;padding:0 .5rem;border-radius:4px;background:var(--mist);border:1px solid var(--line);color:var(--stone);margin-right:.3rem;white-space:nowrap}
.badge.type{color:var(--ink);font-weight:600}
.badge.warn{color:var(--red);border-color:color-mix(in srgb,var(--red) 50%,var(--line))}
.refs .note,.src .note{font-size:.84rem;color:var(--stone);font-style:italic;margin-top:.25rem}
.citebox{margin-top:2rem;padding:1rem 1.2rem;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);font-size:.92rem}

/* Sources page */
.standards{background:var(--paper);border:1px solid var(--line);border-left:4px solid var(--green);border-radius:var(--r);padding:.3rem 1.4rem 1.1rem;margin:2rem 0}
.standards h2{margin-top:1rem}
.src-group h2{padding-bottom:.4rem;border-bottom:1px solid var(--line)}
.src{margin:1rem 0;padding-left:1rem;border-left:3px solid var(--line);font-size:.95rem;scroll-margin-top:6rem}
.src:target{border-left-color:var(--gold);background:var(--paper)}
.src .k{font-size:.85rem;font-style:italic;color:var(--stone);margin-bottom:.15rem}
.sitemap{list-style:none;padding:0}
.sitemap li{margin:0;padding:.9rem 0;border-bottom:1px solid var(--line)}
.sitemap a strong{font-size:1.2rem;font-weight:600}

.pch{font-family:"Noto Sans Pau Cin Hau",sans-serif;font-size:1.7rem}

/* Footer */
footer.site{background:var(--ink);color:#C6C9BD;font-size:.96rem;border-top:10px solid transparent;border-image:var(--weave) 10}
@media (prefers-color-scheme:dark){footer.site{background:#0B0C0A}}
.foot-grid{max-width:var(--wide);margin:0 auto;padding:3rem 24px 1.5rem;display:grid;grid-template-columns:2fr 1fr 1fr;gap:2rem}
@media (max-width:760px){.foot-grid{grid-template-columns:1fr}}
.foot-brand{font-size:1.5rem;font-weight:650;color:#F6F7F2;margin-bottom:.6rem}
.foot-brand em{font-weight:350}
.foot-h{font-weight:600;color:#E2BC6A;margin-bottom:.5rem}
footer.site ul{list-style:none;padding:0;margin:0}
footer.site li{margin:.3rem 0}
footer.site a{color:#F6F7F2;text-decoration:none}
footer.site a:hover{text-decoration:underline}
.foot-legal{max-width:var(--wide);margin:0 auto;padding:1.2rem 24px 2.2rem;border-top:1px solid #2E332B;font-size:.85rem}

@media print{header.site,footer.site,.selvedge,.chapter-nav,.navtoggle,.placeholder,.weave{display:none}body{background:#fff;color:#000}}

/* Plain-language layer */
.short{margin:1.8rem 0 2.6rem;padding:1.3rem 1.5rem 1.1rem;background:var(--paper);border:1px solid var(--line);border-top:6px solid transparent;border-image:var(--weave) 6 0 0 0;border-radius:0 0 var(--r) var(--r);font-size:1.12rem}
.short h2.short-h{margin:0 0 .6rem;font-size:1.25rem;font-weight:600}
.short ul{margin:0;padding-left:1.2rem}
.short li{margin:.55rem 0;line-height:1.55}
.short-more{margin:.9rem 0 0;font-size:.92rem;font-style:italic;color:var(--stone)}
.moments{margin:2.5rem 0 1rem}
.moments h2{margin-top:0}
.moment-list{list-style:none;padding:0;margin:1.2rem 0 0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,21rem),1fr));gap:1rem;counter-reset:m}
.moment-list li{margin:0;padding:1.2rem 1.3rem;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);font-size:.82rem;color:var(--stone)}
.moment-list > li > a{display:flex;flex-direction:column;gap:.35rem;text-decoration:none;color:var(--ink);margin-bottom:.5rem}
.moment-list .when{font-size:1.5rem;font-weight:600;color:var(--green);line-height:1.1}
.moment-list .what{font-size:1.06rem;line-height:1.5}
.moment-list > li > a:hover .what{text-decoration:underline;text-decoration-color:var(--green)}
details.refs{margin-top:3.5rem;padding:0;border-top:1px solid var(--line)}
details.refs summary{cursor:pointer;list-style:none;padding:1.1rem 0 .8rem;display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:.3rem 1rem}
details.refs summary::-webkit-details-marker{display:none}
details.refs summary h2{margin:0;font-size:1.3rem}
details.refs summary h2::before{content:"+ ";color:var(--green)}
details.refs[open] summary h2::before{content:"− "}
details.refs .count{color:var(--stone);font-weight:400}

/* Sticky section menu */
.onpage{position:sticky;top:var(--hdr,58px);z-index:900;margin:0 -24px 1rem;padding:.55rem 24px;background:color-mix(in srgb,var(--mist) 95%,transparent);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:.8rem}
.onpage-label{flex:0 0 auto;font-size:.85rem;font-style:italic;color:var(--stone)}
.onpage ul{list-style:none;margin:0;padding:0;display:flex;gap:.4rem;overflow-x:auto;scrollbar-width:none;scroll-behavior:smooth}
.onpage ul::-webkit-scrollbar{display:none}
.onpage li{margin:0;flex:0 0 auto}
.onpage a{display:inline-flex;align-items:center;min-height:36px;padding:0 .85rem;border:1px solid var(--line);border-radius:999px;background:var(--paper);color:var(--ink-2);text-decoration:none;font-size:.9rem;white-space:nowrap}
.onpage a:hover{border-color:var(--green);color:var(--green)}
.onpage a[aria-current]{background:var(--green);border-color:var(--green);color:#fff}
@media (prefers-color-scheme:dark){.onpage a[aria-current]{color:#121411}}
@media (max-width:640px){.onpage-label{display:none}}
main h2[id]{scroll-margin-top:8.5rem}
/* Glossary */
.glossary{margin:2rem 0}
.glossary dt{font-size:1.35rem;font-weight:600;color:var(--green);margin-top:1.6rem;scroll-margin-top:6rem}
.glossary dd{margin:.3rem 0 0;padding-bottom:1.2rem;border-bottom:1px solid var(--line)}
.glossary dd > a:last-child{margin-left:.3rem;font-size:.92rem}
.glossary dt:target{background:color-mix(in srgb,var(--gold) 22%,transparent)}

/* Landing page */
.hero{min-height:min(78vh,44rem);align-items:center;padding:2rem 0 3rem}
.hero h1{font-size:clamp(3rem,7.2vw,5.6rem);max-width:12ch}
.hero .lede{max-width:34rem}
.cta-row{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:1.8rem}
.btn-ghost{display:inline-flex;align-items:center;min-height:48px;padding:0 1.3rem;border:1.5px solid var(--ink);border-radius:var(--r);color:var(--ink);text-decoration:none;font-weight:600}
.btn-ghost:hover{background:var(--ink);color:var(--mist)}
.hero .weave{min-height:min(60vh,32rem)}
main.wide > section{margin-top:5.5rem}
main.wide > section.hero{margin-top:0}
.moments h2,.explore h2,.faq h2{margin-top:0}
.moment-list{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:900px){.moment-list{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.moment-list{grid-template-columns:1fr}}
.chapter-index{list-style:none;padding:0;margin:1.2rem 0 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 2rem;counter-reset:c}
@media (max-width:900px){.chapter-index{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.chapter-index{grid-template-columns:1fr}}
.chapter-index li{margin:0;border-top:1px solid var(--line);counter-increment:c}
.chapter-index a{display:grid;grid-template-columns:2rem 1fr;row-gap:.1rem;padding:1rem 0;text-decoration:none;color:var(--ink)}
.chapter-index a::before{content:counter(c);grid-row:1/3;font-weight:300;font-size:1.5rem;line-height:1.1;color:var(--green)}
.chapter-index strong{font-size:1.15rem;font-weight:600}
.chapter-index span{font-size:.95rem;color:var(--stone)}
.chapter-index a:hover strong{color:var(--green)}
.where{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.7fr);gap:2rem 3rem;align-items:center}
.where h2{margin-top:0}
.where .map{margin:0;height:420px}
@media (max-width:820px){.where{grid-template-columns:1fr}.where .map{height:340px}}
.faq{max-width:44rem}
.contribute{display:grid;grid-template-columns:1fr auto;align-items:center;gap:1rem 2rem}
.contribute h2,.contribute p{margin:0}
.contribute p{grid-column:1}
.contribute .btn{grid-column:2;grid-row:1/3}
@media (max-width:640px){.contribute{grid-template-columns:1fr}.contribute .btn{grid-column:1;grid-row:auto;justify-self:start}}