:root{
  --bg:#03101a;--panel:#092236;--panel-2:#061927;--panel-3:#03111b;
  --text:#edf8ff;--muted:#9bb5c8;--line:rgba(113,198,239,.20);
  --cyan:#40d7ff;--green:#55e2a0;--amber:#ffd166;--red:#ff6c78;
  --shadow:0 18px 55px rgba(0,0,0,.24);--radius:16px;--max:1540px
}
*{box-sizing:border-box}
html{background:var(--bg)}
body{
  margin:0;color:var(--text);
  background:
    radial-gradient(circle at 12% 0,rgba(64,215,255,.13),transparent 33rem),
    linear-gradient(180deg,#03101a,#061b2b);
  font:15px/1.5 Inter,system-ui,-apple-system,"Segoe UI",sans-serif
}
button{font:inherit}.wrap{width:min(var(--max),calc(100% - 2rem));margin:auto}
.topbar{position:sticky;top:0;z-index:30;border-bottom:1px solid var(--line);background:rgba(3,16,26,.9);backdrop-filter:blur(14px)}
.topbar-inner{min-height:68px;display:flex;align-items:center;justify-content:space-between;gap:1rem}
.brand{font-size:1.08rem;font-weight:950;letter-spacing:.02em}.brand span{color:var(--cyan)}
.brand-subtitle{font-size:.72rem;color:var(--muted);letter-spacing:.07em;text-transform:uppercase}
.release-chip,.engine-label{padding:.38rem .68rem;border:1px solid var(--line);border-radius:999px;color:var(--muted);background:rgba(255,255,255,.025)}
.intro{display:grid;grid-template-columns:minmax(0,1fr) 370px;gap:1.25rem;align-items:end;padding:2.25rem 0 1.25rem}
.eyebrow{color:var(--cyan);font-weight:900;text-transform:uppercase;letter-spacing:.085em;font-size:.78rem}
.intro h1{max-width:850px;margin:.35rem 0;font-size:clamp(2rem,4vw,3.65rem);line-height:1.03;letter-spacing:-.045em}
.intro p,.node-header p,.spectrum-header p{margin:.35rem 0 0;color:var(--muted)}
.motto-card{padding:1rem 1.1rem;border:1px solid var(--line);border-radius:var(--radius);background:linear-gradient(135deg,rgba(64,215,255,.07),rgba(85,226,160,.05))}
.motto-card span{display:block;color:var(--muted);font-size:.78rem}.motto-card strong{display:block;margin-top:.2rem;color:var(--green)}
.warning{margin-bottom:1rem;padding:.8rem 1rem;border:1px solid rgba(255,209,102,.45);border-radius:12px;background:rgba(255,209,102,.08);color:var(--amber)}
.summary-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.8rem}
.summary-card,.panel{border:1px solid var(--line);border-radius:var(--radius);background:linear-gradient(180deg,rgba(9,34,54,.96),rgba(6,25,39,.96));box-shadow:var(--shadow)}
.summary-card{padding:.85rem 1rem}.summary-card span{color:var(--muted);font-size:.78rem}.summary-card strong{display:block;margin-top:.1rem;font-size:1.65rem}
.console-layout{display:grid;grid-template-columns:285px minmax(0,1fr);gap:1rem;align-items:start;margin-top:1rem}
.sidebar{padding:.8rem;position:sticky;top:84px}.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:.75rem;padding:.25rem .25rem .75rem}
.section-heading span{font-weight:900}.section-heading small{color:var(--muted)}
.nodes{display:grid;gap:.55rem}.node{cursor:pointer;width:100%;padding:.8rem;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.022);color:var(--text);text-align:left}
.node:hover,.node.active{border-color:rgba(64,215,255,.62);background:rgba(64,215,255,.075)}
.node-head{display:flex;align-items:center;justify-content:space-between;gap:.65rem}.node small{display:block;margin-top:.22rem;color:var(--muted)}
.node-dot{width:.65rem;height:.65rem;border-radius:50%}.node-dot.online{background:var(--green);box-shadow:0 0 12px rgba(85,226,160,.65)}.node-dot.offline{background:var(--red)}
.main-panel{padding:1rem}.node-header{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem}.node-header h2{margin:.25rem 0 0;font-size:1.65rem}
.state-chip{display:inline-flex;align-items:center;gap:.42rem;padding:.4rem .68rem;border:1px solid currentColor;border-radius:999px;font-size:.77rem;font-weight:850;background:rgba(255,255,255,.025)}
.state-chip.live{color:var(--green)}.state-chip.delayed{color:var(--amber)}.state-chip.offline{color:var(--red)}
.status-pulse{display:inline-block;width:.55rem;height:.55rem;border-radius:50%;background:currentColor;box-shadow:0 0 0 0 currentColor}
.pulse-now{animation:ulrfPulse .8s ease-out}@keyframes ulrfPulse{0%{transform:scale(.85);box-shadow:0 0 0 0 rgba(85,226,160,.85)}70%{transform:scale(1.12);box-shadow:0 0 0 9px rgba(85,226,160,0)}100%{transform:scale(1);box-shadow:0 0 0 0 rgba(85,226,160,0)}}
.node-facts{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:.72rem;margin-top:1rem}
.fact{padding:.72rem .78rem;border:1px solid var(--line);border-radius:11px;background:rgba(255,255,255,.022);min-width:0}
.fact span{display:block;color:var(--muted);font-size:.76rem}.fact strong{display:block;margin-top:.17rem;overflow-wrap:anywhere}
.spectrum-card{margin-top:1rem;padding:1rem;border:1px solid var(--line);border-radius:15px;background:var(--panel-3)}
.spectrum-header{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.spectrum-title-row{display:flex;align-items:center;gap:.75rem}.spectrum-title-row h3{margin:0;font-size:1.35rem}.engine-label{font-size:.7rem;padding:.25rem .5rem}
.state-cluster,.toolbar{display:flex;align-items:center;gap:.45rem;flex-wrap:wrap}
.toolbar{margin-top:.75rem}.tool-button{cursor:pointer;border:1px solid var(--line);border-radius:9px;padding:.43rem .68rem;background:rgba(255,255,255,.035);color:var(--text)}
.tool-button:hover,.tool-button.active{border-color:rgba(64,215,255,.62);background:rgba(64,215,255,.10)}
.canvas-shell{position:relative;height:430px;margin-top:.8rem;border:1px solid var(--line);border-radius:13px;overflow:hidden;background:
linear-gradient(rgba(64,215,255,.065) 1px,transparent 1px),
linear-gradient(90deg,rgba(64,215,255,.065) 1px,transparent 1px),#020c14;background-size:100% 54px,82px 100%,100% 100%}
canvas{display:block;width:100%;height:100%}.center-line{pointer-events:none;position:absolute;inset:0 auto 0 50%;width:1px;background:rgba(255,255,255,.28)}
.cursor-tooltip{pointer-events:none;position:absolute;display:none;z-index:5;min-width:165px;padding:.55rem .65rem;border:1px solid rgba(255,255,255,.25);border-radius:9px;background:rgba(2,12,20,.94);box-shadow:0 10px 30px rgba(0,0,0,.4);font-size:.83rem}
.axis{display:grid;grid-template-columns:repeat(5,1fr);margin-top:.45rem;color:var(--muted);font-size:.78rem}.axis span{text-align:center}.axis span:first-child{text-align:left}.axis span:last-child{text-align:right}
.spectrum-metrics{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:.65rem;margin-top:.78rem}.spectrum-metrics .wide{grid-column:span 1}
.occupancy-track{height:6px;margin-top:.4rem;border-radius:99px;background:rgba(255,255,255,.08);overflow:hidden}.occupancy-fill{height:100%;width:0;background:linear-gradient(90deg,var(--cyan),var(--green),var(--amber))}
.report-age{margin-top:.72rem;padding:.55rem .7rem;border-left:3px solid rgba(64,215,255,.62);background:rgba(64,215,255,.045);color:var(--muted)}
.operator-help{margin-top:.45rem;color:var(--muted);font-size:.82rem}
.activity-panel{margin:1rem 0;padding:1rem}.activity-item{display:grid;grid-template-columns:90px 1fr;gap:.75rem;padding:.62rem .2rem;border-bottom:1px solid var(--line)}.activity-item time,.activity-item span{color:var(--muted)}.activity-item span{display:block}.empty{padding:.8rem;color:var(--muted)}
footer{margin-top:2.5rem;border-top:1px solid var(--line)}.footer-inner{display:flex;justify-content:space-between;gap:2rem;padding:1.8rem 0;color:var(--muted)}.footer-inner strong{color:var(--text)}.footer-inner p{margin:.25rem 0;max-width:690px}
@media(max-width:1250px){.intro{grid-template-columns:1fr}.summary-grid{grid-template-columns:repeat(3,1fr)}.console-layout{grid-template-columns:1fr}.sidebar{position:static}.nodes{grid-template-columns:repeat(2,1fr)}.node-facts,.spectrum-metrics{grid-template-columns:repeat(4,1fr)}}
@media(max-width:760px){.summary-grid,.nodes,.node-facts,.spectrum-metrics{grid-template-columns:1fr 1fr}.canvas-shell{height:320px}.footer-inner{display:block}}
@media(max-width:460px){.summary-grid,.nodes,.node-facts,.spectrum-metrics{grid-template-columns:1fr}.node-header,.spectrum-header{display:block}.state-cluster{margin-top:.7rem}}


/* ULRF Monitor RC2.1 · Selector de escala vertical */
.scale-controls{
  display:flex;
  align-items:center;
  gap:.7rem;
  flex-wrap:wrap;
  margin-top:.65rem;
  padding:.65rem .75rem;
  border:1px solid var(--line);
  border-radius:11px;
  background:rgba(255,255,255,.025)
}
.scale-mode-group,.fixed-scale-fields{
  display:flex;
  align-items:center;
  gap:.45rem;
  flex-wrap:wrap
}
.scale-label{
  color:var(--muted);
  font-size:.82rem;
  font-weight:800;
  letter-spacing:.03em;
  text-transform:uppercase
}
.fixed-scale-fields[hidden]{display:none}
.fixed-scale-fields label{
  display:flex;
  align-items:center;
  gap:.35rem;
  color:var(--muted);
  font-size:.82rem
}
.fixed-scale-fields input{
  width:78px;
  padding:.38rem .45rem;
  border:1px solid var(--line);
  border-radius:8px;
  background:rgba(3,17,27,.78);
  color:var(--text);
  font:inherit
}
.scale-status{
  margin-left:auto;
  color:var(--cyan);
  font-size:.82rem;
  font-weight:800
}
@media(max-width:760px){
  .scale-controls{align-items:flex-start}
  .scale-status{width:100%;margin-left:0}
}


/* ULRF Monitor RC2.2 · Ayuda técnica dBFS */
.dbfs-help{
  margin-top:.7rem;
  border:1px solid var(--line);
  border-radius:11px;
  background:rgba(255,255,255,.022);
  overflow:hidden
}
.dbfs-help summary{
  cursor:pointer;
  padding:.72rem .85rem;
  color:var(--cyan);
  font-size:.84rem;
  font-weight:800;
  user-select:none
}
.dbfs-help summary:hover{background:rgba(66,217,255,.055)}
.dbfs-help-content{
  padding:0 .9rem .85rem;
  color:var(--muted);
  font-size:.82rem;
  line-height:1.55
}
.dbfs-help-content p{margin:.65rem 0 0}
.dbfs-help-content strong{color:var(--text)}