/* PCS TV v3 "PCS Network" broadcast package (Oct 30, 2026). Own CSS. */
@font-face{font-family:Fraunces;font-weight:600;src:url(assets/fonts/fraunces-normal-600.woff2) format('woff2')}
@font-face{font-family:Fraunces;font-style:italic;font-weight:600;src:url(assets/fonts/fraunces-italic-600.woff2) format('woff2')}
@font-face{font-family:Fraunces;font-style:italic;font-weight:400;src:url(assets/fonts/fraunces-italic-400.woff2) format('woff2')}
@font-face{font-family:Outfit;font-weight:400;src:url(assets/fonts/outfit-normal-400.woff2) format('woff2')}
@font-face{font-family:Outfit;font-weight:500;src:url(assets/fonts/outfit-normal-500.woff2) format('woff2')}
@font-face{font-family:Outfit;font-weight:600;src:url(assets/fonts/outfit-normal-600.woff2) format('woff2')}
@font-face{font-family:Outfit;font-weight:700;src:url(assets/fonts/outfit-normal-700.woff2) format('woff2')}
:root{--navy:#0B1B44;--blue:#2E6BC6;--elec:#3D7BFF;--cyan:#5BD3FF;--gold:#FFC857;--sand:#D4A970}
html,body{margin:0;height:100%;background:#050b1c;overflow:hidden}
html.w2tv-paused *,html.w2tv-paused *::before,html.w2tv-paused *::after{animation-play-state:paused!important}
#screen{position:absolute;left:50%;top:50%;width:1920px;height:1080px;overflow:hidden;font-family:Outfit,sans-serif;color:#fff;background:var(--navy)}
.scene{position:absolute;inset:0;visibility:hidden;z-index:1}
.scene.is-live{visibility:visible;z-index:3}.scene.is-leaving{visibility:visible;z-index:2}
.ground{position:absolute;inset:0;background:radial-gradient(circle at 70% 30%,#1d4fb8,#0B1B44 70%)}
.scene.is-live.tx-zoom{animation:txZoom 800ms cubic-bezier(.7,0,.2,1) both}
.scene.is-live.tx-wipe{animation:txWipe 750ms cubic-bezier(.7,0,.2,1) both}
.scene.is-live.tx-flash::after{content:'';position:absolute;inset:0;background:#fff;z-index:9;pointer-events:none;animation:txFlash 380ms ease-out both}
@keyframes txZoom{from{clip-path:inset(22% 22% round 60px);transform:scale(.94)}to{clip-path:inset(0 0 round 0);transform:none}}
@keyframes txWipe{from{clip-path:polygon(110% 0,130% 0,110% 100%,90% 100%)}to{clip-path:polygon(-30% 0,130% 0,110% 100%,-50% 100%)}}
@keyframes txFlash{from{opacity:1}to{opacity:0}}
.beat{position:absolute;inset:0;visibility:hidden;z-index:2;background:var(--navy);overflow:hidden}
.beat.is-active,.beat.is-out{visibility:visible}
.beat.is-out{animation:beatOut 300ms ease-in both}
@keyframes beatOut{to{opacity:0}}
/* full-bleed camera moves (non-people imagery, graded) */
.bgimg{position:absolute;inset:-70px;background-size:cover;background-position:center}
.bgimg::after{content:'';position:absolute;inset:0}
.beat.is-active .mv-push{animation:push var(--dur) linear both}
.beat.is-active .mv-panl{animation:panl var(--dur) linear both}
.beat.is-active .mv-panr{animation:panr var(--dur) linear both}
.beat.is-active .mv-zoom{animation:zoom var(--dur) cubic-bezier(.1,.7,.2,1) both}
@keyframes push{from{transform:scale(1.02)}to{transform:scale(1.16)}}
@keyframes panl{from{transform:scale(1.12) translateX(40px)}to{transform:scale(1.12) translateX(-40px)}}
@keyframes panr{from{transform:scale(1.12) translateX(-40px)}to{transform:scale(1.12) translateX(40px)}}
@keyframes zoom{from{transform:scale(1.3)}to{transform:scale(1.06)}}
.g-left::after{background:linear-gradient(90deg,rgba(6,16,52,.94) 0%,rgba(10,32,96,.80) 45%,rgba(20,70,190,.20) 100%)}
.g-full::after{background:linear-gradient(120deg,rgba(6,16,52,.86),rgba(18,58,160,.62))}
.g-blur{filter:blur(16px) saturate(1.35)}.g-blur::after{background:linear-gradient(180deg,rgba(8,22,70,.45),rgba(8,22,70,.75))}
.g-flash::after{background:var(--tint);mix-blend-mode:multiply}
.g-bump::after{background:linear-gradient(90deg,rgba(6,16,52,.9),rgba(30,80,200,.5))}
.t-blue{--tint:#2E6BC6}.t-gold{--tint:#E0A53A}.t-cyan{--tint:#1C9BD0}.t-red{--tint:#C0344A}.t-flash{--tint:#3048A8}
.stage{position:absolute;left:130px;right:130px;top:150px;bottom:130px;display:flex}
.stage.center{align-items:center;justify-content:center}
.stage.left{flex-direction:column;justify-content:flex-start;padding-top:40px;gap:26px;max-width:1300px}
.stage.split{display:grid;grid-template-columns:auto 1fr;gap:80px;align-items:center}
.stage.split .col.media:last-child{order:2}
.stage.show{justify-content:center;perspective:1600px}
.stage.step{display:grid;grid-template-columns:auto 1fr;gap:60px;align-items:center}
.col{display:flex;flex-direction:column}.col.text{gap:26px;min-width:0}.col.media{align-items:center}
.kicker{font:700 30px/1.2 Outfit;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);align-self:flex-start}
.hero{font:600 96px/1.16 Fraunces;letter-spacing:-.01em;text-shadow:0 6px 30px rgba(0,0,0,.35)}
.hero.mid{font-size:80px}
.hero em,.em{font-style:italic;color:var(--gold)}
.lede{font:500 44px/1.35 Outfit;color:#E6EEFF;text-shadow:0 3px 16px rgba(0,0,0,.4)}.lede.big{font-size:52px}
.w{display:inline-block}
.beat.is-active .w{animation:kinIn 700ms cubic-bezier(.2,.8,.2,1) var(--d) both}
.beat.is-active .a-up{animation:up 900ms cubic-bezier(.2,.7,.2,1) var(--d) both}
.beat.is-active .a-wipe{animation:wipe 600ms cubic-bezier(.6,0,.2,1) var(--d) both}
.beat.is-active .a-left{animation:left 800ms cubic-bezier(.2,.7,.2,1) var(--d) both}
.beat.is-active .a-slide{animation:slide 800ms cubic-bezier(.2,.9,.2,1) var(--d) both}
.beat.is-active .a-pic{animation:pic 1100ms cubic-bezier(.2,.7,.2,1) var(--d) both}
.beat.is-active .a-pic.cam3d{animation:pic 1100ms cubic-bezier(.2,.7,.2,1) var(--d) both,cam 9s ease-in-out 1200ms infinite alternate}
.beat.is-active .a-pic.fly3d{animation:fly 1200ms cubic-bezier(.2,.8,.2,1) both,drift3d 6s ease-in-out 1200ms infinite alternate}
.beat.is-active .a-pic.flyin{animation:pic 800ms cubic-bezier(.2,.8,.2,1.2) var(--d) both}
.beat.is-active .a-qr{animation:up 900ms cubic-bezier(.2,.7,.2,1) var(--d) both}
.beat.is-active .a-step{animation:stepIn 900ms cubic-bezier(.2,.9,.2,1) both,glow 3s ease-in-out 900ms infinite alternate}
.beat.is-active .slam{animation:slam 240ms cubic-bezier(.2,.9,.3,1) both}
@keyframes kinIn{from{opacity:0;transform:translateY(.35em) rotateX(-60deg);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
@keyframes up{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes wipe{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes left{from{opacity:0;transform:translateX(-30px)}to{opacity:1;transform:none}}
@keyframes slide{from{opacity:0;transform:translateX(-80px) skewX(-8deg)}to{opacity:1;transform:none}}
@keyframes pic{from{opacity:.2;transform:scale(.9)}to{opacity:1;transform:none}}
@keyframes cam{from{transform:perspective(1400px) rotateY(6deg)}to{transform:perspective(1400px) rotateY(-6deg)}}
@keyframes fly{from{opacity:.3;transform:rotateY(-28deg) translateZ(-260px)}to{opacity:1;transform:rotateY(-6deg)}}
@keyframes drift3d{from{transform:rotateY(-6deg) rotateX(2deg)}to{transform:rotateY(5deg) rotateX(-1deg)}}
@keyframes stepIn{from{transform:scale(.7) rotate(-6deg);opacity:.4}to{transform:none;opacity:1}}
@keyframes glow{from{text-shadow:0 0 20px rgba(91,211,255,.3)}to{text-shadow:0 0 60px rgba(91,211,255,.8)}}
@keyframes slam{from{transform:scale(1.12)}to{transform:none}}
.slam{font:600 230px/1.02 Fraunces;text-align:center;text-shadow:0 10px 50px rgba(0,0,0,.45);letter-spacing:-.02em}
.slam.mid{font-size:150px}
/* lower third */
.l3{position:absolute;left:0;bottom:0;padding:18px 40px 18px 34px;display:flex;flex-direction:column;gap:6px;max-width:1500px}
.l3bar{position:absolute;inset:0;background:linear-gradient(90deg,var(--elec),#1F4FB8 70%,rgba(31,79,184,.0));border-left:10px solid var(--gold);border-radius:4px;transform-origin:left}
.beat.is-active .l3bar{animation:bar 700ms cubic-bezier(.7,0,.2,1) var(--d) both,sheen 4s linear calc(var(--d) + 800ms) infinite}
@keyframes bar{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes sheen{0%,70%{filter:none}80%{filter:brightness(1.35)}100%{filter:none}}
.l3n{position:relative;font:700 44px Outfit;color:#fff}.l3t{position:relative;font:500 32px/1.3 Outfit;color:#E8F0FF}
/* founder */
.portrait{border:8px solid #fff;border-radius:10px;box-shadow:0 30px 80px rgba(0,0,0,.45)}
.stats{display:flex;gap:60px}.stat .num{font:600 110px/1 Fraunces;color:var(--gold)}.stat .num.word{font-size:84px;line-height:110px}
.stat .lbl{font:500 32px Outfit;margin-top:8px;color:#E6EEFF}
.num.inline{color:var(--gold);display:inline-block;min-width:.6em}
.logorow{display:flex;gap:40px}.lg{border-radius:10px;box-shadow:0 18px 40px rgba(0,0,0,.4)}
.bignum .num{display:block;line-height:1.2}.bignum{font:600 240px/1.2 Fraunces;color:var(--gold);text-shadow:0 0 60px rgba(255,200,87,.35)}
.browser{border-radius:12px;border:6px solid #fff;box-shadow:0 40px 90px rgba(0,0,0,.55)}
.bigstep{font:600 400px/1 Fraunces;color:var(--cyan)}
.shiny{font-style:italic;background:linear-gradient(100deg,var(--gold) 0%,var(--gold) 40%,#fff6d8 50%,var(--gold) 60%,var(--gold) 100%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shine 3.5s linear infinite}
@keyframes shine{from{background-position:100% 0}to{background-position:-150% 0}}
.quote{font:italic 400 62px/1.3 Fraunces;text-shadow:0 4px 20px rgba(0,0,0,.4)}
/* bumpers */
.bumpbar{position:absolute;left:-10%;right:-10%;top:390px;height:300px;background:linear-gradient(90deg,var(--gold),var(--elec) 40%,var(--cyan));transform:skewY(-4deg);opacity:.92}
.beat.is-active .bumpbar{animation:bump var(--dur) cubic-bezier(.2,.9,.2,1) both}
@keyframes bump{0%{transform:skewY(-4deg) translateX(-100%)}25%{transform:skewY(-4deg) translateX(0)}100%{transform:skewY(-4deg) translateX(4%)}}
.bumpstage{flex-direction:column;justify-content:center;gap:10px;padding-left:40px}
.bumpstage .kicker{color:#0B1B44;background:#fff;padding:8px 18px;border-radius:6px}
.bumpshow{font:600 140px/1.1 Fraunces;color:#fff;text-shadow:0 8px 30px rgba(0,0,0,.35)}
/* logo sting */
.lsting{background:radial-gradient(circle at 50% 50%,#3D7BFF 0%,#1B3FA0 45%,#0B1B44 80%)}
@keyframes spin{to{transform:rotate(360deg)}}
.flare{position:absolute;left:50%;top:50%;width:1400px;height:12px;margin:-6px 0 0 -700px;background:radial-gradient(ellipse,rgba(255,255,255,.95),rgba(91,211,255,.4) 40%,transparent 70%)}
.beat.is-active .flare{animation:flare var(--dur) ease-out both}
@keyframes flare{0%{transform:scaleX(0);opacity:0}30%{transform:scaleX(1);opacity:1}100%{transform:scaleX(1.3);opacity:0}}
.lwrap{position:relative;width:620px;height:256px;overflow:hidden;filter:drop-shadow(0 20px 40px rgba(0,0,0,.4))}
.llogo{display:block}
.beat.is-active .a-spin{animation:lspin 1300ms cubic-bezier(.2,.9,.2,1) both,lbreathe 3s ease-in-out 1300ms infinite alternate}
@keyframes lspin{from{transform:perspective(1200px) rotateY(-160deg) scale(.4);opacity:.5}to{transform:perspective(1200px) rotateY(0) scale(1);opacity:1}}
@keyframes lbreathe{from{transform:perspective(1200px) rotateY(0) scale(1)}to{transform:perspective(1200px) rotateY(8deg) scale(.97)}}
.gloss{position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.85) 50%,transparent 65%);mix-blend-mode:overlay;transform:translateX(-120%)}
.beat.is-active .gloss{animation:gloss 1100ms ease-in-out 900ms both}
@keyframes gloss{to{transform:translateX(120%)}}
/* contact */
.crows{display:flex;flex-direction:column;gap:20px}
.crow{display:flex;gap:26px;align-items:baseline}.cl{font:700 26px Outfit;letter-spacing:.1em;text-transform:uppercase;color:var(--gold);width:250px;flex:none}.cv{font:500 46px Outfit}
.qrbox{display:flex;flex-direction:column;align-items:center;gap:16px;background:#fff;padding:28px;border-radius:18px;box-shadow:0 30px 70px rgba(0,0,0,.45)}
.qrcap{font:700 30px Outfit;color:var(--navy)}
/* on-air package */
.chassis{position:absolute;inset:0;z-index:20;pointer-events:none}
.topbug{position:absolute;left:46px;top:36px;display:flex;align-items:center;gap:16px}
.bug{width:120px;height:auto;filter:drop-shadow(0 4px 10px rgba(0,0,0,.5))}
#showtag{font:700 26px Outfit;letter-spacing:.12em;text-transform:uppercase;background:rgba(11,27,68,.75);border-left:6px solid var(--gold);padding:8px 18px;border-radius:4px}
#showtag.swap{animation:swap 700ms cubic-bezier(.2,.9,.2,1) both}
@keyframes swap{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
#tvclock{position:absolute;right:46px;top:40px;font:700 30px Outfit;background:rgba(11,27,68,.75);padding:8px 20px;border-radius:4px;border-right:6px solid var(--cyan)}
.w2-ticker{position:absolute;left:0;right:0;bottom:0;height:66px;z-index:21;display:flex;background:linear-gradient(90deg,#0B1B44,#1B3FA0);border-top:3px solid var(--gold)}
.w2-badge{position:relative;overflow:hidden;flex:none;display:flex;align-items:center;gap:12px;padding:0 28px;background:var(--gold);color:var(--navy);font:800 32px Outfit;letter-spacing:.05em}
.w2-badge::after{content:'';position:absolute;top:0;bottom:0;width:60px;left:-80px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.8),transparent);animation:bsheen 5s ease-in-out infinite}
@keyframes bsheen{0%,70%{left:-80px}100%{left:110%}}
.bdot{width:14px;height:14px;border-radius:50%;background:var(--elec);animation:bdot 1.6s ease-in-out infinite}
@keyframes bdot{50%{transform:scale(.6);opacity:.6}}
.w2-tick-win{flex:1;overflow:hidden;position:relative}
.w2-tick-track{position:absolute;top:0;left:0;height:63px;display:flex;align-items:center;white-space:nowrap;font:500 30px Outfit;animation:tick 80s linear infinite}
.w2-tick-track b{color:var(--gold)}
@keyframes tick{from{transform:translateX(0)}to{transform:translateX(-50%)}}
#dbg{position:absolute;left:10px;top:120px;z-index:30;font:14px monospace;background:#000a;color:#0f0;padding:4px 8px;display:none}

/* Oct 31: particle logo ident (no rays) */
.lwrap{position:relative;width:620px;height:256px;overflow:visible!important}
.gclip{position:absolute;inset:0;overflow:hidden}
.lpart{position:absolute;left:-650px;top:-412px;width:1920px;height:1080px;pointer-events:none}
.llogo{position:absolute;left:0;top:0;opacity:0}
.beat.is-active .llogo{animation:lcrisp 250ms ease-out 1150ms both}
@keyframes lcrisp{from{opacity:0}to{opacity:1}}
.beat.is-active .lpart{animation:lpfade 400ms ease-out 1450ms both}
@keyframes lpfade{to{opacity:0}}
.stage.center{flex-direction:column}
.ltag{margin-top:56px;font:600 36px Outfit;letter-spacing:.22em;text-transform:uppercase;color:#E6EEFF}
.beat.is-active .ltag{animation:wipe 900ms cubic-bezier(.6,0,.2,1) 0ms both}
/* Oct 31: zoom-through kinetic words: start tiny, pause partway (readable), fly past the viewer */
.zw{font:700 230px/1 Fraunces;text-shadow:0 10px 50px rgba(0,0,0,.45);opacity:0}
.beat.is-active .zw{animation:zwIn 650ms cubic-bezier(.15,.8,.25,1) both,zwHold calc(var(--dur) - 1250ms) linear 650ms both,var(--zx) 600ms cubic-bezier(.6,0,.9,.4) calc(var(--dur) - 600ms) both}
.zw.ex-fast{--zx:zwOutFast}.zw.ex-slow{--zx:zwOutSlow}.zw.ex-spin{--zx:zwOutSpin}
.beat.is-active .zw.ex-fast{animation-name:zwIn,zwHold,zwOutFast}.beat.is-active .zw.ex-slow{animation-name:zwIn,zwHold,zwOutSlow}.beat.is-active .zw.ex-spin{animation-name:zwIn,zwHold,zwOutSpin}
@keyframes zwIn{from{opacity:0;transform:translate(0,0) scale(.03) rotate(0)}to{opacity:1;transform:translate(var(--dx),var(--dy)) scale(var(--ps)) rotate(var(--rot))}}
@keyframes zwHold{from{opacity:1;transform:translate(var(--dx),var(--dy)) scale(var(--ps)) rotate(var(--rot))}to{opacity:1;transform:translate(calc(var(--dx)*1.3),calc(var(--dy)*1.3)) scale(calc(var(--ps)*1.1)) rotate(var(--rot))}}
@keyframes zwOutFast{from{opacity:1;transform:translate(calc(var(--dx)*1.3),calc(var(--dy)*1.3)) scale(calc(var(--ps)*1.1)) rotate(var(--rot))}45%{opacity:.1}to{opacity:0;transform:translate(calc(var(--dx)*3),calc(var(--dy)*3)) scale(9) rotate(var(--rot))}}
@keyframes zwOutSlow{from{opacity:1;transform:translate(calc(var(--dx)*1.3),calc(var(--dy)*1.3)) scale(calc(var(--ps)*1.1)) rotate(var(--rot))}55%{opacity:.1}to{opacity:0;transform:translate(calc(var(--dx)*2),calc(var(--dy)*2)) scale(5) rotate(calc(var(--rot)*3))}}
@keyframes zwOutSpin{from{opacity:1;transform:translate(0,calc(var(--dy)*1.3)) scale(calc(var(--ps)*1.1)) rotate(0)}45%{opacity:.1}to{opacity:0;transform:translate(0,0) scale(8) rotate(25deg)}}
/* Oct 31: varied image reveals (no frame flashes) */
.rv{position:relative}
.rvimg{position:absolute;left:0;top:0;box-sizing:border-box}
.beat.is-active .rv{animation:rvdrift 9s ease-in-out 2000ms infinite alternate}
@keyframes rvdrift{from{transform:scale(1)}to{transform:scale(1.025)}}
.beat.is-active .rv-defocus .rvimg{animation:rvFocus 1700ms cubic-bezier(.3,.6,.2,1) both}
@keyframes rvFocus{from{filter:blur(42px) brightness(1.3);transform:scale(1.04);opacity:.4}to{filter:none;transform:none;opacity:1}}
.beat.is-active .rv-iris .rvimg{animation:rvIris 1600ms cubic-bezier(.5,0,.2,1) both}
@keyframes rvIris{from{clip-path:circle(0% at 50% 50%)}to{clip-path:circle(75% at 50% 50%)}}
.strip{position:absolute;display:block;opacity:0}
.rv[class*="rv-strips"] .rvimg{opacity:0}
.beat.is-active .rv[class*="rv-strips"] .rvimg{animation:lcrisp 1ms linear 1750ms both}
.beat.is-active .strip{animation:var(--sa) 900ms cubic-bezier(.2,.8,.2,1) var(--sd) both}
.beat.is-active .s-top{--sa:sTop}.beat.is-active .s-bottom{--sa:sBot}.beat.is-active .s-left{--sa:sLeft}.beat.is-active .s-right{--sa:sRight}
.beat.is-active .strip.s-top{animation-name:sTop}.beat.is-active .strip.s-bottom{animation-name:sBot}.beat.is-active .strip.s-left{animation-name:sLeft}.beat.is-active .strip.s-right{animation-name:sRight}
@keyframes sTop{from{opacity:0;transform:translateY(-110%)}to{opacity:1;transform:none}}
@keyframes sBot{from{opacity:0;transform:translateY(110%)}to{opacity:1;transform:none}}
@keyframes sLeft{from{opacity:0;transform:translateX(-60%)}to{opacity:1;transform:none}}
@keyframes sRight{from{opacity:0;transform:translateX(60%)}to{opacity:1;transform:none}}
.diss{position:absolute;left:0;top:0;border-radius:12px}
.rv-dissolve .rvimg{opacity:0}
.beat.is-active .rv-dissolve .rvimg{animation:lcrisp 200ms linear 1750ms both}
.beat.is-active .rv-dissolve .diss{animation:lpfade 200ms linear 1900ms both}
.stage.show{top:120px;bottom:265px;align-items:center}
.stage.show .l3{bottom:-135px}
.zwcap{position:absolute;left:0;right:0;bottom:30px;text-align:center;font:600 30px Outfit;letter-spacing:.22em;text-transform:uppercase;color:#E6EEFF;text-shadow:0 2px 12px rgba(0,0,0,.5)}
/* Oct 31 PM: PCS Fx before/after inside the app UI: input settles in, then the result "renders" in with a soft left-to-right sweep */
.fxin,.fxout{position:absolute;opacity:0}
.beat.is-active .fxin{animation:fxIn 900ms cubic-bezier(.2,.7,.2,1) 1900ms both}
.beat.is-active .fxout{animation:fxOut 1800ms cubic-bezier(.45,0,.2,1) 3100ms both}
@keyframes fxIn{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:none}}
@keyframes fxOut{from{opacity:1;clip-path:inset(0 100% 0 0);filter:blur(10px) saturate(.4)}60%{filter:blur(2px) saturate(.9)}to{opacity:1;clip-path:inset(0 0 0 0);filter:none}}