main{display:grid;grid-template-columns:240px minmax(480px,1fr) 290px;gap:16px;padding:20px;max-width:1800px;margin:auto}.workspace{display:grid;gap:16px}.panel{padding:18px}aside{display:grid;gap:16px;align-content:start}.readout{text-align:center;margin:18px 0}.readout strong{display:block;font-size:36px;color:#6ee7df}small{display:block;color:#8ca4b5;font-size:11px;letter-spacing:1px}em{font-size:14px;font-style:normal}.vertical{display:block;height:235px;margin:15px auto}button{margin-top:10px}label{display:block;margin:14px 0;color:#adc0cb;font-size:12px}label input:not(.vertical),select{width:100%;margin-top:8px}.limits,.loadrow{display:flex;justify-content:space-between;font-size:12px;padding:10px 0}.metrics,.diagnostics{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.metrics strong{display:block;color:#6ee7df;font-size:23px;margin-top:10px}.diagnostics{grid-template-columns:repeat(3,1fr)}.diagnostics strong{display:block;margin:10px 0}meter{width:100%;accent-color:#6ee7df}svg{width:100%;margin:20px 0;background:#091725;border:1px solid #234151}.lower{display:grid;grid-template-columns:1fr 1fr;gap:16px}.danger{border-color:#df6573;color:#ff9eaa}.emergency{border-color:#683644}dialog{background:#111c29;color:#d4e2ec;border:1px solid #df6573;padding:28px;max-width:420px}dialog::backdrop{background:#000b}footer button{margin:0}@media(max-width:1100px){main{grid-template-columns:200px minmax(0,1fr)}aside{grid-column:1/-1;grid-template-columns:repeat(3,1fr)}}@media(max-width:700px){main{display:block}.panel{margin-bottom:14px}aside,.lower{display:block}.metrics{grid-template-columns:1fr 1fr}}
.gauges{display:grid;grid-template-columns:1fr 1fr;gap:14px;text-align:center}.dial{--value:0;position:relative;width:110px;height:110px;margin:14px auto;border-radius:50%;background:conic-gradient(from 225deg,#6ee7df calc(var(--value)*2.7deg),#203a49 0deg 270deg,transparent 270deg);display:grid;place-items:center}.dial:before{content:'';position:absolute;inset:9px;border-radius:50%;background:#111c29}.dial strong{position:relative;color:#6ee7df;font-size:22px}.collector-blade{transition:transform .25s ease-out}.gauges small{font-size:10px}

.damage-control{margin-top:18px;border:1px solid #683644;border-radius:5px;padding:12px 16px}.damage-control label{margin:0 0 8px;color:#ff9eaa}.damage-control input{width:100%;accent-color:#ed6371}.damage-control .muted{display:block;margin-top:6px;font-size:11px}

.coolant-controls{border-top:1px solid #294454;margin-top:22px;padding-top:18px}.coolant-controls .loadrow{gap:8px;flex-wrap:wrap}.coolant-controls .sectiontitle{line-height:1.5}

.sync-control{display:flex;align-items:center;gap:14px}.sync-light{width:20px;height:20px;border-radius:50%;background:#ed6371;box-shadow:0 0 8px #ffffff20;flex-shrink:0}

.metrics{grid-template-columns:repeat(5,minmax(0,1fr))}.damage-readout label{margin:0;color:#8ca4b5;font-size:11px;letter-spacing:1px}.damage-readout>div{display:flex;align-items:center;margin-top:10px;color:#ff9eaa;font-size:23px}.damage-readout input{width:66px;padding:0;border:0;border-bottom:1px solid #683644;background:transparent;color:inherit;font:inherit;margin:0}.damage-readout input:focus{outline:1px solid #6ee7df}@media(max-width:800px){.metrics{grid-template-columns:repeat(2,minmax(0,1fr))}}

.temperature-gauge{height:12px;background:linear-gradient(to right,#203e48 0% 53.333%,#645127 53.333% 66.667%,#642f3a 66.667%);position:relative;margin-top:12px;border-radius:3px}.temperature-gauge>div{height:100%;border-radius:3px;transition:width .1s linear}.temp-marker{position:absolute;top:-4px;height:20px;width:2px}.danger-marker{left:53.333%;background:#efc574}.damage-marker{left:66.667%;background:#ed6371}.temp-legend{display:flex;justify-content:space-between;font-size:9px;margin-top:8px;color:#efc574}.temp-legend span:last-child{color:#ed6371}

.umbilical-indicator{display:flex;align-items:center;gap:10px;margin-top:18px;font-size:11px;color:#adc6d4}.umbilical-indicator .sync-light{width:16px;height:16px}

.demo-actions{display:flex;gap:10px;flex-wrap:wrap}

.component-repair{position:absolute;right:8px;top:4px}.component-repair button{width:28px;height:28px;padding:0;min-width:0;margin:0;font-size:18px}.panel>.sectiontitle,.coolant-controls>.sectiontitle{padding-right:28px}

#refillFuel{display:block;margin:12px auto 0}#refillFuel[hidden]{display:none}#fuelTimeRemaining{font-variant-numeric:tabular-nums;font-size:15px;margin-top:8px}

#fuelGauge>strong{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;width:100%;font-variant-numeric:tabular-nums}#fuelGaugeUnits{display:block;text-align:center;font-family:monospace;font-variant-numeric:tabular-nums}#fuelTimeRemaining{width:100%;text-align:center;font-family:monospace;font-variant-numeric:tabular-nums}

#effValue,#savingValue{display:block;width:100%;text-align:center;font-family:monospace;font-variant-numeric:tabular-nums}#flowValue{display:inline-block;min-width:5ch;text-align:center;font-family:monospace;font-variant-numeric:tabular-nums}