/* Compact overlay, with a pointer-transparent spotlight so models stay live. */
#interactiveGuide,#guideWelcome,#guideMenu{color:#e4edf5;background:#142535;border:1px solid #648095;border-radius:14px;box-shadow:0 10px 34px #0008;font:14px/1.45 system-ui,sans-serif;box-sizing:border-box}
#interactiveGuide,#guideWelcome{position:fixed;z-index:1800;width:min(350px,calc(100vw - 20px));padding:14px;max-height:calc(100dvh - 20px);overflow:auto}
#interactiveGuide[hidden],#guideWelcome[hidden],#guideHighlight[hidden]{display:none}
#interactiveGuide h2,#guideWelcome h2{font-size:18px;line-height:1.25;margin:9px 0}
#interactiveGuide p,#guideWelcome p{margin:9px 0}
.guide-heading,.guide-navigation{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
#interactiveGuide button,#guideWelcome button,#guideMenu button{min-height:40px;white-space:normal;font:inherit;color:#eff8ff;border:1px solid #607c91;background:#203e53;border-radius:8px;padding:7px 11px;cursor:pointer}
#interactiveGuide button:disabled{opacity:.45;cursor:default}
#interactiveGuide button:focus-visible,#guideWelcome button:focus-visible,#guideMenu button:focus-visible{outline:3px solid #ffd17c;outline-offset:2px}
#guideExit{margin-left:auto;font-size:12px!important}
#guideProgress{font-size:12px;color:#a9cede}
#guideStatus{font-size:12px;color:#b9d4e3;min-height:1.4em}
#guideNext,#guideWelcomeStart{background:#235a70!important;border-color:#87d1db!important}
#guideAction,#guideChoose{width:100%;margin:3px 0 10px}
#guideHighlight{position:fixed;z-index:1799;pointer-events:none;border:2px solid #ffd17c;border-radius:9px;box-shadow:0 0 0 9999px #020b141f;box-sizing:border-box;transition:left .15s,top .15s,width .15s,height .15s}
#guideWelcome{right:12px;bottom:12px;z-index:1700}
#guideWelcome>div{display:flex;gap:8px;flex-wrap:wrap}
#guideMenu{width:min(470px,calc(100vw - 24px));max-height:calc(100dvh - 24px);padding:18px}
#guideMenu h2{font-size:19px;margin:0}
#guideMenu::backdrop{background:#0008}
.guide-choices{display:grid;gap:8px}
.open-interactive-guide{margin:9px 0}
@media(max-height:480px){#interactiveGuide{width:min(320px,44vw);padding:9px;font-size:12px}#interactiveGuide h2{font-size:15px}#interactiveGuide p{margin:5px 0}#interactiveGuide button{min-height:34px;padding:5px 8px}#guideWelcome{width:min(440px,calc(100vw - 24px));font-size:12px}}
@media(prefers-reduced-motion:reduce){#guideHighlight{transition:none}}

/* Mobile-only: translucent surface with an explicit drag handle. Text and
   controls stay opaque; body scrolling remains independent of handle dragging. */
#interactiveGuide #guideMove{display:none}
#interactiveGuide.guide-mobile{background:rgba(20,37,53,.76)}
#interactiveGuide.guide-mobile #guideMove{display:block;width:100%;min-height:44px;margin:0 0 7px;padding:5px 9px;background:#14253570;border-style:dashed;color:#d9eef7;touch-action:none;user-select:none;-webkit-user-select:none;cursor:grab;font-size:12px}
#interactiveGuide.guide-dragging #guideMove{cursor:grabbing;border-color:#ffd17c}
#interactiveGuide.guide-mobile #guideMove{position:sticky;top:0;z-index:2}
#interactiveGuide.guide-mobile .guide-navigation{position:sticky;bottom:0;background:#142535d9;padding:5px 0}
@media(orientation:portrait){#interactiveGuide.guide-mobile{max-height:calc(48dvh - 10px)}}
