*{box-sizing:border-box}html,body{margin:0;height:100%;background:#080e13;color:#f4ebd7;font:15px/1.5 system-ui,sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer;background:#152329dc;border:1px solid #b9b7a750;border-radius:5px;padding:10px 16px}button:hover{background:#304044}button:focus-visible,a:focus-visible{outline:3px solid #f5ce80;outline-offset:5px}a{color:inherit}button[hidden],[hidden]{display:none!important}#lab{height:100%;overflow:hidden;position:relative;isolation:isolate}#viewport{position:absolute;inset:0;overflow:hidden}#stage{position:absolute;width:1672px;height:941px;transform-origin:0 0}.plate,.foreground{position:absolute;width:100%;height:100%;pointer-events:none}.foreground{z-index:4;clip-path:polygon(0 52%,20% 52%,20% 59%,31% 59%,31% 51%,46% 51%,46% 65%,100% 65%,100% 100%,0 100%)}#projection{position:absolute;left:34.8%;top:24%;width:27.2%;height:16.5%;z-index:1;overflow:hidden;clip-path:ellipse(50% 50% at 50% 50%)}#projection canvas{width:100%;height:100%;display:block}#actor{position:absolute;left:11.5%;top:17%;width:33%;height:39.1%;z-index:3;transform-origin:54% 94%;pointer-events:none;animation:breathe 4.8s ease-in-out infinite}.pose{position:absolute;inset:0;background-image:url('assets/host-poses.png');background-size:200% 200%;background-repeat:no-repeat;transition:opacity .23s ease}#pose-a{opacity:1}#pose-b{opacity:0}.hotspot{position:absolute;z-index:6;transform:translate(-50%,-50%);padding:16px;background:transparent;border:0;opacity:0;transition:opacity .4s;white-space:nowrap}.entered .hotspot{opacity:1}.focused .hotspot{visibility:hidden;pointer-events:none}.hotspot i{display:block;width:12px;height:12px;margin:auto;border:1px solid #ffe0a4;border-radius:50%;box-shadow:0 0 0 5px #15232965,0 0 18px #ffc75b}.hotspot span{display:block;padding:5px 10px;background:#101c24e8;margin-top:10px;font-size:14px;opacity:0;transform:translateY(4px);transition:.2s}.hotspot:hover,.hotspot:focus-visible{background:transparent}.hotspot:hover span,.hotspot:focus-visible span{opacity:1;transform:none}header{position:absolute;inset:0 0 auto;z-index:10;display:flex;justify-content:space-between;align-items:center;padding:16px 26px;background:linear-gradient(#070e17e8,transparent)}header>a{text-decoration:none;font-family:Georgia,serif;font-size:19px;text-shadow:0 2px 4px #000}header small{display:block;font:10px system-ui;letter-spacing:.16em;text-transform:uppercase;color:#d2c6ae}header>div{display:flex;gap:8px}header button{font-size:12px;background:#0e1b23b8;padding:8px 12px}#place-menu{position:absolute;top:72px;right:26px;z-index:15;display:grid;gap:5px;padding:12px;background:#0c1924f5;border:1px solid #bba57877;border-radius:8px}#place-menu button{text-align:left}#arrival{position:absolute;z-index:8;left:7%;bottom:12%;max-width:630px;padding:32px;background:linear-gradient(110deg,#07111af2,#07111aaf);border-left:2px solid #d7b574;box-shadow:0 20px 70px #0006}h1,h2{font-family:Georgia,serif;font-weight:400;line-height:1.12}h1{font-size:clamp(36px,5vw,67px);margin:14px 0}h2{font-size:28px;margin:8px 0 17px}.eyebrow{font-size:10px;letter-spacing:.17em;text-transform:uppercase;color:#e6c58b;margin:0 0 10px}.small{font-size:11px;color:#c0c5c5;margin-bottom:0}.primary{background:#ddbd80;color:#172027;border-color:#ddbd80}.primary:hover{background:#f5d99f}.primary span{margin-left:30px}#conversation,#instrument,#observation{position:absolute;z-index:9;bottom:80px;left:50%;transform:translateX(-50%);width:min(720px,calc(100% - 40px));background:#091720ed;border:1px solid #c2ac7777;border-radius:8px;padding:22px 28px;box-shadow:0 16px 65px #0009;backdrop-filter:blur(12px)}#line{font:clamp(18px,2vw,25px)/1.4 Georgia,serif;margin:0 0 17px;min-height:2.8em}#responses{display:flex;gap:9px;flex-wrap:wrap}#responses button{font-size:13px}#instrument{width:min(620px,calc(100% - 40px));padding:18px 24px}.blueprints{display:flex;gap:7px}.blueprints button{flex:1;font-size:13px}.blueprints button[aria-pressed=true]{border-color:#e7c588;background:#34474b}.instrument-bottom{display:flex;align-items:center;gap:15px;justify-content:space-between}.instrument-bottom p{font-size:12px;color:#d9dedb;max-width:340px}.instrument-bottom button{white-space:nowrap}#observation p:not(.eyebrow){color:#d1dadc}#observation a{font-size:13px;color:#e7c588}footer{position:absolute;bottom:0;left:0;right:0;z-index:12;padding:14px 26px;min-height:65px;display:flex;align-items:center;gap:20px;background:linear-gradient(transparent,#07111af5)}footer button{font-size:12px}footer span{font-size:11px;letter-spacing:.06em;text-shadow:0 1px 5px #000}#replay{margin-left:auto}kbd{font:10px system-ui;opacity:.6;margin-left:15px}.still #actor{animation:none}.still .pose{transition:none}@keyframes breathe{50%{transform:translateY(-1.5px) rotate(.15deg)}}@media(max-width:600px){header{padding:12px}header>a{font-size:15px}header small{font-size:8px}header button{padding:8px;font-size:11px}#arrival{left:20px;right:20px;bottom:90px;padding:22px}footer{padding:12px;gap:10px}#orientation{display:none}#conversation,#instrument,#observation{bottom:74px;padding:18px;max-height:53vh;overflow:auto}#line{font-size:19px}.blueprints{gap:4px}.blueprints button{padding:8px 5px}.instrument-bottom{align-items:flex-start}#responses button{padding:9px}.hotspot span{font-size:12px}.eyebrow{font-size:9px}}@media(prefers-reduced-motion:reduce){#actor{animation:none}.pose{transition:none}}
body:not(.entered) .hotspot{visibility:hidden;pointer-events:none}

/* Dialogue text does not shield an otherwise available region from navigation. */
#conversation{pointer-events:none}#conversation button{pointer-events:auto}

/* Place the cropped host behind the real assembly silhouette. */
#actor{left:8.5%;top:26%}
