:root{color-scheme:dark;--bg:#09121d;--panel:#101d2c;--border:#30445a;--muted:#a6b9cd;--mint:#8de2bc;--red:#ff3455}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 70% 0,#182638 0,transparent 50%),var(--bg);color:#f2f6fb;font:15px Arial,sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit}button:focus-visible,a:focus-visible{outline:3px solid #b5e8ff;outline-offset:4px}button:disabled{cursor:default;opacity:.45}button:active:not(:disabled){transform:translateY(1px)}[hidden]{display:none!important}header{max-width:1600px;margin:auto;padding:24px 42px;display:flex;align-items:center;gap:24px;border-bottom:1px solid #29394b}.identity img{width:200px;height:30px;object-fit:contain;object-position:left}.header-note{font-size:10px;letter-spacing:1.5px;color:var(--muted);margin-right:auto}.quiet{background:#152333;border:1px solid #445870;border-radius:7px;padding:10px 16px;font-size:13px}main{max-width:1600px;margin:auto;padding:32px 42px 22px}.intro{display:flex;align-items:center;justify-content:space-between;gap:30px}.eyebrow{font-size:10px;font-weight:700;letter-spacing:1.8px;color:#a5bdd5;margin:0 0 10px}h1{font-size:clamp(30px,3vw,46px);letter-spacing:-1.6px;line-height:1.08;margin:0 0 16px}h1 span{color:#a8bbce}.lede{color:#b7c7d7;line-height:1.5;margin:0}.intro-note{font-size:12px;white-space:nowrap;border-left:1px solid var(--border);padding-left:26px}.intro-note p{font-size:11px;line-height:1.7;color:#8da4bb}.demo-dot,.live-dot{display:inline-block;width:7px;height:7px;background:var(--mint);border-radius:50%;margin-right:8px}.stories{display:flex;gap:12px;margin:28px 0 23px}.stories button{display:grid;grid-template-columns:24px 1fr;text-align:left;column-gap:12px;background:#111e2c;border:1px solid var(--border);border-radius:9px;padding:14px 20px;flex:1}.stories button>span{grid-row:span 2;color:#748da5;font-size:13px}.stories strong{font-size:14px}.stories small{color:#8fa6bd;margin-top:6px;font-size:11px}.stories button[aria-pressed=true]{background:#203448;border-color:#7693b0;box-shadow:inset 0 -2px var(--red)}.monitor{display:grid;grid-template-columns:1fr 1.15fr;background:#101d2c;border:1px solid var(--border);border-radius:13px;overflow:hidden;box-shadow:0 14px 30px #0003}.preview-wrap{min-width:0;border-right:1px solid var(--border);background:#071019}.monitor-top{display:flex;justify-content:space-between;padding:13px 20px;color:#b6c8d9;font-size:10px;letter-spacing:1px}.sim{color:#83a3ba;font-size:9px}.preview{height:173px;position:relative;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse,#203950,#0a1521 75%);overflow:hidden}.preview>img{height:145px;width:70%;object-fit:contain;filter:drop-shadow(0 6px 14px #0007)}#source-labels{position:absolute;bottom:8px;left:20px;right:20px;display:flex;justify-content:center;gap:12px}#source-labels span{font-size:10px;background:#0a1424dd;border:1px solid #52667c;padding:4px 10px;border-radius:3px}#lower-third{position:absolute;bottom:16px;left:24px;right:24px;background:linear-gradient(90deg,#941f38,#192a3cf2);border-left:4px solid #ff657f;padding:11px 15px;font-size:13px;box-shadow:0 4px 14px #0006}#timer{position:absolute;right:15px;top:12px;background:#102336;border:1px solid #809aae;padding:5px 10px;font-family:monospace}.program-line{display:flex;gap:6px;align-items:center;padding:12px 20px;font-size:12px;border-top:1px solid #26394a}.program-line .live-dot{background:var(--red)}#camera-label{margin-left:auto;color:#9bb2c7;font-size:11px}.explanation{padding:23px 28px;display:flex;flex-direction:column;justify-content:center}.explanation h2{font-size:24px;letter-spacing:-.5px;margin:0 0 10px}.explanation>p:not(.eyebrow){font-size:13px;line-height:1.5;color:#becddd;margin:0}.benefit{display:grid;grid-template-columns:100px 1fr;gap:15px;border-top:1px solid #2b3d50;padding-top:13px;margin-top:15px}.benefit span{font-size:9px;letter-spacing:1px;color:#8db19f;line-height:1.6}.benefit p{font-size:12px;line-height:1.5;margin:0;color:#b7c9d9}.explanation .next-hint{color:#a6e7cc!important;font-size:11px!important;margin-top:14px!important}.controllers{display:grid;grid-template-columns:1.18fr 1fr;gap:28px;margin-top:27px;align-items:start}.controller-card{min-width:0}.role-heading{display:flex;justify-content:space-between;align-items:center;margin:0 3px 16px;gap:12px}.role-heading h2{font-size:23px;margin:0}.role-heading .eyebrow{font-size:9px;margin-bottom:5px}.role-heading>p{font-size:11px;line-height:1.6;color:#9fb5ca;margin:0;text-align:right}.deck{border-radius:24px;padding:21px 20px 26px;background:linear-gradient(145deg,#37393f,#1a1c21 45%,#101114);border:1px solid #656970;box-shadow:inset 0 2px 2px #ffffff29,inset 0 -3px 2px #0008,0 14px 28px #0008;position:relative}.deck:after{content:'';position:absolute;bottom:-7px;left:35px;right:35px;height:7px;background:#070a0d;border-radius:0 0 8px 8px}.deck-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.deck-top img{width:116px;height:20px;object-fit:contain;object-position:left}.deck-top span{font-size:8px;color:#919ba8;letter-spacing:2px}.deck-grid{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:10px}.devicekey{padding:0;border:0;border-radius:7px;background:black;overflow:hidden;box-shadow:0 0 0 2px #05080b,0 3px 2px #000;aspect-ratio:1;position:relative;touch-action:manipulation;transition:box-shadow .15s}.devicekey:hover{box-shadow:0 0 0 2px #b4c7dc,0 3px 2px #000}.devicekey.selected{box-shadow:0 0 0 2px var(--mint),0 0 15px #77e0b23b}.devicekey.selected:after{content:'✓';position:absolute;right:4px;top:3px;background:#185340;color:#c4ffe4;font-size:13px;font-weight:bold;padding:0 3px;border-radius:3px}.devicekey.onair{box-shadow:0 0 0 2px #ff6379}.devicekey.onair:after{background:#963048}.devicekey.featured{box-shadow:0 0 0 2px #c2eedd,0 0 18px #8de2bc33}.key{width:100%;height:100%;position:relative;overflow:hidden;background:#102132}.key>img{width:100%;height:100%}.layer{position:absolute;display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden}.layer img{width:100%;height:100%;object-fit:contain}.label{white-space:pre-wrap;line-height:1.05;max-width:100%}.device-caption{display:flex;justify-content:space-between;gap:10px;margin:16px 4px 0;font-size:9px;color:#879fb7}.device-caption>span:first-child{letter-spacing:1px;color:#c0d2e3}.tablet{background:#080e14 url('cuebrio-demo-c3b77f5316963c1a-chassis.jpg') center/100% 100%;border-radius:24px;border:1px solid #6d777b;padding:22px 23px 14px;box-shadow:inset 0 0 0 5px #050809,0 14px 28px #0007}.touch-head{display:flex;align-items:center;justify-content:space-between;background:linear-gradient(#233039,#0d1820);border:1px solid #4b5b67;box-shadow:inset 0 2px 7px #0008;border-radius:8px;padding:12px 14px;gap:10px}.touch-head img{width:135px}.touch-head>div{text-align:right}.touch-head small{font-size:8px;color:#b999a7;letter-spacing:1px;display:block;margin-bottom:5px}.touch-head strong{font-size:13px}.touch-body{padding:13px 0 9px}.touch-section-title{display:flex;justify-content:space-between;font-size:9px;font-weight:bold;letter-spacing:1px;color:#a6b7c5}.segment-title{font-size:16px;font-weight:bold;margin:9px 0 12px}.touch-key-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}.touch-key-grid .touchkey{font-size:11px!important;min-height:48px!important;padding:8px!important;border-top-color:#d2ba8e!important}.topics{margin-top:13px;padding:12px;background:#20202e;border:1px solid #706885;border-radius:7px}.topics>.eyebrow{font-size:8px;color:#cebedf}.topic-live,.cue-line{font-size:11px;color:#b6c8d6;margin:7px 0}.topic-live strong{color:#fff}.cue-line strong{color:#b0e6d3}.topic-nav{display:flex;gap:7px;margin-top:10px}.topic-nav button,.touch-nav button{flex:1;border:1px solid #526778;border-radius:5px;background:linear-gradient(#2a3c4a,#182631);padding:8px;font-weight:600;font-size:10px}.take{display:flex;justify-content:space-between;gap:10px;background:linear-gradient(#2a6557,#183e34);border:1px solid #99d7b8;border-top:3px solid #b8f5d0;border-radius:6px;padding:12px;margin-top:9px;width:100%;font-size:11px;font-weight:bold;box-shadow:0 3px 3px #0006}.take span{font-size:10px;color:#cff1e3;font-weight:normal}.touch-nav{display:flex;gap:5px;touch-action:pan-y}.touch-nav button{font-size:9px;padding:10px 3px}.touch-nav button[aria-current=page]{background:linear-gradient(#39615a,#1d3e3a);border-color:#9ed3c1}.touch-foot{text-align:center;font-size:8px;color:#8eaaa9;margin-top:9px}.pairing{padding:28px 4px 20px;max-width:820px}.pairing h2{font-size:21px;margin:0 0 10px}.pairing>p{font-size:13px;color:#b3c4d5;line-height:1.6;margin:0}footer{border-top:1px solid #2a3b4e;padding-top:17px;display:flex;justify-content:space-between;gap:20px;font-size:10px;color:#7e98b1}footer p{margin:0;max-width:720px;line-height:1.6}#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#24384c;color:white;border:1px solid #8da8c1;box-shadow:0 8px 30px #0009;padding:14px 20px;border-radius:8px;max-width:90vw;z-index:10;font-size:13px}.director{min-height:420px;background:#09111d;border:1px solid #53677d;border-radius:12px;box-shadow:0 10px 28px #0006;overflow:hidden}.director-head{padding:17px 15px;display:flex;align-items:center;justify-content:space-between;background:#101c2b}.director-head img{width:166px}.director-head span{font-size:8px;color:#859eb7}.director-nav{display:flex;padding:0 10px 10px;gap:5px;background:#101c2b}.director-nav button{background:#1b2c40;border:1px solid #5b708b;border-bottom:3px solid #a995c9;border-radius:4px;padding:9px;font-size:10px}.director-nav button[aria-current=page]{background:#304967;border-bottom-color:#a8d5ff}#director-content{padding:15px}.director-status{padding:12px;border:1px solid #405c74;border-radius:5px;color:#bbd1e3;font-size:11px;margin-bottom:12px}.director-card{border:1px solid #3e566c;border-radius:5px;padding:15px;background:#142333}.director-card h3{font-size:15px;margin:0 0 12px}.director-card p{font-size:12px;color:#afc5d9;line-height:1.5}.director-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.director-actions button{background:#20394e;border:1px solid #718ca5;border-radius:5px;padding:12px;font-size:11px}.director-footer{padding:12px 15px;color:#95afc5;font-size:10px;line-height:1.6;border-top:1px solid #34485c}dialog{background:#142535;border:1px solid #8cb6c6;color:white;border-radius:12px;padding:24px;max-width:90vw}dialog::backdrop{background:#000a}dialog h2{font-size:21px}dialog p{font-size:13px;color:#afc7db;max-width:400px}.chooser-options{display:flex;gap:8px;margin:20px 0}.chooser-options button{padding:12px;background:#26465e;border:1px solid #84a8c4;border-radius:5px}
@media(min-width:1450px){.deck-grid{gap:13px}.deck{padding:25px 24px 30px}.tablet{padding:23px 28px 16px}.touch-key-grid .touchkey{min-height:54px!important}.preview{height:192px}}
@media(max-width:1000px){header,main{padding-left:24px;padding-right:24px}.intro-note{display:none}.controllers{gap:20px;grid-template-columns:1fr 1fr}.deck-grid{gap:7px}.deck{padding:17px 13px 22px}.deck-top{margin-bottom:16px}.deck-top span{display:none}.role-heading>p{font-size:10px}.tablet{padding:17px 15px 12px}.touch-head img{width:112px}.device-caption{line-height:1.5}.explanation{padding:20px}.benefit{grid-template-columns:1fr;gap:4px}}
@media(max-width:760px){header{padding:18px}.identity img{width:156px}.header-note{display:none}.quiet{margin-left:auto;font-size:11px;padding:9px}main{padding:24px 16px}.intro h1{font-size:34px}.lede{font-size:13px}.stories{gap:7px;margin-top:22px}.stories button{padding:12px 9px;display:flex;flex-direction:column;gap:6px}.stories button>span{font-size:10px}.stories strong{font-size:11px;line-height:1.4}.stories small{font-size:9px;margin:0}.monitor{grid-template-columns:1fr}.preview-wrap{border-right:0;border-bottom:1px solid var(--border)}.preview{height:150px}.preview>img{height:125px}.explanation h2{font-size:21px}.controllers{grid-template-columns:1fr;gap:28px}.deck{padding:22px 17px 24px}.deck-grid{gap:9px}.role-heading>p{font-size:11px}.tablet{padding:22px 22px 16px}.touch-head img{width:150px}.touch-key-grid .touchkey{min-height:56px!important;font-size:12px!important}.take{padding:15px;font-size:12px}.touch-nav button{min-height:44px;font-size:10px}.topic-nav button{min-height:40px}.device-caption{font-size:9px}footer{display:block}footer>span{display:block;margin-top:12px}.program-line{padding:12px}.explanation{padding:20px}.role-heading h2{font-size:25px}.pairing{padding-top:28px}.preview .sim{font-size:8px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
.mobile-result{display:none}@media(max-width:760px){.mobile-result{position:fixed;bottom:10px;left:12px;right:12px;z-index:5;display:block;text-align:left;padding:12px 15px;border:1px solid #8baec7;background:#172d40f5;box-shadow:0 5px 25px #000b;border-radius:8px;font-size:11px;color:#e0f1ff}.mobile-result span{display:block;color:#8fd8ba;font-size:9px;margin-top:4px}footer{padding-bottom:75px}}
@media(max-width:760px){.deck{overflow-x:auto;scrollbar-color:#66839b #111e28;scrollbar-width:thin}.deck-grid{min-width:490px}.deck-top{min-width:490px}.devicekey{min-height:50px}.device-caption{flex-wrap:wrap}#toast{bottom:86px}.touch-foot{visibility:hidden}}
.stories{display:grid;grid-template-columns:repeat(3,1fr)}.stories button{flex:none}.stories strong{font-size:13px}.connection-path{display:flex;gap:8px;justify-content:space-between;align-items:center;padding:12px;background:#20384b;border:1px solid #577488;border-radius:6px;font-size:8px;letter-spacing:.5px}.connection-path b{color:#8ee3c5;font-size:16px}.demo-boundary{font-size:9px!important;color:#9bb2c7!important;line-height:1.5!important;margin:10px 0!important}.prepared-row{display:flex;flex-direction:column;gap:7px;padding:12px;background:#091c2c;margin:12px 0;border-left:3px solid #9ecdbb}.prepared-row span{font-size:9px;letter-spacing:2px;color:#9ac1d6}.prepared-row strong{font-size:17px}.prepared-row small{font-size:11px;color:#aabfd1}.handoff-status{color:#9de0c3!important}.profile-recall{display:flex;align-items:center;gap:10px;margin:12px 0}.profile-recall button{background:#253747;border:1px solid #718ca5;border-radius:5px;padding:10px;font-size:10px}.profile-recall span{font-size:9px;color:#aec3d5}.director-actions button.ready{background:#275445;border-color:#9ce3c1}.voices{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin:15px 0}.voice{padding:9px 6px;background:linear-gradient(#203847,#11212e);border:1px solid #476070;border-radius:6px;text-align:left}.voice>span{font-size:11px;font-weight:bold}.voice i{display:block;height:5px;background:#06101a;margin:10px 0 7px}.voice i b{display:block;height:100%;background:#71d0a1}.voice small{font-size:7px;color:#8daabd}.voice.speaking{border-color:#ff8fa0;box-shadow:inset 0 -3px #f45171}.voice.speaking small{color:#ffb2bd}.demo-controls{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px 0}.demo-controls button,.wide-control,.prepared-media button{background:linear-gradient(#28414e,#172b36);border:1px solid #809cae;border-top:2px solid #a1d9c4;padding:11px 8px;border-radius:6px;font-size:11px;font-weight:bold}.wide-control{width:100%}.status-caption{font-size:11px;line-height:1.6;color:#b9d2e1}.track-card{display:flex;align-items:center;gap:18px;margin:22px 0}.track-card>span{font-size:42px;color:#aed7d1}.track-card strong{display:block;font-size:21px}.track-card small{display:block;margin-top:7px;color:#a3bacd;font-size:11px}.music-meter{height:28px;background:#07111c;border:1px solid #527183;border-radius:5px;overflow:hidden;margin:24px 0 8px}.music-meter>div{height:100%;background:linear-gradient(90deg,#509887,#9be3b8);transition:width .45s}.meter-label{display:flex;justify-content:space-between;font-size:9px;color:#9bd5bc;letter-spacing:.7px;margin-bottom:20px}.duck-flow{display:flex;gap:8px;align-items:center;justify-content:center;font-size:8px;color:#aac4d7;margin:20px 0}.duck-flow b{color:#8de2bc;font-size:16px}.chat-heading{font-size:12px;font-weight:bold;display:flex;align-items:center;gap:10px}.chat-heading small{margin-left:auto;font-size:8px;color:#89a4bc}.youtube-mark{background:#bc2d42;color:white;border-radius:5px;padding:4px 8px}.chat-message{border:1px solid #40596f;background:#142737;border-radius:7px;margin:12px 0;padding:12px}.chat-message>strong{font-size:11px;color:#a6d7e2}.chat-message p{font-size:12px;line-height:1.5;margin:8px 0}.chat-message button{background:#28445a;border:1px solid #789ab5;border-radius:4px;padding:8px;font-size:10px;margin-right:7px}.iso-feeds{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:17px 0}.iso-feeds button{background:#162939;border:1px solid #537288;padding:10px 6px;border-radius:6px}.iso-feeds span,.iso-feeds small,.iso-feeds b{display:block}.iso-feeds span{font-size:11px;font-weight:bold}.iso-feeds small{margin:8px 0;font-size:8px;color:#8eb0c1}.iso-feeds .rec{color:#ff8c9e}.iso-feeds b{font-size:8px;color:#a9bac9}.iso-feeds [aria-pressed=true]{border-color:#98ddbf}.iso-feeds [aria-pressed=true] b{color:#a1eac8}.prepared-media{margin-top:14px;border-top:1px solid #4b5b70;padding-top:13px}.prepared-media>div{display:flex;gap:7px;margin:10px 0}.prepared-media button{flex:1;font-size:9px}.prepared-media small{color:#9bb0c2;font-size:9px}#media-frame{position:absolute;inset:0;background:radial-gradient(ellipse at 30% 40%,#204c62,#0a1828 70%);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:11px}#media-frame img{width:150px;height:27px;margin-bottom:8px}#media-frame span{font-size:9px;letter-spacing:3px;color:#9ad4c4}#media-frame strong{font-size:23px}#media-frame small{font-size:7px;color:#8da8bf;letter-spacing:2px}.monitor .preview{height:190px}.intro h1{font-size:43px}@media(max-width:760px){.stories{grid-template-columns:repeat(2,1fr)}.intro h1{font-size:33px}.voices{gap:6px}.voice small{font-size:7px}.connection-path{font-size:7px}.prepared-media button{min-height:40px}.demo-controls button{min-height:44px}.monitor .preview{height:170px}.touch-nav{display:none}.touch-foot{display:none}.profile-recall{align-items:start}.profile-recall button{min-width:110px}}@media(prefers-reduced-motion:reduce){.music-meter>div{transition:none}}

/* Layout browsing and prepared rundown reuse the existing control surfaces. */
.page-browser{margin:0 0 16px;padding:16px;border:1px solid #385166;border-radius:12px;background:#111e2c}.page-browser label{display:block;font-weight:700;margin-bottom:8px}.page-browser select{width:100%;min-height:44px;padding:8px;background:#20394b;color:#fff;border:1px solid #7899ae;border-radius:6px;font:inherit}.page-browser p{line-height:1.5;color:#b9ccda;margin:12px 0 0}
.demo-rundown{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:16px 0}.demo-rundown section{min-width:0;padding:12px;border:1px solid #385166;border-radius:8px;background:#0b1c2b}.demo-rundown h4{margin:0 0 12px;font-size:15px}.demo-rundown h4 small{display:block;color:#abc5d5;margin-top:6px;font-size:11px;font-weight:400}.rundown-item{display:flex;width:100%;align-items:center;justify-content:space-between;gap:8px;text-align:left;margin:6px 0;padding:10px;border:1px solid #385166;border-radius:6px;background:#172b3c;color:#edf5ff;min-height:54px}.rundown-item span{min-width:0}.rundown-item small{display:block;color:#adc5d5;margin-top:5px;font-size:11px}.rundown-item b{font-size:10px;color:#a7cddd;flex-shrink:0}.rundown-item.is-live{border-color:#ff3455}.rundown-item.is-live b{color:#ff8198}.rundown-item.is-cued{border-color:#78e5bc}.rundown-item.is-cued b{color:#78e5bc}.rundown-transport{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.rundown-transport button{min-height:44px;padding:8px;border:1px solid #7899ae;border-radius:6px;background:#20394b;color:#fff}.rundown-transport .take{grid-column:1/-1;background:#225b4e;font-weight:700}.demo-rundown button:hover{background:#284256}@media(max-width:550px){.demo-rundown{grid-template-columns:1fr}.rundown-transport{grid-template-columns:repeat(2,1fr)}}

/* Keep the remote role readable alongside its short workflow description. */
.role-heading{flex-wrap:wrap}.role-heading>div{min-width:0}.role-heading h2{overflow-wrap:anywhere}
