/* Quiet HUD glass changes the surface only; telemetry and command colors stay solid. */
:root{--hud-glass:rgba(7,19,31,.15)}
/* Pane opacity changes only on a visibility command, never on live telemetry.
   No blur, retained animation loop or permanent compositor hint is needed. */
:is(#bridgePanel,#sensorsPanel,#targetPanel)[data-pane-animated="true"]{transition:opacity var(--pane-fade-duration,220ms) ease-in-out}
:is(#bridgePanel,#sensorsPanel,#targetPanel)[data-pane-hidden="true"]{opacity:0;pointer-events:none}
@media(prefers-reduced-motion:reduce){:is(#bridgePanel,#sensorsPanel,#targetPanel)[data-pane-animated="true"]{transition:none}}
.target-console,#flightConsole>.panel,.view-tools .segmented,.alert-banner,#bridgePanel,#sensorsPanel,#enterpriseStatus .ship-status,#transportPanel,#warpLabel,.mission-briefing,.squadron-alert{
 background:var(--hud-glass);box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;
}
.red-alert .alert-banner{background:rgba(88,33,39,.15);box-shadow:inset 3px 0 #ff9a80}
#bridgePanel .shield-controls,#bridgePanel .proximity-readout,#sensorsPanel #saucerStrip{background:transparent;box-shadow:none}
.mission-badges span{background:var(--hud-glass)}
.target-console,.mission,.sensors,.alert-banner,.condition-rail,#flightConsole .panel,#transportPanel,#warpLabel{text-shadow:0 1px 3px #000}

/* Expanded controls keep their fixed footprint and their original command nodes. */
.target-console{--target-reference-top:10px;--target-reference-height:144px;top:var(--target-reference-top);height:var(--target-reference-height);grid-template-rows:60px 60px}
.target-heading{padding-right:118px;grid-template-columns:auto minmax(100px,1fr) auto minmax(0,1.3fr)}
#targetType{grid-column:1}#targetName{grid-column:2}#scanLabel{grid-column:3}#targetRange{grid-column:4}
.target-panel-toggle,.target-panel-hide{position:absolute;top:6px;width:25px;height:23px;padding:0;font-size:16px;line-height:21px;border-color:#8fc4db70;background:#102738b8}
.target-panel-toggle{right:36px}.target-panel-hide{right:7px;font-size:20px}
/* Labels shares the existing presentation owner; this header control stays
   outside the contact/tractor disclosure in both compact and expanded modes. */
.target-label-toggle{position:absolute;top:6px;right:65px;width:54px;min-width:54px;height:23px;padding:0 6px;font-size:11px;line-height:21px;white-space:nowrap;background:#101929bb;color:#a5b3c7}
.target-label-toggle[aria-pressed="true"]{background:#17493fe0;color:#d6fff2;border-color:#92e8d1}
.hud-restore-top{left:50%;right:auto;top:10px;transform:translateX(-50%)}
.target-command-strip{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:28px 28px;gap:4px;min-width:0}
.target-command-strip .target-actions,.target-secondary-actions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:28px;gap:4px;min-width:0}
.target-secondary-actions button{min-width:0;height:28px;font-size:12px;white-space:normal;line-height:1.15;overflow:hidden;text-overflow:ellipsis;padding:3px}
.target-secondary-actions button[aria-pressed=true]{background:linear-gradient(120deg,#28666b,#184854);border-color:#a2f4e7;color:#e1fff8;box-shadow:inset 3px 0 0 #a2f4e7}
.target-more-panel{display:contents}
.target-command-strip .tractor-controls{grid-column:1/-1;grid-row:2}
#targetRange{max-width:none}

/* 70px is less than half the 144px expanded desktop contact panel. */
.target-console[data-compact="true"]{height:70px;grid-template-columns:minmax(120px,1fr) minmax(340px,1.4fr);grid-template-rows:22px 28px;gap:2px 12px}
.target-console[data-compact="true"] .target-summary{display:contents}
.target-console[data-compact="true"] .target-heading{grid-column:1/-1;grid-row:1;height:22px;grid-template-columns:minmax(100px,1fr) auto minmax(0,1.45fr);gap:9px}
.target-console[data-compact="true"] #targetType{display:none}
.target-console[data-compact="true"] #targetName{grid-column:1;font-size:16px;line-height:22px;height:22px}
.target-console[data-compact="true"] #scanLabel{grid-column:2}
.target-console[data-compact="true"] #targetRange{grid-column:3;max-width:none;font-size:11px}
.target-console[data-compact="true"] .health{position:absolute;left:10px;right:10px;top:28px;height:2px;margin:0}
.target-console[data-compact="true"] #targetHint{grid-column:1;grid-row:2;height:26px;line-height:13px;font-size:11px;align-self:center;margin:0;overflow:hidden}
.target-console[data-compact="true"] .target-command-strip{grid-column:2;grid-row:2;display:grid;grid-template-columns:minmax(0,1fr) 48px;grid-template-rows:28px;gap:4px}
.target-console[data-compact="true"] .target-actions{grid-template-rows:28px}
.target-console[data-compact="true"] .target-actions button{height:28px;font-size:12px;line-height:12px;padding:1px 3px}
.target-console[data-compact="true"] .target-actions kbd{display:none}
.target-more-toggle{height:28px;min-width:0;padding:2px 5px;font-size:12px;border-color:#8fc4db70;color:#c8eafb}
.target-more-toggle[aria-expanded="true"]{background:#31596b;border-color:#a5e5ef}
.target-more-toggle[data-active="true"]{border-color:#a2f4e7;color:#d9fff2}
.target-console[data-compact="true"] .target-more-panel{display:grid;position:absolute;top:calc(100% + 5px);right:0;width:min(420px,100%);grid-template-columns:minmax(0,1fr);gap:8px;padding:10px;border:1px solid #8ac8e675;border-radius:6px;background:var(--hud-glass);text-shadow:0 1px 3px #000;z-index:6}
.target-console[data-compact="true"] .target-more-panel .tractor-controls{grid-column:auto;grid-row:auto;grid-template-columns:1fr;grid-template-rows:auto auto;gap:5px;border-top:1px solid #8ac8e640;padding-top:7px}
.target-console[data-compact="true"] .target-more-panel .tractor-heading{flex-direction:row;justify-content:space-between;height:auto;gap:10px;font-size:10px}
.target-console[data-compact="true"] .target-more-panel .tractor-heading strong{white-space:normal;height:auto;font-size:11px;line-height:14px}
.target-console[data-compact="true"] .target-more-panel .tractor-actions{grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}
.target-console[data-compact="true"] .target-more-panel button{min-height:30px}
.target-console[data-compact="true"] .target-more-panel #towOutpost{grid-column:span 2}
#sim .viewscreen-frame{top:var(--command-bottom)}

@media(max-width:1200px){
 .target-heading{grid-template-columns:minmax(90px,1fr) auto minmax(0,1.3fr)}
 #targetName{grid-column:1}#scanLabel{grid-column:2}#targetRange{grid-column:3}
}
@media(max-width:1150px){
 .target-console{--target-reference-height:194px;grid-template-rows:60px 108px}
 .target-command-strip{grid-template-columns:minmax(0,1fr);grid-template-rows:28px 28px 46px}
 .target-command-strip .tractor-controls{grid-row:3;grid-template-columns:1fr;grid-template-rows:14px 28px;gap:4px}
 .target-command-strip .tractor-heading{flex-direction:row;height:14px;gap:8px}
 .target-secondary-actions kbd{display:none}
 /* 94px stays below half of the 194px expanded panel, including on narrow screens. */
 .target-console[data-compact="true"]{height:94px;padding:6px 10px;grid-template-columns:minmax(0,1fr);grid-template-rows:32px 12px 28px;gap:3px}
 .target-console[data-compact="true"] .target-heading{height:32px;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:20px 12px;gap:0 6px}
 .target-console[data-compact="true"] #targetName{grid-column:1;grid-row:1;font-size:15px;line-height:20px;height:20px}
 .target-console[data-compact="true"] #scanLabel{grid-column:2;grid-row:1;padding:0 4px;font-size:10px;line-height:16px}
 .target-console[data-compact="true"] #targetRange{grid-column:1/-1;grid-row:2;max-width:100%;font-size:10px;line-height:12px}
 .target-console[data-compact="true"] .health{top:41px}
 .target-console[data-compact="true"] #targetHint{grid-column:1;grid-row:2;height:12px;line-height:12px;white-space:nowrap;text-overflow:ellipsis}
 .target-console[data-compact="true"] .target-command-strip{grid-column:1;grid-row:3;grid-template-columns:minmax(0,1fr) 48px}
 .target-console[data-compact="true"] .target-actions button{font-size:11px}
}
@media(max-width:700px){
 .target-console{--target-reference-top:100px}
 .hud-restore-top{top:69px}
 .target-console[data-compact="true"] .target-actions button{font-size:12px}
 #sim:is([data-target-compact="true"],[data-target-hidden="true"]) .alert-banner,#sim:is([data-target-compact="true"],[data-target-hidden="true"]) .sensors{top:calc(var(--command-bottom) + 12px)}
 #sim:is([data-target-compact="true"],[data-target-hidden="true"]) .mission{top:calc(var(--command-bottom) + 60px)}
 #sim:is([data-target-compact="true"],[data-target-hidden="true"]) .hud-restore-left{top:calc(var(--command-bottom) + 60px)}
 #sim:is([data-target-compact="true"],[data-target-hidden="true"]) .hud-restore-right{top:calc(var(--command-bottom) + 12px)}
}
