
:root{
  --navy:#212836; --navy-2:#0d364f; --navy-3:#0e405e;
  --teal:#01a09a; --teal-2:#1a9ca2; --cyan:#2d8db8;
  --ink:#152132; --muted:#6c7887; --line:#e2e7ea;
  --bg:#f5f7f8; --card:#ffffff; --soft:#eef7f7;
  --success:#137c72; --danger:#b53d45; --warn:#a97a1e;
  --soft-ok:#e8f7f2; --soft-warn:#fdf5e6; --soft-bad:#fff0ef;
  --ink-ok:#1c755f; --ink-warn:#8a6414; --ink-bad:#a63d36;
  --panel-head:#fafbfb; --row-hover:#fbfdfd; --chart-grid:#e6edef;
  --shadow:0 12px 34px rgba(25,44,58,.10);
  --shadow-card:0 7px 18px rgba(25,44,58,.04);
  --radius:18px;
  --mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --ink:#e8eef2; --muted:#93a3ae; --line:#26323c;
    --bg:#0e161d; --card:#151f28; --soft:#16302f;
    --panel-head:#121b23; --row-hover:#18242e; --chart-grid:#26323c;
    --soft-ok:#12302a; --soft-warn:#2e2618; --soft-bad:#33201f;
    --ink-ok:#5fd0b2; --ink-warn:#d8b25c; --ink-bad:#e08a82;
    --shadow:0 12px 34px rgba(0,0,0,.44);
    --shadow-card:0 7px 18px rgba(0,0,0,.28);
  }
}
:root[data-theme="dark"]{
  --ink:#e8eef2; --muted:#93a3ae; --line:#26323c;
  --bg:#0e161d; --card:#151f28; --soft:#16302f;
  --panel-head:#121b23; --row-hover:#18242e; --chart-grid:#26323c;
  --soft-ok:#12302a; --soft-warn:#2e2618; --soft-bad:#33201f;
  --ink-ok:#5fd0b2; --ink-warn:#d8b25c; --ink-bad:#e08a82;
  --shadow:0 12px 34px rgba(0,0,0,.44);
  --shadow-card:0 7px 18px rgba(0,0,0,.28);
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);
  font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:14px;-webkit-font-smoothing:antialiased}
