*{box-sizing:border-box}
html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#09110d;color:#fff;font-family:"Segoe UI",Arial,sans-serif;letter-spacing:0}
#player-boot{position:fixed;inset:0;z-index:60;display:none;place-content:center;justify-items:center;gap:10px;background:radial-gradient(circle at 50% 36%,#1f503d 0,#0d1b15 50%,#09110d 100%);text-align:center}
body.player-loading #player-boot{display:grid}
#player-boot strong{font-size:28px}
#player-boot span{color:#a7bbb0;font-size:14px}
#pair{height:100%;display:none;place-content:center;text-align:center;background:radial-gradient(circle at 50% 36%,#1f503d 0,#0d1b15 50%,#09110d 100%)}
.player-logo{margin:auto;width:96px;height:96px;display:block}
#pair p{color:#d8f06b;font-size:12px;font-weight:800;letter-spacing:2px;margin-top:22px}
#pair h1{font-size:42px;margin:0 0 24px}
#pair form{display:flex;gap:8px;justify-content:center}
#pair input{width:230px;background:#fff;border:0;border-radius:8px;padding:15px;font-size:22px;text-align:center;letter-spacing:7px;text-transform:uppercase}
#pair button{border:0;border-radius:8px;background:#d8f06b;padding:0 20px;font-weight:800}
#pair small{color:#9aaba2;margin-top:18px}
.fullscreen-toggle{position:fixed;top:18px;right:18px;z-index:40;border:0;border-radius:999px;background:rgba(15,27,22,.76);color:#fff;padding:11px 16px;font:inherit;font-weight:700;backdrop-filter:blur(10px);cursor:pointer;display:inline-flex;align-items:center;gap:8px;transition:opacity .25s ease,transform .25s ease}
.fullscreen-toggle.hidden{opacity:0;pointer-events:none;transform:translateY(-8px)}

#stage{width:100%;height:100%;display:none;background:radial-gradient(circle at top right, rgba(214,240,107,.14), transparent 18%),radial-gradient(circle at left center, rgba(40,111,80,.18), transparent 30%),#040707;position:relative;overflow:hidden}
.scene{position:absolute;inset:0;opacity:0;transform:scale(1.015);transition:opacity 700ms ease,transform 900ms ease,clip-path 850ms ease,filter 850ms ease;overflow:hidden;transform-origin:center center}
.scene.active{opacity:1;transform:scale(1)}
.scene.scene-exit{opacity:0;transform:scale(1.02)}
.scene.transition-none{transition:none}
.scene.transition-none.active,.scene.transition-none.scene-exit{transform:none;opacity:1}
.scene.transition-none.scene-exit{opacity:0}
.scene.transition-fade.active,.scene.transition-crossfade.active{opacity:1}
.scene.transition-slide-left{transform:translateX(5%)}
.scene.transition-slide-left.active{transform:translateX(0)}
.scene.transition-slide-left.scene-exit{transform:translateX(-7%)}
.scene.transition-slide-right{transform:translateX(-5%)}
.scene.transition-slide-right.active{transform:translateX(0)}
.scene.transition-slide-right.scene-exit{transform:translateX(7%)}
.scene.transition-slide-up{transform:translateY(5%)}
.scene.transition-slide-up.active{transform:translateY(0)}
.scene.transition-slide-up.scene-exit{transform:translateY(-7%)}
.scene.transition-slide-down{transform:translateY(-5%)}
.scene.transition-slide-down.active{transform:translateY(0)}
.scene.transition-slide-down.scene-exit{transform:translateY(7%)}
.scene.transition-zoom-in{transform:scale(.9)}
.scene.transition-zoom-in.active{transform:scale(1)}
.scene.transition-zoom-in.scene-exit{transform:scale(1.08)}
.scene.transition-zoom-out{transform:scale(1.08)}
.scene.transition-zoom-out.active{transform:scale(1)}
.scene.transition-zoom-out.scene-exit{transform:scale(.9)}
.scene.transition-push{transform:translateX(100%)}
.scene.transition-push.active{transform:translateX(0)}
.scene.transition-push.scene-exit{transform:translateX(-100%)}
.scene.transition-wipe{clip-path:inset(0 100% 0 0)}
.scene.transition-wipe.active{clip-path:inset(0 0 0 0)}
.scene.transition-wipe.scene-exit{opacity:1}
.scene.transition-dissolve{filter:blur(18px)}
.scene.transition-dissolve.active{filter:blur(0)}
.scene.transition-dissolve.scene-exit{filter:blur(18px)}
.scene.transition-flip{transform:rotateY(-90deg)}
.scene.transition-flip.active{transform:rotateY(0)}
.scene.transition-flip.scene-exit{transform:rotateY(90deg)}
.scene.transition-rotate{transform:rotate(-10deg) scale(.96)}
.scene.transition-rotate.active{transform:rotate(0) scale(1)}
.scene.transition-rotate.scene-exit{transform:rotate(10deg) scale(.96)}
.scene.transition-cube{transform:perspective(1400px) rotateY(-85deg)}
.scene.transition-cube.active{transform:perspective(1400px) rotateY(0)}
.scene.transition-cube.scene-exit{transform:perspective(1400px) rotateY(85deg)}
.scene.transition-blur{filter:blur(18px);transform:scale(1.04)}
.scene.transition-blur.active{filter:blur(0);transform:scale(1)}
.scene.transition-blur.scene-exit{filter:blur(18px);transform:scale(.98)}
.scene.transition-split{clip-path:inset(0 50% 0 50%)}
.scene.transition-split.active{clip-path:inset(0 0 0 0)}
.scene.transition-circle{clip-path:circle(0 at 50% 50%)}
.scene.transition-circle.active{clip-path:circle(140% at 50% 50%)}
.scene.transition-curtain{clip-path:inset(0 48% 0 48%)}
.scene.transition-curtain.active{clip-path:inset(0 0 0 0)}
.scene-idle{display:grid;place-items:center;background:radial-gradient(circle at 50% 38%, rgba(41,107,79,.26), transparent 24%),linear-gradient(180deg,#07100d 0%,#040707 100%)}
.message-shell{display:grid;gap:24px;place-items:center;text-align:center}
.idle-brand-shell{position:relative;padding:24px 32px}
.message-mark{width:110px;height:110px;border-radius:28px;background:linear-gradient(160deg, rgba(214,240,107,.95), rgba(74,169,104,.92)),#d8f06b;box-shadow:0 16px 60px rgba(119,201,98,.24);position:relative}
.message-mark::before,.message-mark::after{content:"";position:absolute;background:#122218;border-radius:999px}
.message-mark::before{width:54px;height:10px;left:28px;top:50px;transform:rotate(-40deg)}
.message-mark::after{width:24px;height:10px;left:22px;top:61px;transform:rotate(42deg)}
.message{display:grid;gap:10px;color:#9baca3}
.message strong{font-size:34px;color:#fff}
.message span{font-size:21px}
.message small{font-size:14px;color:#8fa49a}
.idle-mark{display:grid;place-items:center;overflow:hidden;animation:idleFloat 4s ease-in-out infinite}
.idle-mark::before,.idle-mark::after{display:none}
.idle-mark img{width:70px;height:70px;filter:drop-shadow(0 16px 35px rgba(0,0,0,.24))}
.idle-orbit{position:absolute;border-radius:999px;border:1px solid rgba(216,240,107,.18);animation:idleSpin 14s linear infinite}
.idle-orbit-one{width:220px;height:220px}
.idle-orbit-two{width:300px;height:300px;animation-direction:reverse;animation-duration:19s}

.grid-layout,.panel{width:100%;height:100%}
.grid-layout{display:grid;gap:10px;padding:10px}
.grid-layout.split-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid-layout.split-4{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr))}
.panel{position:relative;overflow:hidden;background:#020303;border-radius:18px}
.scene-single .panel{border-radius:0}
.scene-live{z-index:20;background:#000;opacity:1;transform:none}
.live-stream-video{width:100%;height:100%;object-fit:contain;background:#000}
.live-stream-audio{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.live-playback-notice{position:absolute;left:50%;bottom:28px;z-index:4;max-width:min(680px,calc(100% - 40px));transform:translateX(-50%);padding:12px 16px;border:1px solid rgba(255,255,255,.18);border-radius:8px;background:rgba(5,12,9,.88);color:#fff;font-size:14px;text-align:center;backdrop-filter:blur(10px)}
.live-playback-notice[hidden]{display:none}
.panel-backdrop,.panel-fill,.panel-backdrop-video{position:absolute;inset:0;width:100%;height:100%}
.panel-backdrop{background-position:center;background-repeat:no-repeat;background-size:cover;filter:blur(22px) brightness(.58) saturate(1.1);transform:scale(1.08)}
.panel-fill{background-position:center;background-repeat:no-repeat;background-size:cover;filter:blur(9px) brightness(.74) saturate(1.08);transform:scale(1.05)}
.panel-backdrop-video{object-fit:cover;filter:blur(24px) brightness(.52);transform:scale(1.08)}
.panel-media{position:relative;z-index:2;width:100%;height:100%}
.panel-image-media,.panel-video-media{box-shadow:0 28px 90px rgba(0,0,0,.32)}
.panel-image-media[data-fit="contain"],.panel-video-media[data-fit="contain"]{object-fit:contain}
.panel-image-media[data-fit="cover"],.panel-video-media[data-fit="cover"]{object-fit:cover}
.panel-image-media{will-change:transform,filter}
.panel-iframe-media{border:0;background:#fff}
.panel-youtube-media{background:#000}
.panel-audio,.panel-rss,.panel-iframe,.panel-youtube{background:linear-gradient(135deg,#0f1b16 0%,#09110d 100%)}
.panel-text{display:grid;place-items:center;padding:42px}
.youtube-note{position:absolute;left:18px;right:18px;bottom:18px;z-index:3;padding:10px 12px;border-radius:10px;background:rgba(6,10,9,.72);color:#dbe6df;font-size:12px;line-height:1.45;backdrop-filter:blur(8px)}
.text-stage{position:relative;z-index:2;width:min(1100px,100%);display:grid;place-items:center;text-align:center}
.text-stage.text-align-left{text-align:left;justify-items:start}
.text-stage.text-align-right{text-align:right;justify-items:end}
.text-copy{display:grid;gap:16px;max-width:min(1220px,100%)}
.text-copy strong{font-size:21px;opacity:.82;letter-spacing:.06em;text-transform:uppercase}
.text-copy h2{margin:0;font-size:clamp(36px,6vw,88px);line-height:1.02;font-weight:900;font-family:var(--text-font, "Segoe UI", Arial, sans-serif);transform:scale(var(--headline-scale,1));transform-origin:center center}
.text-copy p{margin:0;font-size:clamp(18px,2.2vw,34px);line-height:1.35;max-width:22ch;font-family:var(--text-font, "Segoe UI", Arial, sans-serif)}
.text-badge{display:inline-flex;align-items:center;justify-content:center;padding:8px 14px;border-radius:999px;background:color-mix(in srgb, var(--accent, #ffe082) 18%, transparent);border:1px solid color-mix(in srgb, var(--accent, #ffe082) 55%, transparent);color:var(--accent, #ffe082);font-size:13px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.panel-text[data-text-case="uppercase"] .text-copy h2,.panel-text[data-text-case="uppercase"] .text-copy p{text-transform:uppercase}
.panel-text[data-text-case="title"] .text-copy h2,.panel-text[data-text-case="title"] .text-copy p{text-transform:capitalize}
.countdown-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.countdown-cell{padding:18px 14px;border-radius:18px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);display:grid;gap:8px;min-width:120px}
.countdown-cell em{font-style:normal;font-size:clamp(28px,4vw,62px);font-weight:900;color:var(--accent, #7bd6ff)}
.countdown-cell span{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#d8e7df}
.countdown-style-capsule .countdown-cell{border-radius:999px}
.countdown-style-hero .countdown-cell{background:linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,.04))}
.audio-mini,.rss-mini{position:relative;z-index:2;height:100%;display:grid;align-content:center;justify-items:center;text-align:center;padding:28px}
.audio-mini strong,.rss-mini strong{font-size:28px}
.audio-mini span,.rss-mini span{color:#a8bbb1}
.rss-mini p{margin:0 0 10px;color:#d8f06b;font-size:12px;font-weight:800;letter-spacing:2px}
.rss-mini{gap:10px}
.audio-bars{display:flex;gap:10px;align-items:flex-end;height:72px;margin-top:12px}
.audio-bars span{width:14px;border-radius:999px;background:linear-gradient(180deg,#d8f06b 0%,#5cc273 100%);animation:audioBounce 1.2s ease-in-out infinite}
.audio-bars span:nth-child(1){height:20px}
.audio-bars span:nth-child(2){height:42px;animation-delay:.12s}
.audio-bars span:nth-child(3){height:62px;animation-delay:.24s}
.audio-bars span:nth-child(4){height:34px;animation-delay:.36s}
.audio-bars span:nth-child(5){height:50px;animation-delay:.48s}

.panel-image.kenburns-in .panel-image-media{animation:kenburnsIn 18s ease-in-out forwards}
.panel-image.kenburns-out .panel-image-media{animation:kenburnsOut 18s ease-in-out forwards}
.panel-image.pan-left .panel-image-media{animation:panLeft 18s ease-in-out forwards}
.panel-image.pan-right .panel-image-media{animation:panRight 18s ease-in-out forwards}
.panel-image.float-rise .panel-image-media{animation:floatRise 18s ease-in-out forwards}
.panel-image.cinema-sweep .panel-image-media{animation:cinemaSweep 18s ease-in-out forwards}
.panel-text.text-animation-fade .text-copy{animation:textFade 12s ease both}
.panel-text.text-animation-slide-up .text-copy{animation:textSlideUp 12s ease both}
.panel-text.text-animation-slide-left .text-copy{animation:textSlideLeft 12s ease both}
.panel-text.text-animation-zoom .text-copy{animation:textZoom 12s ease both}
.panel-text.text-animation-ticker .text-copy{animation:textTicker 14s linear both}
.panel-text.text-animation-pulse .text-copy{animation:textPulse 6s ease-in-out infinite}
.panel-text.text-animation-glow .text-copy{animation:textGlow 7s ease-in-out infinite}
.panel-text.text-animation-spotlight .text-copy{animation:textSpotlight 10s ease both}
.panel-text.text-animation-bounce .text-copy{animation:textBounce 6s ease-in-out infinite}
.panel-text.text-animation-flip-in .text-copy{animation:textFlipIn 10s ease both}
.panel-text.text-animation-drift .text-copy{animation:textDrift 12s ease-in-out both}
.panel-text.text-animation-reveal .text-copy{animation:textReveal 10s ease both}

@keyframes kenburnsIn{0%{transform:scale(1.02) translate3d(0,0,0)}50%{transform:scale(1.08) translate3d(-1.2%,1%,0)}100%{transform:scale(1.13) translate3d(1.2%,-1%,0)}}
@keyframes kenburnsOut{0%{transform:scale(1.15) translate3d(1%,-1%,0)}100%{transform:scale(1.03) translate3d(-1%,1.2%,0)}}
@keyframes panLeft{0%{transform:scale(1.12) translate3d(3%,0,0)}50%{transform:scale(1.08) translate3d(0,-1%,0)}100%{transform:scale(1.12) translate3d(-3%,0,0)}}
@keyframes panRight{0%{transform:scale(1.12) translate3d(-3%,0,0)}50%{transform:scale(1.08) translate3d(0,1%,0)}100%{transform:scale(1.12) translate3d(3%,0,0)}}
@keyframes floatRise{0%{transform:scale(1.08) translate3d(0,2.4%,0)}40%{transform:scale(1.12) translate3d(-1%,0,0)}100%{transform:scale(1.17) translate3d(1.4%,-3%,0)}}
@keyframes cinemaSweep{0%{transform:scale(1.14) translate3d(-2.2%,-1.4%,0) rotate(.15deg)}45%{transform:scale(1.09) translate3d(1.1%,.5%,0) rotate(0)}100%{transform:scale(1.14) translate3d(2.2%,1.4%,0) rotate(-.15deg)}}
@keyframes audioBounce{0%,100%{transform:scaleY(.72)}50%{transform:scaleY(1.18)}}
@keyframes idleFloat{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-10px) scale(1.03)}}
@keyframes idleSpin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}
@keyframes textFade{0%,100%{opacity:0;transform:translateY(18px)}10%,90%{opacity:1;transform:none}}
@keyframes textSlideUp{0%{opacity:0;transform:translateY(48px)}14%,86%{opacity:1;transform:none}100%{opacity:0;transform:translateY(-48px)}}
@keyframes textSlideLeft{0%{opacity:0;transform:translateX(70px)}14%,86%{opacity:1;transform:none}100%{opacity:0;transform:translateX(-70px)}}
@keyframes textZoom{0%{opacity:0;transform:scale(.82)}18%,88%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(1.08)}}
@keyframes textTicker{0%{transform:translateX(16%)}100%{transform:translateX(-16%)}}
@keyframes textPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.04)}}
@keyframes textGlow{0%,100%{filter:drop-shadow(0 0 0 rgba(255,224,130,.0))}50%{filter:drop-shadow(0 0 26px rgba(255,224,130,.42))}}
@keyframes textSpotlight{0%{opacity:0;clip-path:inset(0 100% 0 0)}20%,85%{opacity:1;clip-path:inset(0 0 0 0)}100%{opacity:0;clip-path:inset(0 0 0 100%)}}
@keyframes textBounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-16px)}}
@keyframes textFlipIn{0%{opacity:0;transform:perspective(1200px) rotateX(-85deg)}18%,86%{opacity:1;transform:none}100%{opacity:0;transform:perspective(1200px) rotateX(40deg)}}
@keyframes textDrift{0%{opacity:0;transform:translate3d(-24px,18px,0)}18%,88%{opacity:1;transform:translate3d(0,0,0)}100%{opacity:0;transform:translate3d(26px,-16px,0)}}
@keyframes textReveal{0%{opacity:0;transform:scale(.94);letter-spacing:.08em}20%,88%{opacity:1;transform:scale(1);letter-spacing:0}100%{opacity:0;transform:scale(1.03)}}