/* ============================================================
   BioTwin - Biofiltration Digital Twin
   SCADA / water-technology interface styles
   ============================================================ */

:root{
  --font-display:'Sora',system-ui,sans-serif;
  --font-body:'IBM Plex Sans',system-ui,sans-serif;
  --font-mono:'IBM Plex Mono','SFMono-Regular',monospace;

  --aqua:#21c4a6;
  --aqua-bright:#3fe0c5;
  --cyan:#37b6e9;
  --leaf:#6fd36b;
  --amber:#f5b54a;
  --danger:#ff6b6b;
}

/* ---- DARK (default) ---- */
[data-bs-theme="dark"]{
  --bg:#06121a;
  --bg-grad-1:#082230;
  --bg-grad-2:#04101a;
  --panel:#0e2230;
  --panel-2:#0a1c28;
  --panel-line:#1a3a48;
  --ink:#e7f6f5;
  --ink-soft:#9fc0c4;
  --ink-dim:#6f9197;
  --tile:#0c2030;
  --tile-line:#173644;
  --shadow:0 18px 50px rgba(0,0,0,.45);
  --grid-line:rgba(63,224,197,.05);
  --gauge-track:rgba(255,255,255,.09);
}

/* ---- LIGHT ---- */
[data-bs-theme="light"]{
  --bg:#eef4f3;
  --bg-grad-1:#e3efee;
  --bg-grad-2:#f4f9f8;
  --panel:#ffffff;
  --panel-2:#f3f8f7;
  --panel-line:#d6e6e3;
  --ink:#0d2b30;
  --ink-soft:#3f6166;
  --ink-dim:#6a868a;
  --tile:#ffffff;
  --tile-line:#dceae8;
  --shadow:0 12px 34px rgba(20,60,60,.12);
  --grid-line:rgba(14,124,123,.06);
  --gauge-track:rgba(13,43,48,.10);
}

*{box-sizing:border-box;}
html,body{height:100%;}
body.bt-body{
  margin:0;
  font-family:var(--font-body);
  color:var(--ink);
  background:
    radial-gradient(1200px 600px at 85% -10%, rgba(55,182,233,.10), transparent 60%),
    radial-gradient(900px 500px at -5% 110%, rgba(33,196,166,.10), transparent 55%),
    linear-gradient(160deg,var(--bg-grad-1),var(--bg-grad-2));
  background-attachment:fixed;
  -webkit-font-smoothing:antialiased;
}

/* ---------------- shell layout ---------------- */
.bt-shell{display:flex;min-height:100vh;}
.bt-main{flex:1;min-width:0;display:flex;flex-direction:column;}
.bt-content{padding:1.6rem 1.8rem 3rem;max-width:1500px;width:100%;margin:0 auto;}

/* ---------------- sidebar ---------------- */
.bt-sidebar{
  width:258px;flex-shrink:0;position:sticky;top:0;height:100vh;
  display:flex;flex-direction:column;
  background:linear-gradient(180deg,var(--panel),var(--panel-2));
  border-right:1px solid var(--panel-line);
  padding:1.2rem 0;z-index:40;
}
.bt-brand{display:flex;align-items:center;gap:.7rem;padding:0 1.3rem 1.2rem;}
.bt-brand__mark{
  width:42px;height:42px;border-radius:13px;display:grid;place-items:center;
  font-size:1.3rem;color:#04231f;
  background:linear-gradient(135deg,var(--aqua),var(--cyan));
  box-shadow:0 6px 18px rgba(33,196,166,.4);
}
.bt-brand__text{display:flex;flex-direction:column;line-height:1.05;}
.bt-brand__name{font-family:var(--font-display);font-weight:800;font-size:1.18rem;letter-spacing:-.02em;}
.bt-brand__tag{font-size:.66rem;text-transform:uppercase;letter-spacing:.18em;color:var(--ink-dim);}

.bt-nav{display:flex;flex-direction:column;gap:.15rem;padding:.4rem .8rem;flex:1;overflow-y:auto;}
.bt-nav__section{
  font-size:.62rem;text-transform:uppercase;letter-spacing:.22em;color:var(--ink-dim);
  padding:.9rem .7rem .35rem;font-weight:600;
}
.bt-nav__link{
  display:flex;align-items:center;gap:.8rem;padding:.62rem .75rem;border-radius:11px;
  color:var(--ink-soft);text-decoration:none;font-weight:500;font-size:.93rem;
  transition:background .15s,color .15s,transform .15s;position:relative;
}
.bt-nav__link i{font-size:1.12rem;width:1.3rem;text-align:center;}
.bt-nav__link:hover{background:rgba(63,224,197,.08);color:var(--ink);}
.bt-nav__link--active{
  background:linear-gradient(100deg,rgba(33,196,166,.18),rgba(55,182,233,.06));
  color:var(--ink);
}
.bt-nav__link--active::before{
  content:"";position:absolute;left:-.8rem;top:.4rem;bottom:.4rem;width:3px;border-radius:3px;
  background:linear-gradient(var(--aqua),var(--cyan));
}

