:root{
  --bg:#070a10; --card:#0c1220; --mut:#93a4c7; --txt:#e7eeff;
  --pri:#2f6bff; --pri2:#1f4fe0; --ok:#2ee58f; --warn:#f1c46b; --bad:#ff5d5d;
  --r:18px;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial;
}
*{box-sizing:border-box}
body{margin:0;background:radial-gradient(1200px 700px at 20% -10%, #141f3a 0%, transparent 65%), var(--bg); color:var(--txt)}
.wrap{max-width:980px;margin:0 auto;padding:18px 14px 34px}
.top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:10px 8px 12px}
.h1{font-size:28px;font-weight:800}
.sub{color:var(--mut);margin-top:4px;font-size:13px}
.dot{opacity:.7}
.pill{display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);padding:10px 12px;border-radius:999px;color:var(--mut);white-space:nowrap}
.sep{opacity:.55}
.led{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.2)}
.led.ok{background:var(--ok);box-shadow:0 0 0 3px rgba(46,229,143,.12)}
.led.bad{background:var(--bad);box-shadow:0 0 0 3px rgba(255,93,93,.12)}
.card{background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
  border:1px solid rgba(255,255,255,.08); border-radius:var(--r); padding:14px; margin:12px 0; box-shadow:0 10px 30px rgba(0,0,0,.35)}
.card-h{font-weight:750;margin-bottom:12px}
.muted{color:var(--mut);font-weight:600}
.small{font-size:12px;line-height:1.35;margin-top:10px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.k{border:1px solid rgba(255,255,255,.06);border-radius:14px;padding:10px 12px;background:rgba(0,0,0,.15)}
.klabel{color:var(--mut);font-size:12px}
.kvalue{font-size:18px;font-weight:800;margin-top:6px}
.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
.btn{appearance:none;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);color:var(--txt);
  padding:10px 14px;border-radius:14px;font-weight:750;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;min-width:132px}
.btn.primary{background:linear-gradient(180deg,var(--pri),var(--pri2));border-color:rgba(0,0,0,.1)}
.btn:disabled{opacity:.55;cursor:not-allowed}

