:root{--orange:#ff5a00;--ink:#151313;--white:#fff;--soft:#f4f1ed;--slab:"Roboto Slab",Georgia,serif;--sans:"Roboto",Arial,sans-serif;color-scheme:dark}
[hidden]{display:none!important}
*{box-sizing:border-box}
html,body{width:100%;height:100%;margin:0;overflow:hidden;background:var(--ink);font-family:var(--sans);color:var(--white)}
.screen{position:relative;width:100vw;height:100vh;overflow:hidden;isolation:isolate;background:#0e0d0d}
.idle,.media-stage,.message,.broadcast{position:absolute;inset:0}
.idle{display:grid;place-content:center;justify-items:center;gap:2.6vh;padding:6vw;text-align:center;background:radial-gradient(circle at 82% 12%,rgba(255,90,0,.35),transparent 31%),linear-gradient(132deg,#1b1818 0%,#0c0b0b 62%,#241610 100%);transition:opacity .55s ease}
.idle.is-hidden{opacity:0;pointer-events:none}
.idle-grid{position:absolute;inset:-10%;opacity:.24;background-image:linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px);background-size:5vw 5vw;transform:perspective(900px) rotateX(58deg) translateY(24%);mask-image:linear-gradient(to top,#000,transparent 74%)}
.idle::before{content:"";position:absolute;right:-8vw;bottom:-30vh;width:58vw;height:58vw;border:2px solid rgba(255,90,0,.17);transform:rotate(18deg)}
.brand-lockup{position:relative;z-index:1;display:grid;justify-items:center;gap:clamp(18px,2vh,34px)}
.brand-lockup img{width:clamp(300px,38vw,760px);height:auto;object-fit:contain}
.brand-lockup span{padding-left:.42em;color:var(--orange);font:700 clamp(22px,2.2vw,46px)/1 var(--sans);letter-spacing:.42em}
.idle-kicker,.idle-copy{position:relative;z-index:1;max-width:90vw;margin:0;padding-left:.28em;text-align:center;text-transform:uppercase;letter-spacing:.28em}
.idle-kicker{color:var(--orange);font-weight:700;font-size:clamp(12px,1.15vw,24px)}
.idle-copy{font-size:clamp(13px,1.25vw,26px);opacity:.65}
.media-stage{opacity:0;visibility:hidden;background:#000;transition:opacity .55s ease}
.media-stage.is-visible{opacity:1;visibility:visible}
.media-stage img,.media-stage video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .65s ease,transform 7s ease}
.media-stage img.is-active,.media-stage video.is-active{opacity:1;transform:scale(1.012)}
.media-stage [data-fit="contain"]{object-fit:contain;background:#000}
.media-vignette{position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 10vw rgba(0,0,0,.16)}
.audio-unlock{position:absolute;z-index:5;left:50%;bottom:5vh;transform:translateX(-50%);padding:16px 24px;border:0;background:var(--orange);color:#151313;font:700 clamp(16px,1.4vw,28px) var(--sans);box-shadow:0 15px 45px rgba(0,0,0,.4)}
.media-error{position:absolute;z-index:4;inset:0;display:grid;place-content:center;gap:12px;padding:5vw;text-align:center;background:#111;color:#fff}.media-error b{font:800 clamp(30px,4vw,72px)/1.05 var(--slab);max-width:19ch}.media-error span{color:#bbb;font-size:clamp(16px,1.4vw,28px)}
.message{z-index:30;opacity:0;visibility:hidden;transition:opacity .35s ease,transform .45s cubic-bezier(.2,.8,.2,1)}
.message.is-visible{opacity:1;visibility:visible;transform:none}
.message--fullscreen{display:grid;place-items:center;padding:8vw;background:linear-gradient(128deg,#100e0e,#25150e);transform:scale(1.035)}
.message--fullscreen::before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 44%,rgba(255,90,0,.12) 44.2%,transparent 44.5%),radial-gradient(circle at 82% 20%,rgba(255,90,0,.24),transparent 30%)}
.full-message-inner{position:relative;width:min(1500px,86vw);border-left:clamp(10px,1vw,22px) solid var(--orange);padding-left:clamp(30px,4vw,78px)}
.message-eyebrow{display:block;margin-bottom:1.2em;color:var(--orange);font-weight:700;font-size:clamp(14px,1.3vw,28px);letter-spacing:.25em;text-transform:uppercase}
.message h1,.message h2{margin:0;font-family:var(--slab);font-weight:800;letter-spacing:-.035em;overflow-wrap:break-word;word-break:normal;hyphens:none}
.message--fullscreen h1{max-width:17ch;font-size:clamp(62px,7.2vw,150px);line-height:.99}
.full-brand{position:absolute;right:5vw;bottom:5vh;width:clamp(230px,19vw,390px);height:auto;object-fit:contain}.message--fullscreen.is-light{background:linear-gradient(128deg,#fff,#f1ece7);color:var(--ink)}.message--fullscreen.is-light::before{background:linear-gradient(120deg,transparent 44%,rgba(255,90,0,.16) 44.2%,transparent 44.5%),radial-gradient(circle at 82% 20%,rgba(255,90,0,.12),transparent 31%)}.message--fullscreen.is-light .message-eyebrow{color:#d94c00}.message--fullscreen.is-light p{color:#4e4946}
.message p{margin:1.4em 0 0;font-size:clamp(20px,2vw,40px);line-height:1.35;max-width:48ch}
.message--lower{inset:auto 4vw 5vh 4vw;display:grid;grid-template-columns:clamp(14px,1.2vw,24px) 1fr;gap:clamp(25px,2.2vw,46px);align-items:stretch;padding:clamp(26px,2.4vw,50px);background:rgba(18,16,16,.94);box-shadow:0 2.2vw 6vw rgba(0,0,0,.45);backdrop-filter:blur(20px);transform:translateY(130%)}
.lower-mark{background:var(--orange)}
.message--lower .message-eyebrow{margin-bottom:.55em}
.message--lower h2{font-size:clamp(38px,4.2vw,86px);line-height:1.02}
.message--lower p{margin:.65em 0 0;font-size:clamp(18px,1.65vw,34px)}
.broadcast{z-index:50;display:grid;place-items:center;background:#000;opacity:0;visibility:hidden;transition:opacity .35s ease}
.broadcast.is-visible{opacity:1;visibility:visible}
.broadcast video{width:100%;height:100%;object-fit:contain;background:#000}
.broadcast.is-audio-only{background:transparent;pointer-events:none}.broadcast.is-audio-only video{position:absolute;width:1px;height:1px;opacity:0;background:transparent}.broadcast.is-audio-only .broadcast-waiting{right:3vw;bottom:3vw;left:auto;top:auto;padding:14px 18px;background:rgba(15,14,14,.88);font-size:12px}.broadcast.is-audio-only .broadcast-waiting span{width:24px;height:24px;border-width:3px}.audio-live-badge{display:none;position:absolute;right:3vw;bottom:3vw;padding:12px 16px;background:rgba(15,14,14,.88);border-left:5px solid var(--orange);color:#fff;font-weight:700;letter-spacing:.13em}.broadcast.is-audio-only.is-playing .audio-live-badge{display:block}.broadcast.is-audio-only .audio-notice{pointer-events:auto}
.broadcast-waiting{position:absolute;display:grid;justify-items:center;gap:18px;color:#fff;text-transform:uppercase;letter-spacing:.16em}
.broadcast-waiting span{width:52px;height:52px;border:4px solid rgba(255,255,255,.25);border-top-color:var(--orange);border-radius:50%;animation:spin 1s linear infinite}
.broadcast.is-playing .broadcast-waiting{display:none}
.audio-notice{position:absolute;z-index:3;right:3vw;bottom:3vw;padding:14px 20px;border:0;background:var(--orange);color:#111;font-weight:700}.broadcast.is-audio-only .audio-notice{bottom:8vh}
.connection-state{position:absolute;z-index:100;right:2vw;top:2vw;display:flex;align-items:center;gap:10px;padding:9px 13px;background:rgba(0,0,0,.55);font-size:12px;text-transform:uppercase;letter-spacing:.12em;transition:opacity .25s}
.connection-state span{width:8px;height:8px;border-radius:50%;background:#ffbe00}
.connection-state[data-state="online"]{opacity:0;pointer-events:none}.connection-state[data-state="offline"] span{background:#ef4b3f}
@keyframes spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