.bt-sidebar__foot{padding:1rem 1.3rem .2rem;border-top:1px solid var(--panel-line);margin-top:.5rem;}
.bt-mini-stat{display:flex;justify-content:space-between;align-items:baseline;padding:.28rem 0;}
.bt-mini-stat__k{font-size:.72rem;color:var(--ink-dim);text-transform:uppercase;letter-spacing:.08em;}
.bt-mini-stat__v{font-family:var(--font-mono);font-size:.85rem;color:var(--aqua-bright);font-weight:600;}
.bt-sidebar__ver{display:block;margin-top:.7rem;font-size:.66rem;color:var(--ink-dim);font-family:var(--font-mono);}

.bt-sidebar-backdrop{display:none;}

/* ---------------- topbar ---------------- */
.bt-topbar{
  position:sticky;top:0;z-index:30;
  display:flex;align-items:center;gap:1rem;
  padding:.85rem 1.8rem;
  background:color-mix(in srgb,var(--panel) 80%,transparent);
  backdrop-filter:blur(14px);
  border-bottom:1px solid var(--panel-line);
}
.bt-burger{display:none;background:none;border:0;color:var(--ink);font-size:1.5rem;cursor:pointer;}
.bt-topbar__title{display:flex;align-items:center;gap:.9rem;flex:1;min-width:0;}
.bt-topbar__page{font-family:var(--font-display);font-weight:700;font-size:1.12rem;letter-spacing:-.01em;white-space:nowrap;}
.bt-live{
  display:inline-flex;align-items:center;gap:.4rem;font-family:var(--font-mono);font-size:.66rem;
  letter-spacing:.18em;color:var(--leaf);padding:.18rem .5rem;border-radius:20px;
  border:1px solid rgba(111,211,107,.35);background:rgba(111,211,107,.08);
}
.bt-live__dot{width:7px;height:7px;border-radius:50%;background:var(--leaf);animation:pulse 1.6s infinite;}
@keyframes pulse{0%,100%{opacity:1;box-shadow:0 0 0 0 rgba(111,211,107,.5);}50%{opacity:.5;box-shadow:0 0 0 5px rgba(111,211,107,0);}}

.bt-topbar__right{display:flex;align-items:center;gap:.9rem;}
.bt-scenario{display:flex;align-items:center;gap:.5rem;}
.bt-scenario__label{font-size:.7rem;text-transform:uppercase;letter-spacing:.12em;color:var(--ink-dim);margin:0;}
.bt-scenario__select{width:auto;background:var(--tile);border-color:var(--tile-line);color:var(--ink);font-size:.85rem;}
.bt-icon-btn{
  width:38px;height:38px;border-radius:11px;border:1px solid var(--tile-line);background:var(--tile);
  color:var(--ink-soft);font-size:1.1rem;cursor:pointer;display:grid;place-items:center;transition:.15s;
}
.bt-icon-btn:hover{color:var(--aqua-bright);border-color:var(--aqua);}

.bt-user{display:flex;align-items:center;gap:.6rem;background:var(--tile);border:1px solid var(--tile-line);
  border-radius:12px;padding:.32rem .6rem .32rem .35rem;cursor:pointer;color:var(--ink);}
.bt-user__avatar{width:32px;height:32px;border-radius:9px;display:grid;place-items:center;font-weight:700;
  color:#04231f;background:linear-gradient(135deg,var(--aqua),var(--cyan));font-family:var(--font-display);}
.bt-user__meta{display:flex;flex-direction:column;line-height:1.05;text-align:left;}
.bt-user__name{font-size:.82rem;font-weight:600;}
.bt-user__role{font-size:.66rem;color:var(--ink-dim);text-transform:uppercase;letter-spacing:.1em;}

/* ---------------- generic panels / cards ---------------- */
.bt-card{
  background:linear-gradient(180deg,var(--panel),var(--panel-2));
  border:1px solid var(--panel-line);border-radius:18px;padding:1.25rem;box-shadow:var(--shadow);
  position:relative;overflow:hidden;
}
.bt-card__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem;gap:.6rem;}
.bt-card__title{font-family:var(--font-display);font-weight:700;font-size:1rem;display:flex;align-items:center;gap:.55rem;}
.bt-card__title i{color:var(--aqua);}
.bt-card__sub{font-size:.78rem;color:var(--ink-dim);}

.bt-section-title{font-family:var(--font-display);font-weight:700;font-size:1.15rem;margin:.2rem 0 1rem;
  display:flex;align-items:center;gap:.6rem;}
.bt-section-title i{color:var(--cyan);}

