/* Shared floating-bar treatment from the approved backup_3 website. */
:root{--header:0px;--bar-bg:rgba(39,41,43,.70);--bar-border:1px solid rgba(255,255,255,.18);--bar-shadow:0 10px 28px rgba(10,12,13,.18)}
#tour-shell{position:relative;height:100dvh;min-height:480px}
.header,.view-controls,.mobile-plan{background:var(--bar-bg);border:var(--bar-border);box-shadow:var(--bar-shadow);backdrop-filter:blur(20px) saturate(115%);-webkit-backdrop-filter:blur(20px) saturate(115%);color:#fff;border-radius:999px}
.header{position:absolute;z-index:9;top:10px;left:calc((100% - 350px)/2);transform:translateX(-50%);width:clamp(320px,36vw,480px);max-width:calc(100vw - 20px);height:42px;padding:5px 4px 5px 14px;gap:14px}
.header img{width:90px;height:24px}.header nav{display:flex;align-items:center;gap:14px}.header nav>a{color:white;font-size:12px;text-decoration:none;position:relative}.header nav>a:after{content:'';position:absolute;inset:-13px -4px}.header nav>a:hover{text-decoration:underline}
.header .cta{position:relative;min-height:30px;padding:5px 14px;border-radius:999px;background:#fff;color:var(--ink);gap:7px;font-size:14px;font-weight:400;line-height:1.25}.header .cta span{font-size:16px;line-height:1;display:inline-block}.header .cta:after{content:'';position:absolute;inset:-7px -4px}.header .cta:hover{color:#fff;background:var(--orange)}
.view-controls{height:46px;padding:1px 6px;bottom:68px}.view-controls button{color:white;border-radius:50%;font-size:23px}.view-controls button:hover{background:#ffffff18}.view-controls span{background:#ffffff35}.header :focus-visible,.view-controls :focus-visible,.mobile-plan:focus-visible{outline-color:white}
.scene-heading{top:82px;z-index:2}.scene-heading .eyebrow{font-size:10px}.scene-heading h1{font-size:32px}.scene-heading:before{display:none}.scene-heading>*{position:relative}
#viewer{z-index:0;isolation:isolate}.intro{z-index:4}.pending{z-index:1}.view-controls,.stage-footer{z-index:3}.load-error{z-index:5}
.mobile-plan{min-height:44px;padding:11px 17px}.mobile-plan:hover{background:rgba(39,41,43,.85)}
/* Orange plus enlarged from 28px to 42px, without a visible circle. */
.info-marker{width:44px;height:44px;background:transparent;color:var(--orange);border:0;border-radius:0;font:600 42px/1 Instrument,Arial,sans-serif;box-shadow:none;display:grid;place-items:center;position:relative;padding:0;text-shadow:0 1px 2px #0002}
.info-marker:after{content:'';position:absolute;inset:-4px}.info-marker:hover{background:transparent;filter:none}.info-marker:focus-visible{outline-color:var(--orange)}
/* White perspective arrow inside a green circle, without a permanent label. */
.nav-marker{width:54px;height:54px;min-height:54px;padding:0;display:grid;place-items:center;position:relative;isolation:isolate;background:transparent;border:0;border-radius:50%;box-shadow:none;color:white;filter:drop-shadow(0 2px 2px #0004)}
.nav-marker:before{content:'';position:absolute;inset:0;border-radius:50%;background:var(--green);transform:perspective(120px) rotateX(42deg);pointer-events:none}
.nav-marker svg{position:relative;width:44px;height:36px;overflow:visible;transform:perspective(120px) rotateX(42deg) rotateZ(var(--arrow-turn,0deg));pointer-events:none}.nav-marker path{fill:none;stroke:currentColor;stroke-width:6;stroke-linecap:square;stroke-linejoin:miter}.nav-marker:hover{background:transparent;filter:drop-shadow(0 2px 3px #0006);transform:scale(1.07)}
.nav-marker .destination{position:absolute;bottom:calc(100% + 5px);left:50%;transform:translateX(-50%);white-space:nowrap;padding:5px 10px;background:rgba(39,41,43,.85);color:white;border-radius:4px;font-size:11px;opacity:0;pointer-events:none}
@media(hover:hover){.nav-marker:hover .destination{opacity:1}}.nav-marker:focus-visible .destination{opacity:1}
.calibration{top:142px}.sidebar{position:relative;z-index:10}.intro{padding-top:90px}.header a:focus-visible{outline-offset:6px}.stage[aria-busy=true] .nav-marker{pointer-events:none;opacity:.45}
@media(min-width:1600px){.header{left:calc((100% - 390px)/2)}}
@media(max-width:850px){
  .header{left:50%;top:8px;height:40px;padding:5px 4px 5px 12px;width:clamp(320px,36vw,480px)}.header img{width:85px;height:23px}.header .cta{min-height:30px;padding:5px 12px;font-size:14px}.header .cta span{display:inline-block}.header nav{gap:12px}
  .mobile-plan,#tour-shell:fullscreen .mobile-plan{top:86px;right:16px}.scene-heading{top:149px;left:22px}.scene-heading h1{font-size:28px}.sidebar{position:fixed;inset:60px 0 0}.sidebar.open{z-index:10}.sidebar-heading h2{font-size:28px}.header{z-index:11}
  .pending{padding-top:156px}.calibration{top:208px;z-index:5}.intro{padding-bottom:84px}.stage-footer{padding-bottom:max(12px,env(safe-area-inset-bottom))}.view-controls{bottom:calc(66px + env(safe-area-inset-bottom))}
  #tour-shell:fullscreen .sidebar{top:60px}
}
@media(max-width:360px){.header{width:calc(100vw - 20px);min-width:0}.stage-footer{font-size:9px;padding-inline:12px}}

/* Mobile toolbar remains outside the stage so the plan can safely make it inert. */
.detail-button span { color: var(--orange); }
.mobile-toolbar { display: none; }
#tour-shell { min-height: 0; }
@media(max-width:850px), (orientation:landscape) and (max-height:600px) {
  #tour-shell { display: block; height: 100dvh; min-height: 0; }
  .stage { height: 100%; }
  .header { left: 50%; z-index: 11; }
  .sidebar { display: none; position: fixed; inset: 60px 0 0; overflow: auto; }
  .sidebar.open { display: block; z-index: 12; }
  #close-sidebar { display: block; }
  .mobile-toolbar { display: flex; position: absolute; z-index: 6; bottom: calc(54px + env(safe-area-inset-bottom)); left: 50%; transform: translateX(-50%); }
  .mobile-toolbar .mobile-plan, #tour-shell:fullscreen .mobile-toolbar .mobile-plan { display: flex; position: static; min-height: 44px; padding: 10px 18px; border-radius: 24px; background: var(--bar-bg); color: white; white-space: nowrap; }
  .view-controls { bottom: calc(106px + env(safe-area-inset-bottom)); }
  .scene-heading { top: 76px; left: 22px; }
  .scene-heading h1 { font-size: 26px; }
  .pending { padding: 90px 28px 156px; gap: 10px; overflow: auto; }
  .pending h2 { font-size: 28px; }
  .pending-icon { display: none; }
}
@media(orientation:landscape) and (max-height:600px) {
  .scene-heading { top: 66px; }
  .scene-heading h1 { font-size: 22px; margin: 2px 0; }
  .scene-heading .tag { display: none; }
  .mobile-toolbar { left: calc(50% - 115px); bottom: 16px; }
  .view-controls { left: calc(50% + 115px); bottom: 16px; }
  .stage-footer { bottom: 68px; padding: 8px 22px; }
  .intro { padding: 64px 32px 20px; }
  .intro h1 { font-size: 32px; margin: 8px 0; }
  .intro .cta { margin-top: 12px; }
  .pending { padding: 66px 28px 80px; justify-content: flex-start; }
  .pending h2 { font-size: 25px; }
  .pending p { font-size: 13px; }
}
@media(max-width:850px), (orientation:landscape) and (max-height:600px) {
  .mobile-toolbar { left: 50%; bottom: calc(18px + env(safe-area-inset-bottom)); width: min(390px, calc(100% - 24px)); justify-content: center; align-items: center; background: var(--bar-bg); border: var(--bar-border); border-radius: 28px; backdrop-filter: blur(20px); }
  .mobile-toolbar .mobile-plan, #tour-shell:fullscreen .mobile-toolbar .mobile-plan { flex: 1; min-width: 0; justify-content: center; padding: 8px 10px; white-space: normal; text-align: center; border: 0; background: transparent; box-shadow: none; backdrop-filter: none; }
  .mobile-toolbar .view-controls { position: static; transform: none; flex-shrink: 0; background: transparent; border: 0; box-shadow: none; backdrop-filter: none; }
  .mobile-toolbar .view-controls button { width: 40px; height: 44px; }
  .mobile-toolbar .view-controls > span { margin-inline: 2px; }
  .stage-footer { bottom: calc(76px + env(safe-area-inset-bottom)); }
}

#dialog:not(.plan-dialog) #dialog-body img, #dialog:not(.plan-dialog) #dialog-body video { display:block; width:100%; height:auto; max-height:var(--media-height,35dvh); object-fit:contain; margin-top:14px; }

/* Instructions sit below the mobile menu with space for device safe areas. */
@media(max-width:850px), (orientation:landscape) and (max-height:600px){
 .stage-footer{bottom:0;min-height:52px;padding:8px 16px calc(8px + env(safe-area-inset-bottom));gap:12px}
 .mobile-toolbar{bottom:calc(64px + env(safe-area-inset-bottom))}
}
