:root{--bg:#07090c;--panel:rgba(8,11,15,.90);--line:rgba(255,255,255,.16);--gold:#d9b86c;--text:#f6f3eb;--muted:#b8bec7}*{box-sizing:border-box}html,body,#app{margin:0;width:100%;height:100%;overflow:hidden;background:var(--bg);font-family:Inter,Arial,sans-serif;color:var(--text)}
#world{position:fixed;inset:0;width:100%;height:100%;z-index:0;display:block;touch-action:none;cursor:grab;background:#000}#world.dragging{cursor:grabbing}
#video360{display:none}#video360.desktop-video-bg{position:fixed!important;inset:0!important;width:100vw!important;height:100vh!important;object-fit:cover!important;object-position:center!important;display:block!important;visibility:visible!important;opacity:1!important;z-index:1!important;background:#000;pointer-events:none}
header{position:fixed;top:0;left:0;right:0;height:66px;display:flex;align-items:center;gap:22px;padding:0 26px;background:linear-gradient(#07090cf5,transparent);z-index:20}.brand{font-weight:900;letter-spacing:.08em}.brand span{font-weight:500;color:var(--muted);font-size:12px;margin-left:8px}.progress{height:2px;background:#ffffff24;flex:1}.progress i{display:block;height:100%;background:var(--gold);width:0;transition:.35s}
button{border:1px solid var(--line);background:#11161de8;color:#fff;padding:10px 14px;border-radius:8px;cursor:pointer}button:hover{border-color:#ffffff66}button:disabled{opacity:.35;cursor:default}.toplink{border:1px solid var(--line);background:#11161de8;color:#fff;padding:9px 13px;border-radius:8px;text-decoration:none;font-size:12px}
#hud{position:fixed;left:28px;bottom:92px;width:min(540px,calc(100vw - 56px));max-height:calc(100vh - 170px);overflow:auto;background:var(--panel);backdrop-filter:blur(14px);border:1px solid var(--line);border-radius:16px;padding:22px;z-index:15;box-shadow:0 20px 60px #0008;transition:.25s}#hud.min{transform:translateY(calc(100% - 48px));overflow:hidden}.eyebrow{font-size:11px;letter-spacing:.16em;color:var(--gold);font-weight:800;margin-bottom:7px}#hud h1{font-size:25px;margin:0 0 14px;line-height:1.08}#graphic{margin:12px 0 16px}.copy{border-top:1px solid var(--line);padding-top:13px}.copy h2{font-size:17px;margin:0 0 6px}.copy p{color:#d3d7dc;line-height:1.5;margin:0;font-size:14px}.actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:15px}.actions button{font-size:12px}.cta{display:none;align-items:center;text-decoration:none;border:1px solid var(--gold);color:#15120b;background:var(--gold);font-weight:900;padding:9px 12px;border-radius:8px;font-size:12px}.cta.show{display:inline-flex}
.statgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.stat{padding:10px;border:1px solid var(--line);border-radius:10px;background:#ffffff08}.stat b{display:block;font-size:24px}.stat span{font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}.bars{display:grid;gap:8px}.barrow{font-size:11px}.barlabel{display:flex;justify-content:space-between;margin-bottom:4px}.bar{height:9px;background:#ffffff12;border-radius:12px;overflow:hidden}.bar i{display:block;height:100%;background:linear-gradient(90deg,#907642,var(--gold));border-radius:12px}.deathchart{display:flex;align-items:flex-end;gap:7px;height:125px;border-bottom:1px solid #ffffff30;padding:0 2px}.dcol{flex:1;text-align:center}.dcol i{display:block;background:linear-gradient(#d9b86c,#7e6638);min-height:3px;border-radius:4px 4px 0 0}.dcol b{font-size:9px;display:block;margin-top:4px}.dcol span{font-size:8px;color:var(--muted)}.flow{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.node{border:1px solid var(--line);padding:7px 9px;border-radius:20px;font-size:10px;background:#ffffff08}.arrow{color:var(--gold)}
#desktopNav{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:10px;z-index:20}#sceneDots{display:flex;gap:5px;max-width:60vw;overflow:hidden}.dot{width:7px;height:7px;padding:0;border:0;border-radius:50%;background:#ffffff40}.dot.active{background:var(--gold);transform:scale(1.5)}
#hint{position:fixed;right:22px;bottom:22px;font-size:11px;color:#c7cbd0;z-index:12;max-width:50vw;text-align:right}#vrBtn{position:fixed;right:22px;bottom:52px;z-index:20;background:var(--gold);color:#171207;font-weight:800}#vrBtn.unsupported{background:#31363c;color:#bbb;cursor:not-allowed}#mediaStatus{position:fixed;top:76px;right:20px;z-index:25;background:#07090ce8;border:1px solid var(--line);padding:8px 10px;border-radius:8px;font-size:11px;color:#d7dce1;opacity:0;transition:.2s;pointer-events:none}#mediaStatus.show{opacity:1}
#sources{position:fixed;right:-480px;top:0;width:min(460px,100vw);height:100%;z-index:40;background:#0b0f14fa;padding:28px;overflow:auto;transition:.3s;border-left:1px solid var(--line)}#sources.open{right:0}#closeSources{float:right}.sourcecard{padding:12px 0;border-bottom:1px solid var(--line)}.sourcecard b{display:block;color:var(--gold);margin-bottom:4px}.sourcecard p{font-size:12px;color:#ccd1d6;line-height:1.4}
#start{position:fixed;inset:0;z-index:60;background:radial-gradient(circle at 70% 20%,#28303c,#090b0f 55%);display:grid;place-items:center;padding:30px}#start>div{max-width:760px;text-align:center}#start h1{font-size:clamp(34px,6vw,70px);line-height:.98;margin:20px 0}#start p{color:#c7ccd2;font-size:17px;line-height:1.6}.seal{width:72px;height:72px;border:1px solid var(--gold);border-radius:50%;display:grid;place-items:center;margin:auto;color:var(--gold);font-weight:900}#begin{margin:18px 0;background:var(--gold);color:#12100a;border:0;font-weight:900;padding:14px 22px}.startback{display:block;width:max-content;margin:0 auto 12px;color:#d8c796;text-decoration:none;font-size:13px}#start small{display:block;color:#8e959e}
.xr-active header,.xr-active #hud,.xr-active #desktopNav,.xr-active #hint,.xr-active #vrBtn,.xr-active #mediaStatus{display:none!important}
@media(max-width:700px){header{padding:0 12px}.brand span,#sourcesBtn,#hint{display:none}#hud{left:12px;bottom:70px;width:calc(100vw - 24px);padding:16px;max-height:54vh}#hud h1{font-size:20px}#desktopNav{bottom:14px}.toplink{padding:8px 10px}.cta.show{width:100%;justify-content:center}}





/* Authoritative seamless panorama/video transition */
html,body{
  background:#000 !important;
}
#transitionVeil{
  position:fixed !important;
  inset:0 !important;
  background:rgb(0,0,0) !important;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  z-index:9998 !important;
  transition:opacity .32s ease-in-out, visibility 0s linear .32s;
}
#transitionVeil.show{
  opacity:1;
  visibility:visible;
  transition:opacity .32s ease-in-out, visibility 0s linear 0s;
}
