/* launch19.css | part 19XX: new title page and the pilot gate. Loaded after launch.css, overrides it. */
body{background:#04050c url("bg_launch.jpg") center/cover no-repeat fixed!important}
body::after{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;background:radial-gradient(ellipse at 50% 45%,rgba(4,5,14,0) 30%,rgba(2,3,10,.65) 100%),linear-gradient(180deg,rgba(2,3,10,.5),rgba(2,3,10,0) 30%,rgba(2,3,10,0) 70%,rgba(2,3,10,.6))}
.hidden{display:none!important}
.lx-rings{position:fixed;left:50%;top:40%;width:0;height:0;z-index:1;pointer-events:none}
.lx-rings i{position:absolute;border-radius:50%;border:1px solid rgba(255,213,106,.28);left:0;top:0;transform:translate(-50%,-50%);animation:lxSpin 60s linear infinite}
.lx-rings i:nth-child(1){width:min(78vh,70vw);height:min(78vh,70vw);border-style:dashed}
.lx-rings i:nth-child(2){width:min(98vh,88vw);height:min(98vh,88vw);border-color:rgba(125,249,255,.18);animation-duration:90s;animation-direction:reverse}
.lx-rings i:nth-child(3){width:min(124vh,106vw);height:min(124vh,106vw);border-color:rgba(255,213,106,.1);border-style:dotted;animation-duration:140s}
@keyframes lxSpin{to{transform:translate(-50%,-50%) rotate(360deg)}}
.lx{position:relative;z-index:3;display:flex;flex-direction:column;align-items:center;gap:0;margin-top:-6vh}
.lx-eyebrow{display:flex;align-items:center;gap:1.2em;font-size:clamp(.65rem,1.5vh,.85rem);letter-spacing:.7em;color:#7df9ff;opacity:.85;margin-bottom:2.2vh}
.lx-eyebrow span{display:block;width:clamp(30px,8vw,110px);height:1px;background:linear-gradient(90deg,transparent,#7df9ff)}.lx-eyebrow span:last-child{transform:scaleX(-1)}
.lx-title{display:flex;flex-direction:column;align-items:center;line-height:.92;margin:0;animation:none!important}
.lx-title b{display:block;font-weight:800;font-size:clamp(2.6rem,10.5vh,6.2rem);letter-spacing:.2em;padding-left:.2em;text-transform:uppercase;color:transparent;background:linear-gradient(180deg,#fff7d6 0%,#ffd56a 38%,#e08a1e 62%,#ffd56a 100%);-webkit-background-clip:text;background-clip:text;filter:drop-shadow(0 0 22px rgba(255,190,60,.45)) drop-shadow(0 4px 0 rgba(60,30,0,.6));position:relative;overflow:hidden}
.lx-title b:nth-child(2){font-size:clamp(2.1rem,8.7vh,5.2rem);letter-spacing:.27em;padding-left:.27em}
.lx-title b::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.85) 50%,transparent 60%);transform:translateX(-120%);animation:lxSweep 5s ease-in-out infinite;mix-blend-mode:overlay}
@keyframes lxSweep{0%,55%{transform:translateX(-120%)}85%,100%{transform:translateX(120%)}}
.lx-tag{margin-top:2.4vh;font-size:clamp(.7rem,1.9vh,1rem);letter-spacing:.55em;color:#cfd8ea;text-shadow:0 0 12px rgba(0,0,0,.8)}
.lx-prompt{all:unset;display:block;margin-top:7vh;box-sizing:border-box;padding:.9em 2.4em;font-family:'Mozilla Headline',Arial,sans-serif;font-weight:700;font-size:clamp(.8rem,2vh,1.05rem);letter-spacing:.45em;color:#0a0d12;background:linear-gradient(180deg,#ffe08a,#ffc94a);clip-path:polygon(14px 0,100% 0,calc(100% - 14px) 100%,0 100%);animation:lxPulse 1.8s ease-in-out infinite}
.lx-prompt .prompt-text{all:unset}
@keyframes lxPulse{0%,100%{filter:drop-shadow(0 0 6px rgba(255,200,80,.5));transform:scale(1)}50%{filter:drop-shadow(0 0 20px rgba(255,200,80,.95));transform:scale(1.03)}}
.selector-menu{position:fixed!important;left:0;right:0;bottom:3.2vh;flex-direction:row!important;justify-content:center;gap:2.2em!important;margin:0!important;width:100%!important;z-index:5}
.selector-menu .menu-item{font-size:clamp(.65rem,1.6vh,.85rem)!important;letter-spacing:.35em!important;color:#aab4c6!important;background:none!important;border:0!important;padding:.4em .2em!important}
.selector-menu .menu-item:hover{color:#ffd56a!important}
.lx-pilot{position:fixed;top:2.6vh;right:2.4vw;z-index:5;display:flex;align-items:center;gap:.8em;padding:.5em .9em .5em .5em;background:rgba(6,8,18,.7);border:1px solid rgba(255,213,106,.3);font-size:clamp(.62rem,1.5vh,.8rem);letter-spacing:.18em;color:#cfd8ea}
.lx-pilot canvas{width:2.6em;height:2.6em;display:block;border:1px solid rgba(255,255,255,.2)}.lx-pilot small{display:block;color:#8793a8;font-size:.8em;letter-spacing:.25em}.lx-pilot b{color:#ffd56a}
/* gate */
.lx-gate{position:fixed;inset:0;z-index:2000;display:flex;align-items:center;justify-content:center;background:rgba(2,3,10,.62);backdrop-filter:blur(6px);animation:lxIn .35s ease}
@keyframes lxIn{from{opacity:0}to{opacity:1}}
.lx-panel{box-sizing:border-box;width:min(580px,94vw);max-height:94vh;overflow:hidden;padding:clamp(14px,2.6vh,26px) clamp(16px,3vh,30px);text-align:left;background:linear-gradient(160deg,rgba(16,20,40,.96),rgba(6,8,18,.95));border:1px solid rgba(255,213,106,.35);border-top:3px solid #ffd56a;box-shadow:0 20px 80px rgba(0,0,0,.7);font-size:clamp(11px,1.9vh,15px)}
.lx-panel h2{margin:0;font-size:1.5em;letter-spacing:.3em;color:#ffd56a}.lx-panel .sub{margin:.35em 0 1em;font-size:.78em;letter-spacing:.08em;color:#9aa6ba;line-height:1.5}
.lx-panel .step{font-size:.62em;letter-spacing:.4em;color:#7df9ff;margin-bottom:.5em}
.lx-g{display:grid;grid-template-columns:1fr 1fr;gap:.7em .9em}
.lx-g label{display:block;font-size:.62em;letter-spacing:.25em;color:#8f9bb0;margin-bottom:.3em}
.lx-g input,.lx-one input{width:100%;box-sizing:border-box;padding:.6em .7em;font:inherit;font-size:.9em;color:#fff;background:rgba(0,0,0,.45);border:1px solid rgba(255,255,255,.2);outline:0;user-select:text;-webkit-user-select:text}
.lx-g input:focus,.lx-one input:focus{border-color:#ffd56a;box-shadow:0 0 0 2px rgba(255,213,106,.2)}.lx-g input.bad,.lx-one input.bad{border-color:#ff6a6a}
.lx-em{margin-top:.9em}.lx-em>label{display:block;font-size:.62em;letter-spacing:.25em;color:#8f9bb0;margin-bottom:.4em}
.lx-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:.35em}.lx-grid button{padding:0;border:2px solid transparent;background:none;cursor:pointer;aspect-ratio:1}.lx-grid button.on{border-color:#ffd56a;box-shadow:0 0 10px rgba(255,213,106,.6)}.lx-grid canvas{display:block;width:100%;height:100%}
.lx-row{display:flex;align-items:center;justify-content:space-between;gap:1em;margin-top:.9em;font-size:.72em;color:#9aa6ba;letter-spacing:.1em}.lx-row label{display:flex;gap:.5em;align-items:center;cursor:pointer}
.lx-err{min-height:1.4em;margin-top:.7em;font-size:.74em;letter-spacing:.06em;color:#ff8a8a}.lx-err.ok{color:#7dff9b}
.lx-btns{display:flex;gap:.7em;margin-top:.6em;align-items:stretch}.lx-btn{flex:1;font:inherit;font-weight:800;font-size:.78em;letter-spacing:.22em;padding:1em .8em;cursor:pointer;color:#0a0d12;background:linear-gradient(180deg,#ffe08a,#ffc94a);border:0}
.lx-btn.s{flex:0 1 auto;color:#cfd8ea;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.2)}.lx-btn:disabled{opacity:.5;cursor:wait}.lx-btn:hover:not(:disabled){filter:brightness(1.1)}
.lx-link{background:none;border:0;color:#7df9ff;font:inherit;font-size:.72em;letter-spacing:.14em;cursor:pointer;padding:.3em 0}.lx-link:hover{color:#fff}
.lx-me{display:flex;align-items:center;gap:1em;margin:.6em 0 1em}.lx-me canvas{width:4.4em;height:4.4em;border:2px solid #ffd56a}.lx-me b{font-size:1.2em;letter-spacing:.14em;color:#fff}.lx-me small{display:block;color:#8f9bb0;letter-spacing:.2em;font-size:.65em;margin-top:.3em}
.lx-one{margin:.2em 0}.lx-one label{display:block;font-size:.62em;letter-spacing:.25em;color:#8f9bb0;margin-bottom:.3em}
.lx-kit{display:grid;gap:.6em;margin:.4em 0 .9em}.lx-kit div{display:flex;align-items:center;gap:1em;padding:.8em 1em;background:rgba(255,255,255,.05);border-left:3px solid var(--c,#ffd56a);opacity:0;transform:translateX(-14px);transition:all .45s}.lx-kit div.on{opacity:1;transform:none}
.lx-kit b{font-size:1.05em;letter-spacing:.12em;color:#fff}.lx-kit small{display:block;font-size:.66em;letter-spacing:.14em;color:#9aa6ba;margin-top:.2em}.lx-kit i{font-style:normal;font-size:1.5em;color:var(--c,#ffd56a);width:1.4em;text-align:center}
.lx-train{display:grid;gap:.45em;margin:.3em 0 .8em;font-size:.82em;color:#cfd8ea}.lx-train span{display:flex;gap:.7em;align-items:center}.lx-train span::before{content:"";width:.55em;height:.55em;background:#7dff9b;border-radius:50%;flex:none}
/* warp readout */
.warping .lx,.warping .lx-pilot,.warping .selector-menu,.warping .lx-rings{transition:transform 3.4s cubic-bezier(.6,0,1,1),opacity 2.6s ease-in,filter 3s;transform:scale(1.6);opacity:0;filter:blur(4px)}
.warping .lx-gate{display:none}
#warpCanvas.warp-active{opacity:1}
/* patch 2.1: connection chooser */
.lx-modes{display:grid;grid-template-columns:1fr 1fr;gap:.7em;margin:.4em 0 .6em}.lx-mode{font:inherit;cursor:pointer;text-align:left;display:grid;gap:.4em;padding:.9em 1em;color:#cfd8ea;background:rgba(255,255,255,.05);border:2px solid rgba(255,255,255,.14)}
.lx-mode b{font-size:1.15em;letter-spacing:.2em;color:#fff}.lx-mode span{font-size:.68em;letter-spacing:.06em;line-height:1.4;color:#9aa6ba}.lx-mode.on{border-color:#7dff9b;background:rgba(125,255,155,.09)}.lx-mode[data-m=offline].on{border-color:#ffd56a;background:rgba(255,213,106,.08)}
.lx-st{font-size:.66em;letter-spacing:.18em;font-weight:800;color:#ff9a45;margin:.2em 0 .5em}.lx-st.ok{color:#7dff9b}
