:root{--bg:#0a1425;--panel:#12233b;--line:#30475d;--fg:#e8f1fb;--muted:#a5bbce;--accent:#4ab8f6;--green:#68dfbb}*{box-sizing:border-box}body{margin:0;font:15px system-ui,Segoe UI,Arial;color:var(--fg);background:var(--bg)}.wrap{max-width:1210px;margin:auto;padding:24px}.hero{padding:25px;background:linear-gradient(120deg,#162d48,#133f5b);border-radius:18px;margin-bottom:18px}h1{font-size:27px;margin:4px 0}h2{font-size:19px;margin:0 0 14px}h3{font-size:16px}p{line-height:1.55}.small,.muted{font-size:13px;color:var(--muted)}.brand{font-weight:800;letter-spacing:.13em;color:#bceaff}.figure{height:150px;border:1px dashed #6484a0;border-radius:12px;display:grid;place-items:center;color:#b1c9df;text-align:center;margin:15px 0;background:#102238}.layout{display:grid;grid-template-columns:minmax(320px,1fr) minmax(330px,1fr);gap:18px}.card{border:1px solid var(--line);border-radius:14px;background:var(--panel);padding:20px;margin-bottom:18px}.fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.field label{display:block;font-size:12px;color:#c6d7e5;margin-bottom:5px}.field input,.field select,select{background:#08192c;border:1px solid #476179;border-radius:8px;color:var(--fg);width:100%;padding:10px;font:inherit}.field small{color:var(--muted)}.tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:15px}button{cursor:pointer;background:#1c3651;border:1px solid #5480a1;color:white;border-radius:9px;padding:11px 15px;font-weight:600}button.active,button.primary{background:#0878b5;border-color:#31b0eb}button:disabled{opacity:.4}.hidden{display:none!important}.kpis{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.kpi{background:#091c30;border-radius:10px;padding:13px}.kpi strong{font-size:24px;display:block;color:#79cfff}.kpi span{font-size:12px;color:#afc5d5}.alert{background:#403417;border-left:3px solid #ffc46e;padding:12px;margin-top:13px;border-radius:6px}.good{background:#123c33;border-left:3px solid var(--green);padding:12px;margin-top:13px;border-radius:6px}canvas{width:100%;height:230px;background:#091b2c;border-radius:9px}.tankStage{height:285px;display:flex;align-items:center;justify-content:center;gap:24px}.tank{position:relative;width:155px;height:235px;border:5px solid #a7c0d3;border-radius:54px;overflow:hidden;background:#06111c}.gas{position:absolute;top:0;left:0;right:0;background:#e6c66e;transition:height .15s}.water{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(#4dc4ed,#116bac);transition:height .15s}.dividerTank{position:absolute;left:0;right:0;height:5px;background:#dce8ed;transition:top .15s}.legend{font-size:13px;line-height:2}.legend b{color:#fff}.range{width:100%}.row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.results{min-height:120px}.equations{font-family:ui-monospace,monospace;font-size:13px;color:#c3e8fe;overflow-wrap:anywhere}.foot{color:#c3d2df;font-size:12px}body.light{--bg:#f3f7fb;--panel:white;--line:#ccdae8;--fg:#14273a;--muted:#456079}body.light .field input,body.light .field select{color:#123;background:#f5faff}body.light .kpi{background:#eaf3fa}body.light .kpi span{color:#345}body.light .legend b{color:#153}body.light .equations{color:#16649a}@media(max-width:850px){.layout{grid-template-columns:1fr}.wrap{padding:12px}.fields{grid-template-columns:1fr 1fr}}@media(max-width:450px){.fields,.kpis{grid-template-columns:1fr}}.steps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.steps>div{padding:16px;border:1px solid var(--line);border-radius:10px;background:rgba(66,153,210,.08)}.equation-detail{padding:16px;border-radius:8px;background:#081c30;border-left:3px solid #5ad0fa;font-family:ui-monospace,monospace;line-height:2;color:#d7eeff;overflow-wrap:anywhere;margin:12px 0 18px}body.light .equation-detail{background:#eaf4fd;color:#204463}@media(max-width:650px){.steps{grid-template-columns:1fr}}@media print{button,.tabs,.row{display:none!important}body{background:white;color:black}.card{break-inside:avoid}} 
:root{color-scheme:dark;--input:#0b1b2d;--subpanel:#0b1d31;--hero:linear-gradient(120deg,#162d48,#133f5b);--label:#d6e6f3;--kpi:#8fdbff;--good-bg:#153d32;--good-text:#d1f9e6;--warn-bg:#403417;--warn-text:#ffe4b2;--plot:#0b1d31;--plot-text:#c6dbea;--grid:#30485f;--diagram:#0d2239;--diagram-box:#183d5a;--diagram-text:#e9f7ff;--pipe:#72d7ff;--button:#1c3651}
body.light{color-scheme:light;--input:#f5f9fd;--subpanel:#eaf3fa;--hero:linear-gradient(120deg,#e2effb,#d3edf7);--label:#243e54;--kpi:#075d8d;--good-bg:#e1f3e9;--good-text:#154c34;--warn-bg:#fff0d5;--warn-text:#65400b;--plot:#f7fbff;--plot-text:#25455e;--grid:#c7d9e7;--diagram:#eff6fc;--diagram-box:#dcebf6;--diagram-text:#163c57;--pipe:#1677a0;--button:#e2eef7}
.hero{background:var(--hero);color:var(--fg)}.brand{color:var(--kpi)}.field label{color:var(--label)}select,.field input,.field select,body.light .field input,body.light .field select{background:var(--input);color:var(--fg);border-color:var(--line)}.kpi,body.light .kpi{background:var(--subpanel)}.kpi strong{color:var(--kpi)}.kpi span,body.light .kpi span,.foot{color:var(--muted)}.legend b,body.light .legend b{color:var(--fg)}button,.home-button{background:var(--button);color:var(--fg);border:1px solid var(--line);border-radius:9px;padding:11px 15px;font-size:13px;text-decoration:none;font-weight:600;display:inline-block}button.primary,button.active{color:white;background:#076a9e;border-color:#278fb9}.home-button:hover,button:hover{filter:brightness(1.12)}.good{background:var(--good-bg);color:var(--good-text)}.alert{background:var(--warn-bg);color:var(--warn-text)}canvas{background:var(--plot)}.equations,.equation-detail,body.light .equation-detail{color:var(--label);background:var(--subpanel)}#systemDiagram{background:var(--diagram)}#systemDiagram text{fill:var(--diagram-text)}#systemDiagram g[fill="none"]{stroke:var(--pipe)}#systemDiagram g[fill="#183d5a"]{fill:var(--diagram-box);stroke:var(--pipe)}#systemDiagram marker path{stroke:var(--pipe)}.row>label{min-width:140px;flex:0 1 190px;font-size:13px}.row>label>select{margin-top:5px}.tank{flex-shrink:0}input:focus-visible,select:focus-visible,button:focus-visible,a:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.legend{min-width:140px}.tankStage{gap:16px}#msg{overflow-wrap:anywhere}.units-note{font-size:12px;color:var(--muted)}@media(max-width:450px){.tankStage{flex-direction:column;height:auto;padding:15px 0}.row>label{flex:1 1 130px}.hero h1{font-size:23px}}@media print{body,body.light{--bg:white;--panel:white;--fg:#111;--muted:#333;--label:#222;--kpi:#123;--subpanel:#f1f4f8;--plot:#fff;--plot-text:#111;--diagram:#fff;--diagram-text:#111;--diagram-box:#eee;--pipe:#246}.hero{background:#eef3f8}.wrap{max-width:none}.layout{display:block}.home-button{display:none}.foot{color:#333}}