:root{font-family:Inter,ui-sans-serif,system-ui,Arial;color:#d8f3ff;background:#05111c;font-size:12px}*{box-sizing:border-box}body{margin:0;overflow:hidden}#viewport{position:fixed;inset:0}#viewport canvas{display:block;width:100%;height:100%}#hud{position:absolute;inset:0;pointer-events:none}#hud button,#hud input,.panel{pointer-events:auto}header{position:absolute;top:22px;left:25px;right:25px;display:flex;justify-content:space-between;align-items:start}h1{font-size:28px;letter-spacing:5px;font-weight:850;margin:0}h1 span{font-weight:250;color:#33cce9}.eyebrow{font-size:9px;letter-spacing:3px;color:#64acbf;margin-bottom:6px}header p{margin:4px 0;color:#77a9ba;letter-spacing:1.5px;font-size:9px}.pill{background:#042b33d9;border:1px solid #159b9e;padding:9px 15px;color:#43efc5;border-radius:3px;font-size:10px;letter-spacing:1px}#metrics{display:flex;gap:7px;position:absolute;top:105px;left:25px;right:25px;max-width:860px}.metric{min-width:0;flex:1;padding:11px;background:#081927e5;border:1px solid #21465b;border-top:2px solid #28b4d7;display:flex;flex-direction:column;gap:2px}.metric span{color:#80b8c7;font-size:9px;letter-spacing:1px}.metric strong{font-size:23px;font-weight:650;letter-spacing:-1px}.metric small{font-size:9px;color:#688d9c}.panel{background:#061521ed;border:1px solid #24475a;box-shadow:0 10px 40px #0008;border-radius:3px}.controls{position:absolute;left:25px;top:203px;width:265px;padding:13px}.panelhead{display:flex;justify-content:space-between;align-items:center;color:#b6e4f3;letter-spacing:1.2px;font-size:10px;margin-bottom:14px}.panelhead small{color:#64899b;font-size:9px}button{border:1px solid #2a586e;background:#102b3c;color:#b3eaf8;border-radius:2px;padding:8px 9px;cursor:pointer;font-size:10px;letter-spacing:.4px}button:hover{background:#17465b}#togglePanel{padding:1px 8px}.controls label{display:block;font-size:9px;letter-spacing:1px;color:#8ebed0;margin-bottom:12px}.controls em{float:right;font-style:normal;color:#41d8e2}.controls input{display:block;width:100%;margin:8px 0 0;accent-color:#24b9d0;height:5px}.buttons{display:flex;gap:7px;margin:9px 0}.buttons button{flex:1}#emergency{border-color:#9e364c;color:#ff9ba7}.legend{margin-top:11px;line-height:1.5;color:#6c94a5;font-size:10px}.chartpanel{position:absolute;bottom:57px;right:25px;width:360px;padding:12px}.chartpanel canvas{width:100%;height:110px}.chartlegend{display:flex;justify-content:space-between;color:#8eb5c6;font-size:9px}.chartlegend span:nth-child(1){color:#4de5c8}.chartlegend span:nth-child(2){color:#f5b15a}.chartlegend span:nth-child(3){color:#6cbbff}#selection{position:absolute;right:25px;top:203px;width:250px;padding:13px;color:#8eb5c6}#selection b{font-size:10px;color:#c2e7f5;letter-spacing:1px}#selectionBody{font-size:11px;line-height:1.55;margin-top:10px;white-space:pre-line}footer{position:absolute;bottom:16px;left:25px;right:25px;display:flex;justify-content:space-between;color:#86b2c4;letter-spacing:1px;font-size:9px}#load{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;background:#03101c;z-index:5;color:#4fe0ef;font-weight:600;letter-spacing:3px;font-size:15px}#loadDetail{margin-top:14px;color:#678d9c;font-size:10px;letter-spacing:1px}#crosshair{position:absolute;left:50%;top:50%;color:#7edce0;opacity:.4;pointer-events:none}@media(max-width:850px){header{top:10px;left:10px;right:10px}h1{font-size:18px}header p{display:none}#metrics{top:66px;left:10px;right:10px}.metric{padding:7px}.metric strong{font-size:15px}.metric span{font-size:7px}.controls{top:138px;left:10px;width:225px}.chartpanel{right:10px;bottom:34px;width:230px}#selection{right:10px;top:138px;width:180px}footer{left:10px;right:10px;font-size:7px}}@media(max-width:530px){#selection{display:none}.chartpanel{width:180px}.controls{width:200px}.metric:nth-child(4),.metric:nth-child(5){display:none}}