/* ---------------- telemetry tiles ---------------- */
.bt-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(176px,1fr));gap:1rem;}
.bt-tile{
  background:linear-gradient(165deg,var(--tile),var(--panel-2));
  border:1px solid var(--tile-line);border-radius:16px;padding:1rem 1.05rem;position:relative;overflow:hidden;
  animation:tileIn .5s ease both;
}
.bt-tile::after{content:"";position:absolute;inset:0;background:
  linear-gradient(120deg,transparent 60%,rgba(63,224,197,.05));pointer-events:none;}
.bt-tile__top{display:flex;align-items:center;justify-content:space-between;}
.bt-tile__label{font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;color:var(--ink-dim);font-weight:600;}
.bt-tile__icon{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;font-size:.95rem;
  color:var(--aqua-bright);background:rgba(33,196,166,.1);border:1px solid rgba(33,196,166,.2);}
.bt-tile__value{font-family:var(--font-mono);font-weight:600;font-size:1.9rem;letter-spacing:-.02em;margin-top:.55rem;line-height:1;
  transition:color .3s;}
.bt-tile__unit{font-size:.85rem;color:var(--ink-soft);font-weight:500;margin-left:.2rem;}
.bt-tile__spark{height:30px;margin-top:.55rem;}
.bt-tile--warn .bt-tile__value{color:var(--amber);}
.bt-tile--crit .bt-tile__value{color:var(--danger);}
.bt-tile--good .bt-tile__value{color:var(--leaf);}
@keyframes tileIn{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:none;}}

/* ---------------- gauges ---------------- */
.bt-gauge{display:flex;flex-direction:column;align-items:center;gap:.4rem;}
.bt-gauge__ring{position:relative;width:150px;height:150px;}
.bt-gauge__num{position:absolute;inset:0;display:grid;place-items:center;flex-direction:column;text-align:center;}
.bt-gauge__val{font-family:var(--font-mono);font-weight:600;font-size:2.1rem;line-height:1;}
.bt-gauge__cap{font-size:.7rem;color:var(--ink-dim);text-transform:uppercase;letter-spacing:.1em;margin-top:.2rem;}

/* ---------------- alerts ---------------- */
.bt-alert{display:flex;gap:.75rem;align-items:flex-start;padding:.7rem .85rem;border-radius:12px;margin-bottom:.6rem;
  border:1px solid var(--tile-line);background:var(--tile);}
.bt-alert i{font-size:1.1rem;margin-top:.1rem;}
.bt-alert__param{font-weight:600;font-size:.85rem;}
.bt-alert__msg{font-size:.82rem;color:var(--ink-soft);}
.bt-alert--critical{border-color:rgba(255,107,107,.4);background:rgba(255,107,107,.07);}
.bt-alert--critical i{color:var(--danger);}
.bt-alert--warning{border-color:rgba(245,181,74,.4);background:rgba(245,181,74,.07);}
.bt-alert--warning i{color:var(--amber);}
.bt-alert--ok{border-color:rgba(111,211,107,.35);background:rgba(111,211,107,.06);}
.bt-alert--ok i{color:var(--leaf);}

/* ---------------- badges ---------------- */
.bt-badge{display:inline-flex;align-items:center;gap:.3rem;font-size:.7rem;font-weight:600;
  padding:.2rem .55rem;border-radius:20px;text-transform:uppercase;letter-spacing:.06em;
  background:rgba(127,150,156,.15);color:var(--ink-soft);}
.bt-badge--ok{background:rgba(111,211,107,.15);color:var(--leaf);}
.bt-badge--warning{background:rgba(245,181,74,.16);color:var(--amber);}
.bt-badge--critical{background:rgba(255,107,107,.16);color:var(--danger);}
.bt-badge--info{background:rgba(55,182,233,.16);color:var(--cyan);}

