/* Self-contained release display. Values stay unresolved until a date is announced. */
.release-countdown {
  --signal-ink:#d7f771;
  --signal-muted:#b5c48d;
  --signal-rule:rgba(215,247,113,.22);
  --countdown-size:clamp(44px,5.4vw,80px);
  min-width:0;
}
.countdown-accessible {
  position:absolute;
  width:1px;
  height:1px;
  margin:-1px;
  padding:0;
  overflow:hidden;
  clip-path:inset(50%);
  white-space:nowrap;
}
.signal-screen {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  color:var(--signal-ink);
  font-family:"Courier New",Courier,monospace;
}
.signal-screen::before {
  content:"";
  position:absolute;
  z-index:2;
  inset:-35% 0 auto;
  height:30%;
  pointer-events:none;
  opacity:0;
  background:linear-gradient(transparent,rgba(180,215,115,.1),transparent);
}
.signal-screen::after {
  content:"";
  position:absolute;
  z-index:3;
  inset:0;
  pointer-events:none;
  background:repeating-linear-gradient(0deg,transparent 0 3px,rgba(0,0,0,.065) 3px 4px);
}
.signal-topline,.signal-bottomline {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  font-size:10px;
  line-height:1.4;
  letter-spacing:.1em;
}
.signal-topline { padding-bottom:12px; border-bottom:1px solid var(--signal-rule); }
.signal-bottomline { padding-top:12px; border-top:1px solid var(--signal-rule); letter-spacing:0; }
.signal-status { display:flex; align-items:center; gap:7px; }
.signal-dot { width:5px; height:5px; flex:none; border-radius:50%; background:currentColor; }
.signal-ellipsis { margin-left:-7px; }
.signal-bars { display:flex; align-items:flex-end; gap:3px; height:13px; }
.signal-bars i { display:block; width:3px; height:25%; background:currentColor; opacity:.5; }
.signal-bars i:nth-child(2) { height:50%; }
.signal-bars i:nth-child(3) { height:75%; }
.signal-bars i:nth-child(4) { height:100%; }
.countdown-readout {
  display:grid;
  grid-template-columns:minmax(0,1fr) .2fr minmax(0,1fr) .2fr minmax(0,1fr);
  align-items:start;
  padding:27px 0 21px;
  text-align:center;
}
.countdown-unit { display:grid; gap:8px; min-width:0; }
.countdown-digits {
  display:block;
  position:relative;
  font-size:var(--countdown-size);
  font-weight:700;
  line-height:.9;
  letter-spacing:-.07em;
  padding-right:.07em;
}
.countdown-digits::after {
  content:attr(data-value);
  position:absolute;
  inset:0;
  padding-right:.07em;
  color:inherit;
  opacity:0;
  clip-path:inset(30% 0 38%);
  pointer-events:none;
}
.countdown-unit small { color:var(--signal-muted); font:10px/1.5 "Courier New",Courier,monospace; text-transform:uppercase; letter-spacing:.16em; }
.countdown-colon { font-size:calc(var(--countdown-size) * .6); line-height:1.2; opacity:.7; }

