@charset "UTF-8";
:root{color-scheme:dark;--ink:#f1f2f3;--blue:#0032e9}
*{box-sizing:border-box}
html,body{margin:0;width:100%;min-height:100%;background:#040607;color:var(--ink)}
body{font-family:Arial,Helvetica,sans-serif;min-height:100svh}
button,a{-webkit-tap-highlight-color:transparent}
button{font:inherit}
a{color:inherit;text-decoration:none}
.skip{position:fixed;top:0;left:1rem;padding:1rem;background:var(--blue);z-index:10;transform:translateY(-110%)}
.skip:focus{transform:translateY(0)}
main{min-height:100svh}
.television{position:fixed;inset:0;width:100%;height:100%;height:100dvh;min-height:0;background:#0d0f10;overflow:hidden}
.television-screen{position:absolute;inset:0;overflow:hidden;isolation:isolate;container-type:size;background:#040607;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}
/* Original composite geometry; motion happens on its outer wrappers. */
.visual{position:absolute;inset:0;overflow:hidden;isolation:isolate;background:url('assets/signal-texture.webp') center/cover no-repeat}
.crt-artwork{position:absolute;inset:0}
.wordmark-layer{position:absolute;inset:0;z-index:7;pointer-events:none;mix-blend-mode:normal;isolation:isolate}
.crt-stage{position:absolute;left:var(--stage-left,50%);top:var(--stage-top,47%);width:var(--stage-width,205cqw);height:var(--stage-height,115.373804cqw);transform:translate(-50%,-50%);mask-image:linear-gradient(to bottom,transparent 0%,#000 10%,#000 90%,transparent 100%)}
.crt-picture{background:url('assets/signal-texture.webp') center/100% 100% no-repeat}
.crt-source,.crt-clean{position:absolute;inset:0;display:block;width:100%;height:100%}
.crt-source[hidden],.crt-clean[hidden],.logo-static[hidden]{display:none}
.scene-light{position:absolute;left:29.3%;top:52.2%;width:41.6%;height:37.3%;background:#010208;opacity:.04;animation:scene-breathe 7s ease-in-out infinite;will-change:opacity;pointer-events:none;mask-image:linear-gradient(to right,transparent,#000 5.5%,#000 94.5%,transparent),linear-gradient(to bottom,transparent,#000 8%,#000 90%,transparent);mask-composite:intersect}
@keyframes scene-breathe{0%,100%{opacity:.04}50%{opacity:.5}}
.wordmark{position:absolute;left:31.7%;top:28.6%;width:36.6%;height:23.6%;margin:0;color:var(--blue)}
.logo-static{display:block;width:100%;height:100%}
 .crt-phosphor,.crt-signal,.crt-glass,.crt-scanlines,.crt-edge{position:absolute;inset:0;pointer-events:none}
.crt-phosphor{z-index:2;opacity:.27;mix-blend-mode:screen}
.crt-signal{z-index:3;display:block;width:100%;height:100%;mix-blend-mode:screen;opacity:1}
.crt-glass{z-index:4;background:radial-gradient(ellipse at 48% 8%,#b0fff71c,transparent 63%),linear-gradient(105deg,#3bc9db15,transparent 25%,transparent 72%,#657bff15)}
.crt-scanlines{z-index:5;opacity:.74;background:repeating-linear-gradient(0deg,#0005 0px,#0005 1px,transparent 1px,transparent 3px),repeating-linear-gradient(90deg,#ff000008 0px,#00ff0008 1px,#0000ff08 2px,transparent 3px);mix-blend-mode:multiply}
.crt-edge{z-index:6;background:radial-gradient(ellipse at center,transparent 65%,#01060844 100%)}
.site-controls{position:absolute;z-index:2;left:calc(16px + env(safe-area-inset-left));right:calc(16px + env(safe-area-inset-right));bottom:calc(16px + env(safe-area-inset-bottom));display:flex;flex-direction:column;align-items:center;gap:24px}
.channels{display:flex;align-items:center;justify-content:center;gap:clamp(8px,1.9cqw,18px);max-width:100%;flex-wrap:wrap}
.social{display:flex;align-items:center;justify-content:center;width:46px;height:46px;flex:0 0 46px;border:0;border-radius:50%;color:#040607;background:var(--blue);filter:drop-shadow(0 1px 3px #0008);transition:transform .2s,filter .2s}
.social svg{width:25px;height:25px;display:block}
.social[href]:hover{filter:brightness(1.15) drop-shadow(0 1px 4px #0008);transform:translateY(-3px)}
.social:disabled{opacity:1;cursor:default}
a:focus-visible,button:focus-visible{outline:2px solid #b8cbff;outline-offset:6px}
footer{display:flex;justify-content:center;flex-wrap:wrap;gap:5px 12px;color:#d8dde6;font-size:.75rem;line-height:1.2;letter-spacing:.035em;text-shadow:0 1px 4px #000;pointer-events:none;text-align:center}
@media(max-height:500px) and (min-aspect-ratio:4/3){
 .site-controls{bottom:calc(12px + env(safe-area-inset-bottom));flex-direction:row;justify-content:space-between;gap:18px}
 .channels{order:2;flex-wrap:nowrap;gap:10px;flex-shrink:0}
 .social{width:44px;height:44px;flex-basis:44px}
 .social svg{width:24px;height:24px}
 footer{order:1;justify-content:flex-start;text-align:left;gap:3px 8px;min-width:0}
}
@media(max-width:380px){.channels{gap:10px}.social{width:44px;height:44px;flex-basis:44px}.social svg{width:24px;height:24px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.scene-light{opacity:.1;will-change:auto}.crt-phosphor{opacity:.12}}
