/* ================= Series 2 grade: overrides the HUD skin ================= */
/* A dot-grid ground in each frame, glass panes and terminals. Red stays "running now";
   green is "passed" and the focused pane. */
:root{--g:#4cb782;--glass:rgba(255,255,255,.035);--edge:rgba(230,233,231,.12)}
/* each framed section gets the dot-grid ground and a soft vignette */
section.blk.cm{background:
  radial-gradient(ellipse 80% 75% at 50% 45%,transparent 55%,rgba(0,0,0,.45) 100%),
  radial-gradient(rgba(230,233,231,.08) 1px,transparent 1.4px) 0 0/24px 24px,
  #0c0f10}
/* the terminals: glass on the grid, a red window dot, a lift */
.term{background:rgba(16,18,19,.72)!important;border-color:var(--edge)!important;backdrop-filter:blur(10px);box-shadow:0 22px 60px rgba(0,0,0,.5)!important}
.term .chrome{background:rgba(16,18,19,.55);backdrop-filter:blur(8px)}
.term .chrome i:first-child{background:var(--red)!important;box-shadow:0 0 8px rgba(229,72,47,.6)}
/* panes are glass; the label sits on the ground */
.pane{background:var(--glass)!important;border-color:var(--edge)!important;backdrop-filter:blur(10px);transition:border-color .4s,box-shadow .4s}
.pane>.t{background:#0e1112!important}
.pane.focus{border-color:rgba(76,183,130,.5)!important;box-shadow:0 0 28px rgba(76,183,130,.15),inset 0 0 24px rgba(76,183,130,.05)}
.pane.focus>.t{color:var(--g)!important}
/* the pipelines: running is red and glows, done is green */
.pipe .stage.run{background:color-mix(in srgb,var(--red) 8%,transparent)!important;box-shadow:0 0 22px rgba(229,72,47,.3),inset 0 0 18px rgba(229,72,47,.08)}
.pipe .stage.run .sn{box-shadow:0 0 10px rgba(229,72,47,.5)}
.pipe .stage.done{border-color:rgba(76,183,130,.45)!important}
.pipe .stage.done .sn{background:var(--g)!important;border-color:var(--g)!important;color:#0b0c0d!important}
.pipe .stage.done .sb{color:var(--g)!important}
.pipe .stage.done+.stage.run::before{background:linear-gradient(90deg,var(--g),var(--red))!important}
/* status words, progress and the selected step */
.ws.ok,.sv.ok{color:var(--g)!important;text-shadow:0 0 8px rgba(76,183,130,.5)}
.ws.x{text-shadow:0 0 8px rgba(229,72,47,.5)}
.aitabs2 .prog{box-shadow:0 0 10px var(--red)}
.steps button.on{box-shadow:0 0 20px rgba(230,233,231,.16)}
.rl button.on{box-shadow:inset 2px 0 0 var(--g)}
.rl button.on .c{color:var(--g)!important}
