/* 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; }
}

/* Small display over the artwork, with no separate countdown pane. */
.countdown-compact {
  width:246px;
  padding:15px 18px 12px;
  color:#d7f771;
  background:linear-gradient(135deg,#27351df5,#111a11fa);
  border:1px solid #93a96a;
  border-radius:3px;
  box-shadow:4px 5px 0 #0d150ca6,0 8px 28px #080e0b55,inset 0 0 0 3px #a8be6720;
  --countdown-size:34px;
}
.countdown-compact h3 { margin:0 0 12px; color:#e4ebce; font:700 10px/1.4 "Courier New",Courier,monospace; text-transform:uppercase; letter-spacing:.08em; }
.countdown-compact .signal-topline { font-size:8px; padding-bottom:7px; }
.countdown-compact .signal-bars { height:10px; }
.countdown-compact .countdown-readout { padding:17px 0 12px; }
.countdown-compact .countdown-unit { gap:4px; }
.countdown-compact .countdown-unit small { font-size:8px; letter-spacing:.06em; }
.countdown-compact .signal-bottomline { padding-top:8px; font-size:9px; }
@media(max-width:480px) {
  .countdown-compact { width:210px; padding:12px 14px 10px; --countdown-size:29px; }
  .countdown-compact h3 { font-size:9px; margin-bottom:9px; }
  .countdown-compact .countdown-readout { padding:13px 0 9px; }
}

.project-image { position:relative; }
.project-image .countdown-compact { position:absolute; bottom:20px; left:20px; }
@media(max-width:600px) { .project-image .countdown-compact { bottom:15px; left:15px; } }