.diagnostic-launcher{position:fixed;right:16px;bottom:16px;z-index:80;border:1px solid #ffb703;background:#111317;color:#ffb703;padding:9px 11px;font:700 11px ui-monospace,monospace;letter-spacing:1.5px;box-shadow:3px 3px 0 #000}
.diagnostic-overlay{position:fixed;z-index:90;right:12px;top:12px;width:min(600px,45vw);max-height:calc(100dvh - 24px);overflow:auto;background:#111317;color:#eceff4;border:1px solid #4a6fa5;box-shadow:-10px 12px 40px #000b;font:11px ui-monospace,SFMono-Regular,Menlo,monospace;user-select:text}
.diagnostic-head{position:sticky;top:0;z-index:1;display:flex;justify-content:space-between;gap:10px;padding:14px;border-bottom:1px solid #4a6fa5;background:#1a1d24}
.diagnostic-head h2{margin:2px 0;font:700 18px/1 Impact,ui-sans-serif,sans-serif;letter-spacing:1px}
.diagnostic-head p,.diagnostic-kicker{margin:0;color:#9299a5;font-size:9px;letter-spacing:.7px}
.diagnostic-kicker{color:#ffb703}
.diagnostic-exit{display:grid;align-content:start;gap:5px}
.diagnostic-overlay button{border:1px solid #4a6fa5;background:#20242c;color:#eceff4;padding:7px 8px;font:inherit;font-size:9px;letter-spacing:.3px}
.diagnostic-overlay button:hover:not(:disabled){border-color:#ffb703;color:#ffb703}
.diagnostic-overlay button:disabled{opacity:.45}
.diagnostic-restore{border-color:#e63946!important}
.diagnostic-body{padding:10px;display:grid;gap:10px}
.diagnostic-section{border:1px solid #2e3440;padding:8px;display:grid;gap:7px}
.diagnostic-section h3{margin:0;color:#ffb703;font-size:9px;letter-spacing:.8px}
.diagnostic-buttons,.diagnostic-tick-row{display:flex;gap:5px;flex-wrap:wrap}
.diagnostic-tick-row input[type=range]{flex:1;min-width:160px;accent-color:#ffb703}
.diagnostic-tick-input{width:94px}
.diagnostic-overlay input,.diagnostic-overlay select{width:100%;min-width:0;background:#080a0d;color:#eceff4;border:1px solid #596575;padding:5px;font:inherit;font-size:10px}
.diagnostic-timeline,.diagnostic-legend,.diagnostic-status{margin:0;color:#9299a5;font-size:9px;line-height:1.45}
.diagnostic-status{color:#ffb703;min-height:13px}
.diagnostic-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
.diagnostic-fields label{display:grid;gap:3px;color:#b3bec9;font-size:8px;letter-spacing:.4px}
.diagnostic-check{display:flex!important;grid-column:1/-1;align-items:center;gap:6px}
.diagnostic-check input{width:auto}
.diagnostic-graph{width:100%;height:auto;display:block;background:#080a0d;border:1px solid #2e3440;cursor:crosshair}
.diagnostic-grid-line{stroke:#2e3440;stroke-width:1}
.diagnostic-cursor-line{stroke:#eceff4;stroke-width:1;stroke-dasharray:3 3}
.diagnostic-details summary{cursor:pointer;color:#ffb703}
.diagnostic-inspector{margin:8px 0 0;max-height:220px;overflow:auto;white-space:pre-wrap;color:#b3bec9;font:9px/1.42 ui-monospace,monospace}
.diagnostic-trace{margin:0;padding-left:18px;max-height:150px;overflow:auto}
.diagnostic-trace li{padding:3px 0;color:#b3bec9}
.diagnostic-event{color:#eceff4!important}
.diagnostic-command{color:#ffb703!important}
@media(max-width:760px){.diagnostic-overlay{right:0;left:0;top:auto;bottom:0;width:100%;max-height:78dvh;border-inline:0}
.diagnostic-head{position:sticky;top:0;z-index:1}
.diagnostic-fields{grid-template-columns:repeat(2,minmax(0,1fr))}
.diagnostic-launcher{right:9px;bottom:9px}
}


.diagnostic-head .diagnostic-status{color:#ffb703;letter-spacing:0}

/* Keep the full tactical console visible beside the deck on wide screens. */
@media (min-width:1000px){
  body.diagnostics-open #viewport-container{margin-left:max(16px,calc((100vw - min(600px,45vw) - 464px)/2));margin-right:0}
}
.diagnostic-tick-row .diagnostic-tick-input{width:94px;flex:0 0 94px}

.diagnostic-buttons a{color:#ffb703;padding:8px;border:1px solid #4a6fa5;text-decoration:none}
