/* LFG FX layer: CRT, HUD, channel guide, ticker, reveals */
:root{--fx-red:#ff2436;--fx-gold:#e8b75e;--fx-mono:"Press Start 2P",monospace}
.fx-crt{position:fixed;inset:0;z-index:700;pointer-events:none;background:radial-gradient(ellipse at 50% 45%,transparent 60%,rgba(0,0,0,.45) 100%)}
.fx-crt:after{content:none}
@keyframes fxgrain{0%{transform:translate(0,0)}20%{transform:translate(-4%,3%)}40%{transform:translate(3%,-5%)}60%{transform:translate(-2%,6%)}80%{transform:translate(5%,2%)}100%{transform:translate(0,0)}}
.fx-sweep{display:none!important}
@keyframes fxsweep{to{transform:translateY(700%)}}
/* hero HUD */
.hero{--hud:rgba(232,183,94,.9)}
.fx-hud{position:absolute;inset:92px 22px 26px;z-index:2;pointer-events:none;font:400 .52rem/1.9 var(--fx-mono);letter-spacing:.12em;color:#e9dccb;text-transform:uppercase}
.fx-hud .tl,.fx-hud .bl,.fx-hud .br{position:absolute}
.fx-hud .tl{left:0;top:0}.fx-hud .bl{left:0;bottom:0;color:#b9aea4}.fx-hud .br{right:0;bottom:0;text-align:right}
.fx-hud .rec{color:var(--fx-red)}.fx-hud .rec:before{content:"";display:inline-block;width:8px;height:8px;margin-right:8px;border-radius:50%;background:var(--fx-red);box-shadow:0 0 10px var(--fx-red);animation:fxblink 1.1s steps(1) infinite;vertical-align:-1px}
.fx-hud .dim{color:#8f857c}.fx-hud .g{color:var(--fx-gold)}
.fx-bars i{display:inline-block;width:5px;height:9px;margin-left:2px;background:var(--fx-gold);opacity:.25;animation:fxbar 1.6s infinite}
.fx-bars i:nth-child(2){animation-delay:.2s}.fx-bars i:nth-child(3){animation-delay:.4s}.fx-bars i:nth-child(4){animation-delay:.6s}
@keyframes fxbar{0%,100%{opacity:.25}40%{opacity:1}}
@keyframes fxblink{50%{opacity:0}}
/* viewfinder brackets */
.fx-vf:not(.fx-panel){position:relative}
.fx-vf>.fx-br{position:absolute;inset:-14px;pointer-events:none;z-index:3}
.fx-br b{position:absolute;width:26px;height:26px;border:2px solid var(--fx-gold);filter:drop-shadow(0 0 6px rgba(255,36,54,.6));transition:inset .5s cubic-bezier(.2,.8,.2,1)}
.fx-br b:nth-child(1){left:0;top:0;border-right:0;border-bottom:0}.fx-br b:nth-child(2){right:0;top:0;border-left:0;border-bottom:0}
.fx-br b:nth-child(3){left:0;bottom:0;border-right:0;border-top:0}.fx-br b:nth-child(4){right:0;bottom:0;border-left:0;border-top:0}
.fx-vf.fx-lock>.fx-br{animation:fxlock 1s cubic-bezier(.2,.8,.2,1) both}
@keyframes fxlock{0%{inset:-46px;opacity:0}60%{inset:-8px;opacity:1}100%{inset:-14px}}
.fx-tag{position:absolute;z-index:4;right:-10px;bottom:30px;padding:4px 8px;border:1px solid var(--fx-gold);background:rgba(7,6,10,.82);font:400 .5rem/1.5 var(--fx-mono);letter-spacing:.1em;color:var(--fx-gold);white-space:nowrap}
.fx-tag small{display:block;color:#b9aea4;font-size:.44rem}
/* release barcode tag */
.fx-price{position:absolute;z-index:4;left:-26px;top:-30px;width:118px;padding:10px 10px 8px;background:#f3e6cf;color:#140608;transform:rotate(-7deg);box-shadow:0 14px 30px rgba(0,0,0,.6);font:900 .62rem/1.1 Inter,sans-serif;letter-spacing:.06em;text-align:center;animation:fxsway 5s ease-in-out infinite;transform-origin:50% -30px}
.fx-price:before{content:"";position:absolute;left:50%;top:-30px;width:2px;height:30px;background:repeating-linear-gradient(180deg,var(--fx-red) 0 4px,#f3e6cf 4px 8px)}
.fx-price .bc{height:26px;margin-bottom:5px;background:repeating-linear-gradient(90deg,#140608 0 2px,transparent 2px 3px,#140608 3px 4px,transparent 4px 7px,#140608 7px 10px,transparent 10px 11px)}
.fx-price em{display:block;font-style:normal;color:#b5121f;font-size:.9rem;font-family:Cinzel,serif}
.fx-price small{display:block;margin-top:3px;font:400 .4rem var(--fx-mono);letter-spacing:.08em}
@keyframes fxsway{0%,100%{transform:rotate(-7deg)}50%{transform:rotate(-3deg)}}
/* channel guide */
.fx-guide{position:fixed;z-index:60;right:18px;top:96px;width:196px;font:400 .5rem/1 var(--fx-mono);letter-spacing:.08em}
.fx-guide .hd{display:flex;justify-content:space-between;margin:0 0 8px;color:#a99e94}.fx-guide .hd span:last-child{color:var(--fx-red)}
.fx-guide a{display:flex;align-items:stretch;height:30px;margin-bottom:4px;border:1px solid rgba(232,183,94,.28);background:rgba(10,7,12,.62);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:#e8ddd2;transition:border-color .25s,background .25s,transform .25s}
.fx-guide a b{display:grid;place-items:center;width:52px;background:linear-gradient(135deg,#b5121f,#6d0a12);color:#fff;font-weight:400}
.fx-guide a span{display:flex;align-items:center;padding-left:10px;flex:1}
.fx-guide a:hover{transform:translateX(-4px);border-color:var(--fx-gold)}
.fx-guide a.on{border-color:var(--fx-gold);background:rgba(60,8,14,.78)}.fx-guide a.on b{background:linear-gradient(135deg,#f3cf7a,#c98b2c);color:#1a0f02}.fx-guide a.on span{color:var(--fx-gold)}
.fx-guide a.on span:after{content:"●";margin-left:auto;margin-right:9px;color:var(--fx-red);animation:fxblink 1s steps(1) infinite}
.fx-guide{opacity:0;transform:translateX(20px);transition:opacity .4s,transform .4s;pointer-events:none}.fx-guide.show{opacity:1;transform:none;pointer-events:auto}
@media(max-width:1180px){.fx-guide{display:none}}
/* ticker */
.fx-tick{position:fixed;z-index:650;left:0;right:0;bottom:0;height:28px;display:flex;align-items:center;background:linear-gradient(90deg,#2a0306,#0b0709 30%,#0b0709 70%,#1e1408);border-top:1px solid rgba(232,183,94,.35);font:400 .5rem/1 var(--fx-mono);letter-spacing:.1em;color:#e8ddd2;overflow:hidden}
.fx-tick .lb{flex:none;height:100%;display:flex;align-items:center;padding:0 12px;background:var(--fx-red);color:#fff}
.fx-tick .lb:before{content:"";width:6px;height:6px;margin-right:8px;border-radius:50%;background:#fff;animation:fxblink 1s steps(1) infinite}
.fx-tick .rail{flex:1;overflow:hidden;white-space:nowrap;mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent)}
.fx-tick .run{display:inline-block;padding-left:100%;animation:fxrun 38s linear infinite}
.fx-tick .run i{font-style:normal;color:var(--fx-gold);margin:0 18px}
.fx-tick .cd{flex:none;padding:0 12px;color:var(--fx-gold);border-left:1px solid rgba(232,183,94,.3);height:100%;display:flex;align-items:center}
@keyframes fxrun{to{transform:translateX(-100%)}}
.fx-has-tick body{padding-bottom:28px}
/* section channel strip + reveals */
.fx-ch{display:flex;align-items:center;gap:14px;margin:0 0 18px;font:400 .52rem/1 var(--fx-mono);letter-spacing:.12em;color:var(--fx-red)}
.fx-ch:after{content:"";flex:1;height:1px;background:linear-gradient(90deg,rgba(232,183,94,.5),transparent)}
.fx-ch span{color:#8f857c}
.fx-rv{opacity:0;transform:translateY(34px);transition:opacity .9s cubic-bezier(.2,.8,.2,1),transform .9s cubic-bezier(.2,.8,.2,1)}
.fx-rv.in{opacity:1;transform:none}
.fx-gl{position:relative}
.fx-gl.in{animation:fxchrom .9s steps(1) 1}
@keyframes fxchrom{0%{text-shadow:-6px 0 rgba(34,211,238,.8),6px 0 rgba(255,36,54,.8);clip-path:inset(20% 0 50% 0)}15%{text-shadow:4px 0 rgba(34,211,238,.7),-4px 0 rgba(255,36,54,.7);clip-path:inset(60% 0 10% 0)}30%{text-shadow:-2px 0 rgba(34,211,238,.6),2px 0 rgba(255,36,54,.6);clip-path:none}50%,100%{text-shadow:none;clip-path:none}}
.fx-gl:hover{text-shadow:-2px 0 rgba(34,211,238,.55),2px 0 rgba(255,36,54,.55)}
.track,.si-tv,.artist-card{position:relative}
.fx-cardvf:before,.fx-cardvf:after{content:"";position:absolute;z-index:3;width:18px;height:18px;pointer-events:none;opacity:0;transition:opacity .3s,transform .3s}
.fx-cardvf:before{left:8px;top:8px;border-left:2px solid var(--fx-gold);border-top:2px solid var(--fx-gold);transform:translate(-6px,-6px)}
.fx-cardvf:after{right:8px;bottom:8px;border-right:2px solid var(--fx-gold);border-bottom:2px solid var(--fx-gold);transform:translate(6px,6px)}
.fx-cardvf:hover:before,.fx-cardvf:hover:after,.fx-cardvf:focus-within:before,.fx-cardvf:focus-within:after{opacity:1;transform:none}
@media(max-width:860px){.fx-hud{inset:80px 14px 18px;font-size:.44rem}.fx-hud .br{display:none}.fx-price{left:-6px;top:-22px;width:96px}.fx-sweep{display:none}.fx-crt:after{content:none}}
@media(prefers-reduced-motion:reduce){.fx-crt:after,.fx-sweep,.fx-tick .run,.fx-price,.fx-bars i,.fx-hud .rec:before{animation:none!important}.fx-sweep{display:none}.fx-rv{opacity:1;transform:none;transition:none}.fx-gl.in{animation:none}.fx-tick .run{padding-left:12px}}

.fx-noscan:after{display:none!important}
.fx-hud-host{position:relative}
@media(max-width:860px){.fx-price{display:none}.fx-hud{inset:auto 14px auto;top:74px;bottom:auto;height:16px}.fx-hud .tl{top:0;white-space:nowrap}.fx-hud .tl br{display:none}.fx-hud .tl .dim{display:none}.fx-hud .tl .g{margin-left:10px}.fx-hud .bl,.fx-hud .br{display:none}
.fx-tick .lb{font-size:0;padding:0 10px}.fx-tick .lb:before{margin:0}#fx-chnow{display:none}.fx-tick .cd{padding:0 10px}.fx-tag{right:4px}}
.fx-tv-guide a b{width:46px}
@media print{.fx-crt,.fx-sweep,.fx-guide,.fx-tick,.fx-hud,.fx-br,.fx-tag,.fx-price,.fx-ch{display:none!important}.fx-rv{opacity:1!important;transform:none!important}body{padding-bottom:0!important}}

/* OSD menu (TV settings style) */
.fx-osd{position:fixed;z-index:60;right:16px;top:50%;transform:translate(16px,-50%);opacity:0;pointer-events:none;transition:opacity .4s,transform .4s;display:flex;flex-direction:column;gap:6px;padding:10px 8px;border:1px solid rgba(232,183,94,.3);border-radius:14px;background:rgba(10,7,12,.66);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 20px 50px rgba(0,0,0,.5)}
.fx-osd.show{opacity:1;transform:translate(0,-50%);pointer-events:auto}
.fx-osd .hd{font:400 .42rem/1 var(--fx-mono);letter-spacing:.14em;color:#8f857c;text-align:center;margin-bottom:2px}
.fx-osd a{position:relative;display:grid;place-items:center;width:42px;height:42px;border-radius:10px;border:1px solid rgba(232,183,94,.18);background:rgba(255,255,255,.03);color:#d9cdbf;transition:background .25s,border-color .25s,color .25s,transform .25s}
.fx-osd a b{display:grid;place-items:center;width:22px;height:22px}
.fx-osd svg,.fx-ci svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.fx-osd a span{position:absolute;right:calc(100% + 12px);top:50%;transform:translate(8px,-50%);white-space:nowrap;padding:7px 10px;border:1px solid rgba(232,183,94,.45);border-radius:8px;background:rgba(10,7,12,.92);font:400 .5rem/1 var(--fx-mono);letter-spacing:.1em;color:var(--fx-gold);opacity:0;pointer-events:none;transition:opacity .2s,transform .2s}
.fx-osd a:hover span,.fx-osd a:focus-visible span{opacity:1;transform:translate(0,-50%)}
.fx-osd a:hover{border-color:rgba(255,36,54,.6);color:#fff;transform:scale(1.06)}
.fx-osd a.on{border-color:var(--fx-gold);color:#1a0f02;background:linear-gradient(135deg,#f3cf7a,#c98b2c);box-shadow:0 0 18px rgba(232,183,94,.35)}
.fx-ci{display:inline-grid;width:14px;height:14px;color:var(--fx-gold)}
@media(max-width:1180px){.fx-osd{display:none}}
.fx-hud-r .tl{left:auto;right:0;text-align:right}

/* keep burned-in camera HUD (REC / timestamp) inside every bezel */
.screen video,.screen .ytwrap{inset:12% 10%!important;width:80%!important;height:76%!important;object-fit:contain!important}
.screen.is-pip video,.screen.is-pip .ytwrap{left:3%!important;right:auto!important;top:calc(30px + 3%)!important;bottom:auto!important;width:94%!important;height:calc(94% - 30px)!important}
.yt video,.sp-video.on video{inset:3.5%!important;width:93%!important;height:93%!important;object-fit:contain!important}
.yt.is-pip video,.sp-video.on.is-pip video{left:2.5%!important;right:auto!important;top:calc(30px + 2.5%)!important;bottom:auto!important;width:95%!important;height:calc(95% - 30px)!important}
.fx-sweep{display:none!important}.fx-crt:after{content:none!important;animation:none!important}

/* KTK brand layer (decor only, never blocks input) */
.fx-ktk .fx-br,.fx-ktk .fx-khud,.fx-ktk .fx-board,.fx-ktk .fx-cardvf:before,.fx-ktk .fx-cardvf:after{pointer-events:none}
.fx-khud{position:absolute;z-index:5;left:0;right:0;bottom:64px;height:0;font:400 .5rem/1.9 "Press Start 2P",monospace;letter-spacing:.12em;color:#e9dccb;text-transform:uppercase}
#war>.fx-khud{position:fixed;bottom:58px}
.fx-khud .l,.fx-khud .r{position:absolute;bottom:0;padding:8px 10px;border-left:2px solid rgba(232,183,94,.6);background:linear-gradient(90deg,rgba(7,6,10,.55),transparent)}
.fx-khud .l{left:18px}.fx-khud .r{right:18px;text-align:right;border-left:0;border-right:2px solid rgba(232,183,94,.6);background:linear-gradient(270deg,rgba(7,6,10,.55),transparent)}

.fx-khud .rec{color:#ff2436}.fx-khud .rec:before{content:"";display:inline-block;width:7px;height:7px;margin-right:7px;border-radius:50%;background:#ff2436;box-shadow:0 0 10px #ff2436;animation:fxblink 1.1s steps(1) infinite}
.fx-khud .g{color:#e8b75e}.fx-khud .dim{color:#8f857c}
@media(max-width:1180px),(max-height:640px){.fx-khud{display:none}}
.fx-board{position:absolute;inset:6px;z-index:1;border:1px solid rgba(232,183,94,.14);border-radius:14px}
.fx-board b{position:absolute;width:22px;height:22px;border:2px solid rgba(232,183,94,.7)}
.fx-board b:nth-child(1){left:-1px;top:-1px;border-right:0;border-bottom:0;border-top-left-radius:12px}.fx-board b:nth-child(2){right:-1px;top:-1px;border-left:0;border-bottom:0;border-top-right-radius:12px}
.fx-board b:nth-child(3){left:-1px;bottom:-1px;border-right:0;border-top:0;border-bottom-left-radius:12px}.fx-board b:nth-child(4){right:-1px;bottom:-1px;border-left:0;border-top:0;border-bottom-right-radius:12px}
.fx-ul b{background:linear-gradient(90deg,#ff2436,#e8b75e) 0 100%/0 1px no-repeat;transition:background-size .4s cubic-bezier(.2,.8,.2,1)}
.fx-ul:hover b,.fx-ul:focus-visible b{background-size:100% 1px}
.fx-ktk .fx-cardvf:hover:before,.fx-ktk .fx-cardvf:hover:after{filter:drop-shadow(0 0 6px rgba(255,36,54,.6))}

.fx-ktk .fx-panel>.fx-br{inset:-6px}.fx-ktk .fx-panel>.fx-br b{width:14px;height:14px;border-width:1.5px}
.fx-rrec{position:absolute;right:10px;top:50%;transform:translateY(-50%);z-index:2;pointer-events:none;font:400 .42rem/1 "Press Start 2P",monospace;letter-spacing:.1em;color:#b9aea4;white-space:nowrap}
.fx-rrec .rec{color:#ff2436}.fx-rrec .g{color:#e8b75e}
@media(max-width:1100px){.fx-rrec{display:none}}
.splash-stage>.fx-br{inset:10px}.splash-stage.fx-lock>.fx-br{animation:fxlockin 1s cubic-bezier(.2,.8,.2,1) both}@keyframes fxlockin{0%{inset:-30px;opacity:0}60%{inset:14px;opacity:1}100%{inset:10px}}
.splash-stage>.fx-br{z-index:20!important;position:absolute}
.splash-stage>.fx-br{position:absolute!important;top:10px!important;left:10px!important;right:10px!important;bottom:10px!important;width:auto!important;height:auto!important;margin:0!important;animation:none!important}

/* ht1: home track cards never fade to black; one soft red/cyan split on the visible art when they enter */
.fx-tin{opacity:1!important;transform:none!important}
.fx-tin .yt-track{background:#120a0e}
.fx-tin.in .yt-track>img{animation:fxtin .7s ease-out 1}
@keyframes fxtin{0%{filter:drop-shadow(-3px 0 rgba(34,211,238,.45)) drop-shadow(3px 0 rgba(255,36,54,.45))}100%{filter:drop-shadow(0 0 0 rgba(34,211,238,0)) drop-shadow(0 0 0 rgba(255,36,54,0))}}
@media(prefers-reduced-motion:reduce){.fx-tin.in .yt-track>img{animation:none}}