/* Visible signal interference, without flashing the whole panel. */
.is-signal-running .signal-screen::before { animation:signal-sweep 2.7s linear infinite; }
.is-signal-running .signal-screen::after { animation:signal-static 4.8s steps(1,end) infinite; }
.is-signal-running .countdown-digits { animation:signal-tune 4.8s steps(1,end) infinite; }
.is-signal-running .countdown-digits::after { animation:signal-fragment 4.8s steps(1,end) infinite; }
.is-signal-running .countdown-unit:nth-child(3) .countdown-digits,
.is-signal-running .countdown-unit:nth-child(3) .countdown-digits::after { animation-delay:-.2s; }
.is-signal-running .countdown-unit:nth-child(5) .countdown-digits,
.is-signal-running .countdown-unit:nth-child(5) .countdown-digits::after { animation-delay:-.4s; }
.is-signal-running .signal-bars i { animation:signal-search 2.4s steps(1,end) infinite; }
.is-signal-running .signal-bars i:nth-child(2) { animation-delay:.3s; }
.is-signal-running .signal-bars i:nth-child(3) { animation-delay:.6s; }
.is-signal-running .signal-bars i:nth-child(4) { animation-delay:.9s; }
@keyframes signal-sweep {
  0% { transform:translateY(0); opacity:0; }
  10%,85% { opacity:1; }
  100% { transform:translateY(450%); opacity:0; }
}
@keyframes signal-tune {
  0%,19%,57%,77%,100% { transform:none; }
  4% { transform:translateX(2px) skewX(-7deg); }
  11% { transform:translateX(-2px) skewX(5deg); }
  61% { transform:translateX(2px); }
  69% { transform:translateX(-1px) skewX(-4deg); }
}
@keyframes signal-fragment {
  0%,21%,56%,79%,100% { opacity:0; transform:none; }
  3% { opacity:.9; transform:translate(8px,3px); clip-path:inset(12% 0 52%); }
  10% { opacity:.75; transform:translate(-7px,-2px); clip-path:inset(42% 0 22%); }
  16% { opacity:.6; transform:translate(5px,2px); clip-path:inset(28% 0 34%); }
  60% { opacity:.8; transform:translate(-6px,2px); clip-path:inset(18% 0 44%); }
  69% { opacity:.65; transform:translate(7px,-2px); clip-path:inset(46% 0 18%); }
}
@keyframes signal-static {
  0%,22%,56%,80%,100% { background-position:0 0; opacity:.7; }
  3%,60% { background-position:0 2px; opacity:1; }
  13%,70% { background-position:0 -2px; opacity:.85; }
}
@keyframes signal-search {
  0%,100% { opacity:.25; }
  35% { opacity:.6; }
  65% { opacity:1; }
}
@media(prefers-reduced-motion:reduce) {
  .release-countdown *,.release-countdown *::before,.release-countdown *::after { animation:none!important; }
}

