/* Hold first paint until auth/browse chrome is ready. */
html[data-page-state="pending"]{background:var(--bg,#050d19)}
html[data-page-state="pending"] body>*:not(.page-ready-status){visibility:hidden!important;pointer-events:none}
html[data-page-state="pending"] .page-ready-status{visibility:visible!important;pointer-events:none}
.page-ready-status{position:fixed;inset:120px 20px 20px;display:grid;align-content:center;justify-items:center;gap:16px;z-index:20;color:var(--text,#f2f8fc);font:14px system-ui;text-align:center;pointer-events:none}
.page-ready-status::before{content:"";width:26px;height:26px;border:2px solid var(--border,#91b8d91f);border-top-color:var(--text,#f2f8fc);border-radius:50%;animation:page-ready-spin 1s linear infinite}
.page-ready-status button{pointer-events:auto;min-height:44px;padding:10px 22px;background:var(--text,#f2f8fc);color:var(--brand-ink,#03121e);border:0;border-radius:9px}
.page-ready-status.failed::before{display:none}
@keyframes page-ready-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.page-ready-status::before{animation:none}}

/* Critical brand mark so header never flashes the legacy PNG/blue-slash treatment. */
header .brand{display:inline-flex;align-items:center;flex-shrink:0;width:auto;height:auto;overflow:visible;border-radius:0;background:transparent;text-decoration:none;gap:0}
header .brand-wordmark{display:none!important}
header .brand-mark{display:inline-flex;align-items:center;justify-content:center;gap:10px;color:var(--text,#f2f8fc)}
header .brand-play{width:22px;height:16px;border:1px solid var(--border-strong,#91b8d938);border-radius:5px;display:grid;place-items:center;box-shadow:inset 0 1px 0 #f2f8fc12;flex:0 0 auto}
header .brand-play::after{content:"";width:0;height:0;border-top:3px solid transparent;border-bottom:3px solid transparent;border-left:5px solid #c6baa0;margin-left:1px}
header .brand-wordmark-text{display:inline-flex;align-items:center;font-family:"Helvetica Neue",Arial,sans-serif;font-size:22px;font-weight:750;line-height:1;letter-spacing:-1px;color:var(--text,#f2f8fc)}
header .brand-mark .brand-slash{font-weight:300;color:#a69b80;padding:0 2px;font-size:26px;margin:0;line-height:1}
header .brand-mark .brand-cable{font-weight:300;letter-spacing:-.7px}
header .brand-mark .brand-tv{font-size:9px;font-weight:500;letter-spacing:1px;border:1px solid var(--border-strong,#91b8d938);border-radius:3px;padding:3px 3px;margin-left:6px;line-height:1}

/* Browse routes: keep marketing chrome and legacy app nav out of the first paint */
html[data-browse-boot="1"] #welcome{display:none!important}
html[data-browse-boot="1"] header .site-nav{visibility:hidden}
html[data-browse-boot="1"][data-page-state="pending"] #app>nav,
html[data-browse-boot="1"][data-page-state="pending"] #catalog-view,
html[data-browse-boot="1"][data-page-state="pending"] .browse-rail,
html[data-browse-boot="1"][data-page-state="pending"] .browse-mobile{visibility:hidden!important}
html[data-browse-boot="1"] body:not(.browse-mode) #app>nav{visibility:hidden}
html[data-browse-boot="1"] body:not(.browse-mode) .browse-rail,
html[data-browse-boot="1"] body:not(.browse-mode) .browse-mobile{visibility:hidden}
@media(min-width:701px){html[data-browse-boot="1"] main{padding-left:calc(var(--space-6,24px) + 72px)}}
@media(max-width:700px){html[data-browse-boot="1"] main{padding-bottom:calc(68px + env(safe-area-inset-bottom,0px))}}

/* Who-watching gate: CSS mark (no PNG swap) */
.who-brand .brand-mark{display:inline-flex;align-items:center;justify-content:center;gap:10px;color:var(--text,#f2f8fc)}
.who-brand .brand-play{width:26px;height:18px;border:1px solid var(--border-strong,#91b8d938);border-radius:5px;display:grid;place-items:center;box-shadow:inset 0 1px 0 #f2f8fc12;flex:0 0 auto}
.who-brand .brand-play::after{content:"";width:0;height:0;border-top:4px solid transparent;border-bottom:4px solid transparent;border-left:7px solid #c6baa0;margin-left:1px}
.who-brand .brand-wordmark-text{display:inline-flex;align-items:center;font-family:"Helvetica Neue",Arial,sans-serif;font-size:26px;font-weight:750;line-height:1;letter-spacing:-1px;color:var(--text,#f2f8fc)}
.who-brand .brand-slash{font-weight:300;color:#a69b80;padding:0 2px;font-size:30px;margin:0;line-height:1}
.who-brand .brand-cable{font-weight:300;letter-spacing:-.7px}
.who-brand .brand-tv{font-size:10px;font-weight:500;letter-spacing:1px;border:1px solid var(--border-strong,#91b8d938);border-radius:3px;padding:3px 3px;margin-left:6px;line-height:1}
.who-brand .who-wordmark{display:none!important}