/* ---------------- plant schematic ---------------- */
.bt-plant{position:relative;border-radius:18px;overflow:hidden;background:
  linear-gradient(160deg,#06202b,#04141d);border:1px solid var(--panel-line);
  min-height:430px;padding:1.5rem;}
[data-bs-theme="light"] .bt-plant{background:linear-gradient(160deg,#eaf5f3,#dfeeec);}
.bt-plant__grid{position:absolute;inset:0;background-image:
  linear-gradient(var(--grid-line) 1px,transparent 1px),
  linear-gradient(90deg,var(--grid-line) 1px,transparent 1px);
  background-size:32px 32px;pointer-events:none;}
.bt-unit{position:absolute;border-radius:12px;border:1.5px solid var(--tile-line);
  background:linear-gradient(180deg,rgba(14,42,56,.85),rgba(8,28,40,.9));
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:.4rem;cursor:default;transition:transform .2s,border-color .2s,box-shadow .2s;}
[data-bs-theme="light"] .bt-unit{background:linear-gradient(180deg,rgba(255,255,255,.92),rgba(240,248,247,.95));}
.bt-unit:hover{transform:translateY(-3px);border-color:var(--aqua);box-shadow:0 10px 26px rgba(33,196,166,.25);}
.bt-unit__icon{font-size:1.3rem;color:var(--aqua-bright);}
.bt-unit__name{font-size:.7rem;font-weight:600;margin-top:.2rem;line-height:1.1;}
.bt-unit__val{font-family:var(--font-mono);font-size:.72rem;color:var(--cyan);margin-top:.15rem;}

/* water tank fill */
.bt-tank__water{position:absolute;left:4px;right:4px;bottom:4px;border-radius:8px;
  background:linear-gradient(180deg,rgba(55,182,233,.55),rgba(33,196,166,.7));overflow:hidden;transition:height .8s;}
.bt-tank__water::before{content:"";position:absolute;top:-6px;left:-50%;width:200%;height:12px;border-radius:50%;
  background:rgba(255,255,255,.25);animation:waveMove 4s linear infinite;}
@keyframes waveMove{from{transform:translateX(0);}to{transform:translateX(25%);}}

/* flowing pipe */
.bt-pipe{position:absolute;background:rgba(55,182,233,.16);border-radius:20px;overflow:hidden;}
.bt-pipe__flow{position:absolute;inset:0;background:repeating-linear-gradient(90deg,
  transparent 0 14px,rgba(63,224,197,.55) 14px 22px);background-size:36px 100%;
  animation:flow 1.1s linear infinite;}
.bt-pipe--v .bt-pipe__flow{background:repeating-linear-gradient(180deg,
  transparent 0 14px,rgba(63,224,197,.55) 14px 22px);background-size:100% 36px;animation:flowV 1.1s linear infinite;}
@keyframes flow{from{background-position:0 0;}to{background-position:36px 0;}}
@keyframes flowV{from{background-position:0 0;}to{background-position:0 36px;}}

/* biofilm bubbles in reactor */
.bt-bubbles span{position:absolute;bottom:6px;width:6px;height:6px;border-radius:50%;
  background:rgba(255,255,255,.5);animation:rise 2.6s linear infinite;}
@keyframes rise{from{transform:translateY(0);opacity:.7;}to{transform:translateY(-120px);opacity:0;}}

/* ---------------- forms / misc ---------------- */
.bt-form-label{font-size:.78rem;font-weight:600;color:var(--ink-soft);margin-bottom:.3rem;text-transform:uppercase;letter-spacing:.05em;}
.form-control,.form-select{background:var(--tile);border-color:var(--tile-line);color:var(--ink);}
.form-control:focus,.form-select:focus{background:var(--tile);color:var(--ink);border-color:var(--aqua);box-shadow:0 0 0 .2rem rgba(33,196,166,.18);}
.bt-btn{border:0;border-radius:12px;padding:.7rem 1.3rem;font-weight:700;font-family:var(--font-display);cursor:pointer;
  background:linear-gradient(135deg,var(--aqua),var(--cyan));color:#04231f;transition:filter .15s,transform .15s;}
.bt-btn:hover{filter:brightness(1.08);transform:translateY(-1px);}
.bt-btn--ghost{background:var(--tile);border:1px solid var(--tile-line);color:var(--ink);}
.bt-btn--ghost:hover{border-color:var(--aqua);color:var(--aqua-bright);}

.bt-table{width:100%;border-collapse:collapse;}
.bt-table th{font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-dim);
  text-align:left;padding:.6rem .7rem;border-bottom:1px solid var(--panel-line);}
.bt-table td{padding:.65rem .7rem;border-bottom:1px solid var(--panel-line);font-size:.88rem;}
.bt-table tr:last-child td{border-bottom:0;}
.bt-table tbody tr:hover{background:rgba(63,224,197,.05);}
.bt-mono{font-family:var(--font-mono);}

.bt-result-hero{display:flex;align-items:center;gap:1.5rem;flex-wrap:wrap;}
.bt-result-big{font-family:var(--font-mono);font-size:3.4rem;font-weight:600;line-height:1;letter-spacing:-.03em;}
.bt-kpi{display:flex;flex-direction:column;gap:.15rem;}
.bt-kpi__v{font-family:var(--font-mono);font-size:1.4rem;font-weight:600;}
.bt-kpi__k{font-size:.72rem;color:var(--ink-dim);text-transform:uppercase;letter-spacing:.08em;}

.bt-chip{display:inline-flex;gap:.35rem;align-items:center;padding:.3rem .7rem;border-radius:10px;
  font-size:.78rem;font-weight:600;background:var(--tile);border:1px solid var(--tile-line);color:var(--ink-soft);}

/* utility */
.bt-grid{display:grid;gap:1rem;}
.bt-grid--2{grid-template-columns:repeat(2,1fr);}
.bt-grid--3{grid-template-columns:repeat(3,1fr);}
.bt-muted{color:var(--ink-dim);}
.bt-mt{margin-top:1rem;}

/* ---------------- responsive ---------------- */
@media (max-width:992px){
  .bt-sidebar{position:fixed;left:0;top:0;transform:translateX(-100%);transition:transform .25s;box-shadow:var(--shadow);}
  .bt-sidebar.open{transform:none;}
  .bt-sidebar-backdrop.show{display:block;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:35;}
  .bt-burger{display:block;}
  .bt-content{padding:1.1rem;}
  .bt-grid--2,.bt-grid--3{grid-template-columns:1fr;}
  .bt-scenario__label{display:none;}
}
@media (max-width:560px){
  .bt-user__meta{display:none;}
  .bt-tiles{grid-template-columns:repeat(2,1fr);}
  .bt-result-big{font-size:2.6rem;}
}

/* login page */
.bt-login{min-height:100vh;display:grid;place-items:center;padding:1.5rem;}
.bt-login__card{width:100%;max-width:410px;}
.bt-login__brand{display:flex;align-items:center;gap:.7rem;justify-content:center;margin-bottom:1.4rem;}

/* ============================================================
   Additional components (forms, results, drawer, modal)
   ============================================================ */

/* form controls */
.bt-label{display:block;font-size:.74rem;font-weight:600;color:var(--ink-soft);
  text-transform:uppercase;letter-spacing:.05em;margin:.85rem 0 .3rem;}
.bt-input{width:100%;background:var(--tile);border:1px solid var(--tile-line);color:var(--ink);
  border-radius:11px;padding:.62rem .8rem;font-family:var(--font-body);font-size:.92rem;outline:none;transition:border-color .15s,box-shadow .15s;}
.bt-input:focus{border-color:var(--aqua);box-shadow:0 0 0 .18rem rgba(33,196,166,.18);}
.bt-input--inline{display:inline-block;width:auto;}
.bt-row2{display:grid;grid-template-columns:1fr 1fr;gap:.7rem;}
.bt-range{width:100%;accent-color:var(--aqua);margin-top:.35rem;}
.bt-check{display:flex;align-items:center;gap:.5rem;font-size:.85rem;color:var(--ink-soft);margin:.9rem 0 .2rem;cursor:pointer;}
.bt-check input{accent-color:var(--aqua);width:16px;height:16px;}

/* button variants */
.bt-btn--primary{background:linear-gradient(135deg,var(--aqua),var(--cyan));color:#04231f;}
.bt-btn--sm{padding:.4rem .7rem;border-radius:9px;font-size:.8rem;}
.bt-btn--danger{background:linear-gradient(135deg,#ff6b6b,#e2484f);color:#fff;}
.bt-btn:disabled{opacity:.5;cursor:not-allowed;filter:none;transform:none;}

/* table numeric column */
.bt-table th.bt-num,.bt-table td.bt-num{text-align:right;font-family:var(--font-mono);}

/* result hero */
.bt-result-hero__left{min-width:160px;text-align:center;}
.bt-result-hero__right{flex:1;display:grid;grid-template-columns:1fr 1fr;gap:.35rem .9rem;min-width:240px;}
.bt-kv{display:flex;justify-content:space-between;gap:.6rem;font-size:.84rem;
  padding:.3rem 0;border-bottom:1px dashed var(--panel-line);}
.bt-kv span{color:var(--ink-dim);}
.bt-kv b{font-family:var(--font-mono);color:var(--ink);}

/* placeholder card */
.bt-placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:2.6rem 1.6rem;color:var(--ink-dim);}
.bt-placeholder i{font-size:2.4rem;color:var(--aqua);opacity:.6;margin-bottom:.7rem;}
.bt-placeholder p{max-width:380px;font-size:.9rem;line-height:1.5;}

/* tips list */
.bt-tip{display:flex;gap:.6rem;align-items:flex-start;padding:.6rem .2rem;border-bottom:1px solid var(--panel-line);font-size:.86rem;}
.bt-tip:last-child{border-bottom:0;}
.bt-tip i{margin-top:.1rem;}
.bt-tip--critical i{color:var(--danger);}
.bt-tip--warning i{color:var(--amber);}
.bt-tip--ok i{color:var(--leaf);}

/* drawer (compound detail) */
.bt-drawer{position:fixed;inset:0;z-index:60;display:none;}
.bt-drawer.open{display:block;}
.bt-drawer__backdrop{position:absolute;inset:0;background:rgba(0,0,0,.5);}
.bt-drawer__panel{position:absolute;top:0;right:0;height:100%;width:min(440px,92vw);
  background:var(--panel);border-left:1px solid var(--panel-line);box-shadow:var(--shadow);
  display:flex;flex-direction:column;animation:drawerIn .25s ease;}
@keyframes drawerIn{from{transform:translateX(40px);opacity:.4;}to{transform:none;opacity:1;}}
.bt-drawer__head{display:flex;align-items:center;justify-content:space-between;
  padding:1.1rem 1.3rem;border-bottom:1px solid var(--panel-line);font-family:var(--font-display);font-weight:700;}
.bt-drawer__close,.bt-modal__close{background:none;border:0;color:var(--ink-dim);font-size:1.1rem;cursor:pointer;}
.bt-drawer__close:hover,.bt-modal__close:hover{color:var(--ink);}
.bt-drawer__body{padding:1.2rem 1.3rem;overflow:auto;}

/* modal (user edit) */
.bt-modal{position:fixed;inset:0;z-index:60;display:none;align-items:center;justify-content:center;}
.bt-modal.open{display:flex;}
.bt-modal__backdrop{position:absolute;inset:0;background:rgba(0,0,0,.55);}
.bt-modal__panel{position:relative;z-index:1;width:min(420px,94vw);background:var(--panel);
  border:1px solid var(--panel-line);border-radius:16px;box-shadow:var(--shadow);padding:1.3rem 1.4rem;
  animation:drawerIn .2s ease;}
.bt-modal__head{display:flex;align-items:center;justify-content:space-between;
  font-family:var(--font-display);font-weight:700;margin-bottom:.4rem;}

@media (max-width:560px){
  .bt-result-hero__right{grid-template-columns:1fr;}
  .bt-row2{grid-template-columns:1fr;}
}

/* ============================================================
   v2 components — settings, updater, compound editor, guide,
   enhanced simulator
   ============================================================ */
.bt-page__head{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;margin-bottom:1.1rem;flex-wrap:wrap;}
.bt-page__title{font-family:var(--font-display);font-weight:800;font-size:1.5rem;letter-spacing:-.01em;}
.bt-page__sub{color:var(--ink-dim);font-size:.86rem;max-width:62ch;margin-top:.25rem;}
.bt-card__body{font-size:.9rem;}
.bt-card--accent{border-color:var(--aqua);box-shadow:0 0 0 1px var(--aqua) inset,var(--shadow);}

.bt-flash{padding:.8rem 1rem;border-radius:12px;margin-bottom:1rem;font-size:.88rem;font-weight:600;
  border:1px solid var(--tile-line);background:var(--tile);}
.bt-flash--ok{border-color:rgba(33,196,166,.5);color:var(--aqua-bright);background:rgba(33,196,166,.08);}
.bt-flash--warning{border-color:rgba(245,181,74,.5);color:var(--amber);background:rgba(245,181,74,.08);}
.bt-flash--critical{border-color:rgba(255,107,107,.5);color:var(--danger);background:rgba(255,107,107,.08);}
.bt-flash--info{border-color:rgba(55,182,233,.5);color:var(--cyan);background:rgba(55,182,233,.08);}

.bt-field{margin-bottom:.85rem;}
.bt-field--wide{grid-column:1 / -1;}
.bt-hint{display:block;font-size:.72rem;color:var(--ink-dim);margin-top:.3rem;}
.bt-actions{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:1rem;grid-column:1 / -1;}
.bt-form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:0 1rem;}
.bt-input--sm{padding:.4rem .55rem;font-size:.82rem;}
.bt-input--xs{padding:.35rem .4rem;font-size:.8rem;font-family:var(--font-mono);}
.bt-kv strong{font-family:var(--font-mono);color:var(--ink);font-weight:600;}
.bt-mono{font-family:var(--font-mono);font-size:.82rem;}

.bt-version-chip{display:inline-flex;align-items:center;gap:.45rem;padding:.5rem .85rem;border-radius:12px;
  background:var(--tile);border:1px solid var(--tile-line);font-size:.82rem;color:var(--ink-soft);}
.bt-version-chip strong{color:var(--aqua-bright);font-family:var(--font-mono);}

.bt-loglist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.45rem;font-size:.84rem;}
.bt-loglist li{display:flex;align-items:center;gap:.55rem;}
.bt-note{display:flex;gap:.5rem;align-items:flex-start;padding:.7rem .85rem;border-radius:10px;margin-top:.7rem;
  background:rgba(55,182,233,.07);border:1px solid rgba(55,182,233,.25);font-size:.83rem;color:var(--ink-soft);}
.bt-note i{color:var(--cyan);margin-top:.1rem;}

.bt-inline-form{display:flex;gap:.6rem;align-items:center;flex-wrap:wrap;}
.bt-delete-form{margin-top:.6rem;}
.bt-table-wrap{overflow-x:auto;}
.bt-table--editable td{padding:.3rem .35rem;}
.bt-table--editable .bt-input{margin:0;}

.bt-compound{padding:0;overflow:hidden;}
.bt-compound__head{cursor:pointer;padding:1rem 1.2rem;margin:0;user-select:none;}
.bt-compound__head:hover{background:var(--panel-2);}
.bt-compound__class{font-size:.78rem;font-weight:500;margin-left:.4rem;}
.bt-compound__quick{display:flex;align-items:center;gap:.4rem;flex-wrap:wrap;}
.bt-compound__quick .bi-chevron-down{transition:transform .2s ease;color:var(--ink-dim);}
.bt-compound__head.is-open .bi-chevron-down{transform:rotate(180deg);}
.bt-compound__body{padding:0 1.2rem 1.2rem;}

/* enhanced simulator */
.bt-sim{display:grid;grid-template-columns:340px 1fr;gap:1rem;align-items:start;}
.bt-slider-row{margin-bottom:.9rem;}
.bt-slider-row label{display:flex;justify-content:space-between;font-size:.78rem;font-weight:600;color:var(--ink-soft);margin-bottom:.3rem;}
.bt-slider-row label b{font-family:var(--font-mono);color:var(--aqua-bright);}
.bt-slider-row input[type=range]{width:100%;accent-color:var(--aqua);}
.bt-result-hero{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;
  padding:1rem 1.2rem;border-radius:14px;background:linear-gradient(135deg,rgba(33,196,166,.12),rgba(55,182,233,.06));
  border:1px solid var(--tile-line);margin-bottom:1rem;}
.bt-result-hero__big{font-family:var(--font-display);font-weight:800;font-size:2.6rem;line-height:1;color:var(--aqua-bright);}
.bt-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:.7rem;margin-bottom:1rem;}
.bt-metric{background:var(--tile);border:1px solid var(--tile-line);border-radius:12px;padding:.7rem .8rem;}
.bt-metric span{display:block;font-size:.72rem;color:var(--ink-dim);}
.bt-metric b{font-family:var(--font-mono);font-size:1.05rem;color:var(--ink);}
@media(max-width:900px){.bt-sim{grid-template-columns:1fr;}.bt-metrics{grid-template-columns:repeat(2,1fr);}.bt-form-grid{grid-template-columns:1fr;}}

/* user guide */
.bt-guide{display:grid;grid-template-columns:230px 1fr;gap:1.4rem;align-items:start;}
.bt-toc{position:sticky;top:1rem;font-size:.85rem;}
.bt-toc a{display:block;padding:.35rem .6rem;border-radius:8px;color:var(--ink-soft);text-decoration:none;}
.bt-toc a:hover{background:var(--tile);color:var(--aqua-bright);}
.bt-prose h2{font-family:var(--font-display);font-size:1.15rem;margin:1.6rem 0 .6rem;padding-top:.4rem;}
.bt-prose h3{font-size:.98rem;margin:1.1rem 0 .4rem;color:var(--aqua-bright);}
.bt-prose p,.bt-prose li{font-size:.9rem;line-height:1.6;color:var(--ink-soft);}
.bt-prose code{font-family:var(--font-mono);background:var(--tile);padding:.1rem .35rem;border-radius:6px;font-size:.82rem;}
.bt-prose table{width:100%;border-collapse:collapse;margin:.6rem 0;font-size:.84rem;}
.bt-prose th,.bt-prose td{border:1px solid var(--tile-line);padding:.45rem .6rem;text-align:left;}
@media(max-width:900px){.bt-guide{grid-template-columns:1fr;}.bt-toc{position:static;}}

/* ---- chart sizing: stable parent height stops Chart.js from collapsing ---- */
.bt-chart-wrap{position:relative;width:100%;height:240px;min-height:240px;overflow:hidden;}
.bt-chart-wrap--trend{height:280px;min-height:280px;}
.bt-chart-wrap canvas{display:block;}

/* ===========================================================================
   v2.5 "Blueprint" re-skin — deliberate engineering / technical-paper look.
   Appended last so it supersedes the legacy glow/gradient styling. CSS only.
   Direction: flat paper ground with a faint drafting grid, hairline rules,
   one muted slate-blue accent, technical Archivo headings, tabular mono data.
   =========================================================================== */
:root{
  --font-display:'Archivo','IBM Plex Sans',system-ui,sans-serif;
  --bp-accent:#23586a;     /* muted prussian / slate blue */
  --bp-accent-d:#1a4150;
  --bp-brass:#8a6d3b;      /* secondary technical ochre */
  --bp-good:#3d6f55;
  --bp-warn:#9c6b1f;
  --bp-bad:#9b3a32;
  --bp-paper:#f1efe8;
  --bp-surface:#fbfaf6;
  --bp-line:#d8d2c4;
  --bp-ink:#1c2426;
  --bp-ink-soft:#4c5658;
  --bp-ink-dim:#79817d;
}
/* unify both themes onto the paper palette (remap legacy accent tokens) */
[data-bs-theme="light"],[data-bs-theme="dark"]{
  --aqua:var(--bp-accent); --aqua-bright:var(--bp-accent-d); --cyan:var(--bp-brass);
  --leaf:var(--bp-good); --amber:var(--bp-warn); --danger:var(--bp-bad);
  --bg:var(--bp-paper); --bg-grad-1:var(--bp-paper); --bg-grad-2:var(--bp-paper);
  --panel:var(--bp-surface); --panel-2:var(--bp-paper); --panel-line:var(--bp-line);
  --ink:var(--bp-ink); --ink-soft:var(--bp-ink-soft); --ink-dim:var(--bp-ink-dim);
  --tile:var(--bp-surface); --tile-line:var(--bp-line);
  --shadow:0 1px 0 rgba(28,36,38,.04);
  --grid-line:rgba(35,88,106,.06); --gauge-track:rgba(28,36,38,.12);
}
*{backdrop-filter:none !important;-webkit-backdrop-filter:none !important;}
.bt-body *{text-shadow:none !important;}
[class*="pulse"],.bt-dot,.bt-live,.bt-status__dot{animation:none !important;}

/* flat paper ground + faint drafting grid (the one intentional texture) */
body.bt-body{
  background:var(--bp-paper) !important;
  background-image:
    linear-gradient(rgba(35,88,106,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(35,88,106,.05) 1px,transparent 1px) !important;
  background-size:30px 30px !important;background-attachment:fixed !important;
}

/* surfaces: hairline borders, low radius, no shadow/blur */
.bt-card,.bt-result-hero,.bt-tile,.bt-metric,.bt-unit,.bt-drawer,.bt-plant{
  box-shadow:none !important;border-radius:5px !important;}
.bt-card,.bt-result-hero{background:var(--panel) !important;border:1px solid var(--panel-line) !important;}
.bt-tile,.bt-metric{background:var(--panel) !important;border:1px solid var(--panel-line) !important;}
.bt-tile::before,.bt-tile::after,.bt-card::before,.bt-card::after{display:none !important;}
.bt-sidebar{background:var(--panel) !important;border-right:1px solid var(--panel-line) !important;box-shadow:none !important;}

/* brand mark + nav active: solid accent, side-rule instead of glow */
.bt-brand__mark{background:var(--bp-accent) !important;color:#fff !important;border-radius:4px !important;}
.bt-nav__link--active{background:rgba(35,88,106,.10) !important;color:var(--bp-accent) !important;
  box-shadow:inset 3px 0 0 var(--bp-accent) !important;border-radius:0 4px 4px 0 !important;}

/* buttons: flat, squared, technical */
.bt-btn{border-radius:4px !important;background-image:none !important;box-shadow:none !important;letter-spacing:.01em;}
.bt-btn--primary{background:var(--bp-accent) !important;color:#fff !important;border:1px solid var(--bp-accent) !important;}
.bt-btn--primary:hover{background:var(--bp-accent-d) !important;filter:none !important;}
.bt-btn--ghost{background:transparent !important;border:1px solid var(--panel-line) !important;color:var(--ink) !important;}
.bt-btn--danger{background:var(--bp-bad) !important;color:#fff !important;border:1px solid var(--bp-bad) !important;}

/* inputs: squared, thin accent ring (no neon glow) */
.bt-input,.form-control,.form-select{border-radius:4px !important;}
.bt-input:focus,.form-control:focus,.form-select:focus{border-color:var(--bp-accent) !important;box-shadow:0 0 0 2px rgba(35,88,106,.16) !important;}
:focus-visible{outline:2px solid var(--bp-accent) !important;outline-offset:1px;}

/* typography: Archivo technical headings, uppercase micro-labels, tabular mono data */
.bt-page__title,.bt-card__title,.bt-brand__name,.bt-result-hero__big,.bt-login__brand{
  font-family:var(--font-display) !important;letter-spacing:-.005em;}
.bt-page__title{font-weight:700 !important;}
.bt-nav__section,.bt-label,.bt-tile__label{
  text-transform:uppercase !important;letter-spacing:.11em !important;font-size:.66rem !important;
  font-family:var(--font-display) !important;font-weight:600 !important;color:var(--ink-dim) !important;}
.bt-metric b,.bt-mono,.bt-tile__value,.bt-result-hero__big{
  font-family:var(--font-mono) !important;font-variant-numeric:tabular-nums !important;letter-spacing:-.01em;}

/* tables: ruled and data-first */
.bt-table{border-collapse:collapse !important;}
.bt-table th{font-family:var(--font-display) !important;text-transform:uppercase;letter-spacing:.06em;
  font-size:.72rem;color:var(--ink-soft) !important;background:transparent !important;border-bottom:1.5px solid var(--panel-line) !important;}
.bt-table td{border-bottom:1px solid var(--panel-line) !important;font-variant-numeric:tabular-nums;}

/* badges / chips / callouts: flat, low radius, tinted not gradient */
.bt-badge,.bt-chip,.bt-version-chip{border-radius:3px !important;background-image:none !important;box-shadow:none !important;}
.bt-result-hero,.bt-note{background:rgba(35,88,106,.06) !important;background-image:none !important;
  border:1px solid var(--panel-line) !important;}

/* v2.5.1 fix: never uppercase unit-bearing labels — CSS uppercase converts the
   micro sign (µ) into Greek capital Mu (Μ), which reads as "M" and turns
   "µg/L" into "MG/L" (a 1000x error). Keep all-caps only on unit-free nav
   dividers; style other labels with the display font + letter-spacing instead. */
.bt-label,.bt-tile__label,.bt-table th{text-transform:none !important;letter-spacing:.02em !important;}