*{box-sizing:border-box}html,body{margin:0;background:#101718;color:#fff;font-family:Arial,Helvetica,sans-serif;height:100%;overflow:hidden}main{height:100%;display:grid;place-items:center}#stage{position:relative;width:min(100vw,177.7778vh);height:min(56.25vw,100vh);overflow:hidden;background:#172126}iframe,video,#bridge{position:absolute;inset:0;width:100%;height:100%;border:0;object-fit:fill}iframe{z-index:0;pointer-events:none}#bridge{z-index:1;opacity:0;pointer-events:none}#workflow{z-index:2;opacity:0;pointer-events:none}#drone{z-index:3;pointer-events:none}#welcome{position:absolute;inset:0;z-index:5;background:linear-gradient(90deg,rgba(5,15,19,.88),rgba(5,15,19,.12));padding:4.3%;transition:opacity .7s}.wordmark{font-weight:800;letter-spacing:.12em;font-size:clamp(14px,2.1vw,27px)}.wordmark span{display:block;font-size:9px;font-weight:400;letter-spacing:.2em;margin-top:9px}.intro{position:absolute;left:4.3%;bottom:20%}.intro>p:first-child{font-size:10px;letter-spacing:.24em;color:#efbd69}h1{font-size:clamp(22px,4.7vw,60px);line-height:1.06;font-weight:400;letter-spacing:-.04em;margin:18px 0 25px}button{font:inherit;cursor:pointer;border:1px solid #d5ae70;background:#efbd69;color:#122127;padding:13px 24px;border-radius:2px;font-size:13px}button:disabled{opacity:.55;cursor:wait}button:focus-visible{outline:3px solid white;outline-offset:4px}#status{font-size:11px;max-width:440px;color:#d5dee0;line-height:1.5;min-height:16px}#preview{background:transparent;color:#fff;padding:9px 14px}.foot{position:absolute;bottom:5%;font-size:9px;letter-spacing:.12em;display:flex;gap:14px}.foot i{color:#efbd69;font-style:normal}#replay{position:absolute;z-index:6;right:20px;top:20px;background:#101b21cc;color:white;border-color:#ffffff55}#endnote{position:absolute;z-index:4;bottom:4%;left:4%;background:#102026e8;padding:16px 24px}#endnote p{margin-top:0} [hidden]{display:none!important}@media(prefers-reduced-motion:reduce){#welcome{transition:none}}@media(max-width:600px){.wordmark span,.foot{display:none}.intro{bottom:8%}h1{margin:8px 0 14px}button{padding:8px 12px;font-size:11px}#status{font-size:9px;max-width:260px}.intro>p:first-child{font-size:8px}}

#intro{z-index:3;pointer-events:none;transition:opacity 1.25s ease}#intro.reveal{opacity:0}#tour.interactive{pointer-events:auto}
/* Keep the live tour concealed until the final video frame has held. */
#tour{opacity:0}
#tour.visible{opacity:1}
#intro{transition:opacity 2.4s cubic-bezier(.4,0,.2,1)}

/* End on the unchanged workflow frame; no added transition effect. */
#intro{transition:none}
