
:root{--gold:#c79b43;--gold-light:#f2ddb0}
*{box-sizing:border-box}
html,body{width:100%;height:100%;margin:0;background:#000;overflow:hidden;font-family:Arial,sans-serif}
body{display:flex;align-items:center;justify-content:center}
.stage{position:relative;width:min(100vw,177.7778vh);height:min(100vh,56.25vw);flex:0 0 auto;overflow:hidden;background:#000}
.stage>img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;display:block;user-select:none;-webkit-user-drag:none}
.exit{position:absolute;left:1.3%;top:2.1%;z-index:50;border:2px solid rgba(231,198,119,.95);border-radius:7px;padding:.55em .9em;background:rgba(30,20,8,.92);color:#ffe9ad;text-decoration:none;font-weight:800;letter-spacing:.08em;font-size:clamp(12px,1.05vw,17px);box-shadow:0 4px 12px rgba(0,0,0,.65)}
.exit:hover,.exit:focus-visible{outline:2px solid #fff;outline-offset:3px;background:#4b3517}
.hotspot{--x:50%;--y:50%;position:absolute;left:var(--x);top:var(--y);z-index:20;width:clamp(30px,2.55vw,42px);aspect-ratio:1;display:grid;place-items:center;border-radius:50%;border:2px solid rgba(230,205,143,.97);color:#fff7dc;background:linear-gradient(145deg,#aa8635,#76581f 60%,#4e3813);box-shadow:0 3px 9px rgba(0,0,0,.75),inset 0 1px 2px rgba(255,247,205,.35);font:800 clamp(.78rem,1vw,.98rem)/1 Arial,sans-serif;cursor:pointer;transform:translate(-50%,-50%);transition:transform .16s ease,box-shadow .16s ease}
.hotspot:hover,.hotspot:focus-visible,.hotspot.armed{transform:translate(-50%,-50%) scale(1.12);box-shadow:0 4px 13px rgba(0,0,0,.8),0 0 0 3px rgba(202,161,70,.35),0 0 17px rgba(234,191,86,.5)}
.hotspot:focus-visible{outline:2px solid #fff;outline-offset:3px}
.hotspot .label{position:absolute;left:50%;bottom:calc(100% + 9px);transform:translateX(-50%);min-width:max-content;max-width:260px;padding:7px 10px;border-radius:6px;background:rgba(18,13,7,.96);border:1px solid var(--gold);color:#fff3cf;font:700 clamp(10px,.8vw,13px)/1.25 Arial,sans-serif;letter-spacing:.02em;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .15s ease;white-space:nowrap}
.hotspot:hover .label,.hotspot:focus-visible .label,.hotspot.armed .label{opacity:1;visibility:visible}
.model-link{position:absolute;z-index:8;border:2px solid transparent;background:transparent;cursor:pointer;border-radius:44%;transition:border-color .2s ease,box-shadow .2s ease,background .2s ease}
.model-link:hover,.model-link:focus-visible{border-color:rgba(222,180,83,.9);box-shadow:0 0 22px rgba(222,180,83,.48);background:rgba(211,164,65,.06);outline:none}
.action{position:absolute;bottom:2.2%;z-index:24;padding:.56em .9em;border-radius:7px;border:2px solid rgba(222,196,126,.95);background:rgba(28,20,9,.93);color:#ffe9ad;font-weight:800;letter-spacing:.05em;font-size:clamp(10px,.82vw,14px);cursor:pointer;text-decoration:none;box-shadow:0 3px 10px rgba(0,0,0,.55)}
.action:hover,.action:focus-visible{outline:2px solid #fff;outline-offset:2px;background:#493516}
.action.left{left:2%}.action.mid{left:50%;transform:translateX(-50%)}.action.right{right:2%}
.overlay{position:fixed;inset:0;z-index:100;display:grid;place-items:center;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .25s ease,visibility .25s ease}
.overlay.open{opacity:1;visibility:visible;pointer-events:auto}
.backdrop{position:absolute;inset:0;border:0;background:rgba(0,0,0,.78);cursor:pointer}
.board{position:relative;z-index:2;width:min(92vw,1450px);height:min(88vh,820px);padding:12px;background:linear-gradient(145deg,#6c5225,#2b200f 45%,#8c692c);border:2px solid #d5b36c;border-radius:14px;box-shadow:0 25px 80px rgba(0,0,0,.85)}
.board iframe{width:100%;height:100%;border:0;border-radius:8px;background:#15110c}
.close{position:absolute;right:-14px;top:-14px;z-index:5;width:46px;height:46px;border-radius:50%;border:2px solid #f2ddb0;background:#3b2a12;color:white;font-size:30px;line-height:1;cursor:pointer}
.close:hover,.close:focus-visible{outline:3px solid #fff}
.closer{width:100%;height:100%;overflow:auto;background:#050505;display:none;align-items:flex-start;justify-content:center}
.closer.active{display:flex}
.closer img{height:auto;max-width:none;min-width:100%;display:block}
@media (hover:none),(pointer:coarse){.hotspot .label{display:none}}

/* Standard Discovery Mill EXIT control */
.exit-button{
  position:absolute;
  top:clamp(14px,2vw,28px);
  left:clamp(14px,2vw,28px);
  z-index:60;
  width:clamp(70px,7vw,92px);
  padding:0;
  border:0;
  background:transparent;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.exit-button img{
  display:block;
  width:100%;
  height:auto;
  filter:drop-shadow(0 5px 8px rgba(0,0,0,.72));
}
.exit-button:hover,
.exit-button:focus-visible{
  transform:scale(1.05);
  outline:3px solid #fff;
  outline-offset:4px;
  border-radius:8px;
}

/* Bay-only illustrated arch hotspots */
.bay-arch{
  --x:50%;position:absolute;left:var(--x);top:16%;z-index:20;
  width:11.5%;height:42%;transform:translateX(-50%);
  border:4px solid transparent;border-bottom:0;border-radius:50% 50% 0 0 / 27% 27% 0 0;
  background:rgba(8,39,54,.001);cursor:pointer;color:transparent;
  transition:border-color .24s ease,background .24s ease,box-shadow .24s ease
}
.bay-arch:hover,.bay-arch:focus-visible,.bay-arch.armed{
  border-color:rgba(222,190,107,.92);background:rgba(215,174,73,.045);
  box-shadow:0 0 17px rgba(215,174,83,.46),inset 0 0 16px rgba(215,174,83,.11);outline:none
}
.bay-arch.edge{width:10.5%}

/* Gold model gateway */
.china-bay .model-link{
  border:4px solid rgba(222,180,83,.68);
  box-shadow:0 0 15px rgba(222,180,83,.42),inset 0 0 12px rgba(222,180,83,.20);
}
.china-bay .model-link:hover,.china-bay .model-link:focus-visible{
  border-color:#f2ddb0;box-shadow:0 0 28px rgba(222,180,83,.82),inset 0 0 18px rgba(222,180,83,.28)
}

/* Gold-standard question -> reveal -> fade/drop close */
.overlay{opacity:1;visibility:hidden;pointer-events:none;transition:none}
.overlay.open,.overlay.closing{visibility:visible}
.overlay.open{pointer-events:auto}.overlay.closing{pointer-events:none}
.backdrop{background:rgba(0,0,0,0);transition:background .75s ease}
.overlay.open .backdrop{background:rgba(0,0,0,.72)}
.board{
  opacity:0;transform:translateY(105vh) scale(.96);
  transition:transform 1.15s cubic-bezier(.16,.76,.18,1),opacity .55s ease
}
.overlay.open .board{opacity:1;transform:translateY(0) scale(1)}
.board iframe{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .35s ease}
.overlay.revealed .board iframe{opacity:1;visibility:visible;pointer-events:auto}
.mystery-cover{
  position:absolute;inset:12px;z-index:4;display:grid;place-items:center;border:0;border-radius:8px;
  color:#f3d58d;cursor:pointer;opacity:0;visibility:hidden;transform:scale(.97);
  background:radial-gradient(ellipse at center,rgba(54,17,6,.72) 0%,rgba(25,9,4,.94) 52%,#050505 80%);
  transition:opacity .72s ease .35s,transform .72s ease .35s,visibility 0s linear .35s
}
.overlay.open .mystery-cover{opacity:1;visibility:visible;transform:scale(1)}
.mystery-cover::before,.mystery-cover::after{content:"";position:absolute;inset:10%;border-radius:50%;pointer-events:none}
.mystery-cover::before{border:5px solid rgba(238,171,58,.92);box-shadow:0 0 16px rgba(255,111,0,.94),0 0 38px rgba(255,74,0,.76),inset 0 0 25px rgba(255,80,0,.38);animation:chinaMysteryPulse 2.05s ease-in-out infinite}
.mystery-cover::after{inset:15%;background:rgba(255,91,0,.10);box-shadow:0 0 30px rgba(255,79,0,.72);animation:chinaMysteryInner 2.05s ease-in-out infinite}
.question-mark{position:relative;z-index:2;font:700 clamp(7rem,12vw,11rem)/1 Arial,sans-serif;color:#f5d28b;text-shadow:0 0 12px rgba(255,171,45,.88),0 0 30px rgba(255,84,0,.72);animation:chinaQuestion 2.05s ease-in-out infinite}
@keyframes chinaMysteryPulse{0%,100%{transform:scale(.90);opacity:.48}50%{transform:scale(1.12);opacity:1}}
@keyframes chinaMysteryInner{0%,100%{transform:scale(.88);opacity:.28}50%{transform:scale(1.20);opacity:.72}}
@keyframes chinaQuestion{0%,100%{transform:scale(.94);opacity:.70}50%{transform:scale(1.06);opacity:1}}
.overlay.revealed .mystery-cover{opacity:0;visibility:hidden;transform:scale(.94);transition:opacity .58s ease,transform .58s ease,visibility 0s linear .58s}