.chartBox{position:relative;border:1px solid rgba(255,255,255,.06);border-radius:16px;padding:10px;background:rgba(0,0,0,.18)}
.legend{display:flex;gap:14px;margin-top:8px;color:var(--mut);font-size:12px}
.sw{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:middle}
.sw1{background:#35c97b}.sw2{background:#f1c46b}.sw3{background:#7aa7ff}
.zones{display:flex;gap:14px;margin-top:6px;font-size:12px}
.z{color:var(--mut)} .z.g{color:var(--ok)} .z.y{color:var(--warn)} .z.r{color:var(--bad)}

.tableWrap{overflow:auto;border:1px solid rgba(255,255,255,.06);border-radius:16px;margin-top:12px}
table{width:100%;border-collapse:collapse;font-size:13px}
th,td{padding:10px 10px;border-bottom:1px solid rgba(255,255,255,.06);text-align:left;white-space:nowrap}
th{color:var(--mut);font-size:12px}
tr:last-child td{border-bottom:none}
.badge{padding:4px 8px;border-radius:999px;font-weight:800;font-size:12px;border:1px solid rgba(255,255,255,.10)}
.b_ok{color:var(--ok)} .b_warn{color:var(--warn)} .b_bad{color:var(--bad)}

.invGrid{display:grid;grid-template-columns:1fr;gap:10px}
@media(min-width:880px){.invGrid{grid-template-columns:1fr 1fr 1fr}}
.invCard{border:1px solid rgba(255,255,255,.06);border-radius:16px;padding:12px;background:rgba(0,0,0,.15)}
.invH{font-weight:900;margin-bottom:10px}
.invRow{display:flex;justify-content:space-between;gap:10px;color:var(--mut);margin:6px 0}
.invRow b{color:var(--txt)}
.decision{margin-top:12px;border:1px solid rgba(255,255,255,.06);border-radius:16px;padding:12px;background:rgba(0,0,0,.15);font-weight:650;line-height:1.35}

.diagGrid{display:grid;grid-template-columns:1fr;gap:10px}
@media(min-width:880px){.diagGrid{grid-template-columns:1fr 1fr 1fr}}
.diag{border:1px solid rgba(255,255,255,.06);border-radius:16px;padding:10px 12px;background:rgba(0,0,0,.15)}
.diagK{color:var(--mut);font-size:12px}
.diagV{font-weight:800;margin-top:6px}
.raw{margin-top:12px;background:rgba(0,0,0,.35);border:1px solid rgba(255,255,255,.06);border-radius:16px;padding:12px;max-height:320px;overflow:auto}
.foot{color:var(--mut);text-align:center;margin-top:18px;font-size:12px}

/* Montaje */
.montGrid{display:grid;grid-template-columns:1fr;gap:10px}
@media(min-width:880px){.montGrid{grid-template-columns:1fr 1fr}}
.montGrid2{display:grid;grid-template-columns:1fr;gap:10px;margin-top:10px}
@media(min-width:880px){.montGrid2{grid-template-columns:1fr 1.25fr}}
.montCard{border:1px solid rgba(255,255,255,.06);border-radius:16px;padding:12px;background:rgba(0,0,0,.15)}
.montH{font-weight:900;margin-bottom:10px}
.montRow{display:flex;justify-content:space-between;gap:10px;color:var(--mut);margin:6px 0}
.montRow b{color:var(--txt)}
.steps{margin:10px 0 0 16px;color:var(--txt);line-height:1.35}
.steps li{margin:10px 0}
.steps .t{font-weight:800}
.steps .m{color:var(--mut);font-size:12px;margin-top:4px}

/* Schematic */
.schem{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.tankbox{width:160px;border-radius:16px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.03);padding:12px}
.tH{font-size:18px;font-weight:1000}
.tS{color:var(--mut);font-size:12px;margin-top:2px}
.tMeta{margin-top:10px;font-size:12px;color:var(--mut)}
.pipe{flex:1;min-width:180px;display:flex;flex-direction:column;gap:8px;align-items:center;justify-content:center}
.pLine{height:6px;width:100%;border-radius:999px;background:linear-gradient(90deg, rgba(122,167,255,.15), rgba(46,229,143,.18));border:1px solid rgba(255,255,255,.08)}
.pTag{font-size:12px;color:var(--mut);border:1px solid rgba(255,255,255,.08);background:rgba(0,0,0,.18);padding:6px 10px;border-radius:999px}
.pTag.winter{border-color:rgba(241,196,107,.25)}

/* health pills */
.hp{display:inline-flex;align-items:center;gap:8px}
.dotH{width:10px;height:10px;border-radius:50%}
.dotG{background:rgba(46,229,143,.9)}
.dotY{background:rgba(241,196,107,.9)}
.dotR{background:rgba(255,93,93,.9)}

/* profile + thermal */
.montTop{display:flex;gap:10px;flex-wrap:wrap;align-items:stretch;justify-content:space-between;margin-bottom:10px}
.seg{display:flex;border:1px solid rgba(255,255,255,.10);border-radius:14px;overflow:hidden;background:rgba(0,0,0,.18)}
.segBtn{appearance:none;border:0;background:transparent;color:var(--mut);padding:10px 12px;font-weight:900;cursor:pointer;min-width:160px}
.segBtn.on{background:rgba(47,107,255,.22);color:var(--txt)}
.thermMini{display:grid;grid-template-columns:repeat(2, minmax(120px,1fr));gap:8px;border:1px solid rgba(255,255,255,.06);
  border-radius:16px;padding:10px;background:rgba(0,0,0,.15);min-width:320px}
.tRow{display:flex;justify-content:space-between;gap:10px;color:var(--mut)}
.tRow b{color:var(--txt)}