:root{color-scheme:dark;--bg:#0c0f12;--line:#282f36;--muted:#89939e;--gold:#dfb568}
*{box-sizing:border-box}
body{margin:0;background:radial-gradient(ellipse at 90% 8%,#3b233223,transparent 60%),linear-gradient(125deg,#0e1012,#161412 65%,#121113);color:#e7e9eb;font:14px/1.5 var(--font-reference);padding:24px 28px}
button,input{font:inherit}
button{cursor:pointer;color:inherit;background:#171c21;border:1px solid #333a42;border-radius:20px;padding:7px 17px;transition:background .18s,border-color .18s}
button:hover{background:#272d34}
button:focus-visible,a:focus-visible,canvas:focus-visible,[tabindex]:focus-visible,input:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
header{display:flex;align-items:center;gap:36px;padding:0 0 23px;border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:12px;color:#f4f0e7;text-decoration:none;white-space:nowrap;flex-shrink:0}
.brand-symbol{display:block;width:67px;height:45px;background:linear-gradient(135deg,#edd7a9,#c49a58);mask:url('../../Media/Monedial-Logo-6.png') center/contain no-repeat;-webkit-mask:url('../../Media/Monedial-Logo-6.png') center/contain no-repeat;filter:drop-shadow(0 1px 1px #0008)}
.brand-copy{display:block}
.brand-wordmark{display:block;font:27px/1.05 var(--font-reference);letter-spacing:3px}
.brand small{display:block;font:9px/1.5 var(--font-reference);letter-spacing:2.1px;margin-top:7px;color:#c9beb0}
.search{display:flex;align-items:center;gap:12px;flex:1;max-width:630px;background:#151a20;border:1px solid #343b42;border-radius:17px;padding:11px 17px}
.search>span{font-size:25px;line-height:1}
.search input{width:100%;background:none;border:0;color:#eee;outline:none}
.search:focus-within{border-color:var(--gold)}
kbd{white-space:nowrap;color:var(--muted);font-size:10px}
.market{display:flex;align-items:center;gap:10px;cursor:pointer;margin-left:auto}
.market small,.nav-title small{display:block;color:var(--muted);font-size:11px}
.market input{appearance:none;width:43px;height:24px;border-radius:15px;background:#343b43;border:1px solid #555;position:relative;cursor:pointer}
.market input:before{content:'';position:absolute;width:18px;height:18px;top:2px;left:3px;border-radius:50%;background:#aaa;transition:transform .2s}
.market input:checked{background:#6e5128;border-color:var(--gold)}
.market input:checked:before{background:#edbf6d;transform:translateX(17px)}
.prototype{color:var(--muted);font-size:9px;letter-spacing:2px}
main{display:flex;gap:20px;align-items:stretch}
.explorer{min-width:0;flex:1}
.stage-heading{display:flex;justify-content:space-between;gap:12px;font-size:10px;color:var(--muted);letter-spacing:1px;margin:16px 0 10px}
#price-status{color:#ba9b65}
.plot{position:relative;border:1px solid #232b32;border-radius:12px;overflow:hidden;background:linear-gradient(115deg,#17191b70,#201a192b)}
#timeline{display:block;width:100%;height:clamp(480px,calc(100dvh - 335px),920px);touch-action:none;cursor:grab}
#timeline:active{cursor:grabbing}
#tooltip{position:absolute;pointer-events:none;max-width:310px;padding:10px 14px;border:1px solid #48525b;border-radius:10px;background:#171d25f5;box-shadow:0 8px 30px #0008;font-size:12px;z-index:3}
#empty{position:absolute;top:42%;left:25%;right:15%;padding:20px;background:#151b23ed;border:1px solid var(--line);border-radius:12px}
.instructions{display:flex;justify-content:space-between;font-size:9px;color:var(--muted);letter-spacing:1.4px;margin:12px 4px}
.navigator{display:flex;gap:24px;align-items:center;border:1px solid var(--line);padding:20px;border-radius:15px;background:#1a1a1c88}
.nav-title{min-width:140px;font-size:12px}
.nav-title button{font-size:10px;padding:4px 9px;margin-top:8px}
.nav-title small{margin-top:5px}
#nav-track{position:relative;flex:1;height:100px;min-width:0;touch-action:none}
#overview{width:100%;height:100%;display:block}
#selection{position:absolute;top:3px;height:76px;background:linear-gradient(180deg,#e4bb752a,#e4bb750b);border:1px solid #e2bc76;border-radius:5px;cursor:grab;touch-action:none;box-shadow:inset 0 0 18px #ddb46710,0 0 14px #ddb46720}
.handle{position:absolute;top:20px;width:9px;height:34px;padding:0;background:linear-gradient(90deg,#bfa06b,#ffe4ae,#c6a36a);border-radius:5px;border:1px solid #ffe8b9;cursor:ew-resize;touch-action:none}
.left{left:-5px}
.right{right:-5px}
.event-list{margin-top:18px;font-size:12px;color:var(--muted)}
.event-list summary{cursor:pointer}
#results{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:8px;margin:12px 0}
#results button{text-align:left;border-radius:9px;font-size:12px}
#results small{display:block;color:var(--muted)}
footer{display:flex;justify-content:space-between;margin-top:28px;color:#8c949c;font-size:9px;letter-spacing:2px}
[hidden]{display:none!important}
@media(max-width:1100px){header{gap:20px;flex-wrap:wrap}
.prototype,kbd{display:none}
.brand{font-size:23px}
.market{margin-left:0}

.stage-heading{flex-wrap:wrap}
}
@media(max-width:760px){body{padding:15px}
.search{order:3;flex-basis:100%;max-width:none}
.market{margin-left:auto;font-size:11px}

.navigator{padding:14px;gap:12px}
.nav-title{min-width:90px;max-width:100px}
footer{gap:20px}
.instructions{font-size:8px}
}



/* HTML lane controls share the canvas top/bottom inset and equal lane heights. */
#all-categories{position:absolute;left:10px;top:8px;z-index:2;border:0;border-radius:4px;padding:3px 5px;font-size:10px;background:none;color:#99938a}
#all-categories[aria-pressed=true]{color:#dcc497}
#lane-controls{position:absolute;left:7px;top:40px;bottom:40px;width:116px;display:grid;grid-template-rows:repeat(9,1fr);z-index:4;pointer-events:none}
.lane-control{display:flex;align-items:center;gap:0;pointer-events:none;position:relative}
.lane-control button{pointer-events:auto;border:0;border-left:2px solid transparent;border-radius:3px;background:none;padding:7px 5px;text-align:left;font-size:11px;color:var(--category-color);transition:opacity .18s,background .18s,text-shadow .18s}
.lane-control button:hover{background:#ffffff08}
.lane-control button[aria-pressed=true],.lane-control button[aria-pressed=mixed]{border-left-color:var(--category-color);background:#ffffff06;text-shadow:0 0 12px var(--category-color)}
.lane-control button.muted{opacity:.38}
#more-categories{pointer-events:auto}
#more-categories summary{cursor:pointer;padding:8px 5px;color:#9e98aa;list-style:none}
#more-options{position:absolute;left:4px;bottom:85%;min-width:215px;max-width:260px;max-height:300px;overflow:auto;padding:12px;display:grid;gap:4px;border:1px solid #423c3a;border-radius:10px;background:#1d1c20;box-shadow:0 12px 28px #0007}
#price-axis{position:absolute;right:5px;top:40px;bottom:40px;width:64px;pointer-events:none;border-left:1px solid #c6a06420;color:#ad9771;font-size:10px}
#price-axis .axis-title{position:absolute;top:-27px;right:2px;font-size:8px;letter-spacing:.5px;white-space:nowrap}
#price-axis .axis-tick{position:absolute;left:8px;transform:translateY(-50%)}
#price-axis .axis-tick:before{content:'';position:absolute;left:-8px;top:50%;width:4px;border-top:1px solid #c6a06450}
#price-axis .axis-empty{font-size:9px;display:block;margin:16px 0 0 8px}
.site-menu{position:relative}
#menu-toggle{width:35px;height:35px;padding:9px 7px;display:grid;align-content:center;gap:5px;border:1px solid #3b3835;border-radius:9px;background:#211e1b66}
#menu-toggle span{display:block;height:1px;background:#c0b8aa}
#menu-panel{position:absolute;right:0;top:48px;width:300px;max-width:calc(100vw - 30px);max-height:75vh;overflow:auto;z-index:20;display:grid;gap:15px;padding:22px;background:#1c1b1ef5;border:1px solid #433b36;border-radius:14px;box-shadow:0 20px 55px #0009}
#menu-panel h2{font-size:10px;font-weight:500;text-transform:uppercase;letter-spacing:2px;color:#c1a878;margin:0 0 7px}
#menu-panel a,#menu-panel section>span{display:flex;justify-content:space-between;gap:12px;padding:6px 0;color:#d0cbc6;font-size:12px;text-decoration:none}
#menu-panel a:hover{color:#f2d398}
#menu-panel section>span{color:#817e7c}
#menu-panel small{font-size:9px;color:#76716d;white-space:nowrap}
#nav-dates{position:absolute;top:-18px;left:50%;transform:translateX(-50%);white-space:nowrap;font-size:10px;letter-spacing:.4px;color:#e1c393;opacity:0;transition:opacity .15s;pointer-events:none}
#nav-track.dragging #nav-dates,#nav-track:focus-within #nav-dates{opacity:1}
.nav-title{letter-spacing:.3px}
.handle:after{content:'';position:absolute;inset:10px 3px;border-left:1px solid #69513388}
#selection:focus-visible,.handle:focus-visible{outline-offset:4px}
@media(max-width:760px){#lane-controls{width:90px;left:3px}.lane-control button{font-size:9px;padding:8px 3px}#all-categories{font-size:9px;left:4px}.lane-control summary{padding:5px 2px}#price-axis{width:51px;font-size:9px}.market{margin-left:auto}.site-menu{margin-left:0}header{gap:13px}#timeline{height:560px}.instructions{flex-wrap:wrap;gap:5px}#nav-dates{font-size:8px}}
@media(prefers-reduced-motion:reduce){button,.lane-control button,#nav-dates{transition:none}}

/* Editorial detail panel: bounded height and contained scrolling keep the timeline still. */
#panel{--event-accent:#c6a56b;position:sticky;top:16px;align-self:flex-start;width:clamp(350px,35vw,560px);flex-shrink:0;height:calc(100dvh - 135px);max-height:calc(100dvh - 32px);overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;overflow-anchor:none;scrollbar-width:thin;scrollbar-color:#59504a transparent;border:1px solid #403936;border-top:2px solid var(--event-accent);border-radius:15px;background:linear-gradient(155deg,#211f20,#19191b 65%);box-shadow:0 15px 40px #0003}
.panel-toolbar{position:sticky;top:0;display:flex;justify-content:space-between;align-items:center;padding:13px 21px;background:#211f20f5;backdrop-filter:blur(8px);border-bottom:1px solid #c7b38c12;z-index:2}
#event-back{border:0;background:none;padding:5px 0;color:#b8aca0;font-size:11px}
#panel button:disabled{opacity:.35;cursor:default}
#close-panel{padding:0;width:30px;height:30px;font-size:23px;line-height:1;background:#ffffff05;border-color:#ffffff12}
.event-article{padding:25px clamp(22px,2.3vw,36px) 34px;overflow-wrap:anywhere}
.article-meta{display:flex;flex-wrap:wrap;gap:7px 12px;align-items:center;font-size:10px;line-height:1.6;color:#a69e95;letter-spacing:.5px}
.article-category{color:var(--event-accent);text-transform:uppercase;font-weight:600}
.article-category:before{content:'';display:inline-block;width:6px;height:6px;background:var(--event-accent);border-radius:50%;margin-right:7px;box-shadow:0 0 9px var(--event-accent)}
.article-geography{flex-basis:100%}
#panel h1{font:clamp(27px,2.4vw,37px)/1.17 var(--font-reference);color:#e8e0d5;margin:21px 0 19px;font-weight:400;letter-spacing:-.5px;outline:none}
#panel .standfirst{font-size:16px;line-height:1.7;color:#c9beb0;margin:0 0 27px}
.event-image{margin:0 0 28px}
#panel img{display:block;width:100%;height:auto;max-height:360px;object-fit:contain;border-radius:7px}
#panel .body-content{font-size:15px;line-height:1.85;color:#c6c0b8;overflow-wrap:anywhere}
.body-content>p{margin:0 0 1.4em}.body-content>p:last-child{margin-bottom:0}
.body-content strong{color:#dfd7cc;font-weight:600}.body-content h2,.body-content h3{color:#e1d8cb;line-height:1.35}
.body-content blockquote{margin:22px 0;padding:0 0 0 18px;border-left:2px solid var(--event-accent);color:#cfc2b2}
.body-content table{display:block;max-width:100%;overflow-x:auto}.body-content pre{white-space:pre-wrap;overflow-wrap:anywhere}
#panel a{color:#dcc18a;text-decoration-color:#dcc18a55;text-underline-offset:3px;overflow-wrap:anywhere}
#panel a:hover{color:#f0d9ac}
#panel .tags{display:flex;gap:6px;flex-wrap:wrap;margin:28px 0;font-size:10px;color:#a39b91}
.tags span{border:1px solid #bfa77a20;border-radius:12px;padding:3px 8px}
.article-sources,.related-history,.article-navigation{border-top:1px solid #c1ac861c;margin-top:27px;padding-top:20px}
#panel section>h2{font-size:11px;font-weight:500;letter-spacing:1.7px;text-transform:uppercase;color:#c9bda9;margin:0 0 14px}
.article-sources ol{padding-left:18px;font-size:12px;line-height:1.65}.article-sources li{padding-left:4px;margin:0 0 12px}.article-sources small{display:block;font-size:10px;color:#8f877e}
.related-event{display:block;width:100%;text-align:left;border:0;border-left:2px solid var(--related-accent);border-radius:0;background:none;padding:4px 0 4px 13px;margin:14px 0;color:#d0c7bb;font-size:13px;line-height:1.5}
.related-event:hover{background:#ffffff04}.related-event small{display:block;font-size:10px;color:#a2998e;margin-top:5px}.related-event .relation-reason{color:#817c75;font-size:9px}
.panel-note{font-size:11px;color:#9e9385;line-height:1.6}.chronological-controls{display:flex;gap:9px;margin-top:15px}.chronological-controls button{flex:1;font-size:11px;padding:9px 6px;border-radius:7px;background:#ffffff03;border-color:#c1ac8625}
#return-to-event{position:absolute;right:90px;bottom:44px;z-index:5;font-size:11px;background:#29241ded;border-color:#8c7753}
@media(max-width:1100px) and (min-width:761px){#panel{width:350px}.event-article{padding:22px}.stage-heading{font-size:9px}}
@media(max-width:760px){#panel{position:fixed;right:10px;top:12px;bottom:12px;width:min(94vw,500px);height:auto;max-height:none;z-index:10;box-shadow:0 0 0 100vmax #0005}.event-article{padding:24px}#panel h1{font-size:30px}#return-to-event{right:65px;font-size:10px}}

/* Advanced filtering is an optional popover, not a permanent form. */
.filter-launcher{position:relative;flex-shrink:0}
#advanced-toggle{display:flex;align-items:center;gap:7px;padding:9px 11px;font-size:11px;border-radius:10px;background:#211e1b66;border-color:#3b3835;color:#b8ae9e}
#advanced-toggle[data-active=true]{border-color:#aa8951;color:#e0c28a;background:#aa895118}
#advanced-toggle:disabled{opacity:.4;cursor:wait}
#advanced-filters{position:fixed;right:auto;top:48px;width:370px;max-width:calc(100vw - 30px);max-height:75dvh;overflow:auto;overscroll-behavior:contain;z-index:25;border:1px solid #493e32;border-radius:14px;background:#1d1c1efb;box-shadow:0 20px 55px #0009;padding:18px;scrollbar-width:thin}
.advanced-heading{display:flex;align-items:center;justify-content:space-between;gap:14px}
.advanced-heading h2{font-size:15px;font-weight:500;color:#e5d5bb;margin:0}
#close-filters{font-size:20px;line-height:1;padding:3px 7px;border:0;background:none}
.facet-help,.facet-note{font-size:11px;line-height:1.6;color:#a69b8e;margin:12px 0}
#facet-groups details{border-top:1px solid #b7a17c20;padding:9px 0}
#facet-groups summary{font-size:12px;cursor:pointer;color:#cec1ad;padding:5px 0}
#facet-groups label{display:flex;align-items:center;gap:9px;font-size:12px;padding:6px 4px;color:#c3bcb3;cursor:pointer}
#facet-groups input{accent-color:#c8a365;width:14px;height:14px;flex-shrink:0;margin:0}
.advanced-footer{position:sticky;bottom:-18px;background:#1d1c1ef5;border-top:1px solid #b7a17c20;padding:13px 0;display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:10px;color:#c9b387}
.advanced-footer button{font-size:10px;padding:5px 9px}
#filter-summary{display:flex;align-items:center;gap:7px;max-width:100%;overflow-x:auto;white-space:nowrap;padding:10px 0 0;scrollbar-width:thin}
#filter-summary button{flex-shrink:0;font-size:10px;padding:4px 9px;border-color:#8e795a45;background:#a78b5710;color:#c9b996}
#filter-summary .filter-chip{max-width:230px;overflow:hidden;text-overflow:ellipsis}
.summary-count{font-size:10px;color:#9f978b;flex-shrink:0}
#filter-summary:focus{outline:1px solid #a78b5750;outline-offset:2px}

@media(max-width:760px){#advanced-filters{position:fixed;left:15px;right:15px;top:100px;width:auto;max-height:calc(100dvh - 125px)}#advanced-toggle span{display:none}#advanced-toggle{padding:8px}#filter-summary .filter-chip{max-width:180px}}

/* Monedial masthead: existing artwork, presentation only. Canvas styles unchanged. */
header{gap:24px;padding-bottom:20px;border-bottom-color:#b8996529}
header .search{min-width:160px;border-radius:12px;background:linear-gradient(145deg,#1d1c1b,#15181b);border-color:#464039;box-shadow:inset 0 1px #ffffff05;padding:10px 15px}
header .search:focus-within{border-color:var(--gold);box-shadow:0 0 0 2px #dfb56816}
header .search input{min-width:0}
header .market{flex-shrink:0;gap:8px;font-size:12px;color:#e0d4c4}
header .market small{font-size:10px;color:#a69f96}
header #advanced-toggle{border-color:#494037;background:#211d1980;color:#d6c9b7}
header .site-menu{flex-shrink:0}
#menu-toggle{width:39px;height:39px;padding:10px 9px;border-color:#76604470;background:linear-gradient(145deg,#31291e90,#191a1c);box-shadow:inset 0 1px #f4d8a714;gap:5px}
#menu-toggle span{background:#d4bb91;transition:transform .16s,opacity .16s}
#menu-toggle span:nth-child(2){width:75%;justify-self:end}
#menu-toggle[aria-expanded=true]{border-color:#bc965d}
#menu-toggle[aria-expanded=true] span:first-child{transform:translateY(6px) rotate(45deg)}
#menu-toggle[aria-expanded=true] span:nth-child(2){opacity:0}
#menu-toggle[aria-expanded=true] span:last-child{transform:translateY(-6px) rotate(-45deg)}
#menu-panel{top:51px;width:330px;padding:22px;gap:17px;background:linear-gradient(145deg,#28231ff7,#19191dfb 65%);border-color:#9d7c494d;box-shadow:inset 0 1px #edcf9b0f,0 18px 48px #0009;backdrop-filter:blur(14px)}
.menu-masthead{padding-bottom:14px;border-bottom:1px solid #c7a56a26}
.menu-kicker{font:10px/1.5 var(--font-reference);letter-spacing:2px;color:#cdb48b}
.menu-masthead p{font:17px/1.4 var(--font-reference);color:#eee2d1;margin:7px 0 0}
#menu-panel section+section{padding-top:14px;border-top:1px solid #a88d6726}
#menu-panel h2{color:#c8a873;letter-spacing:1.8px}
#menu-panel a,#menu-panel section>span{padding:7px 9px;border-radius:6px;font-size:12px}
#menu-panel a:hover,#menu-panel a:focus-visible{background:#d2b27c10;color:#f6e5c8}
#menu-panel a[aria-current=page]{border-left:2px solid #d1ad71;background:#d2b27c0c;color:#f3e2c6}
#menu-panel section>span{color:#b2aaa1}
#menu-panel small{color:#aaa096}
@media(min-width:761px) and (max-width:1100px){
 header{display:grid;grid-template-columns:auto minmax(130px,1fr) auto auto auto;gap:14px}
 .brand{gap:8px}.brand-symbol{width:52px;height:37px}.brand-wordmark{font-size:23px;letter-spacing:2px}.brand small{font-size:8px;letter-spacing:1.4px}
 header .market{margin-left:0}header .market>span{font-size:10px}header .market small{font-size:9px}
 header #advanced-toggle span{display:none}header #advanced-toggle{padding:8px}
}
@media(max-width:760px){
 header{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:12px;padding-bottom:17px}
 .brand{grid-column:1/3;grid-row:1;gap:9px}.brand-symbol{width:53px;height:37px}.brand-wordmark{font-size:23px;letter-spacing:2px}.brand small{font-size:8px;letter-spacing:1.5px;margin-top:5px}
 header .site-menu{grid-column:3;grid-row:1;justify-self:end}
 header .search{grid-column:1/3;grid-row:2;min-width:0;width:100%;padding:9px 12px}
 header .filter-launcher{grid-column:3;grid-row:2;justify-self:end}
 header .market{grid-column:1/4;grid-row:3;margin-left:0;justify-self:end;font-size:11px}
 header .market>span{display:flex;align-items:center;gap:8px}
 #menu-panel{max-height:calc(100dvh - 95px)}
}
@media(prefers-reduced-motion:reduce){#menu-toggle span,header .market input:before{transition:none}}