:root{color-scheme:dark;--bg:#07151b;--surface:#101f26;--surface2:#16272d;--line:#294049;--mint:#96e4c1;--sub:#8c9fa6;--white:#ecf2ed;--amber:#f0c88a;--blue:#83b8e9}
*{box-sizing:border-box}html{background:var(--bg)}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;background:#08171c;color:var(--white);-webkit-font-smoothing:antialiased}
button,input{font:inherit}.castor-shell{min-height:100vh;max-width:1700px;margin:0 auto;padding:0 26px 24px}
.topbar{height:82px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(140,187,187,.13);gap:20px}.identity{display:flex;align-items:center;gap:12px}
.logo{width:40px;height:40px;background:#a5e3ba;color:#142725;display:grid;place-items:center;border-radius:12px;font-weight:950;font-size:17px;letter-spacing:-1px;transform:rotate(-3deg)}.brand{font-size:15px;font-weight:760;letter-spacing:.19em}.brand small{display:block;font-size:10px;color:#829f9b;letter-spacing:.25em;margin-top:3px;font-weight:500}
.projecttag{border:1px solid #314b4f;background:#14262c;color:#aacac7;padding:9px 15px;border-radius:99px;font:11px ui-monospace,monospace;letter-spacing:.075em}.top-right{display:flex;align-items:center;gap:14px;color:#96aba9;font-size:11px}.live-dot{width:7px;height:7px;background:#83e6b2;border-radius:50%;box-shadow:0 0 10px rgba(101,244,177,.65);display:inline-block;margin-right:7px}.keyline{color:#b2c6c5;border:1px solid #31474d;padding:8px 10px;border-radius:6px}
.heading{padding:23px 0 18px;display:flex;gap:18px;align-items:end;justify-content:space-between}.eyebrow{font:11px ui-monospace,monospace;letter-spacing:.23em;color:var(--mint);margin-bottom:9px}.heading h1{font-size:clamp(26px,2.5vw,37px);font-weight:650;letter-spacing:-.055em;margin:0}.heading h1 em{font-weight:370;font-style:normal;color:#789e9f}.deck{font-size:12px;color:#91a9aa;margin-top:7px}.heading-right{text-align:right;font:10px ui-monospace,monospace;color:#7c9798;line-height:1.8}
.workspace{display:grid;grid-template-columns:minmax(245px,288px) minmax(420px,1fr) minmax(256px,293px);gap:15px;align-items:stretch}.surface{background:linear-gradient(154deg,#12232a,#0d1c23);border:1px solid #223942;border-radius:15px;overflow:hidden;min-width:0}
.side{padding:19px 18px 17px}.panel-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:19px}.section-title{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:#b6c9c7;font-weight:730}.counter{font:11px ui-monospace,monospace;color:#63888a}.subline{border-top:1px solid rgba(117,164,164,.13);padding-top:16px;margin-top:17px}
.control{margin-bottom:18px}.control-label{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:10px}.control-label span{font-size:12px;color:#a9bebc}.control-label output{color:#ecdfb6;font:12px ui-monospace,monospace}.control input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:3px;background:linear-gradient(90deg,#a4eac5 0%,#4e7875 66%,#2a4549 100%);border-radius:3px;outline:0;cursor:ew-resize}.control input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;background:#c1f3d7;border:3px solid #245451;border-radius:50%;box-shadow:0 0 0 3px #16302f}.control input[type=range]::-moz-range-thumb{width:11px;height:11px;background:#c1f3d7;border:2px solid #245451;border-radius:50%}.control small{display:block;color:#5c797c;font-size:10px;margin-top:8px}
.switchline{display:flex;align-items:center;justify-content:space-between;color:#b2c8c5;font-size:12px;padding:12px 0 2px;cursor:pointer}.switchline input{accent-color:#91e9bc;width:16px;height:16px}.preset-row{display:grid;grid-template-columns:1fr 1fr;gap:8px}.pill-btn{border:1px solid #33504d;background:#18302d;color:#afd6c7;border-radius:9px;padding:10px 7px;font-size:11px;cursor:pointer;transition:.15s}.pill-btn:hover,.pill-btn:focus-visible{border-color:#90d7b4}.pill-btn.active{background:#a6e2bf;color:#102922;font-weight:730}.action-btn{width:100%;border-radius:10px;border:1px solid #8acaa5;background:linear-gradient(100deg,#c1f0d5,#88cda9);color:#153129;font-weight:750;font-size:12px;cursor:pointer;padding:13px 15px;display:flex;gap:12px;align-items:center;justify-content:center}.action-btn:hover{filter:brightness(1.05)}.action-btn:disabled{filter:grayscale(.7);opacity:.6;cursor:default}.outline-btn{width:100%;border:1px solid #4b6260;background:#14272c;color:#d4e4df;border-radius:10px;padding:12px;font-size:12px;cursor:pointer}.outline-btn:hover{background:#1d383c}
.maincol{display:flex;flex-direction:column;gap:15px;min-width:0}.scene{height:486px;position:relative;background:radial-gradient(ellipse at 45% 75%,#21414a 0%,#10272f 51%,#0b1d26 100%)}.scene canvas{width:100%;height:100%;display:block;cursor:grab;touch-action:none}.scene canvas:active{cursor:grabbing}.scene-top{position:absolute;top:18px;left:20px;display:flex;gap:8px;pointer-events:none}.scene-label{padding:8px 11px;border:1px solid rgba(150,210,202,.22);background:rgba(5,24,26,.63);backdrop-filter:blur(9px);border-radius:8px;color:#d3e9df;font:10px ui-monospace,monospace;letter-spacing:.065em}.scene-label .circle{color:#b1f9d2;margin-right:5px}.scene-top.right{left:auto;right:20px}.scene-bottom{position:absolute;bottom:17px;left:17px;right:17px;display:flex;align-items:end;justify-content:space-between;gap:12px;pointer-events:none}.inlet-callout{padding:12px 14px;background:rgba(5,27,31,.77);border:1px solid rgba(119,180,169,.22);border-radius:10px;backdrop-filter:blur(6px);min-width:161px}.inlet-callout small{display:block;color:#89aba6;font:10px ui-monospace,monospace;letter-spacing:.06em}.inlet-callout strong{display:block;font-size:24px;letter-spacing:-.045em;margin-top:5px;font-weight:520}.inlet-callout strong span{font-size:12px;color:#91b2b2}.scene-hints{font:10px ui-monospace,monospace;color:#b5c3c1;text-align:right;line-height:1.8;text-shadow:0 1px 8px #071319}.scene-mode{position:absolute;right:17px;top:66px;background:rgba(9,30,35,.68);border:1px solid rgba(168,218,211,.17);color:#c5e7e1;font:10px ui-monospace,monospace;padding:8px 10px;border-radius:8px;cursor:pointer}.scene-mode:hover{background:#1f4245}
.chart-panel{padding:17px 20px 12px;min-height:233px}.chart-top{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:7px}.chart-legend{display:flex;gap:15px;color:#92aaa8;font:10px ui-monospace,monospace}.legend-swatch{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:5px}.chart-panel canvas{display:block;width:100%;height:163px}
.rightcol{display:flex;flex-direction:column;gap:15px}.telemetry{padding:20px 19px;flex:1}.metric{padding:13px 0;border-bottom:1px solid #263d44}.metric:last-child{border:0}.metric small{display:block;color:#829da1;font:10px ui-monospace,monospace;letter-spacing:.06em;text-transform:uppercase}.metric strong{display:block;margin-top:7px;font:24px ui-monospace,monospace;font-weight:460;letter-spacing:-.05em}.metric strong span{font-size:11px;color:#829da1;letter-spacing:0}.metric strong.mint{color:#abecca}.metric strong.amber{color:#e8bb80}.metric strong.blue{color:#a4cefa}.gauge{width:100%;height:5px;border-radius:8px;background:#243e43;margin-top:10px;overflow:hidden}.gauge-fill{height:100%;background:linear-gradient(90deg,#3bafaa,#c6f7be);width:12%;transition:width .22s}
.status{padding:16px 18px}.statusline{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:11px;color:#b9cfc8;margin-bottom:12px}.status-tag{padding:5px 8px;background:#1b4136;color:#a2e4bc;border:1px solid #376b53;border-radius:6px;font:10px ui-monospace,monospace}.status-tag.alert{color:#ffc38c;background:#4a3024;border-color:#755037}.meter{height:5px;border-radius:10px;background:#20363d;overflow:hidden}.meter>div{height:100%;width:0;background:#8de0b0;transition:width .25s}.status p{margin:11px 0 0;color:#7a9b9e;font:10px ui-monospace,monospace;line-height:1.55}
.footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 2px 0;color:#708c90;font:10px ui-monospace,monospace;flex-wrap:wrap}.footer strong{color:#a0cbb8;font-weight:500}.foot-buttons{display:flex;gap:7px}.foot-buttons button{font:10px ui-monospace,monospace;border:1px solid #3b5758;background:#142a2e;color:#afc7c4;border-radius:7px;padding:8px 11px;cursor:pointer}.foot-buttons button:hover{background:#2b4245}.time-small{font:11px ui-monospace,monospace;color:#acc4bd}
@media(max-width:1170px){.workspace{grid-template-columns:245px minmax(380px,1fr)}.rightcol{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr}.telemetry{display:grid;grid-template-columns:repeat(3,1fr);gap:0 25px}.telemetry .panel-header{grid-column:1/-1}.metric{min-width:0}.scene{height:455px}}
@media(max-width:800px){.castor-shell{padding:0 12px 18px}.heading-right,.projecttag,.top-right .keyline{display:none}.topbar{height:72px}.heading{padding:20px 5px 16px}.workspace{grid-template-columns:1fr}.side{order:2}.maincol{order:1}.rightcol{order:3;display:block}.scene{height:380px}.chart-panel{min-height:205px}.telemetry{display:grid;grid-template-columns:repeat(2,1fr);gap:0 14px}.heading h1{font-size:27px}.footer{line-height:1.5}.scene-label{font-size:9px}}
@media(max-width:480px){.scene{height:320px}.scene-hints{display:none}.scene-top.right{display:none}.inlet-callout{padding:9px 11px;min-width:0}.inlet-callout strong{font-size:18px}.control{margin-bottom:16px}.chart-panel{padding:14px}.chart-legend{gap:8px;font-size:9px}}
