*{box-sizing:border-box}body{margin:0;background:#111;min-height:calc(var(--viewport-height, 100vh) * 100 / 100);display:flex;align-items:center;justify-content:center;flex-direction:column;color:#1c1c1c;font-family:Arial,Helvetica,sans-serif}button{font:inherit;color:inherit;border:0;cursor:pointer;touch-action:manipulation}button:focus-visible{outline:3px solid #54baff;outline-offset:2px}main{width:min(100vw,calc(var(--viewport-height, 100vh) * 170 / 100));aspect-ratio:1.818;background:#000;border-radius:3.8vw;padding:2.4% 2.4% 2.2%;display:flex;flex-direction:column}.screen{position:relative;flex:1;min-height:0;overflow:hidden;border-radius:calc(var(--ui-unit, 1vw) * 1.3);background:#182632}.display{position:absolute;inset:0;overflow:hidden}.image{position:absolute;inset:0;background-color:#547185;transition:filter .4s,transform 1s}.display:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(0deg,#18202c99,transparent 40%)}.rail{position:absolute;left:1.4%;top:3%;bottom:3%;width:5.5%;border-radius:calc(var(--ui-unit, 1vw) * 4);background:#393b3cb3;color:white;display:flex;align-items:center;flex-direction:column;gap:calc(var(--ui-unit, 1vw) * 2);padding:calc(var(--ui-unit, 1vw) * 1) calc(var(--ui-unit, 1vw) * .5);z-index:5}.avatar{border-radius:50%;background:#777c7b;width:calc(var(--ui-unit, 1vw) * 3.8);height:calc(var(--ui-unit, 1vw) * 3.8);display:grid;place-items:center;font-size:calc(var(--ui-unit, 1vw) * 1.15);font-weight:600}#clock{font-size:calc(var(--ui-unit, 1vw) * 1.35);font-weight:600;margin-top:calc(var(--ui-unit, 1vw) * -1.3)}.rail>small{font-size:calc(var(--ui-unit, 1vw) * .95);margin-top:calc(var(--ui-unit, 1vw) * -1.7)}.rail button{background:none;color:white;font-size:calc(var(--ui-unit, 1vw) * 2.3);min-height:calc(var(--ui-unit, 1vw) * 3);width:100%;padding:0}.rail .diamond{font-size:calc(var(--ui-unit, 1vw) * 3);line-height:1}.signal{font-size:calc(var(--ui-unit, 1vw) * 1.3);line-height:1.4;margin-top:calc(var(--ui-unit, 1vw) * 1)}.signal small{display:block;font-size:calc(var(--ui-unit, 1vw) * .7)}.rail .railpower{margin-top:auto;border-radius:50%;background:#fff;color:#222;width:calc(var(--ui-unit, 1vw) * 3.7);height:calc(var(--ui-unit, 1vw) * 3.7);display:grid;place-items:center}.railpower small{display:none}.card{position:absolute;left:7.9%;top:3%;bottom:3%;width:22%;background:#fff;border-radius:calc(var(--ui-unit, 1vw) * 1.4);box-shadow:0 2px 6px #0004;padding:calc(var(--ui-unit, 1vw) * 1.05);display:flex;flex-direction:column;z-index:5}nav{display:flex;align-items:center;gap:calc(var(--ui-unit, 1vw) * .55);height:calc(var(--ui-unit, 1vw) * 3.2);margin-bottom:calc(var(--ui-unit, 1vw) * .65);flex-shrink:0}nav button{background:none;color:#969696;font-size:calc(var(--ui-unit, 1vw) * 1.1);padding:calc(var(--ui-unit, 1vw) * .6) 0;white-space:nowrap;flex:1}nav .selected{color:#171717;font-weight:600}.controls{display:grid;grid-template-columns:1fr 1fr;gap:calc(var(--ui-unit, 1vw) * .7)}.controls button{background:#e5e5e5;border-radius:calc(var(--ui-unit, 1vw) * .9);min-height:calc(var(--ui-unit, 1vw) * 5.1);padding:calc(var(--ui-unit, 1vw) * .65) calc(var(--ui-unit, 1vw) * .7);text-align:left;display:flex;flex-direction:column;gap:calc(var(--ui-unit, 1vw) * .25);position:relative}.controls button>span{font-size:calc(var(--ui-unit, 1vw) * 2.1);line-height:1}.controls strong{font-weight:400;font-size:calc(var(--ui-unit, 1vw) * 1.03)}.controls small{font-size:calc(var(--ui-unit, 1vw) * .65);color:#696969;position:absolute;right:calc(var(--ui-unit, 1vw) * .6);top:calc(var(--ui-unit, 1vw) * .8)}.controls .primary{grid-column:span 2;background:#282828;color:#fff;min-height:calc(var(--ui-unit, 1vw) * 5.2)}.primary small{color:#aaa}.controls button.active{box-shadow:inset 0 -3px #ffac00}.controls .primary.active{background:#282828}.settings{margin-top:auto;display:grid;grid-template-columns:35% 1fr;gap:calc(var(--ui-unit, 1vw) * .7);height:calc(var(--ui-unit, 1vw) * 14.2);padding-top:calc(var(--ui-unit, 1vw) * 1)}.height{background:#e5e5e5;border-radius:calc(var(--ui-unit, 1vw) * .9);padding:calc(var(--ui-unit, 1vw) * 1) calc(var(--ui-unit, 1vw) * .5);display:flex;flex-direction:column;align-items:center;justify-content:space-between;text-align:center}.height>span{font-size:calc(var(--ui-unit, 1vw) * 2);line-height:.7}.height strong{font-size:calc(var(--ui-unit, 1vw) * 1.02);font-weight:400}.height small{font-size:calc(var(--ui-unit, 1vw) * .7);color:#555}.bars{display:grid;gap:calc(var(--ui-unit, 1vw) * .25)}.bars i{display:block;width:calc(var(--ui-unit, 1vw) * 1.6);height:calc(var(--ui-unit, 1vw) * .45);border-radius:5px;background:#969895}.bars i:nth-child(2){background:#ffac00}.height .bars i{width:calc(var(--ui-unit, 1vw) * 3)}.setting-stack{display:grid;gap:calc(var(--ui-unit, 1vw) * .65)}.setting{background:#e5e5e5;border-radius:calc(var(--ui-unit, 1vw) * .9);display:flex;align-items:center;justify-content:space-between;padding:calc(var(--ui-unit, 1vw) * .7);font-size:calc(var(--ui-unit, 1vw) * 1.03);line-height:1.35}.setting small{font-size:calc(var(--ui-unit, 1vw) * .95);color:#555}.display-top{position:absolute;left:33%;right:2%;top:4%;z-index:3;display:flex;justify-content:space-between;color:#fff;font-size:calc(var(--ui-unit, 1vw) * .85);letter-spacing:calc(var(--ui-unit, 1vw) * .08)}.display-top button{background:#ffffffdf;border-radius:calc(var(--ui-unit, 1vw) * .6);padding:calc(var(--ui-unit, 1vw) * .65) calc(var(--ui-unit, 1vw) * 1);color:#222;font-size:calc(var(--ui-unit, 1vw) * 1)}.status{position:absolute;left:33%;bottom:12%;z-index:3;display:flex;align-items:center;gap:calc(var(--ui-unit, 1vw) * .6);color:#fff;font-size:calc(var(--ui-unit, 1vw) * 1.15);text-shadow:0 1px 3px #000}.indicator{width:calc(var(--ui-unit, 1vw) * .5);height:calc(var(--ui-unit, 1vw) * .5);background:#b5e9ff;border-radius:50%}.telemetry{position:absolute;left:33%;bottom:3%;display:flex;gap:calc(var(--ui-unit, 1vw) * 3);z-index:3;color:#fff}.telemetry span{display:block;font-size:calc(var(--ui-unit, 1vw) * 1.8)}.telemetry small{font-size:calc(var(--ui-unit, 1vw) * .65);letter-spacing:calc(var(--ui-unit, 1vw) * .1)}footer{height:calc(var(--ui-unit, 1vw) * 6.4);display:flex;align-items:center;gap:calc(var(--ui-unit, 1vw) * 1.8);color:#eee;padding:calc(var(--ui-unit, 1vw) * .3) calc(var(--ui-unit, 1vw) * .6) 0;flex-shrink:0}.climate{border-radius:calc(var(--ui-unit, 1vw) * 4);background:#222;display:flex;align-items:center;justify-content:space-between;width:calc(var(--ui-unit, 1vw) * 14);padding:calc(var(--ui-unit, 1vw) * .8) calc(var(--ui-unit, 1vw) * 1.2);font-size:calc(var(--ui-unit, 1vw) * 1.7)}.climate small{display:block;text-align:center;font-size:calc(var(--ui-unit, 1vw) * .7)}.cool{color:#358eda;font-size:calc(var(--ui-unit, 1vw) * 2.2)}.warm{color:#e32c34;font-size:calc(var(--ui-unit, 1vw) * 2.2)}.dock-icon{font-size:calc(var(--ui-unit, 1vw) * 2.2);position:relative}.dock-icon.active:after{content:'';position:absolute;bottom:calc(var(--ui-unit, 1vw) * -.8);left:0;right:0;height:calc(var(--ui-unit, 1vw) * .25);background:#ffad00;border-radius:4px}.dock-spacer{flex:1}#sound{background:transparent;color:white;font-size:calc(var(--ui-unit, 1vw) * .8);padding:calc(var(--ui-unit, 1vw) * 1) 0}#shield{position:absolute;inset:15% 3% 16% 33%;border-radius:50%;opacity:0;border:2px solid #a6e8ff;box-shadow:inset 0 0 70px #60cfff70,0 0 45px #60cfff60;transition:opacity .5s;z-index:2;pointer-events:none}#flash{position:absolute;inset:0;pointer-events:none;z-index:4}#stars{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:2}.boost .image{animation:rumble .12s infinite;filter:saturate(1.25) brightness(1.12)}.landed .image{transform:translateY(calc(var(--ui-unit, 1vw) * 3)) scale(.94)}.lights-off .image{filter:brightness(.65)}@keyframes rumble{50%{transform:translate(1px,-1px)}}.rotate{display:none;color:#bbb;text-align:center;font-size:16px;padding:20px}@media(orientation:portrait) and (max-width:700px){.rotate{display:block}main{border-radius:20px}}
.shield-active #shield{background:radial-gradient(ellipse,transparent 48%,#70cbff13 72%,#8bdcff30 96%);animation:shield-breathe 3s ease-in-out infinite}.launching .image{animation:launch 1.9s ease-in-out}.warping .image{animation:jump 5.3s ease-in-out forwards}.recoil .image{animation:recoil .16s ease-out}@keyframes shield-breathe{50%{box-shadow:inset 0 0 90px #60cfff55,0 0 55px #60cfff70}}@keyframes launch{0%{filter:brightness(1)}30%{filter:brightness(1.3) saturate(1.4)}100%{filter:brightness(1.12)}}@keyframes jump{0%{filter:brightness(1)}22%{filter:brightness(1.55) saturate(1.3)}30%,85%{filter:brightness(.45) blur(1px)}90%{filter:brightness(1.75)}100%{filter:brightness(1.12)}}@keyframes recoil{50%{filter:brightness(1.2);transform:translateY(2px)}}
.image{background-color:#a8d0ed;transform:none!important;filter:none!important;animation:none!important;transition:none!important}.display:after{background:none}.display-top{color:#243444;pointer-events:none;font-size:calc(var(--ui-unit, 1vw) * .9)}.status{color:#fff;text-shadow:0 1px 3px #000;background:#1a2936b3;border-radius:calc(var(--ui-unit, 1vw) * .6);padding:calc(var(--ui-unit, 1vw) * .6) calc(var(--ui-unit, 1vw) * .8);bottom:3%;left:33%;right:3%;font-size:calc(var(--ui-unit, 1vw) * 1.05)}.telemetry{display:none}.controls button:active,.controls button.pressed,.rail button:active,.rail button.pressed,.height:active,.height.pressed{box-shadow:inset 0 3px 8px #0004!important;transform:translateY(1px);background:#c7c9cc}.controls .primary:active,.controls .primary.pressed{background:#141516;color:#fff}.controls button.active{box-shadow:inset 0 -3px #ffac00}.height.active .bars i:nth-child(1){background:#ffac00}.height.active .bars i:nth-child(2){background:#969895}
.cloud-layer{position:absolute;left:30%;right:0;top:0;height:17.5%;overflow:hidden;pointer-events:none;z-index:1}.drifting-cloud{position:absolute;left:0;width:30%;height:auto;animation:cloud-drift 110s linear infinite!important;will-change:transform;opacity:.92}.cloud-a{top:-8%;animation-delay:-32s!important}.cloud-b{width:26%;top:22%;opacity:.75;animation-duration:145s!important;animation-delay:-89s!important}.cloud-c{width:22%;top:5%;opacity:.88;animation-duration:170s!important;animation-delay:-139s!important}@keyframes cloud-drift{from{transform:translateX(-150%)}to{transform:translateX(550%)}}@media(prefers-reduced-motion:reduce){.drifting-cloud{animation:none!important;will-change:auto}.cloud-a{left:8%}.cloud-b{left:40%}.cloud-c{left:78%}}


.image{transition:background-image .2s!important}.landed .image{transform:translateY(1.5%)!important}.setting.active .bars i{background:#ffac00}.setting:not(.active) .bars i{background:#969895}.setting{text-align:left}.height .bars i{background:#969895}.height:not(.active) .bars i:last-child,.height.active .bars i:first-child{background:#ffac00}
#shield{inset:18% 2% 13% 32%;z-index:2}.shield-active #shield{opacity:1}#shield-status{position:absolute;right:3%;top:4%;width:20%;padding:calc(var(--ui-unit, 1vw) * .8) calc(var(--ui-unit, 1vw) * 1);background:#152939df;border:1px solid #9ee7ff;border-radius:calc(var(--ui-unit, 1vw) * .8);z-index:4;color:#c5f2ff;font-size:calc(var(--ui-unit, 1vw) * .9)}#shield-status strong{float:right}#shield-meter{display:block;width:100%;height:calc(var(--ui-unit, 1vw) * .7);margin-top:calc(var(--ui-unit, 1vw) * .7);accent-color:#71ddff}#targeting{position:absolute;left:52%;top:26%;width:24%;aspect-ratio:1;z-index:6;background:#070c13ed;color:#f8c760;border:1px solid #dcb55c;border-radius:calc(var(--ui-unit, 1vw) * 1.3);overflow:hidden;box-shadow:0 0 calc(var(--ui-unit, 1vw) * 2) #0007;display:flex;flex-direction:column}#targeting[hidden],#shield-status[hidden],#hyperspace[hidden]{display:none}.target-head,.target-foot{display:flex;justify-content:space-between;align-items:center;padding:calc(var(--ui-unit, 1vw) * .75);font-size:calc(var(--ui-unit, 1vw) * .75);letter-spacing:calc(var(--ui-unit, 1vw) * .07)}.target-head button{background:none;color:#f8c760;font-size:calc(var(--ui-unit, 1vw) * 1.7);line-height:1;padding:0 calc(var(--ui-unit, 1vw) * .3)}#target-canvas{width:100%;flex:1;min-height:0}.target-foot{font-size:calc(var(--ui-unit, 1vw) * .8)}#hyperspace{position:absolute;left:30%;top:0;width:70%;height:100%;z-index:7;pointer-events:none;opacity:1;transition:opacity .4s}.warp-fade #hyperspace{opacity:0}.controls strong{line-height:1.15}.controls button[data-action="weapons"] strong{font-size:calc(var(--ui-unit, 1vw) * .95)}
.setting:active,.setting.pressed{background:#c7c9cc;box-shadow:inset 0 3px 8px #0004;transform:translateY(1px)}.setting.active .bars i{background:#969895}.setting.active .bars i:first-child{background:#ffac00}.setting:not(.active) .bars i:nth-child(2){background:#ffac00}.landed .image{transform:none!important}#targeting,#shield-status,#hyperspace{box-sizing:border-box}#shield{animation:none;transition:opacity .3s}#targeting{width:24%;height:auto}#target-canvas{display:block;flex:1 1 0;height:1px}#hyperspace{transition:opacity .45s}.lights-off #lamp-image{filter:brightness(.035) saturate(.1)}
.rail{gap:calc(var(--ui-unit, 1vw) * 1.25);padding:calc(var(--ui-unit, 1vw) * .95) calc(var(--ui-unit, 1vw) * .45);background:#424646aa}.rail svg{display:block;width:calc(var(--ui-unit, 1vw) * 2.15);height:calc(var(--ui-unit, 1vw) * 2.15);stroke-width:1.7}.rail .avatar{width:calc(var(--ui-unit, 1vw) * 3.65);height:calc(var(--ui-unit, 1vw) * 3.65);flex-shrink:0;background:#858989;font-size:calc(var(--ui-unit, 1vw) * 1.15)}.rail #clock{margin-top:calc(var(--ui-unit, 1vw) * -.6);font-size:calc(var(--ui-unit, 1vw) * 1.35);line-height:1}.rail-weather{display:flex;align-items:center;gap:calc(var(--ui-unit, 1vw) * .2);font-size:calc(var(--ui-unit, 1vw) * 1.05);margin-top:calc(var(--ui-unit, 1vw) * -1)}.rail-weather svg{width:calc(var(--ui-unit, 1vw) * .95);height:calc(var(--ui-unit, 1vw) * .95);color:#ffcb77}.rail-connection{margin-top:calc(var(--ui-unit, 1vw) * 1.1);display:flex;flex-direction:column;align-items:center;gap:calc(var(--ui-unit, 1vw) * .1)}.rail-connection small{font-size:calc(var(--ui-unit, 1vw) * .65)}.rail-connection>svg{height:calc(var(--ui-unit, 1vw) * 1.75);width:calc(var(--ui-unit, 1vw) * 2.2);stroke-width:3}.rail-connection>div{display:flex}.rail-connection>div svg{width:calc(var(--ui-unit, 1vw) * .75);height:calc(var(--ui-unit, 1vw) * .75)}.rail button{display:grid;place-items:center;min-height:calc(var(--ui-unit, 1vw) * 2.8);flex-shrink:0}.rail-compass svg{width:calc(var(--ui-unit, 1vw) * 2.6);height:calc(var(--ui-unit, 1vw) * 2.6)}.notification{position:relative}.notification i{position:absolute;width:calc(var(--ui-unit, 1vw) * .35);height:calc(var(--ui-unit, 1vw) * .35);border-radius:50%;background:#ffb600;top:calc(var(--ui-unit, 1vw) * .3);right:calc(var(--ui-unit, 1vw) * .75)}.rail-locks{margin-top:auto;display:grid;gap:calc(var(--ui-unit, 1vw) * .6)}.unlock-circle,.rail .railpower{display:grid;place-items:center;width:calc(var(--ui-unit, 1vw) * 3.5);height:calc(var(--ui-unit, 1vw) * 3.5);border-radius:50%;background:#858988}.rail .railpower{background:white;color:#333;margin:0}.rail-locks svg{width:calc(var(--ui-unit, 1vw) * 2);height:calc(var(--ui-unit, 1vw) * 2)}.railpower small{display:none}footer{gap:calc(var(--ui-unit, 1vw) * 1.5);padding:calc(var(--ui-unit, 1vw) * .3) calc(var(--ui-unit, 1vw) * .65) 0;height:calc(var(--ui-unit, 1vw) * 6.4)}footer svg{display:block;width:calc(var(--ui-unit, 1vw) * 2.2);height:calc(var(--ui-unit, 1vw) * 2.2);stroke-width:1.65}.dock-group{display:flex;align-items:center;gap:calc(var(--ui-unit, 1vw) * 1.8)}.dock-icon{display:inline-flex;align-items:center;justify-content:center}.dock-icon.active:after{bottom:calc(var(--ui-unit, 1vw) * -.6);height:calc(var(--ui-unit, 1vw) * .25)}.dock-divider{height:calc(var(--ui-unit, 1vw) * 1.7);width:1px;background:#666}.climate{width:calc(var(--ui-unit, 1vw) * 14);flex-shrink:0;padding:calc(var(--ui-unit, 1vw) * .65) calc(var(--ui-unit, 1vw) * 1)}.climate .temperature{position:relative;font-size:calc(var(--ui-unit, 1vw) * 1.65);line-height:1.1;padding-right:calc(var(--ui-unit, 1vw) * 1.6)}.temperature>svg{position:absolute;right:0;top:calc(var(--ui-unit, 1vw) * .05);width:calc(var(--ui-unit, 1vw) * 1.4);height:calc(var(--ui-unit, 1vw) * 1.4);fill:currentColor;stroke-width:1}.temperature small{font-size:calc(var(--ui-unit, 1vw) * .75);margin-top:calc(var(--ui-unit, 1vw) * .18);padding-left:calc(var(--ui-unit, 1vw) * 1.2)}.climate .cool svg,.climate .warm svg{width:calc(var(--ui-unit, 1vw) * 1.8);height:calc(var(--ui-unit, 1vw) * 1.8);stroke-width:3}#sound{display:grid;place-items:center;padding:0;width:calc(var(--ui-unit, 1vw) * 2.8);height:calc(var(--ui-unit, 1vw) * 3)}#sound .sound-off,#sound.muted .sound-on{display:none}#sound.muted .sound-off{display:block}.controls button>span{line-height:1.1}#target-canvas{min-height:0}@media(prefers-reduced-motion:reduce){#hyperspace,#lamp-overlay{transition:none}}

#target-gif{display:block;width:100%;min-height:0;flex:1 1 0;height:1px;object-fit:contain;background:#000}#targeting{background:#000}

#shield-film{position:absolute;right:0;top:0;width:70%;height:100%;z-index:2;opacity:0;pointer-events:none;transition:opacity .3s} .shield-active #shield-film{opacity:1}@media(prefers-reduced-motion:reduce){#shield-film{transition:none}}

#target-media{position:relative;width:100%;aspect-ratio:320/185;overflow:hidden;margin:auto 0;flex:none}#target-media #target-gif{position:absolute;top:0;left:0;width:100%;height:auto;min-height:0;object-fit:initial;flex:none}

#landing-skids{position:absolute;right:0;top:0;width:70%;height:100%;object-fit:fill;pointer-events:none;z-index:1;opacity:0}.landed #landing-skids{opacity:1}

.control-symbol .system-icon{display:block;width:calc(var(--ui-unit, 1vw) * 2);height:calc(var(--ui-unit, 1vw) * 2);stroke-width:1.65}.primary .control-symbol .system-icon{width:calc(var(--ui-unit, 1vw) * 2.2);height:calc(var(--ui-unit, 1vw) * 2.2)}.setting{gap:calc(var(--ui-unit, 1vw) * .4)}.setting>.system-icon{width:calc(var(--ui-unit, 1vw) * 1.35);height:calc(var(--ui-unit, 1vw) * 1.35);flex:none;stroke-width:1.65}.setting>span{flex:1}.landing-chevron .system-icon{width:calc(var(--ui-unit, 1vw) * 1.6);height:calc(var(--ui-unit, 1vw) * 1.6);display:block;margin:auto}

.image{background-color:#081226}.cloud-layer{display:none}



/* Keep front lamps independent of thrust; brighten only the two blue rings. */
#thruster-lighting{position:absolute;right:0;top:0;width:74%;height:100%;pointer-events:none;z-index:1;display:none}.boost #thruster-lighting{display:block}.flame-flicker{animation:thrust-flame-flicker .095s steps(1,end) infinite}@keyframes thrust-flame-flicker{0%,100%{filter:brightness(1)}24%{filter:brightness(1.12)}53%{filter:brightness(1.035)}77%{filter:brightness(1.085)}}@media(prefers-reduced-motion:reduce){.flame-flicker{animation:none}}

.compressor-button{justify-content:center;font-size:calc(var(--ui-unit, 1vw) * 1.03);text-align:center;line-height:1.3}

.height .bars i{background:#969895!important}.height:not(.active) .bars i:first-child,.height.active .bars i:last-child{background:#ffac00!important}

.compressor-button{text-align:left}.compressor-button>span{flex:1}
#targeting{touch-action:none;user-select:none;-webkit-user-select:none;cursor:grab}#targeting.dragging{cursor:grabbing}#target-gif{pointer-events:none;-webkit-user-drag:none}#close-target{cursor:pointer}

.screen.compressor-flicker{animation:compressor-power-flicker .92s linear}@keyframes compressor-power-flicker{0%,7%,12%,30%,38%,72%,78%,100%{filter:brightness(1)}8%,10%{filter:brightness(.48)}32%,35%{filter:brightness(.68)}74%,76%{filter:brightness(.4)}}

.controls .coaxium-level{position:absolute;right:calc(var(--ui-unit, 1vw) * .65);top:calc(var(--ui-unit, 1vw) * .7);width:calc(var(--ui-unit, 1vw) * 4.3);display:flex;flex-direction:column;gap:calc(var(--ui-unit, 1vw) * .22);line-height:1.1}.coaxium-label{font-size:calc(var(--ui-unit, 1vw) * .57);letter-spacing:calc(var(--ui-unit, 1vw) * .025);color:#555}.coaxium-value{font-size:calc(var(--ui-unit, 1vw) * .6);color:#555;text-align:right}#coaxium-meter{display:block;width:100%;height:calc(var(--ui-unit, 1vw) * .45);border:0;border-radius:calc(var(--ui-unit, 1vw) * 1);background:#949895;appearance:none;-webkit-appearance:none}#coaxium-meter::-webkit-meter-bar{background:#949895;border:0;border-radius:calc(var(--ui-unit, 1vw) * 1);height:calc(var(--ui-unit, 1vw) * .45)}#coaxium-meter::-webkit-meter-optimum-value{background:#ffac00;border-radius:calc(var(--ui-unit, 1vw) * 1)}#coaxium-meter::-moz-meter-bar{background:#ffac00;border-radius:calc(var(--ui-unit, 1vw) * 1)}

/* Rivian reference proportions: frame, rail, controls and bottom dock. */
main{position:relative;width:min(100vw,calc(var(--viewport-height, 100vh) * 181.8 / 100));aspect-ratio:1.818;padding:0;border-radius:3.8% / 6.9%;flex:none;overflow:hidden}.screen{position:absolute;left:2.4%;right:2.4%;top:4.38%;bottom:16.2%;border-radius:calc(var(--ui-unit, 1vw) * 1.3)}
.card{left:7.8%;width:21.9%;top:3.1%;bottom:3.1%;border-radius:calc(var(--ui-unit, 1vw) * 1.4);padding:calc(var(--ui-unit, 1vw) * 1.1)}.card nav{height:calc(var(--ui-unit, 1vw) * 3.1);margin-bottom:calc(var(--ui-unit, 1vw) * .45);gap:calc(var(--ui-unit, 1vw) * .5)}.card nav button{font-size:calc(var(--ui-unit, 1vw) * 1.05);letter-spacing:calc(var(--ui-unit, 1vw) * -.025)}.controls{gap:calc(var(--ui-unit, 1vw) * .72)}.controls button{height:calc(var(--ui-unit, 1vw) * 5.15);min-height:0;padding:calc(var(--ui-unit, 1vw) * .7) calc(var(--ui-unit, 1vw) * .72);border-radius:calc(var(--ui-unit, 1vw) * .92);gap:calc(var(--ui-unit, 1vw) * .25)}.controls .primary{height:calc(var(--ui-unit, 1vw) * 5.2);min-height:0}.controls strong{font-size:calc(var(--ui-unit, 1vw) * 1.03);line-height:1.15}.controls button[data-action="weapons"] strong{font-size:calc(var(--ui-unit, 1vw) * .95)}.settings{grid-template-columns:35% minmax(0,1fr);height:calc(var(--ui-unit, 1vw) * 14.25);flex-shrink:0;gap:calc(var(--ui-unit, 1vw) * .72);padding-top:0}.setting-stack{min-width:0;grid-template-rows:repeat(3,minmax(0,1fr));gap:calc(var(--ui-unit, 1vw) * .72)}.setting{min-width:0;min-height:0;padding:calc(var(--ui-unit, 1vw) * .6) calc(var(--ui-unit, 1vw) * .7);gap:calc(var(--ui-unit, 1vw) * .45);border-radius:calc(var(--ui-unit, 1vw) * .92);font-size:calc(var(--ui-unit, 1vw) * 1);line-height:1.23}.setting>span{min-width:0}.setting small{font-size:calc(var(--ui-unit, 1vw) * .95)}.setting>.system-icon{width:calc(var(--ui-unit, 1vw) * 1.25);height:calc(var(--ui-unit, 1vw) * 1.25)}.setting .bars{flex:none}.compressor-button{font-size:calc(var(--ui-unit, 1vw) * .95)}.compressor-button small{display:none}.bars{gap:calc(var(--ui-unit, 1vw) * .27)}.bars i{width:calc(var(--ui-unit, 1vw) * 1.5);height:calc(var(--ui-unit, 1vw) * .45)}.height{border-radius:calc(var(--ui-unit, 1vw) * .92);padding:calc(var(--ui-unit, 1vw) * 1.1) calc(var(--ui-unit, 1vw) * .5)}.height .bars i{width:calc(var(--ui-unit, 1vw) * 3.15)}
.rail{left:1.45%;width:5.35%;top:3.1%;bottom:3.1%;padding:0;display:block;border-radius:calc(var(--ui-unit, 1vw) * 3);background:#4d5153b8}.rail .avatar{position:absolute;top:2%;left:50%;transform:translateX(-50%);width:calc(var(--ui-unit, 1vw) * 3.6);height:calc(var(--ui-unit, 1vw) * 3.6)}.rail #clock{position:absolute;top:12%;width:100%;text-align:center;margin:0;font-size:calc(var(--ui-unit, 1vw) * 1.35)}.rail-weather{position:absolute;top:16%;left:50%;transform:translateX(-50%);margin:0;white-space:nowrap}.rail-connection{position:absolute;top:25%;left:50%;transform:translateX(-50%);margin:0}.rail>button,.rail-compass{position:absolute;left:50%;transform:translateX(-50%);width:calc(var(--ui-unit, 1vw) * 3.4);height:calc(var(--ui-unit, 1vw) * 3);min-height:0;display:grid;place-items:center}.rail>.notification{top:36%}.rail-compass{top:47%}.rail>#fullscreen{top:57%}.rail>#reset{top:67%}.rail .rail-locks{position:absolute;bottom:2%;left:50%;transform:translateX(-50%);margin:0;gap:calc(var(--ui-unit, 1vw) * .6)}.rail .unlock-circle,.rail .railpower{width:calc(var(--ui-unit, 1vw) * 3.5);height:calc(var(--ui-unit, 1vw) * 3.5)}.rail>button:active,.rail>button.pressed{transform:translateX(-50%) translateY(1px)}.notification i{right:calc(var(--ui-unit, 1vw) * .5);top:calc(var(--ui-unit, 1vw) * .45)}
footer{position:absolute;left:3%;right:3%;top:84.7%;height:8%;padding:0;display:grid;grid-template-columns:14% 12% minmax(0,1fr) 2.5% 2.5% 14%;gap:2%;align-items:center}footer .dock-spacer{display:none}footer .climate{width:100%;height:calc(var(--ui-unit, 1vw) * 4.1);padding:calc(var(--ui-unit, 1vw) * .5) calc(var(--ui-unit, 1vw) * .9);border-radius:calc(var(--ui-unit, 1vw) * 3)}.climate .temperature{font-size:calc(var(--ui-unit, 1vw) * 1.55)}.temperature small{font-size:calc(var(--ui-unit, 1vw) * .7)}.dock-group{gap:0;justify-content:space-between}.dock-group.apps{justify-content:center;gap:calc(var(--ui-unit, 1vw) * 2.1)}footer svg{width:calc(var(--ui-unit, 1vw) * 2.15);height:calc(var(--ui-unit, 1vw) * 2.15);stroke-width:1.65}.dock-icon{width:calc(var(--ui-unit, 1vw) * 2.4);height:calc(var(--ui-unit, 1vw) * 2.6);flex:none}.dock-icon.active:after{left:calc(var(--ui-unit, 1vw) * .2);right:calc(var(--ui-unit, 1vw) * .2);bottom:calc(var(--ui-unit, 1vw) * -.3);height:calc(var(--ui-unit, 1vw) * .22)}#sound{width:calc(var(--ui-unit, 1vw) * 2.5);height:calc(var(--ui-unit, 1vw) * 2.6)}.dock-divider{height:calc(var(--ui-unit, 1vw) * 1.45)}.dock-group.apps .lucide-ellipsis{border:1.5px solid currentColor;border-radius:calc(var(--ui-unit, 1vw) * .25);padding:calc(var(--ui-unit, 1vw) * .12)}

#coaxium-meter{--fuel-color:#3da9e8}#coaxium-meter.warning{--fuel-color:#ffbc21}#coaxium-meter.low{--fuel-color:#e74a3b}#coaxium-meter::-webkit-meter-optimum-value,#coaxium-meter::-webkit-meter-suboptimum-value,#coaxium-meter::-webkit-meter-even-less-good-value{background:var(--fuel-color);transition:width .35s,background-color .35s}#coaxium-meter::-moz-meter-bar{background:var(--fuel-color);transition:width .35s,background-color .35s}

.shield-start #shield-film{animation:shield-film-on .6s linear;transition:none}.shield-stop #shield-film{animation:shield-film-off .6s linear;transition:none}@keyframes shield-film-on{0%{opacity:0}14%{opacity:.9}23%{opacity:.28}37%{opacity:1}46%{opacity:.55}68%{opacity:.92}75%{opacity:.65}100%{opacity:1}}@keyframes shield-film-off{0%{opacity:1}15%{opacity:.3}26%{opacity:.8}43%{opacity:.15}52%{opacity:.5}77%{opacity:.1}84%{opacity:.24}100%{opacity:0}}

.controls #hyper-ready{position:absolute;bottom:calc(var(--ui-unit, 1vw) * .6);right:calc(var(--ui-unit, 1vw) * .65);font-size:calc(var(--ui-unit, 1vw) * .52);line-height:1.1;color:#696969;max-width:calc(var(--ui-unit, 1vw) * 3.6);text-align:right;letter-spacing:calc(var(--ui-unit, 1vw) * .02)}

.controls #hyper-ready{max-width:calc(var(--ui-unit, 1vw) * 2.8);font-size:calc(var(--ui-unit, 1vw) * .48)}.controls button[data-action="hyperspace"] strong{font-size:calc(var(--ui-unit, 1vw) * .95)}

#jammer-static{position:absolute;inset:0;width:100%;height:100%;z-index:10;pointer-events:none;opacity:.075;mix-blend-mode:screen;image-rendering:pixelated}#jammer-static[hidden]{display:none}

/* Close the vertical gap with evenly sized control rows. */
.controls{flex:1;min-height:0;grid-template-rows:repeat(3,minmax(0,1fr));gap:calc(var(--ui-unit, 1vw) * .65)}.controls button,.controls .primary{height:auto;min-height:0;justify-content:center;padding:calc(var(--ui-unit, 1vw) * .8) calc(var(--ui-unit, 1vw) * .75);gap:calc(var(--ui-unit, 1vw) * .45)}.settings{margin-top:calc(var(--ui-unit, 1vw) * 1.05);gap:calc(var(--ui-unit, 1vw) * .65)}.setting-stack{gap:calc(var(--ui-unit, 1vw) * .65)}.controls .control-symbol .system-icon{width:calc(var(--ui-unit, 1vw) * 2.25);height:calc(var(--ui-unit, 1vw) * 2.25);stroke-width:1.8}.controls .primary .control-symbol .system-icon{width:calc(var(--ui-unit, 1vw) * 2.4);height:calc(var(--ui-unit, 1vw) * 2.4)}.setting>.system-icon{width:calc(var(--ui-unit, 1vw) * 1.65);height:calc(var(--ui-unit, 1vw) * 1.65);stroke-width:1.8}.setting{gap:calc(var(--ui-unit, 1vw) * .35);padding:calc(var(--ui-unit, 1vw) * .6)}.compressor-button{font-size:calc(var(--ui-unit, 1vw) * .92)}.setting .bars i{width:calc(var(--ui-unit, 1vw) * 1.4)}.rail svg,footer svg,.system-icon{shape-rendering:geometricPrecision;stroke-linecap:round;stroke-linejoin:round}.rail svg{stroke-width:1.8}footer svg{stroke-width:1.8}footer svg[viewBox="0 0 32 32"]{stroke-width:2.35}.rail-compass svg{stroke-width:2.25}.controls #hyper-ready{bottom:calc(var(--ui-unit, 1vw) * .85);max-width:calc(var(--ui-unit, 1vw) * 2.8)}.controls .coaxium-level{top:calc(var(--ui-unit, 1vw) * .85)}#jammer-static{opacity:.14;mix-blend-mode:normal;image-rendering:auto}
/* Fit the Rivian-shaped screen inside landscape Safari's visible iPad area. */
body{width:100%;height:calc(var(--viewport-height, 100vh) * 100 / 100);min-height:0;padding:env(safe-area-inset-top,0px) env(safe-area-inset-right,0px) env(safe-area-inset-bottom,0px) env(safe-area-inset-left,0px);overflow:hidden;background:#000;--available-height:calc(calc(var(--viewport-height, 100vh) * 100 / 100) - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px))}main{width:min(100%,calc(var(--available-height)*1.818));max-width:100%;max-height:100%;flex-shrink:0}.controls #hyper-ready{top:calc(var(--ui-unit, 1vw) * 3.25);bottom:auto;max-width:calc(var(--ui-unit, 1vw) * 4.3);font-size:calc(var(--ui-unit, 1vw) * .6)}.controls strong{font-size:calc(var(--ui-unit, 1vw) * 1.08)}.controls button[data-action="hyperspace"] strong{font-size:calc(var(--ui-unit, 1vw) * 1.02)}.controls button[data-action="weapons"] strong{font-size:calc(var(--ui-unit, 1vw) * 1.02)}.setting{font-size:calc(var(--ui-unit, 1vw) * 1.04)}.compressor-button{font-size:calc(var(--ui-unit, 1vw) * .97)}.controls .coaxium-label{font-size:calc(var(--ui-unit, 1vw) * .63)}.controls .coaxium-value{font-size:calc(var(--ui-unit, 1vw) * .65)}@media(orientation:landscape){.rotate{display:none}}

#jammer-static{opacity:.18;mix-blend-mode:screen;image-rendering:pixelated}

#jammer-static{animation:jammer-static-drift 2.8s steps(10,end) infinite}@keyframes jammer-static-drift{0%{transform:translate(0,0)}22%{transform:translate(-.35%,.7%)}46%{transform:translate(.25%,1.35%)}68%{transform:translate(-.2%,2%)}100%{transform:translate(.15%,2.7%)}}

#thruster-lighting image:not(.steady-front):not(.flame-flicker){animation:engine-ring-soft-flicker .72s ease-in-out infinite}@keyframes engine-ring-soft-flicker{0%,100%{opacity:.82}24%{opacity:1}51%{opacity:.9}73%{opacity:.97}}
#thruster-lighting image:not(.steady-front):not(.flame-flicker){animation:engine-ring-visible-flicker .24s steps(2,end) infinite;transform-origin:center;filter:brightness(1.25)}@keyframes engine-ring-visible-flicker{0%,100%{opacity:.5;filter:brightness(1.05)}18%{opacity:1;filter:brightness(1.8)}42%{opacity:.7;filter:brightness(1.25)}66%{opacity:.95;filter:brightness(1.6)}84%{opacity:.58;filter:brightness(1.1)}}
#thruster-lighting image:not(.steady-front):not(.flame-flicker){animation-duration:.48s}
.dock-icon,.rail-compass,.unlock-circle,.rail-weather{cursor:pointer}.dock-icon:active,.rail-compass:active,.unlock-circle:active,.rail-weather:active{transform:scale(.9);opacity:.72}.rail-compass:active,.unlock-circle:active{transform:translateX(-50%) scale(.9)}.sabacc-charm{width:calc(var(--ui-unit, 1vw) * 1.8)!important;height:calc(var(--ui-unit, 1vw) * 1.8)!important;stroke-width:1.45!important}

/* Final dock cleanup: consistent Rivian-style icon boxes and optical alignment. */
footer .dock-group{align-items:center;height:100%;}
footer .dock-group.apps{gap:calc(var(--ui-unit, 1vw) * 1.8);}
footer .dock-icon{display:grid;place-items:center;width:calc(var(--ui-unit, 1vw) * 2.6);height:calc(var(--ui-unit, 1vw) * 2.8);line-height:1;color:#f5f5f5;}
footer .dock-icon svg{width:calc(var(--ui-unit, 1vw) * 2.15);height:calc(var(--ui-unit, 1vw) * 2.15);max-width:100%;max-height:100%;display:block;stroke-width:1.8;vector-effect:non-scaling-stroke;}
footer .dock-icon.active:after{left:20%;right:20%;bottom:calc(var(--ui-unit, 1vw) * -.18);height:calc(var(--ui-unit, 1vw) * .2);}
footer .dock-divider{margin:0 calc(var(--ui-unit, 1vw) * .2);opacity:.8;}
footer #sound{display:grid;place-items:center;align-self:center;}
body.clif-night .image{background-color:#13243a;}

/* Perceptible thruster stutter on activation. */
.boost #thruster-lighting{animation:thruster-stutter .34s steps(4,end) infinite;transform-origin:center;}
@keyframes thruster-stutter{0%,100%{opacity:.92}18%{opacity:.62}34%{opacity:1}52%{opacity:.74}70%{opacity:.98}86%{opacity:.68}}

/* Visible thruster flicker stays clipped to the engine overlays. */
.boost #thruster-lighting .flame-flicker{animation:dash-flame-pulse .19s steps(2,end) infinite!important;filter:brightness(1.3)}
@keyframes dash-flame-pulse{0%,100%{opacity:.58;filter:brightness(1.05)}22%{opacity:1;filter:brightness(2.25)}48%{opacity:.72;filter:brightness(1.2)}73%{opacity:.96;filter:brightness(1.9)}}
.boost #thruster-lighting image:not(.steady-front):not(.flame-flicker){animation:dash-ring-pulse .24s steps(2,end) infinite!important;transform-origin:center}
@keyframes dash-ring-pulse{0%,100%{opacity:.48;filter:brightness(1.1)}20%{opacity:1;filter:brightness(2.4)}43%{opacity:.62;filter:brightness(1.2)}68%{opacity:.96;filter:brightness(2.05)}86%{opacity:.55;filter:brightness(1.15)}}

/* Three discrete coaxium cells replace the old percentage meter. */
.coaxium-value{display:none!important}#coaxium-meter{display:flex;gap:calc(var(--ui-unit, 1vw) * .16);width:100%;height:calc(var(--ui-unit, 1vw) * .52);background:transparent;appearance:none;-webkit-appearance:none;border:0;border-radius:0;overflow:visible}#coaxium-meter .coaxium-segment{display:block;flex:1;height:100%;border-radius:calc(var(--ui-unit, 1vw) * .1);background:#858a8d;opacity:.48;transition:opacity .2s,background-color .2s,filter .2s}#coaxium-meter .coaxium-segment.filled{background:#3da9e8;opacity:1;box-shadow:0 0 calc(var(--ui-unit, 1vw) * .3) #3da9e8aa}#coaxium-meter.warning .coaxium-segment.filled{background:#ffbc21;box-shadow:0 0 calc(var(--ui-unit, 1vw) * .3) #ffbc21aa}#coaxium-meter.low .coaxium-segment.filled{background:#e74a3b;box-shadow:0 0 calc(var(--ui-unit, 1vw) * .3) #e74a3baa}

/* Keep the hull steady; engine overlays carry all thrust flicker. */
.boost .image{animation:none!important;filter:none!important}

/* State effects stay on their hardware and leave the scene and hull still. */
#ship,.boost #ship,.lights-off #ship,.landed #ship,.warping #ship,.launching #ship,.recoil #ship{filter:none!important;transform:none!important;animation:none!important;transition:none!important;background-image:inherit;}
.boost .image,.lights-off .image,.landed .image,.warping .image,.launching .image,.recoil .image{filter:none!important;transform:none!important;animation:none!important;}



/* Keep the Clif scene fixed while controls toggle. */
.boost .image,.lights-off .image,.boost.lights-off .image{background-image:inherit!important;}
#thruster-lighting .flame-flicker{transform-origin:center;}

/* Restored the original clipped-emitter lights toggle. */


/* Only engine luminosity animates; geometry stays fixed. */
.boost #thruster-lighting{animation:none!important;transform:none!important}
.boost #thruster-lighting .flame-flicker{animation:clif-exhaust-pulse .58s linear infinite!important;filter:brightness(1.35)}
.boost #thruster-lighting .engine-rings{animation:clif-ring-pulse .58s linear infinite!important}
@keyframes clif-exhaust-pulse{0%,100%{opacity:.78}18%{opacity:.38}28%{opacity:1}47%{opacity:.68}65%{opacity:.95}82%{opacity:.52}}
@keyframes clif-ring-pulse{0%,100%{opacity:.9}18%{opacity:.25}28%{opacity:1}47%{opacity:.55}65%{opacity:.95}82%{opacity:.4}}

.boost #thruster-lighting .aft-glow{animation:clif-aft-glow .7s ease-in-out infinite;pointer-events:none}
@keyframes clif-aft-glow{0%,100%{opacity:.85}22%{opacity:.58}38%{opacity:1}65%{opacity:.72}82%{opacity:.95}}

/* Red ring mapping retains source alpha and flickers only in opacity. */
.boost #thruster-lighting .engine-rings{filter:brightness(1.1)!important}

/* One coordinate plane for artwork and engine effects. No state background inheritance. */
#scene-art{position:absolute;right:0;top:0;width:70%;height:100%;pointer-events:none}
#scene-art #ship{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:fill;object-position:center;background:none!important;opacity:1!important;filter:none!important;transform:none!important;animation:none!important;transition:none!important}
#scene-art #thruster-lighting{position:absolute;inset:0;width:100%;height:100%;transform:none!important}

/* Strong rear-engine aura; opacity modulation never moves its anchors. */
@keyframes clif-aft-glow{0%,100%{opacity:.95}22%{opacity:.78}38%{opacity:1}65%{opacity:.88}82%{opacity:1}}

.rail>#clock{left:0;transform:none;top:12%;width:100%;height:auto;min-height:0;padding:0;background:transparent;font-weight:600;line-height:1.25;cursor:pointer}.rail>#clock:active,.rail>#clock.pressed{transform:translateY(1px)}

@font-face{font-family:AurebeshClock;src:url("/assets/aurebesh-clock.otf") format("opentype");font-weight:400 700;font-display:swap;unicode-range:U+0030-0039}.rail>#clock{font-family:AurebeshClock,Arial,sans-serif;font-weight:400;font-size:calc(var(--ui-unit, 1vw) * 1.3);letter-spacing:calc(var(--ui-unit, 1vw) * .04)}

#scene-art #shield-film{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}

.rail>#clock{font-family:Arial,Helvetica,sans-serif;font-weight:600;font-size:calc(var(--ui-unit, 1vw) * 1.35);letter-spacing:normal}

/* Background motion shares the artwork plane and clears the full ship silhouette. */
#ambient-clouds,#earth-motion,#orbital-dust{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1}
#ambient-clouds{display:block}#orbital-dust{display:none}#earth-motion{display:block}
.clif-night #ambient-clouds{display:none}.clif-night #earth-motion,.clif-night #orbital-dust{display:block}
body:not(.clif-night) #location{display:none}
/* JS updates SVG transforms to keep cloud motion consistent in Safari. */
.air-cloud{opacity:.6;will-change:transform}
.dust-band{animation:orbital-haze 18s ease-in-out infinite alternate}.dust-b{animation-duration:25s;animation-delay:-9s;opacity:.85}
@keyframes orbital-haze{from{transform:translate(-100px,38px)}to{transform:translate(100px,-38px)}}

#scene-art{isolation:isolate}#scene-art #ship{z-index:0}#scene-art #thruster-lighting{z-index:2}#scene-art #shield-film{z-index:3}

/* Sun and moon keep the original two circular lower-rail positions. */
.rail .scene-switch{display:grid;place-items:center;width:calc(var(--ui-unit, 1vw) * 3.5);height:calc(var(--ui-unit, 1vw) * 3.5);min-height:0;padding:0;border-radius:50%;background:#858988;color:white;transition:background-color .15s,color .15s}
.rail .scene-switch.active{background:#fff;color:#333}
.rail .scene-switch:active,.rail .scene-switch.pressed{transform:translateY(1px);box-shadow:inset 0 2px 5px #0003}
.rail>#clock{cursor:default}

/* Rings and aft aura share one pulse, so their peaks and dips coincide. */
.boost #thruster-lighting .aft-glow,.boost #thruster-lighting .engine-rings{animation:none!important}
.boost #thruster-lighting .engine-pulse{animation:engine-thrust-pulse .7s linear infinite}
.boost #thruster-lighting .engine-rings{filter:brightness(2.15) drop-shadow(0 0 5px #ff4328) drop-shadow(0 0 11px #ff241c)!important}
@keyframes engine-thrust-pulse{0%,100%{opacity:.88}18%{opacity:.42}30%{opacity:1}48%{opacity:.68}66%{opacity:.98}83%{opacity:.56}}
#music.playing{color:#ffd17a}#music{cursor:pointer}#music:focus-visible{outline:2px solid #54baff;border-radius:calc(var(--ui-unit, 1vw) * .4)}

/* Keep every dock glyph in its own cell, with clear separators and consistent strokes. */
footer{grid-template-columns:14% 12% minmax(0,1fr) 3% 3% 14%;column-gap:1.65%;border:0}
footer .dock-group.apps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr)) calc(var(--ui-unit, 1vw) * .7) repeat(2,minmax(0,1fr));gap:calc(var(--ui-unit, 1vw) * .65);width:100%;min-width:0}
footer .dock-group.comfort{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:calc(var(--ui-unit, 1vw) * .45);min-width:0}
footer .dock-icon{width:100%;min-width:0;height:calc(var(--ui-unit, 1vw) * 3.15);justify-self:center;cursor:pointer;touch-action:manipulation}
footer>#dock-seat-right,footer>#sound{width:100%;height:calc(var(--ui-unit, 1vw) * 3.15)}
footer .dock-icon svg,footer #sound svg{width:calc(var(--ui-unit, 1vw) * 2);height:calc(var(--ui-unit, 1vw) * 2);overflow:visible;stroke-width:1.7;vector-effect:none}
footer .dock-icon svg[viewBox="0 0 32 32"]{stroke-width:2.1}
footer .dock-divider{justify-self:center;width:1px;height:calc(var(--ui-unit, 1vw) * 1.3);margin:0;background:#7d7d7d;opacity:.65}
footer .dock-group.apps .lucide-ellipsis{border:0;padding:0}
footer .dock-icon.active:after{left:calc(50% - calc(var(--ui-unit, 1vw) * .65));right:auto;width:calc(var(--ui-unit, 1vw) * 1.3);bottom:0;height:calc(var(--ui-unit, 1vw) * .18)}
footer .climate{border:0;gap:calc(var(--ui-unit, 1vw) * .35);padding:calc(var(--ui-unit, 1vw) * .55) calc(var(--ui-unit, 1vw) * .8)}
footer .climate .cool,footer .climate .warm{display:grid;place-items:center;flex:0 0 calc(var(--ui-unit, 1vw) * 1.6)}
footer .climate .temperature{flex:0 0 auto;padding-right:calc(var(--ui-unit, 1vw) * 1.6);white-space:nowrap;line-height:1.15}
footer .temperature .lucide-fan{position:absolute;right:0;top:calc(var(--ui-unit, 1vw) * .06);width:calc(var(--ui-unit, 1vw) * 1.3);height:calc(var(--ui-unit, 1vw) * 1.3);stroke-width:1.6}
footer .climate small{font-size:calc(var(--ui-unit, 1vw) * .65);line-height:1.2;margin-top:calc(var(--ui-unit, 1vw) * .15)}
.rail{border:0;box-shadow:none;overflow:hidden}
.rail>button,.rail-compass{width:calc(var(--ui-unit, 1vw) * 3.4);height:calc(var(--ui-unit, 1vw) * 3);border:0;box-shadow:none}
.rail>button svg,.rail-compass svg{width:calc(var(--ui-unit, 1vw) * 2.05);height:calc(var(--ui-unit, 1vw) * 2.05);stroke-width:1.7}
.rail-compass svg{width:calc(var(--ui-unit, 1vw) * 2.3);height:calc(var(--ui-unit, 1vw) * 2.3);stroke-width:2}
.rail .rail-connection>svg{width:calc(var(--ui-unit, 1vw) * 1.9);height:calc(var(--ui-unit, 1vw) * 1.5)}
.rail .rail-connection>div{gap:calc(var(--ui-unit, 1vw) * .2)}
.rail .rail-locks{gap:calc(var(--ui-unit, 1vw) * .7)}
.rail .scene-switch svg{width:calc(var(--ui-unit, 1vw) * 1.9);height:calc(var(--ui-unit, 1vw) * 1.9)}
.rail-compass:focus-visible,.avatar:focus-visible,.dock-icon:focus-visible{outline:2px solid #54baff;outline-offset:-2px;border-radius:calc(var(--ui-unit, 1vw) * .4)}

/* Separate local time and the decorative temperature into non-overlapping rows. */
.rail>#clock{top:12%;line-height:1.1}
.rail .rail-weather{top:19.5%;height:calc(var(--ui-unit, 1vw) * 1.2);line-height:1;margin:0;transform:translateX(-50%)}
.rail .rail-weather:active{transform:translateX(-50%) scale(.9)}

/* All fuel cells warn together, without changing their stored fill state. */
#coaxium-meter.jump-denied .coaxium-segment{background:#ff332c!important;opacity:1;animation:coaxium-denied .48s ease-in-out infinite;box-shadow:0 0 calc(var(--ui-unit, 1vw) * .5) #ff332c}
@keyframes coaxium-denied{0%,100%{opacity:1}50%{opacity:.2}}

/* Stable sizing on iPadOS 15 and no Safari text inflation. */
html{width:100%;height:100%;-webkit-text-size-adjust:100%;text-size-adjust:100%}body{height:var(--viewport-height,100vh)}main{--ui-unit:var(--measured-ui-unit,1vw)}

/* Clif's Air 2 edition fills the viewport; future creator builds are unchanged. */
body main{width:100%;height:100%;aspect-ratio:auto;max-height:none;border-radius:0;padding:1.5% 1.5% 1%;}
body .screen{border-radius:calc(var(--ui-unit,1vw)*1.3)}
body .display{background:linear-gradient(#a8d0ed 0%,#a8d0ed 28%,#8fa2a9 55%,#848575 100%)}
body.clif-night .display{background:linear-gradient(#102345 0%,#174279 58%,#478bae 100%)}
body #scene-art{height:100%;aspect-ratio:auto;top:0;transform:none}
body .controls strong{font-size:calc(var(--ui-unit,1vw)*1.35)}
body .controls button[data-action="weapons"] strong,body .controls button[data-action="hyperspace"] strong{font-size:calc(var(--ui-unit,1vw)*1.25)}
body .controls .control-symbol .system-icon{width:calc(var(--ui-unit,1vw)*2.8);height:calc(var(--ui-unit,1vw)*2.8)}
body .settings{height:calc(var(--ui-unit,1vw)*18);flex-shrink:0}
body .setting,body .height strong{font-size:calc(var(--ui-unit,1vw)*1.25)}
body .setting small,body .height small{font-size:calc(var(--ui-unit,1vw)*1.1)}
body #landing-skids{top:0;height:100%;aspect-ratio:auto;transform:none}

/* Air 2: cache the fixed glow layer and animate opacity only. */
body .engine-pulse{will-change:opacity}
body .dust-band{animation:none}
@media(prefers-reduced-motion:reduce){body .engine-pulse{animation:none!important}}

/* Safari activates controls without waiting for a second tap. */
button,[role="button"],.dock-icon,.rail-weather,.avatar{touch-action:manipulation;-webkit-tap-highlight-color:transparent}

/* Button-priority edition: the main scene is the original still artwork. */
body #earth-motion,
body #ambient-clouds,
body #orbital-dust,
body .cloud-layer{display:none!important}
body #scene-art *,
body #thruster-lighting *{animation:none!important;transition:none!important;will-change:auto!important}
body #thruster-lighting .engine-pulse{opacity:1}

/* One canvas spans the dashboard; controls stay above it and remain clickable. */
main{position:relative;isolation:isolate}
main>#hyperspace{inset:0;left:0;top:0;width:100%;height:100%;z-index:4;pointer-events:none}
main>.screen{position:absolute;z-index:auto}
main>footer{position:absolute;z-index:5}
main.hyperspace-active #targeting,main.hyperspace-active .display-top,
main.hyperspace-active .status,main.hyperspace-active .telemetry{visibility:hidden}
main>#hyperspace.warp-fade{opacity:0}
#location{display:none}

body .screen.compressor-flicker{animation:none!important}

/* Both compressor transitions use brief white flashes, with no persistent animation. */
#compressor-flash{position:absolute;inset:0;z-index:20;pointer-events:none;background:#fff;opacity:0}
#compressor-flash.flashing{animation:compressor-white-flashes .7s linear;will-change:opacity}
@keyframes compressor-white-flashes{0%,16%,36%,58%,100%{opacity:0}7%{opacity:.62}27%{opacity:.45}47%{opacity:.3}}

/* 2.5 times the previous 24% targeting width, within the open ship area. */
body #targeting{width:60%;left:35%;top:15%;aspect-ratio:auto;max-height:94%}

/* Fill the scene without distorting the moon or ship; trim only the side edges. */
body #scene-art #ship{object-fit:cover}

/* Larger drive-mode labels that remain on one row on Air 2. */
body nav{gap:calc(var(--ui-unit,1vw)*.35)}
body nav button{font-size:calc(var(--ui-unit,1vw)*1.45);font-weight:600;line-height:1.1}

body nav button{flex:1 1 auto}
body nav button[data-mode="Off-World"]{font-size:calc(var(--ui-unit,1vw)*1.45 + 2pt)}

/* v8: responsive temperature controls and one compressor status lamp. */
.climate button.cool,.climate button.warm{background:transparent;padding:0;display:grid;place-items:center;min-width:calc(var(--ui-unit,1vw)*2.4);min-height:calc(var(--ui-unit,1vw)*3.2)}
.temperature-value{display:inline!important;font:inherit!important}
.compressor-button .bypass-dot{width:calc(var(--ui-unit,1vw)*.7);height:calc(var(--ui-unit,1vw)*.7);border-radius:50%;background:#717171;flex-shrink:0;box-shadow:none}
.compressor-button.active .bypass-dot{background:#ffb600;box-shadow:0 0 8px #ffb600b3}

/* Keep enlarged mode labels within the card on all viewport widths. */
body nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;height:auto;min-height:calc(var(--ui-unit,1vw)*4.3);align-items:center;gap:calc(var(--ui-unit,1vw)*.2)}
body nav button{min-width:0;width:100%;padding:calc(var(--ui-unit,1vw)*.3) 0;white-space:normal;text-align:center;line-height:1.05}

/* Single-row mode labels sized to the available card width. */
body nav{display:flex;height:calc(var(--ui-unit,1vw)*3.2);min-height:0;gap:calc(var(--ui-unit,1vw)*.2)}
body nav button{flex:1 1 auto;width:auto;min-width:0;white-space:nowrap;font-size:calc(var(--ui-unit,1vw)*1.08);line-height:1.1;padding:calc(var(--ui-unit,1vw)*.3) 0}
body nav button[data-mode="Off-World"]{font-size:calc(var(--ui-unit,1vw)*1.18)}

/* One green status lamp for the jammer toggle. */
[data-action="jammer"] .jammer-dot{width:calc(var(--ui-unit,1vw)*.7);height:calc(var(--ui-unit,1vw)*.7);border-radius:50%;background:#717171;flex-shrink:0;box-shadow:none}
[data-action="jammer"].active .jammer-dot{background:#55dd72;box-shadow:0 0 8px #55dd72b3}

/* Timers own opacity. Disable every inherited CSS pulse on the same layers. */
body #scene-art #shield-film #shield-jacket,
body .shield-active #scene-art #shield-film #shield-jacket,
body #scene-art #thruster-lighting .engine-pulse,
body .boost #scene-art #thruster-lighting .engine-pulse,
body #scene-art #thruster-lighting .engine-pulse *{animation:none!important;transition:none!important}

/* Restore shield activation/deactivation flicker above the still-scene rule. */
body .shield-start #scene-art #shield-film{animation:shield-film-on .6s linear!important;transition:none!important}
body .shield-stop #scene-art #shield-film{animation:shield-film-off .6s linear!important;transition:none!important}
@media(prefers-reduced-motion:reduce){body .shield-start #scene-art #shield-film,body .shield-stop #scene-art #shield-film{animation:none!important}}

/* Explicit opacity steps work consistently for day and night in Safari. */
body .shield-start #scene-art #shield-film,
body .shield-stop #scene-art #shield-film{animation:none!important;transition:none!important}
/* Rivian night-mode weapons window. No blur filters or background animation. */
#weapons-panel[hidden],#weapon-window-glow[hidden],#weapon-range[hidden]{display:none!important}
#weapons-panel{position:absolute;z-index:30;right:3%;left:auto;top:3.1%;bottom:3.1%;width:25%;height:auto;max-height:none;overflow:hidden;box-sizing:border-box;background:rgba(37,42,44,.91);color:#edf0ed;border:1px solid #aab8b02e;border-radius:calc(var(--ui-unit,1vw)*1.3);box-shadow:0 6px 18px #0003;display:flex;flex-direction:column;font-family:Arial,Helvetica,sans-serif;font-size:calc(var(--ui-unit,1vw)*1.1);line-height:1.2}
.weapons-head{display:flex;align-items:center;gap:calc(var(--ui-unit,1vw)*.7);flex:none;box-sizing:border-box;padding:calc(var(--ui-unit,1vw)*1.15) calc(var(--ui-unit,1vw)*1);border-bottom:1px solid #adbdb523;background:rgba(255,255,255,.025)}
.weapons-head h2{font-size:calc(var(--ui-unit,1vw)*1.6);font-weight:500;letter-spacing:-.02em;margin:0;color:#f0f3ef}
.weapons-head small{display:block;font-size:calc(var(--ui-unit,1vw)*.55);letter-spacing:.12em;color:#9ea9a4;margin-bottom:calc(var(--ui-unit,1vw)*.35)}
.weapons-compass{display:block;width:calc(var(--ui-unit,1vw)*1.9);height:calc(var(--ui-unit,1vw)*1.9);color:#c2cec7;flex:none}.weapons-compass svg{width:100%;height:100%}
#close-weapons{margin-left:auto;display:grid;place-items:center;flex:none;width:calc(var(--ui-unit,1vw)*2.8);height:calc(var(--ui-unit,1vw)*2.8);padding:0;border:0;border-radius:50%;background:#8d9a9220;color:#cbd5cd;font-size:calc(var(--ui-unit,1vw)*2);line-height:1}
.weapons-body{flex:1;min-height:0;display:grid;grid-template-rows:minmax(0,1fr) calc(var(--ui-unit,1vw)*2) calc(var(--ui-unit,1vw)*6.8) calc(var(--ui-unit,1vw)*1.6);gap:calc(var(--ui-unit,1vw)*.75);padding:calc(var(--ui-unit,1vw)*1);box-sizing:border-box}
.weapon-tiles{display:grid;grid-template-columns:1fr;grid-template-rows:repeat(4,minmax(0,1fr));gap:calc(var(--ui-unit,1vw)*.6);min-height:0}
.weapon-tile{position:relative;display:grid;grid-template-columns:calc(var(--ui-unit,1vw)*2.7) minmax(0,1fr);grid-template-rows:auto auto;align-content:center;align-items:center;column-gap:calc(var(--ui-unit,1vw)*.8);row-gap:calc(var(--ui-unit,1vw)*.3);min-height:0;min-width:0;padding:calc(var(--ui-unit,1vw)*.65) calc(var(--ui-unit,1vw)*.8);box-sizing:border-box;border:1px solid #87988d22;border-radius:calc(var(--ui-unit,1vw)*.8);background:rgba(108,126,114,.1);color:#c5cdc7;font-size:calc(var(--ui-unit,1vw)*1.15);font-weight:400;letter-spacing:0;line-height:1.1;text-align:left}
.weapon-tile>svg{grid-column:1;grid-row:1/3;width:calc(var(--ui-unit,1vw)*2.5);height:calc(var(--ui-unit,1vw)*2.5);stroke-width:1.55;flex:none;color:#b8c7bd}
.weapon-tile>span{grid-column:2;grid-row:1;max-width:100%}.weapon-tile small{grid-column:2;grid-row:2;font-size:calc(var(--ui-unit,1vw)*.55);font-weight:400;letter-spacing:.055em;color:#8d9c93;line-height:1.1}
.weapon-tile.selected{background:rgba(153,175,157,.16);border-color:#b8cbb86b;color:#f3f4e9;box-shadow:inset 3px 0 #bdc9b4}.weapon-tile.selected>svg{color:#e1e8d8}.weapon-tile.selected small{color:#adbbb0}
.weapon-tile.selected:after{content:'';position:absolute;right:calc(var(--ui-unit,1vw)*.55);top:calc(var(--ui-unit,1vw)*.55);width:calc(var(--ui-unit,1vw)*.35);height:calc(var(--ui-unit,1vw)*.35);border-radius:50%;background:#d4ddb9}
.weapon-telemetry{display:flex;align-items:center;justify-content:space-between;gap:calc(var(--ui-unit,1vw)*.5);margin:0;padding:0 calc(var(--ui-unit,1vw)*.2);font-size:calc(var(--ui-unit,1vw)*.55);letter-spacing:.01em;color:#99a69d;white-space:nowrap}.weapon-telemetry span{display:inline-flex;align-items:center;gap:calc(var(--ui-unit,1vw)*.3)}.weapon-telemetry b{font-weight:500;color:#d6ded3}.armed #weapon-status{color:#e0b891}
.console-status-dot{display:inline-block;width:calc(var(--ui-unit,1vw)*.35);height:calc(var(--ui-unit,1vw)*.35);background:#d29a72;border-radius:50%}
.weapon-controls{display:block;min-width:0}
#fire-weapons{position:relative;display:flex;align-items:center;justify-content:center;gap:calc(var(--ui-unit,1vw)*.9);width:100%;height:100%;padding:0;border:1px solid #c5634d;border-radius:calc(var(--ui-unit,1vw)*.9);background:repeating-linear-gradient(135deg,#ffffff0b 0,#ffffff0b 7px,#461a1433 7px,#461a1433 14px),linear-gradient(#a43c32,#7f2923);color:#ffdfd2;font-size:calc(var(--ui-unit,1vw)*1.7);font-weight:500;letter-spacing:.12em;line-height:1;box-shadow:inset 0 1px #f3bc9a33,0 2px 5px #0003}
#fire-weapons.ready{border-color:#e9976b;background:repeating-linear-gradient(135deg,#ffffff12 0,#ffffff12 7px,#4f1c1330 7px,#4f1c1330 14px),linear-gradient(#b44837,#903025);color:#fff0e2;box-shadow:inset 0 1px #f3c69755,0 2px 6px #0003}
#fire-weapons>svg{width:calc(var(--ui-unit,1vw)*2.8);height:calc(var(--ui-unit,1vw)*2.8);stroke-width:1.6;color:#f8d2b5}
#fire-weapons:active{filter:brightness(1.15)}
#weapon-hint{margin:0;align-self:center;text-align:center;font-size:calc(var(--ui-unit,1vw)*.6);line-height:1.2;color:#97a69c}
#weapons-panel button:focus-visible{outline:2px solid #e3d5aa;outline-offset:-3px}
.weapons-toggle>svg{width:calc(var(--ui-unit,1vw)*1.65);height:calc(var(--ui-unit,1vw)*1.65);flex:none}
.weapons-dot{margin-left:auto;flex:none;width:calc(var(--ui-unit,1vw)*.55);height:calc(var(--ui-unit,1vw)*.55);border-radius:50%;background:#89958d}.weapons-toggle.active .weapons-dot{background:#3f9965;box-shadow:0 0 5px #39965b88}
/* Weapons and targeting share the image area without changing the base viewport. */
body #display.overlays-split #targeting{left:31.5%!important;top:3.1%!important;width:39%;height:93.8%;max-height:93.8%;min-height:0;aspect-ratio:auto;cursor:default;box-sizing:border-box}
/* Synchronized colored glare on the image screen and the window perimeter. */
#weapon-fire-wash{position:absolute;inset:0;z-index:31;pointer-events:none;opacity:0;border-radius:inherit;--weapon-glare:255,100,85;background:linear-gradient(90deg,rgba(var(--weapon-glare),.72),rgba(var(--weapon-glare),.2) 4%,transparent 12%,transparent 88%,rgba(var(--weapon-glare),.2) 96%,rgba(var(--weapon-glare),.72)),linear-gradient(0deg,rgba(var(--weapon-glare),.6),rgba(var(--weapon-glare),.12) 6%,transparent 15%,transparent 85%,rgba(var(--weapon-glare),.12) 94%,rgba(var(--weapon-glare),.6));box-shadow:inset 0 0 22px 3px rgba(var(--weapon-glare),.75);mix-blend-mode:screen}
#weapon-window-glow{position:absolute;z-index:29;right:3%;top:3.1%;bottom:3.1%;width:25%;box-sizing:border-box;pointer-events:none;opacity:0;--weapon-glare:255,100,85;border:3px solid rgb(var(--weapon-glare));border-radius:calc(var(--ui-unit,1vw)*1.3);box-shadow:0 0 12px 5px rgba(var(--weapon-glare),.65),inset 0 0 8px rgba(var(--weapon-glare),.7);mix-blend-mode:screen}
#weapon-fire-wash[data-system="laser"],#weapon-window-glow[data-system="laser"]{--weapon-glare:255,100,85}
#weapon-fire-wash[data-system="ion"],#weapon-window-glow[data-system="ion"]{--weapon-glare:112,217,255}
#weapon-fire-wash[data-system="torpedo"],#weapon-window-glow[data-system="torpedo"]{--weapon-glare:228,166,255}
#weapon-fire-wash[data-system="missile"],#weapon-window-glow[data-system="missile"]{--weapon-glare:255,209,122}
#weapon-fire-wash[data-system="laser"].active,#weapon-window-glow[data-system="laser"].active{animation:weapon-glass-glare .2s ease-out 3 both}
#weapon-fire-wash[data-system="ion"].active,#weapon-window-glow[data-system="ion"].active{animation:weapon-ion-glare .7s ease-out both}
#weapon-fire-wash[data-system="torpedo"].active,#weapon-window-glow[data-system="torpedo"].active{animation:weapon-glass-glare .95s ease-in-out both}
#weapon-fire-wash[data-system="missile"].active,#weapon-window-glow[data-system="missile"].active{animation:weapon-glass-glare .45s ease-out both}
@keyframes weapon-glass-glare{0%{opacity:0}18%{opacity:1}38%{opacity:.75}100%{opacity:0}}
@keyframes weapon-ion-glare{0%{opacity:0}15%{opacity:1}25%{opacity:.25}35%{opacity:.9}50%{opacity:.35}100%{opacity:0}}

/* Large square FIRE fills the lower portion of the right window. */
.weapons-body{grid-template-rows:minmax(0,1fr) calc(var(--ui-unit,1vw)*1.4) auto calc(var(--ui-unit,1vw)*1.3);gap:calc(var(--ui-unit,1vw)*.6)}
.weapon-tiles{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:calc(var(--ui-unit,1vw)*.5)}
.weapon-tile{grid-template-columns:calc(var(--ui-unit,1vw)*1.8) minmax(0,1fr);column-gap:calc(var(--ui-unit,1vw)*.45);row-gap:calc(var(--ui-unit,1vw)*.2);padding:calc(var(--ui-unit,1vw)*.4);font-size:calc(var(--ui-unit,1vw)*1.03)}
.weapon-tile>svg{width:calc(var(--ui-unit,1vw)*1.8);height:calc(var(--ui-unit,1vw)*1.8)}.weapon-tile small{font-size:calc(var(--ui-unit,1vw)*.43);letter-spacing:0}
.weapon-controls{aspect-ratio:1/1;width:100%;height:auto}
#fire-weapons{flex-direction:column;gap:calc(var(--ui-unit,1vw)*1.3);font-size:calc(var(--ui-unit,1vw)*2.7);letter-spacing:.14em;border-radius:calc(var(--ui-unit,1vw)*1.1)}
#fire-weapons>svg{width:calc(var(--ui-unit,1vw)*5);height:calc(var(--ui-unit,1vw)*5);stroke-width:1.3}

/* Modern target: scale the complete dashboard from a 1920 x 1080 plane. */
body[data-device-layout="full"] main{width:1920px;height:1080px;--ui-unit:13.968px;padding:21.6px 21.6px 14.4px}
body[data-device-layout="full"]{position:relative;display:block;min-height:0;height:var(--viewport-height,100vh);padding:env(safe-area-inset-top,0px) env(safe-area-inset-right,0px) env(safe-area-inset-bottom,0px) env(safe-area-inset-left,0px);overflow:hidden}
body[data-device-layout="full"] main{position:absolute;min-width:0;min-height:0;max-width:none;max-height:none;aspect-ratio:auto;margin:0;transform:scale(var(--dashboard-scale,0));transform-origin:0 0;border-radius:0;touch-action:auto}