
.afexkidz-fe-session{--g:#7CFF73;--y:#FFE678;--r:#FF4D4D;--bg:#050708;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  color:var(--g); background:linear-gradient(180deg,#020405,#060a0c);
  border:1px solid rgba(124,255,115,.22); border-radius:16px; padding:12px;
  box-shadow:0 10px 30px rgba(0,0,0,.55);
}
.afexkidz-fe-session *{box-sizing:border-box}
.afexkidz-fe-session .row{display:flex; gap:8px; flex-wrap:wrap; align-items:center}
.afexkidz-fe-session .btn{
  background:#08110c; border:1px solid rgba(124,255,115,.25);
  color:var(--g); padding:10px 12px; border-radius:12px; cursor:pointer;
}
.afexkidz-fe-session .btn:disabled{opacity:.45; cursor:not-allowed}
.afexkidz-fe-session .btn.danger{border-color:rgba(255,77,77,.45); color:#ffd0d0}
.afexkidz-fe-session .btn.wide{width:100%}
.afexkidz-fe-session .top{display:flex; justify-content:space-between; gap:10px; flex-wrap:wrap; margin-bottom:10px}
.afexkidz-fe-session .status{display:flex; gap:10px; flex-wrap:wrap; opacity:.9}
.afexkidz-fe-session .pill{border:1px solid rgba(124,255,115,.22); padding:6px 10px; border-radius:999px; background:rgba(0,0,0,.25)}
.afexkidz-fe-session .pill .k{opacity:.7; margin-right:6px}
.afexkidz-fe-session .tv{
  position:relative; width:100%; height:280px; border-radius:18px; overflow:hidden;
  border:1px solid rgba(255,255,255,.12);
  background:#000;
}
.afexkidz-fe-session .tv::before{
  content:""; position:absolute; inset:0;
  background: repeating-linear-gradient(
    to bottom,
    rgba(0,0,0,.0) 0px,
    rgba(0,0,0,.0) 2px,
    rgba(0,0,0,.14) 3px
  );
  pointer-events:none; mix-blend-mode:multiply; opacity:.65;
}
.afexkidz-fe-session .tv .crtglow{
  position:absolute; inset:-10%;
  background: radial-gradient(closest-side, rgba(124,255,115,.18), rgba(0,0,0,0));
  pointer-events:none; opacity:.55;
}
.afexkidz-fe-session .tv .layer{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  opacity:0; transition:opacity 900ms linear;
  filter:contrast(1.05) saturate(.95);
}
.afexkidz-fe-session .tv .layer.on{opacity:1}
.afexkidz-fe-session canvas.noise{position:absolute; inset:0; width:100%; height:100%; opacity:.35; pointer-events:none}
.afexkidz-fe-session .nosignal{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  background: linear-gradient(90deg,#f00,#ff0,#0f0,#0ff,#00f,#f0f);
  filter:saturate(1.2) contrast(1.1);
}
.afexkidz-fe-session .nosignal .txt{
  background:rgba(0,0,0,.55); border:1px solid rgba(255,255,255,.18);
  padding:10px 14px; border-radius:12px; color:#fff; letter-spacing:.18em;
}
.afexkidz-fe-session .actions{margin:10px 0}
.afexkidz-fe-session .actions .grid{display:grid; grid-template-columns:1fr; gap:10px}
@media(min-width:980px){ .afexkidz-fe-session .actions .grid{grid-template-columns:1fr 1fr} }

/* Sequencer */
.afexkidz-fe-session .seqWrap{
  margin-top:10px; padding:10px; border-radius:16px;
  border:1px solid rgba(124,255,115,.18); background:rgba(0,0,0,.25);
}
.afexkidz-fe-session .seqHead{display:flex; justify-content:space-between; gap:10px; align-items:center; flex-wrap:wrap; margin-bottom:8px}
.afexkidz-fe-session .seqTitle{display:flex; gap:8px; align-items:center}
.afexkidz-fe-session .seqTitle .name{color:var(--y); font-weight:700; letter-spacing:.12em}
.afexkidz-fe-session .seqRow{display:flex; gap:6px; flex-wrap:nowrap; overflow-x:auto; padding-bottom:4px}
.afexkidz-fe-session .step{
  width:18px; height:18px; border-radius:6px;
  border:1px solid rgba(124,255,115,.22);
  background:rgba(0,0,0,.35);
  position:relative; flex:0 0 auto;
}
.afexkidz-fe-session .step.on{background:rgba(124,255,115,.22)}
.afexkidz-fe-session .step.ph{outline:2px solid rgba(255,230,120,.55)}
.afexkidz-fe-session .step .lab{
  position:absolute; right:4px; bottom:2px; font-size:10px; color:rgba(255,230,120,.9)
}
.afexkidz-fe-session .step.ch{border-color:rgba(255,230,120,.35)}
.afexkidz-fe-session .btn.on{border-color:rgba(255,230,120,.35); box-shadow:0 0 0 2px rgba(255,230,120,.10)}

/* Controls */
.afexkidz-fe-session .ctrl{
  margin-top:10px; padding:10px;
  border:1px solid rgba(124,255,115,.18); border-radius:16px; background:rgba(0,0,0,.25);
}
.afexkidz-fe-session .ctrlGrid{
  display:grid; grid-template-columns:repeat(2,1fr); gap:10px;
}
@media(min-width:980px){ .afexkidz-fe-session .ctrlGrid{grid-template-columns:repeat(4,1fr)} }
.afexkidz-fe-session label{display:flex; flex-direction:column; gap:6px; font-size:12px}
.afexkidz-fe-session input[type=range]{width:100%}

/* Guide/Help modal */
.afexkidz-fe-session .modalBack{position:fixed; inset:0; background:rgba(0,0,0,.55); display:none; z-index:99998}
.afexkidz-fe-session .modalBack.on{display:block}
.afexkidz-fe-session .modal{
  position:fixed; inset:auto 12px 12px 12px; max-width:760px; margin:0 auto;
  background:#07110b; border:1px solid rgba(124,255,115,.22);
  border-radius:18px; padding:12px; display:none; z-index:99999;
}
.afexkidz-fe-session .modal.on{display:block}
.afexkidz-fe-session .modal .mhead{display:flex; justify-content:space-between; gap:10px; align-items:center}
.afexkidz-fe-session .modal .mbody{margin-top:10px; max-height:55vh; overflow:auto; padding-right:6px}
.afexkidz-fe-session .dim{opacity:.75}


/* ===== FE_Session Design Patch (no engine changes) ===== */
.afexkidz-fe-session{
  --g:#7CFF73; --y:#FFE678; --r:#FF4D4D;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !important;
  color:var(--g);
  background:linear-gradient(180deg,#020405,#060a0c);
  border:1px solid rgba(124,255,115,.22);
  border-radius:16px;
  padding:12px;
  box-shadow:0 10px 30px rgba(0,0,0,.55);
  max-width:100%;
  overflow:hidden;
}
.afexkidz-fe-session *{box-sizing:border-box}
.afexkidz-fe-session .fe-title{
  margin:0 0 8px 0;
  letter-spacing:.18em;
  font-weight:700;
  color:var(--y);
  font-size:13px;
  text-transform:uppercase;
  opacity:.95;
}

/* Compact buttons */
.afexkidz-fe-session button{
  background:#08110c;
  border:1px solid rgba(124,255,115,.25);
  color:var(--g);
  padding:7px 10px;
  border-radius:10px;
  cursor:pointer;
  font-size:12px;
  line-height:1;
}
.afexkidz-fe-session button:hover{
  border-color:rgba(255,230,120,.35);
  box-shadow:0 0 0 2px rgba(255,230,120,.08);
}
.afexkidz-fe-session button:focus{outline:none}
.afexkidz-fe-session button:disabled{opacity:.45; cursor:not-allowed}

/* TV */
.afexkidz-fe-session .fe-tv,
.afexkidz-fe-session .tv{
  height:380px !important;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.12);
  position:relative;
  overflow:hidden;
}
@media(max-width:900px){.afexkidz-fe-session .fe-tv,.afexkidz-fe-session .tv{height:260px !important;}}
}

/* NO SIGNAL overlay (crisp) — support both classnames */
.afexkidz-fe-session .fe-nosignal,
.afexkidz-fe-session .nosignal{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(90deg,
      #ffffff 0% 10%,
      #ffe600 10% 20%,
      #00ff6a 20% 30%,
      #00d9ff 30% 40%,
      #005bff 40% 50%,
      #ff00d4 50% 60%,
      #ff2b2b 60% 70%,
      #000000 70% 100%);
  image-rendering:pixelated;
}
/* CRT scanlines overlay if tv exists */
.afexkidz-fe-session .fe-tv::before,
.afexkidz-fe-session .tv::before{
  content:"";
  position:absolute; inset:0;
  background: repeating-linear-gradient(
    to bottom,
    rgba(0,0,0,.0) 0px,
    rgba(0,0,0,.0) 2px,
    rgba(0,0,0,.14) 3px
  );
  pointer-events:none;
  mix-blend-mode:multiply;
  opacity:.65;
}

/* Ranges: kill default blue */
.afexkidz-fe-session input[type=range]{-webkit-appearance:none; appearance:none; height:18px; background:transparent; width:100%}
.afexkidz-fe-session input[type=range]::-webkit-slider-runnable-track{
  height:6px; border-radius:999px; background:rgba(124,255,115,.20); border:1px solid rgba(124,255,115,.25);
}
.afexkidz-fe-session input[type=range]::-webkit-slider-thumb{
  -webkit-appearance:none; appearance:none;
  width:14px; height:14px; border-radius:6px;
  background:rgba(255,230,120,.95); border:1px solid rgba(0,0,0,.55);
  margin-top:-5px;
}
.afexkidz-fe-session input[type=range]::-moz-range-track{
  height:6px; border-radius:999px; background:rgba(124,255,115,.20); border:1px solid rgba(124,255,115,.25);
}
.afexkidz-fe-session input[type=range]::-moz-range-thumb{
  width:14px; height:14px; border-radius:6px;
  background:rgba(255,230,120,.95); border:1px solid rgba(0,0,0,.55);
}

/* Compact layout helpers (works with existing markup) */
.afexkidz-fe-session .fe-actions{margin:8px 0 !important}
.afexkidz-fe-session .fe-controls{gap:8px !important}

/* No-signal overlay: full cover */
.afexkidz-fe-session .fe-nosignal,
.afexkidz-fe-session .nosignal{
  width:100% !important;
  height:100% !important;
  background-size:100% 100% !important;
  background-repeat:no-repeat !important;
}
/* If there is an inner label element, style it; otherwise keep minimal */
.afexkidz-fe-session .fe-nosignal .txt,
.afexkidz-fe-session .nosignal .txt,
.afexkidz-fe-session .fe-nosignal span,
.afexkidz-fe-session .nosignal span,
.afexkidz-fe-session .fe-nosignal div,
.afexkidz-fe-session .nosignal div{
  background:rgba(0,0,0,.55);
  border:1px solid rgba(255,255,255,.18);
  padding:10px 14px;
  border-radius:12px;
  color:#fff;
  letter-spacing:.18em;
}

.afexkidz-fe-session .fe-top,
.afexkidz-fe-session .top{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  align-items:center;
  padding:2px 2px 0 2px;
}

/* ===== v1.0.4 TV NO SIGNAL crisp fix ===== */
.afexkidz-fe-session .fe-nosignal,
.afexkidz-fe-session .nosignal{
  filter:none !important;
  backdrop-filter:none !important;
  transform:none !important;
  will-change:auto !important;
}

/* Hide any existing inner text to avoid duplicates, then draw one centered label */
.afexkidz-fe-session .fe-nosignal *,
.afexkidz-fe-session .nosignal *{ display:none !important; }

.afexkidz-fe-session .fe-nosignal::after,
.afexkidz-fe-session .nosignal::after{
  content:"NO SIGNAL";
  display:inline-block;
  background:rgba(0,0,0,.65);
  border:1px solid rgba(255,255,255,.18);
  padding:10px 14px;
  border-radius:12px;
  color:#fff;
  letter-spacing:.18em;
}

/* Make bars hard-edged and full cover */
.afexkidz-fe-session .fe-nosignal,
.afexkidz-fe-session .nosignal{
  background-image: linear-gradient(90deg,
      #ffffff 0% 14.2857%,
      #ffe600 14.2857% 28.5714%,
      #00ff6a 28.5714% 42.8571%,
      #00d9ff 42.8571% 57.1428%,
      #005bff 57.1428% 71.4285%,
      #ff00d4 71.4285% 85.7142%,
      #ff2b2b 85.7142% 100%);
  background-size: 100% 100% !important;
  background-repeat: no-repeat !important;
  image-rendering: pixelated;
}

/* OFF stays black */
.afexkidz-fe-session .tv.off::before,
.afexkidz-fe-session .fe-tv.off::before{ display:none !important; }

/* Wider sequencer pads/steps */
.afexkidz-fe-session .step,
.afexkidz-fe-session .fe-step{
  width:22px !important;
  height:20px !important;
  border-radius:7px !important;
}

/* Prevent ON button overflow */
.afexkidz-fe-session{padding:12px 14px !important;}
.afexkidz-fe-session .fe-top,
.afexkidz-fe-session .top{margin-left:0 !important; padding-left:0 !important;}
.afexkidz-fe-session button{max-width:100%;}

.afexkidz-fe-session .seqHead label{display:flex;flex-direction:column;gap:4px;font-size:11px;min-width:140px}
