/* NILE / SUDAN TV: MINI SET-TOP RECEIVER
   Mechanical styling from the Nile Store radio, reduced to three functions.
   Keep the red Stories poster and the original, uncropped YouTube frame. */
.nl-stories .news-tv-screen .tv-vintage-stage {
  position:relative;
  width:100%;
  height:100%;
  overflow:hidden;
  isolation:isolate;
  background:#091a12;
}
.nl-stories .news-tv-screen .tv-vintage-video {
  display:block;
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  max-width:none;
  max-height:none;
  border:0;
  border-radius:0;
  transform:none;
  background:#091a12;
}

/* The full painted TV cabinet determines the horizontal centre in JS.
   The receiver is small enough to read as a real set-top unit, not furniture. */
.nl-stories .tv-vintage-rack {
  position:absolute;
  z-index:50;
  top:60.7%;
  left:46.44%;
  width:clamp(199px,17.4%,266px);
  max-width:29%;
  transform:translateX(-50%);
  isolation:isolate;
  pointer-events:none;
}
.nl-stories .tv-vintage-rack[hidden] {display:none!important;}

/* Three balanced hardware bays, with the LCD in the centre. */
.nl-stories .tv-vintage-pod {
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:36px minmax(0,1fr) 36px;
  align-items:stretch;
  gap:5px;
  box-sizing:border-box;
  width:100%;
  height:54px;
  min-width:0;
  padding:6px;
  border:2px solid #0a0f0b;
  border-radius:2px;
  background:linear-gradient(150deg,#394239,#1e2520 65%,#111712);
  box-shadow:inset 0 1px #ffffff2c,inset 0 -1px #0008,0 3px 0 #090e09,0 6px 9px #0006;
  pointer-events:auto;
}
.nl-stories .tv-vintage-pod > button[data-vintage-prev],
.nl-stories .tv-vintage-pod > button[data-vintage-next] {
  display:grid;
  place-items:center;
  min-width:0;
  min-height:0;
  height:100%;
  margin:0;
  padding:0;
  border:1px solid #090c09;
  border-radius:1px;
  background:linear-gradient(#dfd4b3,#ada085);
  color:#142c1f;
  box-shadow:inset 1px 1px #fff4d4,inset -1px -1px #5a5346;
  font:900 14px/1 Arial,sans-serif;
  cursor:pointer;
}
.nl-stories .tv-vintage-pod > button:is([data-vintage-prev],[data-vintage-next]):hover {
  background:#f0e0b8;
  color:#a63e35;
}
.nl-stories .tv-vintage-pod > button:is([data-vintage-prev],[data-vintage-next]):active {
  box-shadow:inset 0 2px 2px #72634a;
  transform:translateY(1px);
}
.nl-stories .tv-vintage-pod button:focus-visible {
  outline:2px solid #e9b651;
  outline-offset:2px;
}
.nl-stories .tv-vintage-info {
  display:grid;
  grid-template-columns:minmax(0,1fr) 20px;
  align-items:center;
  column-gap:2px;
  min-width:0;
  height:100%;
  padding:0 3px 0 5px;
  box-sizing:border-box;
  border:1px solid #536450;
  background:linear-gradient(#08170d,#0e2113);
  box-shadow:inset 0 0 7px #c7de9931;
}
.nl-stories .tv-vintage-info > strong {
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  line-clamp:2;
  min-width:0;
  max-height:32px;
  overflow:hidden;
  color:#d1e2a7;
  font:800 9.5px/1.25 ui-monospace,Menlo,Consolas,monospace;
  letter-spacing:.005em;
  overflow-wrap:break-word;
}
.nl-stories .tv-vintage-info [data-vintage-sound] {
  display:grid;
  place-items:center;
  width:20px;
  height:24px;
  min-width:0;
  min-height:0;
  padding:0;
  margin:0;
  border:0;
  border-radius:0;
  background:transparent;
  color:#ddc79d;
  font:800 15px/1 Arial,sans-serif;
  cursor:pointer;
}
.nl-stories .tv-vintage-info [data-vintage-sound][aria-pressed="true"] {
  color:#e7be79;
}
.nl-stories .tv-vintage-info [data-vintage-sound]:hover {
  color:#fff0ca;
}

@media(max-width:999px) {
  .nl-stories .tv-vintage-rack {
    top:61%;
    width:clamp(185px,22.8%,245px);
    max-width:35%;
  }
  .nl-stories .tv-vintage-pod {height:52px;grid-template-columns:34px minmax(0,1fr) 34px;}
  .nl-stories .tv-vintage-info > strong {font-size:9.5px;}
}
@media(max-width:620px) {
  .nl-stories .tv-vintage-rack {
    top:61%;
    width:clamp(178px,27.6%,222px);
    max-width:44%;
  }
  .nl-stories .tv-vintage-pod {height:50px;grid-template-columns:31px minmax(0,1fr) 31px;gap:4px;padding:5px;}
  .nl-stories .tv-vintage-info {grid-template-columns:minmax(0,1fr) 18px;padding-left:4px;}
  .nl-stories .tv-vintage-info > strong {font-size:8.4px;}
   .nl-stories .tv-vintage-info [data-vintage-sound] {width:18px;}
}
@media(prefers-reduced-motion:reduce) {
  .nl-stories .tv-vintage-pod button {transition:none;}
}