/* A wide landscape with the field receiver anchored at the lower left. */
.release-section {
  position:relative;
  isolation:isolate;
  min-height:760px;
  height:min(100svh,1000px);
  padding:65px var(--gutter);
  overflow:hidden;
  background:#242b1d;
}
.release-landscape,.release-landscape img { position:absolute; z-index:-2; inset:0; width:100%; height:100%; }
.release-landscape img { object-fit:cover; object-position:center; }
.release-section::before { content:""; position:absolute; z-index:-1; inset:0; background:linear-gradient(180deg,#111b19aa,transparent 47%,#10190fb8),linear-gradient(90deg,#12200f40,transparent 60%); }
.release-intro .eyebrow { color:#e7e5d5; font-size:11px; }
.release-intro h2 { margin-top:28px; color:#f0ead7; font:400 clamp(82px,10vw,155px)/.96 var(--display); text-transform:uppercase; letter-spacing:.025em; text-shadow:0 3px 24px #14201770; }
.release-intro h2>span { display:block; margin-bottom:15px; font-size:clamp(30px,3.4vw,53px); letter-spacing:.06em; }
.release-note { margin-top:22px; color:#f2eddf; font:12px/1.6 var(--mono); text-shadow:0 1px 6px #12200f; }
.release-art-note { position:absolute; bottom:30px; right:var(--gutter); color:#f2eddf; font:10px/1.5 var(--mono); text-shadow:0 1px 5px #121d10; }
.countdown-radio { position:absolute; bottom:43px; left:var(--gutter); width:clamp(310px,30vw,430px); }
.radio-shell { container-type:inline-size; position:relative; padding:5.5% 5% 3%; isolation:isolate; filter:drop-shadow(0 17px 15px #080d0866); }
.radio-body {
  position:relative;
  display:grid;
  grid-template-columns:18% minmax(0,1fr) 18%;
  gap:3%;
  padding:3.7cqi 4.3cqi 3cqi;
  border:1px solid #929b6c;
  border-bottom:5px solid #353f27;
  border-radius:2.6cqi 2.6cqi 3.2cqi 3.2cqi;
  background:repeating-linear-gradient(92deg,#d3dcb505 0 1px,transparent 1px 5px),linear-gradient(112deg,#77815a,#586443 38%,#616e48 62%,#3e4b30);
  box-shadow:inset 0 2px 1px #bdc69b88,inset 0 -3px 1px #1e291a,inset 5px 0 6px #202b1b55,inset -5px 0 6px #202b1b55,0 2px 0 #141c10;
}
.radio-body::before {
  content:"";
  position:absolute;
  z-index:-1;
  inset:-5.2cqi 2% auto;
  height:8cqi;
  border:1px solid #899374;
  border-radius:2cqi 2cqi 0 0;
  background:linear-gradient(165deg,#9a9f7a,#606c4c 60%,#475336);
  clip-path:polygon(8% 0,91% 0,100% 75%,100% 100%,0 100%,0 65%);
}
.radio-body::after { content:""; position:absolute; top:-2.4cqi; left:16%; width:27%; height:1px; background:#c3c8a455; box-shadow:25cqi 0 #c3c8a455; }
.radio-handle { position:absolute; z-index:2; top:23%; bottom:19%; width:8%; border:1.2cqi solid #151a13; border-radius:3.5cqi; background:transparent; box-shadow:inset 1px 0 1px #9a9d8a,2px 1px 2px #0b100a, -1px 0 1px #9a9d8a; }
.radio-handle-left { left:0; transform:rotate(-3deg); }
.radio-handle-right { right:0; transform:rotate(3deg); }
.radio-screw { position:absolute; width:1.45cqi; height:1.45cqi; border:1px solid #26311d; border-radius:50%; background:linear-gradient(135deg,#939b78 43%,#202b1b 45% 55%,#7c8761 57%); box-shadow:0 1px 1px #acb79555; }
.screw-tl { top:1.5cqi; left:2cqi; }.screw-tr { top:1.5cqi; right:2cqi; }.screw-bl { bottom:1.5cqi; left:2cqi; }.screw-br { bottom:1.5cqi; right:2cqi; }
.radio-side { display:flex; flex-direction:column; align-items:center; padding-top:.4cqi; }
.radio-stencil { font:700 max(6px,1.6cqi)/1.3 "Courier New",Courier,monospace; letter-spacing:.1em; color:#e4e6cf; margin-bottom:.8cqi; }
.radio-dial { position:relative; width:12.5cqi; height:12.5cqi; flex:none; border:1.1cqi solid #293020; border-radius:50%; background:repeating-conic-gradient(#20261c 0deg 12deg,#424a35 12deg 24deg); box-shadow:0 0 0 .3cqi #8a9071,inset 0 0 0 .6cqi #121b13,1px 2px 3px #0b110c; margin:.3cqi 0 2.5cqi; }
.radio-dial::after { content:""; position:absolute; inset:13% 40% 13% 37%; border-radius:2px; background:linear-gradient(90deg,#828772,#394332 45%,#1f271e); transform:rotate(28deg); box-shadow:1px 1px 2px #0c110b; border-top:.6cqi solid #dedfbb; }
.radio-dial-tune::after { transform:rotate(-35deg); }
.radio-port { width:11.5cqi; height:11.5cqi; border:.75cqi solid #bbb99e; border-radius:50%; background:radial-gradient(circle,#141d13 0 20%,#676f50 22% 33%,#1d291b 35% 46%,#a9aa90 49% 56%,#5e6750 59%); box-shadow:0 0 0 .3cqi #35412a,1px 2px 3px #11180f,inset 0 0 0 .3cqi #353d2e; }
.radio-port-blue { background:radial-gradient(circle at 35% 35%,#d2bf83 0 3%,transparent 5%),radial-gradient(circle at 65% 35%,#d2bf83 0 3%,transparent 5%),radial-gradient(circle at 50% 64%,#d2bf83 0 3%,transparent 5%),radial-gradient(circle,#365a6a 0 53%,#1b3038 56%); }
.radio-vent { width:10cqi; height:6cqi; margin-top:2.3cqi; border-radius:.5cqi; background:repeating-linear-gradient(#27321f 0 .45cqi,#7b8560 .5cqi .8cqi); box-shadow:inset 0 1px 3px #131d10; }
.radio-connector { width:6.4cqi; height:6.4cqi; margin-top:2cqi; border:.6cqi solid #bab99e; border-radius:50%; background:#172217; box-shadow:0 0 0 .6cqi #35422c; }
.radio-center { min-width:0; }
.countdown-radio .signal-screen {
  --signal-ink:#26390f;
  --signal-muted:#324519;
  --signal-rule:#475e284a;
  --countdown-size:6.6cqi;
  padding:1.5cqi 1.7cqi 1.2cqi;
  border:1.15cqi solid #222d20;
  border-radius:1cqi;
  background:radial-gradient(ellipse at 40% 40%,#c7d981,#9fb966 65%,#82984f);
  box-shadow:0 0 0 .3cqi #9aab75,inset 0 2px 6px #1c361088,0 2px 4px #19221366;
  text-shadow:0 0 2px #3d5b2833;
}
.countdown-radio .signal-screen::before { background:linear-gradient(transparent,#e4ff9f70,transparent); }
.countdown-radio .signal-topline,.countdown-radio .signal-bottomline { font-size:max(7px,1.35cqi); gap:1cqi; }
.countdown-radio .signal-topline { padding-bottom:.9cqi; }
.countdown-radio .signal-bottomline { padding-top:.8cqi; }
.countdown-radio .signal-status { gap:.65cqi; }
.countdown-radio .signal-dot { width:.6cqi; height:.6cqi; }
.countdown-radio .signal-ellipsis { margin-left:-.65cqi; }
.countdown-radio .signal-bars { gap:.35cqi; height:1.6cqi; }
.countdown-radio .signal-bars i { width:.4cqi; }
.countdown-radio .countdown-readout { padding:2.2cqi 0 1.4cqi; }
.countdown-radio .countdown-unit { gap:.4cqi; }
.countdown-radio .countdown-unit small { font-size:max(7px,1.3cqi); letter-spacing:.07em; }
.radio-name { margin:1.5cqi 0 1.8cqi; color:#f0edcd; font:700 max(9px,2cqi)/1.25 "Courier New",Courier,monospace; text-align:center; text-transform:uppercase; letter-spacing:.04em; text-shadow:0 1px #23301b; }
.radio-keypad { width:100%; display:grid; grid-template-columns:repeat(4,1fr); gap:.65cqi; margin:auto; padding:1.2cqi; border:1px solid #899671; border-radius:1.2cqi; background:#37462e; box-shadow:inset 0 2px 3px #141e11; }
.radio-keypad>span { display:grid; place-items:center; height:4.6cqi; border:1px solid #8e9680; border-bottom:2px solid #151e17; border-radius:.55cqi; color:#d5dac9; background:linear-gradient(#566153,#26342a); font:700 max(6px,1.5cqi)/1 "Courier New",Courier,monospace; box-shadow:0 1px 2px #142010; }

@media(max-width:800px) {
  .release-section { height:850px; min-height:0; padding-top:48px; }
  .release-intro h2 { font-size:clamp(76px,13vw,108px); }
  .release-intro h2>span { font-size:clamp(29px,4.7vw,39px); }
  .countdown-radio { width:360px; bottom:65px; }
}
@media(max-width:480px) {
  .release-section { height:760px; padding-top:43px; }
  .release-landscape img { object-position:54% center; }
  .release-intro h2 { font-size:20.5vw; margin-top:24px; }
  .release-intro h2>span { font-size:7.2vw; }
  .release-note { font-size:11px; }
  .countdown-radio { width:calc(100% - 40px); left:20px; bottom:57px; max-width:320px; }
  .release-art-note { left:24px; right:auto; bottom:24px; font-size:9px; }
}