button,input,select{font:inherit;color:inherit}
button{cursor:pointer;-webkit-tap-highlight-color:transparent}
a{color:inherit;text-decoration:none}
h1,h2,h3{margin:0;letter-spacing:-.02em;text-wrap:balance}
p{margin:0}
:focus-visible{outline:2px solid var(--teal);outline-offset:2px;border-radius:6px}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* ===== LOGIN ===== */
.login-page{min-height:100svh;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(420px,.8fr);background:var(--card)}
.login-brand{background:linear-gradient(140deg,var(--navy) 0%,var(--navy-2) 58%,#124d69 100%);
  color:#fff;display:flex;padding:46px 7vw}
.brand-panel{width:min(720px,100%);margin:auto}
.brand-mark{display:flex;align-items:center;gap:14px;margin-bottom:64px}
.brand-copy h1{font-size:clamp(34px,4.4vw,60px);line-height:1.03;letter-spacing:-.04em;max-width:640px;margin:12px 0 22px;font-weight:800}
.brand-copy p{font-size:17px;line-height:1.7;color:#c5d7df;max-width:600px}
.brand-points{display:flex;flex-wrap:wrap;gap:22px;margin-top:34px;color:#d8f6f3;font-weight:650;font-size:13px}
.brand-points span{display:flex;align-items:center;gap:8px}
.login-form-wrap{display:flex;align-items:center;justify-content:center;padding:48px 24px}
.login-card{width:min(430px,100%)}
.login-card h2{font-size:38px;margin:7px 0 10px;letter-spacing:-.03em;font-weight:800}
.login-card label{display:block;font-size:13px;font-weight:700;margin-top:20px;color:var(--muted)}
.login-card input,.login-card select{width:100%;margin-top:8px;height:52px;border:1px solid var(--line);
  border-radius:11px;padding:0 15px;background:var(--card);outline:none;transition:.2s;font-weight:600}
.login-card input:focus,.login-card select:focus{border-color:var(--teal);box-shadow:0 0 0 4px rgba(1,160,154,.10)}
.mobile-logo{display:none;background:var(--navy);padding:11px 16px;border-radius:10px;width:fit-content;margin-bottom:26px}
.muted{color:var(--muted);line-height:1.55}
.eyebrow{text-transform:uppercase;letter-spacing:.12em;font-size:11px;font-weight:800;color:var(--teal)}
.eyebrow.light{color:#6bd8d4}
.secure-note{margin-top:16px;background:var(--soft);color:var(--muted);border-radius:10px;
  padding:11px 12px;display:flex;gap:9px;font-size:11px;line-height:1.5}

/* ===== BUTTONS ===== */
.primary-btn,.secondary-btn{min-height:44px;border-radius:10px;border:0;display:inline-flex;
  align-items:center;justify-content:center;gap:8px;font-weight:800;padding:0 18px;font-size:14px}
.primary-btn{background:var(--teal);color:#fff;box-shadow:0 7px 18px rgba(1,160,154,.18)}
.primary-btn:hover{filter:brightness(.96)}
.primary-btn.full{width:100%;margin-top:26px;height:52px}
.secondary-btn{background:var(--soft);color:var(--success)}
.secondary-btn.light{background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.20)}

/* ===== SHELL ===== */
.app-shell{min-height:100%;display:flex}
.sidebar{width:248px;background:var(--navy);color:#dfe8ec;display:flex;flex-direction:column;
  padding:24px 16px;position:fixed;inset:0 auto 0 0;z-index:30}
.sidebar-head{display:flex;align-items:center;justify-content:space-between;padding:0 6px 28px}
.sidebar nav{display:flex;flex-direction:column;gap:6px}
.nav-item{width:100%;background:transparent;color:#c4ced4;border:0;display:flex;align-items:center;
  gap:12px;border-radius:10px;padding:12px 14px;text-align:left;font-weight:650;font-size:13.5px}
.nav-item:hover{background:rgba(255,255,255,.06);color:#fff}
.nav-item.active{background:rgba(1,160,154,.17);color:#e6fffc}
.nav-item small{margin-left:auto;color:#71c9c5;font-size:9px;text-transform:uppercase;letter-spacing:.06em;font-weight:800}
.nav-label{padding:18px 8px 8px;font-size:9.5px;text-transform:uppercase;letter-spacing:.11em;color:#7b8c98;font-weight:800}
.sidebar-footer{margin-top:auto;border-top:1px solid rgba(255,255,255,.08);padding-top:16px}
.user-chip{display:flex;align-items:center;gap:10px;padding:8px 10px 12px}
.avatar{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,var(--teal),var(--cyan));
  display:grid;place-items:center;color:#fff;font-weight:900;font-size:13px;flex:0 0 auto}
.user-chip>div{min-width:0}
.user-chip strong{display:block;font-size:13px;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.user-chip span{display:block;font-size:10.5px;color:#8fa4b0;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.logout{color:#9faeb7;background:transparent;border:0;display:flex;align-items:center;gap:9px;
  font-weight:700;font-size:12.5px;padding:8px 10px;width:100%;border-radius:9px}
.logout:hover{background:rgba(255,255,255,.06);color:#fff}
.main-shell{flex:1;margin-left:248px;min-width:0}
.topbar{min-height:88px;background:var(--card);border-bottom:1px solid var(--line);display:flex;
  align-items:center;gap:16px;padding:17px 34px;position:sticky;top:env(safe-area-inset-top,0px);z-index:20}
.topbar-copy{flex:1;min-width:0}
.topbar h1{font-size:21px;letter-spacing:-.02em;font-weight:800}
.topbar p{font-size:12px;color:var(--muted);margin-top:4px}
.mode-chip{display:inline-flex;align-items:center;gap:8px;border-radius:999px;font-size:11.5px;
  font-weight:800;padding:9px 13px;background:var(--soft-ok);color:var(--ink-ok);white-space:nowrap}
.status-dot{width:8px;height:8px;border-radius:50%;background:#26a77f;box-shadow:0 0 0 3px rgba(38,167,127,.15);flex:0 0 auto}
.content{padding:28px 34px 56px}
.page-section{max-width:1450px;margin:0 auto}
.menu-btn{display:none;border:0;background:transparent;padding:6px;color:var(--muted)}
.sidebar-overlay{display:none}

/* ===== HERO ===== */
.hero{background:linear-gradient(115deg,var(--navy-2),#0e4f69);color:#fff;border-radius:var(--radius);
  padding:30px 34px;display:flex;align-items:center;justify-content:space-between;gap:28px;box-shadow:var(--shadow)}
.hero h2{font-size:clamp(25px,2.7vw,36px);margin:7px 0 9px;letter-spacing:-.035em;font-weight:800}
.hero p{color:#bcd4dd;line-height:1.55;max-width:560px}
.hero-stats{display:flex;gap:10px;flex:0 0 auto}
.hero-stat{background:rgba(255,255,255,.08);min-width:150px;padding:18px 22px;border-radius:14px;
  text-align:center;border:1px solid rgba(255,255,255,.09)}
.hero-stat strong{font-size:38px;display:block;color:#60d7d2;font-weight:800;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.hero-stat span{color:#cce0e7;font-size:11.5px;display:block;margin-top:3px}

.section-head{display:flex;align-items:end;justify-content:space-between;gap:24px;margin:32px 0 16px}
.section-head h2{font-size:24px;margin-top:5px;font-weight:800}
.section-head p{color:var(--muted);font-size:12.5px}

/* ===== PLANT CARDS ===== */
.plant-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.plant-card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:20px;
  box-shadow:var(--shadow-card);transition:.2s ease;text-align:left;width:100%;display:block}
.plant-card:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(25,44,58,.09);border-color:#cbdadb}
.plant-card-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}
.plant-icon{width:48px;height:48px;border-radius:14px;background:var(--soft);color:var(--teal);display:grid;place-items:center}
.status-pill{font-size:9.5px;text-transform:uppercase;letter-spacing:.07em;border-radius:999px;
  padding:7px 10px;font-weight:850}
.status-pill.ok{background:var(--soft-ok);color:var(--ink-ok)}
.status-pill.warn{background:var(--soft-warn);color:var(--ink-warn)}
.status-pill.bad{background:var(--soft-bad);color:var(--ink-bad)}
.plant-kicker{color:var(--teal);text-transform:uppercase;font-weight:800;font-size:10.5px;letter-spacing:.10em}
.plant-card h3{margin:5px 0;font-size:20px;font-weight:800}
.plant-meta{margin-bottom:14px;color:var(--muted);font-size:12px}
.connection-line{display:flex;justify-content:space-between;gap:10px;border-top:1px solid var(--line);
  padding:9px 0;font-size:12px}
.connection-line span{color:var(--muted)}
.connection-line strong{text-align:right;font-weight:750;font-variant-numeric:tabular-nums}
.card-link{width:100%;border:0;border-radius:10px;background:var(--soft);color:var(--success);
  min-height:43px;margin-top:10px;display:flex;align-items:center;justify-content:center;gap:8px;font-weight:850;font-size:13px}

/* ===== PANELS ===== */
.panel-row{display:grid;grid-template-columns:1.35fr 1fr;gap:16px;margin-top:16px}
.data-panel{background:var(--card);border:1px solid var(--line);border-radius:16px;margin-top:16px;overflow:hidden}
.panel-row .data-panel{margin-top:0}
.panel-head{display:flex;justify-content:space-between;align-items:end;gap:15px;padding:19px 22px;border-bottom:1px solid var(--line)}
.panel-head h3{margin-top:5px;font-size:18px;font-weight:800}
.panel-head p{font-size:12px;color:var(--muted);margin-top:3px}
.accum-note{font-size:11px;color:var(--muted);background:var(--soft);border-radius:999px;padding:7px 11px;white-space:nowrap;font-weight:700}

/* ===== KPI ===== */
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:18px 22px}
.kpis>div{background:var(--bg);border:1px solid var(--line);border-radius:11px;padding:14px}
.kpis span{display:block;font-size:9.5px;text-transform:uppercase;color:var(--muted);font-weight:800;letter-spacing:.06em}
.kpis strong{display:block;margin-top:6px;font-size:19px;font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.kpis em{display:block;margin-top:3px;font-size:11px;font-style:normal;color:var(--muted)}
.pos{color:var(--success)} .neg{color:var(--danger)}

/* ===== BAND METER (subject-specific) ===== */
.band-wrap{padding:20px 22px}
.band-track{position:relative;height:52px;background:var(--bg);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.band-zone{position:absolute;top:0;bottom:0;background:var(--soft);border-left:1px dashed #9fc9c6;border-right:1px dashed #9fc9c6}
.band-marker{position:absolute;top:0;bottom:0;width:4px;background:var(--teal);border-radius:2px}
.band-marker.out{background:var(--danger)}
.band-flag{position:absolute;top:8px;transform:translateX(-50%);background:var(--navy);color:#fff;
  font-size:11px;font-weight:800;padding:5px 9px;border-radius:7px;white-space:nowrap;font-variant-numeric:tabular-nums}
.band-scale{display:flex;justify-content:space-between;margin-top:9px;font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums}
.band-scale b{color:var(--ink);font-weight:750}

/* ===== TABLE ===== */
.table-wrap{overflow-x:auto}
.readings-table{width:100%;border-collapse:collapse;min-width:680px}
.readings-table.compact{min-width:0}
.readings-table.compact th,.readings-table.compact td{padding-left:14px;padding-right:14px}
.readings-table th{text-align:left;padding:12px 18px;font-size:9.5px;text-transform:uppercase;
  letter-spacing:.07em;color:var(--muted);background:var(--panel-head);border-bottom:1px solid var(--line);font-weight:800}
.readings-table td{padding:11px 18px;border-bottom:1px solid var(--line);font-size:13px}
.readings-table tbody tr:last-child td{border-bottom:0}
.readings-table tbody tr:hover{background:var(--row-hover)}
.readings-table th.num,.readings-table td.num{text-align:right}
.value-cell{font-family:var(--mono);font-weight:800;font-variant-numeric:tabular-nums}
.total-row{background:var(--soft)}
.total-row td{font-weight:900;color:var(--success)}

/* ===== CHART ===== */
.chart-wrap{padding:18px 22px 22px}
.chart{width:100%;height:auto;display:block;overflow:visible}
.legend{display:flex;flex-wrap:wrap;gap:16px;margin-bottom:14px;font-size:11.5px;color:var(--muted);font-weight:650}
.legend i{width:11px;height:11px;border-radius:3px;display:inline-block;margin-right:6px;vertical-align:-1px}
.legend i.ln{height:3px;border-radius:2px;vertical-align:3px}

/* ===== TABS ===== */
.tabs{display:flex;gap:4px;margin-top:18px;border-bottom:1px solid var(--line);overflow-x:auto}
.tabs button{border:0;background:transparent;padding:12px 16px;color:var(--muted);font-weight:750;
  border-bottom:2px solid transparent;white-space:nowrap;font-size:13.5px}
.tabs button.active{color:var(--success);border-color:var(--teal)}

/* ===== CAPTURE FORM ===== */
.form-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;padding:20px 22px}
.form-grid label{font-size:10.5px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.form-grid input,.form-grid select{width:100%;margin-top:7px;border:1px solid var(--line);border-radius:9px;
  padding:11px;background:var(--card);font-weight:600}
.form-grid input:focus,.form-grid select:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 4px rgba(1,160,154,.10)}
.form-grid .wide{grid-column:1/-1}
.src-list{display:grid;gap:9px;padding:0 22px 20px}
.src{display:flex;align-items:center;gap:13px;background:var(--bg);border:1px solid var(--line);border-radius:11px;padding:13px 15px}
.src strong{font-size:13.5px;font-weight:750}
.src p{font-size:11.5px;color:var(--muted);margin-top:2px}
.src .status-pill{margin-left:auto;flex:0 0 auto}
.form-foot{padding:0 22px 22px;display:flex;gap:10px;flex-wrap:wrap;align-items:center}

/* ===== EMPTY ===== */
.empty-state{min-height:360px;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:35px;margin-top:16px}
.empty-icon{width:50px;height:50px;border-radius:14px;background:var(--soft);color:var(--teal);display:grid;place-items:center;margin-bottom:14px}
.empty-state h3{margin:8px 0;font-size:20px;font-weight:800}
.empty-state p{color:var(--muted);max-width:560px;line-height:1.6}
.future-badge{margin-top:14px;border-radius:999px;background:var(--bg);color:var(--muted);
  padding:7px 12px;font-size:9.5px;text-transform:uppercase;font-weight:850;letter-spacing:.06em;border:1px solid var(--line)}
.back-link{border:0;background:transparent;color:var(--muted);padding:0;margin-bottom:14px;font-weight:750;display:flex;align-items:center;gap:7px}
.back-link:hover{color:var(--ink)}

/* ===== RESPONSIVE ===== */
@media (max-width:1180px){
  .plant-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .panel-row{grid-template-columns:1fr}
  .login-page{grid-template-columns:1fr 400px}
  .kpis{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:860px){
  .login-page{display:block;background:var(--bg);padding:20px}
  .login-brand{display:none}
  .login-form-wrap{min-height:calc(100vh - 40px);padding:24px 0}
  .login-card{background:var(--card);border-radius:18px;padding:28px 24px;box-shadow:var(--shadow)}
  .mobile-logo{display:block}
  .sidebar{transform:translateX(-102%);transition:.22s ease;width:min(290px,84vw);box-shadow:20px 0 40px rgba(0,0,0,.20)}
  .sidebar.open{transform:translateX(0)}
  .sidebar-overlay.show{display:block;position:fixed;inset:0;background:rgba(8,22,31,.45);z-index:29}
  .main-shell{margin-left:0}
  .menu-btn{display:grid;place-items:center}
  .topbar{padding:13px 16px;min-height:76px}
  .content{padding:18px 16px 44px}
  .hero{border-radius:15px;padding:24px;flex-direction:column;align-items:stretch}
  .hero-stats{width:100%}
  .hero-stat{flex:1;min-width:0}
  .plant-grid{grid-template-columns:1fr}
  .form-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:620px){
  .mode-chip{font-size:0;padding:9px;gap:0}
  .topbar h1{font-size:17px}
  .topbar p{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:54vw}
  .hero-stats{flex-direction:column}
  .hero-stat{display:flex;align-items:baseline;gap:10px;text-align:left;padding:14px 18px}
  .hero-stat strong{font-size:27px}
  .section-head{align-items:flex-start;flex-direction:column;gap:6px}
  .kpis{grid-template-columns:1fr 1fr;padding:16px}
  .form-grid{grid-template-columns:1fr}
  .panel-head{align-items:flex-start;flex-direction:column}
  .table-wrap{overflow:visible}
  .readings-table{min-width:0;display:block}
  .readings-table thead{display:none}
  .readings-table tbody{display:grid;gap:10px;padding:12px}
  .readings-table tr{display:grid;grid-template-columns:1fr auto;border:1px solid var(--line);
    border-radius:12px;padding:11px 13px;background:var(--card);align-items:center}
  .readings-table td{border:0;padding:3px 0;display:block;font-size:12px}
  .readings-table td:first-child{font-weight:750}
  .readings-table td.num{text-align:right}
  .readings-table tbody tr:hover{background:var(--card)}
  .total-row{background:var(--soft)!important}
  .band-flag{font-size:10px;padding:4px 7px}
}

html,body,#root{min-height:100%}
.live-title{padding:18px 22px}
.live-note{padding:12px 16px;background:var(--soft-warn);color:var(--ink-warn);border-radius:10px;margin:15px 0;line-height:1.5}
.live-error{color:var(--danger);margin-top:12px;min-height:20px}
.live-months{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}
.live-months button{border:1px solid var(--line);background:var(--card);border-radius:9px;padding:9px 13px}
.live-months button.active{color:var(--success);border-color:var(--teal);background:var(--soft)}
.live-table{max-height:520px;overflow:auto}
.live-empty{color:var(--muted);padding:25px 22px}
.live-layout{min-width:0}

/* Vista conectada: las superficies se ajustan sin ampliar el ancho del móvil. */
.live-layout .page-section,.live-layout .data-panel,.live-layout .hero{min-width:0}
.live-layout .content{padding-inline:clamp(16px,2.6vw,38px)}
.live-layout .plant-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,270px),1fr))}
.live-layout .plant-card{min-width:0}
.live-layout .plant-card:hover{transform:translateY(-3px)}
.live-layout .connection-line{flex-wrap:wrap}
.live-layout .connection-line strong{overflow-wrap:anywhere}
.live-layout .hero{background:linear-gradient(120deg,#112e44 0%,#174f65 70%,#176b70 100%)}
.live-layout .hero h2{font-size:clamp(26px,3vw,40px)}
.live-layout .hero-stats{min-width:0}
.live-layout .hero-stat{min-width:140px}
.live-layout .live-months{overflow-x:auto;flex-wrap:nowrap;padding:2px 0 10px;scrollbar-width:thin}
.live-layout .live-months button{flex:0 0 auto;min-height:44px;font-weight:700;white-space:nowrap}
.live-layout .live-months button:hover{border-color:var(--teal)}
.live-layout .live-note{border:1px solid var(--line);line-height:1.55}
.live-layout .live-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.live-layout .live-kpis>div{min-width:0;background:var(--card);border:1px solid var(--line);
  border-radius:14px;padding:18px 20px;box-shadow:var(--shadow-card)}
.live-layout .live-kpis span{display:block;font-size:11px;color:var(--muted);font-weight:750;
  text-transform:uppercase;letter-spacing:.06em}
.live-layout .live-kpis strong{display:block;margin-top:10px;font-size:clamp(19px,2vw,27px);
  font-variant-numeric:tabular-nums;line-height:1.15;overflow-wrap:anywhere}
.live-layout .live-kpis strong small{font-size:.55em;color:var(--muted)}
.live-layout .live-kpis .live-period-name{font-size:clamp(17px,1.75vw,23px);text-transform:capitalize}
.live-layout .validation-list{list-style:none;margin:0;padding:6px 22px;display:grid}
.live-layout .validation-row{min-width:0;display:flex;align-items:center;justify-content:space-between;
  gap:14px;padding:13px 0;border-bottom:1px solid var(--line)}
.live-layout .validation-row:last-child{border-bottom:0}
.live-layout .validation-row>div{min-width:0}
.live-layout .validation-row strong{display:block;font-size:13px;line-height:1.4}
.live-layout .validation-row p{font-size:11.5px;color:var(--muted);margin-top:4px;
  overflow-wrap:anywhere;line-height:1.5}
.live-layout .validation-row .status-pill{flex:0 0 auto}
.live-layout .live-charts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.live-layout .live-charts .data-panel{margin-top:16px;min-width:0}
.live-layout .live-canvas{position:relative;height:300px;width:100%;padding:18px 18px 20px;min-width:0}
.live-layout .live-canvas canvas{display:block}
.live-layout .live-chart-scroll{overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-width:thin}
.live-layout .live-chart-scroll:focus-visible{outline:2px solid var(--teal);outline-offset:-2px}
.live-layout .live-day-filter{display:flex;flex-wrap:wrap;align-items:center;gap:10px;
  padding:15px 20px;border-top:1px solid var(--line)}
.live-layout .live-day-filter label{font-weight:750}
.live-layout .live-day-filter select{min-height:42px;border:1px solid var(--line);
  border-radius:9px;background:var(--card);padding:0 12px}
.live-layout .live-day-filter span{color:var(--muted);font-size:12px}
.live-layout .live-table{max-height:none;overflow:visible}
.live-layout .live-pagination{display:flex;align-items:center;justify-content:space-between;
  flex-wrap:wrap;gap:12px;border-top:1px solid var(--line);padding:14px 18px;color:var(--muted);
  font-size:12px;font-variant-numeric:tabular-nums}
.live-layout .live-pagination>div{display:flex;align-items:center;gap:8px}
.live-layout .live-pagination button{min-height:42px;border:1px solid var(--line);
  border-radius:9px;background:var(--card);padding:0 12px;color:var(--ink);font-weight:700}
.live-layout .live-pagination button:hover:not(:disabled){border-color:var(--teal);color:var(--success)}
.live-layout .live-pagination button:disabled{opacity:.45;cursor:default}

@media(max-width:1180px){
  .live-layout .live-charts{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:860px){
  .login-page{min-height:100svh}
  .live-layout .live-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .live-layout .live-kpis>div:last-child{grid-column:1/-1}
}
@media(max-width:620px){
  .live-layout .validation-list{padding:4px 16px}
  .live-layout .validation-row{align-items:flex-start;flex-direction:column;gap:8px}
  .login-page{padding:12px}
  .login-form-wrap{min-height:calc(100svh - 24px)}
  .login-card{padding:26px 20px}
  .live-layout .hero{padding:22px;gap:18px}
  .live-layout .hero-stats{width:100%}
  .live-layout .hero-stat{width:100%;min-width:0}
  .live-layout .live-kpis{gap:9px}
  .live-layout .live-kpis>div{padding:14px}
  .live-layout .live-kpis strong{font-size:20px}
  .live-layout .live-canvas{height:245px;padding:14px 10px 14px 8px}
  .live-layout .live-canvas-history{width:650px}
  .live-layout .live-canvas-daily{width:690px}
  .live-layout .live-canvas-profile{width:630px}
  .live-layout .live-charts .panel-head{padding:16px}
  .live-layout .live-table .readings-table tbody{display:grid;gap:9px;padding:12px}
  .live-layout .live-table .readings-table tr{display:flex;flex-direction:column;align-items:stretch}
  .live-layout .live-table .readings-table td,
  .live-layout .live-table .readings-table td.num{display:flex;justify-content:space-between;
    align-items:center;gap:12px;text-align:right;padding:5px 0;min-width:0}
  .live-layout .live-table .readings-table td::before{content:attr(data-label);color:var(--muted);
    font-size:11px;font-weight:650;text-align:left}
  .live-layout .live-pagination{justify-content:center;text-align:center}
  .live-layout .live-pagination>div{flex-wrap:wrap;justify-content:center}
}

/* Vista general: cifras procedentes del histórico financiero en PostgreSQL. */
.executive-page{display:grid;gap:16px}
.executive-page .section-head{margin:9px 0 -3px}
.executive-hero{background:linear-gradient(120deg,#0d364f,#105b6a 68%,#0a756f);color:#fff;
  border-radius:20px;padding:34px 38px;display:flex;justify-content:space-between;align-items:end;gap:26px;box-shadow:var(--shadow)}
.executive-hero h2{font-size:clamp(27px,3.3vw,46px);letter-spacing:-.05em;margin:9px 0}
.executive-hero p:not(.eyebrow){color:#c8dfe6;line-height:1.55;max-width:620px}
.executive-filters{display:flex;gap:12px;flex-wrap:wrap;justify-content:flex-end}
.executive-period{min-width:165px}.executive-period label{display:block;font-size:11px;font-weight:800;color:#b6dde0;margin-bottom:8px}
.executive-period select{width:100%;border:1px solid #9fcbce;border-radius:11px;padding:13px;color:#123944;background:#fff;font-weight:750;text-transform:capitalize}
.executive-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.executive-kpis article{background:var(--card);border:1px solid var(--line);border-radius:15px;padding:20px;min-width:0;box-shadow:var(--shadow-card)}
.executive-kpis article.accent{background:var(--soft);border-color:var(--teal)}
.executive-kpis span,.executive-mini span,.executive-bottom span,.executive-plant-values span{display:block;color:var(--muted);font-size:11px;font-weight:750}
.executive-kpis strong{display:block;font-size:clamp(20px,2vw,31px);letter-spacing:-.045em;margin:10px 0 6px;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
.executive-kpis .accent strong{color:var(--success)}.executive-kpis small{color:var(--muted);font-size:11px}.executive-kpis em{font-size:.5em;font-style:normal;color:var(--muted)}
.executive-mini{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.executive-mini>div{background:var(--card);padding:15px 19px;border:1px solid var(--line);border-radius:13px}
.executive-mini strong{display:block;font-size:17px;margin-top:7px;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.executive-panels{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(310px,1fr);gap:16px;min-width:0}
.executive-page .executive-panels .data-panel,.executive-page>.data-panel{margin:0;min-width:0}
.executive-canvas-wide{height:290px;min-width:570px;padding:20px}
.executive-donut{height:205px;max-width:290px;margin:14px auto 0}
.executive-charge-list{margin:4px 20px 8px;padding:0;list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px 20px}
.executive-charge-list li{display:flex;justify-content:space-between;gap:8px;font-size:11px;border-bottom:1px solid var(--line);padding:5px 0}
.executive-charge-list li span{color:var(--muted)}.executive-charge-list li strong{font-variant-numeric:tabular-nums}
.executive-small{font-size:10px;color:var(--muted);line-height:1.55;margin:12px 20px 20px}
.executive-bottom{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.executive-bottom>div{background:var(--soft);border-radius:12px;padding:17px 20px}
.executive-bottom strong{display:block;font-size:20px;margin-top:5px;color:var(--success);font-variant-numeric:tabular-nums}
.executive-plants{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.executive-plant{background:var(--card);border:1px solid var(--line);border-radius:15px;padding:20px;min-width:0}
.executive-plant-top,.executive-plant-foot{display:flex;align-items:center;justify-content:space-between;gap:8px}
.executive-plant-top h3{font-size:20px;margin:5px 0 18px}.executive-plant-values{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.executive-plant-values strong{display:block;font-size:16px;margin:6px 0;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.executive-plant-heading{margin:4px 0 -5px!important}
.executive-plant-usage{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:12px;font-size:11px;color:var(--muted)}
.executive-plant-usage strong{color:var(--ink);font-variant-numeric:tabular-nums}
.executive-plant-foot{border-top:1px solid var(--line);padding-top:13px;margin-top:12px;font-size:11px}
.executive-plant-foot>span strong{display:block;font-size:14px;margin-top:4px}
.executive-detail-link{display:flex;align-items:center;justify-content:space-between;gap:14px;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:14px 18px;color:var(--muted);font-size:12px}
.executive-source{line-height:1.55}.executive-empty{padding:24px}.executive-empty p{margin:10px 0;color:var(--muted)}
@media(max-width:1180px){.executive-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.executive-plants{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:860px){.executive-panels{grid-template-columns:1fr}.executive-hero{align-items:start;flex-direction:column}.executive-filters{width:100%;justify-content:flex-start}.executive-period{flex:1;min-width:155px}}
@media(max-width:620px){.executive-hero{padding:24px 20px}.executive-kpis,.executive-mini,.executive-plants{grid-template-columns:1fr 1fr}
  .executive-kpis article{padding:15px}.executive-kpis strong{font-size:21px}.executive-mini{gap:8px}
  .executive-mini>div{padding:12px}.executive-mini strong{font-size:14px}
  .executive-plants,.executive-bottom{grid-template-columns:1fr}.executive-charge-list{grid-template-columns:1fr}
  .executive-plant-foot .secondary-btn{padding:0 10px;font-size:11px}
  .executive-detail-link{align-items:start;flex-direction:column}}
