*{box-sizing:border-box;margin:0;padding:0}
html,body{width:100%;height:100%;background:#000;overflow:hidden;font-family:'Press Start 2P',monospace}
.tv{position:fixed;inset:0;background:#000;display:flex;align-items:center;justify-content:center}
.stage{position:relative;width:100vw;height:100vh;height:100dvh}
.screen{position:absolute;left:5.6%;right:5.6%;top:7.2%;bottom:8.9%;overflow:hidden;background:#000;border-radius:3% / 6%}
.tv-overlay{position:absolute;inset:0;pointer-events:none;z-index:50;background:url(assets/tvoverlay.png) center/100% 100% no-repeat}
.layer{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;transition:opacity 1.2s ease}
.main{background:#1fc22b;opacity:0;visibility:hidden;z-index:1}
.main.show{opacity:1;visibility:visible}
.main-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.x-logo{position:absolute;top:3%;right:2.5%;display:block;width:clamp(22px,4vw,56px);aspect-ratio:1;
  color:#fff;z-index:5;cursor:pointer;filter:drop-shadow(0 0 6px rgba(0,0,0,.6))}
.video-layer{opacity:0;visibility:hidden;z-index:2;background:#000}
.video-layer.show{opacity:1;visibility:visible}
.video-layer video{width:100%;height:100%;object-fit:cover}
.video-layer.fade{opacity:0}
.enter{z-index:3;background:#000}
.enter.hide{opacity:0;pointer-events:none}
#enter-btn{display:flex;gap:1rem;align-items:center;background:none;border:0;padding:1rem;cursor:pointer;color:#0044ff;font:inherit;
  font-size:clamp(10px,2.2vw,32px);text-shadow:2px 2px 0 #001166,0 0 20px rgba(0,68,255,.5);transition:transform .2s}
#enter-btn:hover{transform:scale(1.05)}
#enter-btn:disabled{pointer-events:none}
.blink{animation:blink 1s steps(2) infinite}
@keyframes blink{50%{opacity:0}}
.scanlines{position:absolute;inset:0;z-index:10;pointer-events:none;
  background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(0,0,0,.15) 2px,rgba(0,0,0,.15) 4px)}
.grain{position:absolute;inset:0;z-index:11;pointer-events:none;opacity:.08;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.9'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E")}
