/* SyncTV customer surfaces v3 — portal-style shell for Brochure, Broadcast, Guest Broadcast, and Cast. */
:root{
  --surface-app-max:1120px;
  --surface-app-page:#f6f7f9;
  --surface-app-card:#fff;
  --surface-app-text:#1c2639;
  --surface-app-muted:#687386;
  --surface-app-border:#e2e5ea;
  --surface-app-soft:#f0f2f6;
  --surface-app-accent:#6f56da;
  --surface-app-purple:#725fc9;
  --surface-app-good:#187b59;
}
html[data-synctv-theme="dark"]{
  --surface-app-page:#0c1422;
  --surface-app-card:#131e2e;
  --surface-app-text:#eef4ff;
  --surface-app-muted:#a8b5c8;
  --surface-app-border:#2b3a51;
  --surface-app-soft:#1b293c;
  --surface-app-accent:#8b75ef;
  --surface-app-purple:#a697ff;
  --surface-app-good:#71ddb3;
}
body.brochure-v2,body.broadcast-v2,body.cast-v2{background:var(--surface-app-page)!important;color:var(--surface-app-text)!important}

.customer-app-header{position:sticky;top:0;z-index:300;background:color-mix(in srgb,var(--surface-app-card) 96%,transparent);border-bottom:1px solid var(--surface-app-border);box-shadow:0 4px 18px rgba(21,29,46,.035);backdrop-filter:blur(14px)}
.customer-app-header-inner{width:min(var(--surface-app-max),calc(100% - 36px));min-height:68px;margin:0 auto;display:flex;align-items:center;gap:22px}
.customer-app-brand{display:inline-flex;align-items:center;gap:10px;color:var(--surface-app-text);text-decoration:none;white-space:nowrap}
.customer-app-brand-mark{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;color:#fff;font-size:18px;font-weight:900;background:linear-gradient(145deg,#22bdec,#7858ed 62%,#ff6b5e);box-shadow:0 7px 16px rgba(94,91,216,.2)}
.customer-app-brand-copy strong,.customer-app-brand-copy span{display:block}.customer-app-brand-copy strong{font-size:16px;line-height:1.05}.customer-app-brand-copy span{margin-top:2px;color:var(--surface-app-muted);font-size:10px;font-weight:800}
.customer-app-mainnav{display:flex;align-items:center;gap:3px;flex:1}.customer-app-mainnav a{min-height:40px;display:inline-flex;align-items:center;justify-content:center;padding:8px 12px;border-radius:9px;color:var(--surface-app-muted);font-size:11px;font-weight:900;text-decoration:none}.customer-app-mainnav a:hover,.customer-app-mainnav a[aria-current="page"]{background:var(--surface-app-soft);color:var(--surface-app-text)}
.customer-app-actions{display:flex;align-items:center;gap:8px;margin-left:auto}.customer-app-actions #synctvThemeToggle,.customer-app-theme-toggle{position:static!important;inset:auto!important;margin:0!important;z-index:auto!important;min-height:36px!important;box-shadow:none!important}
.customer-app-pagehead{width:min(var(--surface-app-max),calc(100% - 36px));margin:0 auto;padding:34px 0 20px;border-bottom:1px solid var(--surface-app-border)}
.customer-app-eyebrow{display:block;margin-bottom:5px;color:var(--surface-app-purple);font-size:9px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}
.customer-app-pagehead h1{margin:0;color:var(--surface-app-text);font-size:clamp(30px,4vw,40px);line-height:1.08;letter-spacing:-.035em}.customer-app-pagehead p{max-width:760px;margin:7px 0 0;color:var(--surface-app-muted);font-size:12px;font-weight:750;line-height:1.55}
.customer-app-tabs-wrap{width:min(var(--surface-app-max),calc(100% - 36px));margin:0 auto;padding:16px 0 0}.customer-app-tabs{display:flex;gap:6px;overflow-x:auto;scrollbar-width:thin;padding-bottom:2px}.customer-app-tab{flex:0 0 auto;min-height:39px;padding:8px 13px;border:1px solid var(--surface-app-border);border-radius:10px;background:var(--surface-app-card);color:var(--surface-app-muted);font:900 10px/1.1 inherit;cursor:pointer;box-shadow:none}.customer-app-tab:hover{border-color:#cfc8f4;color:var(--surface-app-text)}.customer-app-tab[aria-selected="true"]{border-color:#c8bff4;background:color-mix(in srgb,var(--surface-app-accent) 10%,var(--surface-app-card));color:var(--surface-app-purple)}
.customer-app-panel[hidden]{display:none!important}
.customer-app-content-shell{width:min(var(--surface-app-max),calc(100% - 36px));margin:0 auto;padding:20px 0 56px}
.customer-app-card{border:1px solid var(--surface-app-border);border-radius:15px;background:var(--surface-app-card);box-shadow:0 5px 16px rgba(25,34,53,.035)}
.customer-app-note{padding:14px 16px;border:1px solid var(--surface-app-border);border-radius:12px;background:var(--surface-app-soft);color:var(--surface-app-muted);font-size:11px;font-weight:800;line-height:1.5}

/* Brochure becomes a focused product guide instead of one long landing page. */
body.brochure-v2>.site-nav{display:none!important}
body.brochure-v2 main#top{width:min(var(--surface-app-max),calc(100% - 36px));margin:0 auto;padding:20px 0 52px}
body.brochure-v2 main#top>.customer-app-panel{margin:0 0 16px!important}
body.brochure-v2 main#top>.section-wrap.customer-app-panel{width:100%!important}
body.brochure-v2 main#top>.statement.customer-app-panel,body.brochure-v2 main#top>.possibilities.customer-app-panel,body.brochure-v2 main#top>.quality-band.customer-app-panel,body.brochure-v2 main#top>.addon-band.customer-app-panel,body.brochure-v2 main#top>.final-cta.customer-app-panel{width:100%!important;border:1px solid var(--surface-app-border);border-radius:16px;overflow:hidden}
body.brochure-v2 .hero{min-height:0;padding:24px!important;gap:32px;border:1px solid var(--surface-app-border);border-radius:16px;background:var(--surface-app-card);box-shadow:0 5px 16px rgba(25,34,53,.035)}
body.brochure-v2 .hero h1{font-size:clamp(40px,6vw,68px)}
body.brochure-v2 .statement{padding:30px 0!important;background:var(--surface-app-card)!important}
body.brochure-v2 .statement-grid{gap:30px}
body.brochure-v2 .how,body.brochure-v2 .feature-section,body.brochure-v2 .plans,body.brochure-v2 .account-section,body.brochure-v2 .faq{padding-top:26px!important;padding-bottom:30px!important;border:1px solid var(--surface-app-border);border-radius:16px;background:var(--surface-app-card);box-shadow:0 5px 16px rgba(25,34,53,.035)}
body.brochure-v2 .possibilities{padding:28px 0!important;background:var(--surface-app-card)!important}
body.brochure-v2 .quality-band,body.brochure-v2 .addon-band{padding:28px 0!important;background:var(--surface-app-card)!important}
body.brochure-v2 .final-cta{padding:32px 0!important;background:linear-gradient(120deg,#0d1b2d,#17152d)!important;color:#fff!important}
body.brochure-v2 .final-cta h2,body.brochure-v2 .final-cta p,body.brochure-v2 .final-cta .eyebrow{color:#fff!important}
body.brochure-v2 .final-cta .button.secondary,body.brochure-v2 .final-cta .button.ghost{background:#fff!important;color:#25324a!important;border-color:#fff!important}
body.brochure-v2 .tv-screen,body.brochure-v2 .tv-screen *{color:#fff!important}
body.brochure-v2 .tv-screen .screen-kicker{color:#64e6f4!important}
body.brochure-v2 .tv-screen .screen-copy p:last-child{color:#d0d7e4!important}
body.brochure-v2 .tv-screen .screen-topline{color:rgba(255,255,255,.82)!important}
body.brochure-v2 .tv-screen .screen-source{color:#fff!important}
body.brochure-v2 .use-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
body.brochure-v2 .feature-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
body.brochure-v2 .feature-card.featured{grid-column:span 2}
body.brochure-v2 footer{border-top:1px solid var(--surface-app-border);background:var(--surface-app-card)!important}
body.brochure-v2 .footer-inner{width:min(var(--surface-app-max),calc(100% - 36px))}
html[data-synctv-theme="light"] body.brochure-v2 .tv-bezel{color:#fff!important}
html[data-synctv-theme="light"] body.brochure-v2 .screen-content h2{color:#fff!important}
html[data-synctv-theme="light"] body.brochure-v2 .final-cta h2 span{color:transparent!important;background:linear-gradient(90deg,#64e6f4,#4ca8ff,#b996ff);-webkit-background-clip:text;background-clip:text}

/* Broadcast/Guest Broadcast use a compact control-center shell. */
body.broadcast-v2 .app-shell{max-width:none!important;margin:0!important}
body.broadcast-v2 .app-shell>.topbar{display:none!important}
body.broadcast-v2 .app-content{width:min(var(--surface-app-max),calc(100% - 36px));max-width:var(--surface-app-max);margin:0 auto;padding:20px 0 56px!important}
body.broadcast-v2 .hero-card{margin:0 0 14px;padding:20px 22px;border:1px solid var(--surface-app-border);border-radius:15px;background:var(--surface-app-card);box-shadow:0 5px 16px rgba(25,34,53,.035)}
body.broadcast-v2 .hero-copy h1,body.broadcast-v2 .hero-copy p{color:var(--surface-app-text)}
body.broadcast-v2 .hero-copy p{color:var(--surface-app-muted)!important}
body.broadcast-v2 .hero-stats{gap:8px}.broadcast-v2 .hero-stat{border:1px solid var(--surface-app-border)!important;background:var(--surface-app-soft)!important;border-radius:11px!important}.broadcast-v2 .hero-stat span{color:var(--surface-app-muted)!important}.broadcast-v2 .hero-stat strong{color:var(--surface-app-text)!important}
body.broadcast-v2 .broadcast-section-tabs{margin:0 0 14px}
body.broadcast-v2 .dashboard-grid{grid-template-columns:minmax(0,1.12fr) minmax(320px,.88fr)!important;gap:14px!important}
body.broadcast-v2 .panel{border:1px solid var(--surface-app-border)!important;border-radius:15px!important;background:var(--surface-app-card)!important;box-shadow:0 5px 16px rgba(25,34,53,.035)!important}
body.broadcast-v2 .control-panel{padding:20px!important}.broadcast-v2 .preview-panel{top:88px!important;padding:20px!important}
body.broadcast-v2 .setup-block{border-color:var(--surface-app-border)!important}.broadcast-v2 .setup-content>label,.broadcast-v2 .panel-heading h2{color:var(--surface-app-text)!important}.broadcast-v2 .helper,.broadcast-v2 .connection-guidance,.broadcast-v2 .panel-heading span{color:var(--surface-app-muted)!important}
body.broadcast-v2 .connection-reading,body.broadcast-v2 .tip-card,body.broadcast-v2 .mini-card{border-color:var(--surface-app-border)!important;background:var(--surface-app-soft)!important}.broadcast-v2 .connection-reading strong,.broadcast-v2 .mini-card strong{color:var(--surface-app-text)!important}
body.broadcast-v2 .technical-details{border-color:var(--surface-app-border)!important;background:var(--surface-app-soft)!important}.broadcast-v2 .technical-details summary{color:var(--surface-app-text)!important}
body.broadcast-v2 .preview-frame{min-height:300px;border-radius:13px}
body.broadcast-v2 .broadcast-tab-empty{padding:18px;border:1px dashed var(--surface-app-border);border-radius:12px;color:var(--surface-app-muted);font-size:11px;font-weight:800}

/* Cast is a short status page, not a dead-end vertical page. */
body.cast-v2{display:block!important;padding:0!important;min-height:100vh!important;background:var(--surface-app-page)!important;color:var(--surface-app-text)!important}
body.cast-v2 .cast-app-wrap{width:min(760px,calc(100% - 36px));margin:0 auto;padding:22px 0 56px}
body.cast-v2 .cast-launch{width:100%!important;margin:0!important;padding:24px!important;border:1px solid var(--surface-app-border)!important;border-radius:15px!important;background:var(--surface-app-card)!important;box-shadow:0 5px 16px rgba(25,34,53,.035)!important}
body.cast-v2 .cast-launch h1{color:var(--surface-app-text)!important}.cast-v2 .cast-launch p{color:var(--surface-app-muted)!important}.cast-v2 .cast-status{background:var(--surface-app-soft)!important;border-color:var(--surface-app-border)!important;color:var(--surface-app-text)!important}
body.cast-v2 .cast-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:16px 0 0}.cast-v2 .cast-step{padding:14px;border:1px solid var(--surface-app-border);border-radius:12px;background:var(--surface-app-soft)}.cast-v2 .cast-step span{display:block;margin-bottom:5px;color:var(--surface-app-purple);font-size:9px;font-weight:900;letter-spacing:.08em}.cast-v2 .cast-step strong{display:block;color:var(--surface-app-text);font-size:12px}.cast-v2 .cast-help{padding-top:14px;border-top:1px solid var(--surface-app-border)}

@media(max-width:900px){
  .customer-app-header-inner{flex-wrap:wrap;gap:8px;padding:9px 0}.customer-app-mainnav{order:3;width:100%;overflow-x:auto}.customer-app-actions{margin-left:auto}
  body.brochure-v2 .hero{grid-template-columns:1fr!important}.brochure-v2 .use-grid,.brochure-v2 .feature-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.brochure-v2 .feature-card.featured{grid-column:1/-1}
  body.broadcast-v2 .dashboard-grid{grid-template-columns:1fr!important}.broadcast-v2 .preview-panel{position:static!important}
}
@media(max-width:620px){
  .customer-app-header-inner,.customer-app-pagehead,.customer-app-tabs-wrap,body.brochure-v2 main#top,body.broadcast-v2 .app-content,.cast-app-wrap{width:min(100% - 24px,var(--surface-app-max))!important}
  .customer-app-header-inner{flex-wrap:nowrap;min-height:60px}.customer-app-brand-copy span{display:none}.customer-app-mainnav{display:none}.customer-app-brand{margin-right:auto}.customer-app-brand-mark{width:34px;height:34px}.customer-app-actions{margin-left:0}.customer-app-pagehead{padding-top:26px}.customer-app-pagehead h1{font-size:30px}
  body.brochure-v2 .hero{padding:18px!important}.brochure-v2 .use-grid,.brochure-v2 .feature-grid,.brochure-v2 .steps-grid,.brochure-v2 .plan-grid,.brochure-v2 .quality-stats,.brochure-v2 .account-grid{grid-template-columns:1fr!important}.brochure-v2 .feature-card.featured{grid-column:1}.brochure-v2 .hero h1{font-size:42px!important}.brochure-v2 .statement-grid,.brochure-v2 .quality-grid,.brochure-v2 .addon-grid,.brochure-v2 .final-grid{grid-template-columns:1fr!important;gap:20px!important}
  body.broadcast-v2 .hero-card{display:block!important}.broadcast-v2 .hero-stats{margin-top:14px;grid-template-columns:repeat(3,minmax(0,1fr))!important}.broadcast-v2 .control-panel,.broadcast-v2 .preview-panel{padding:16px!important}.broadcast-v2 .setup-block{padding:16px 0!important}.broadcast-v2 .step-badge{display:none!important}
  body.cast-v2 .cast-app-wrap{width:calc(100% - 24px)!important}.cast-v2 .cast-launch{padding:20px!important}.cast-v2 .cast-steps{grid-template-columns:1fr}
}