:root{font-family:Inter,ui-sans-serif,system-ui,sans-serif;color:#222a29;background:#f6f7f3;--green:#274e43}*{box-sizing:border-box}body{margin:0}button,a,input{touch-action:manipulation}button{font:inherit;cursor:pointer;border:1px solid #d4dcd5;background:white;border-radius:9px;padding:11px 16px;color:inherit}button:hover{background:#eaf0e9}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #bd853d;outline-offset:3px}header{height:86px;border-bottom:1px solid #dde2d9;display:flex;align-items:center;gap:24px;padding:0 5%}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--green);font-size:29px;letter-spacing:-1px}.brand span{font-size:13px;letter-spacing:0;color:#6b756e;border-left:1px solid #ccc;padding-left:18px;margin-left:14px}header>.badge{margin-left:auto}.badge{font-size:10px;letter-spacing:1.3px;background:#e4ebe1;padding:8px 11px;border-radius:20px;white-space:nowrap}main{max-width:1520px;margin:auto;padding:48px 5%}.welcome{display:grid;grid-template-columns:1fr 1fr;gap:9%;align-items:center}.eyebrow{font-size:11px;font-weight:700;letter-spacing:2px;color:#617663}h1{font-size:clamp(38px,4.2vw,64px);line-height:1.08;font-weight:500;letter-spacing:-2.5px;margin:20px 0}h1 em{font-family:Georgia,serif;color:var(--green);font-weight:normal}.intro{max-width:460px;font-size:18px;line-height:1.6;color:#6b746e}h2{font-size:19px;margin:0 0 13px}p{line-height:1.5}.login{max-width:440px;margin-top:30px}.login>p,.login small{font-size:12px;color:#69736e}.provider{width:100%;display:flex;align-items:center;margin:9px 0;justify-content:space-between;text-align:left}.provider small{font-size:10px}.primary{background:var(--green);color:white;border-color:var(--green)}.primary:hover{background:#386454}.login>.primary{width:100%;margin:10px 0}.hero{border:1px solid #d8ded5;background:white;padding:18px;border-radius:15px;box-shadow:0 28px 70px #213e3612}.minihead,.stagehead{display:flex;justify-content:space-between;align-items:center;font-size:12px;margin-bottom:15px}.minihead span:last-child{font-size:10px;color:#547559}.poster{aspect-ratio:1.25;background:#ecedde;position:relative;overflow:hidden;padding:25px}.poster>p{font-family:Georgia,serif;font-size:clamp(28px,3vw,45px);line-height:1.2;position:relative;z-index:1;margin:10px}.figure{position:absolute;right:-8%;bottom:0;height:66%;width:65%;fill:#111}.orbits{font-size:70px;color:#9bac8c;margin-top:45px;white-space:nowrap}.caption{font-size:12px;color:#768170}.studiohead{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.studiohead h1{font-size:38px;letter-spacing:-1.5px}.studiohead p{color:#6b756e;font-size:13px}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:28px}canvas{width:100%;aspect-ratio:16/9;border-radius:12px;display:block;background:white;box-shadow:0 10px 30px #273e3310}.transport{display:flex;align-items:center;gap:12px;margin-top:18px;font-size:12px}.spacer{flex:1}.hint{font-size:12px;color:#657168;max-width:720px}aside{background:white;border:1px solid #dde3d9;border-radius:13px;padding:24px}aside h2{font-size:17px}.step{display:flex;gap:12px;margin:23px 0}.step>span{flex-shrink:0;background:#eaf0e6;width:25px;height:25px;border-radius:50%;text-align:center;line-height:25px;font-size:12px}.step h3{font-size:13px;margin:2px 0}.step p{font-size:12px;color:#6b756e}.step button{font-size:12px;padding:9px;margin:3px 0}label{font-size:12px}.row{display:flex;justify-content:space-between;align-items:center;margin:20px 0 10px}input[type=range]{width:100%;accent-color:var(--green);margin-bottom:20px}input[type=checkbox]{accent-color:var(--green);width:18px;height:18px}.positions{display:flex;gap:8px;margin-top:10px}.positions button{flex:1}.selected{background:#e3eddc;border-color:#527654}.danger{width:100%;margin-top:22px;color:#923e32;border-color:#edd8d1}.tiny{font-size:10px!important;color:#727c74}hr{border:0;border-top:1px solid #e4e8df}dialog{border:1px solid #d8dfd3;border-radius:16px;max-width:590px;padding:32px;line-height:1.6}dialog::backdrop{background:#14291c66}.close{float:right;padding:3px 10px}dialog p,dialog li{font-size:14px} [hidden]{display:none!important}@media(max-width:900px){.welcome{grid-template-columns:1fr;gap:35px}.hero{max-width:600px}.workspace{grid-template-columns:1fr}.brand span{display:none}header{gap:10px;padding:0 4%;height:75px}.brand{font-size:23px}header>.badge{display:none}header>button{margin-left:auto;font-size:12px}.studiohead{gap:10px}.studiohead h1{font-size:30px}.transport{flex-wrap:wrap}main{padding-top:28px}}
/* WCAG 2.2 AA-oriented interface: readable text, visible focus and generous targets. */
:root{font-size:100%}body{line-height:1.5}p,li,button,label,summary{overflow-wrap:anywhere}button,input,summary,a{scroll-margin-block:1.5rem}button{min-height:44px;min-width:44px;border-color:#718174}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible,[tabindex="-1"]:focus-visible{outline:3px solid #174e9c;outline-offset:3px}header{height:auto;min-height:86px;flex-wrap:wrap;padding-block:16px}header nav{display:flex;flex-wrap:wrap;gap:8px}main{min-width:0}.welcome>*,.workspace>*,.step>div{min-width:0}.brand span,.intro,.login>p,.login small,.caption,.studiohead p,.hint,.step p,.tiny{color:#48584e}.badge,.eyebrow{font-size:.8125rem}.login>p,.login small,.provider small,.caption,.studiohead p,.hint,.step p,.step button,label,.tiny{font-size:.9375rem!important}.step h3{font-size:1rem}.primary{color:#fff}h1{line-height:1.15}aside h2{font-size:1.125rem}.stagehead h2{font-size:1.125rem;margin:0}.stagehead{flex-wrap:wrap;gap:8px}.badge{white-space:normal}.row{min-height:44px;gap:12px}.row input{flex:0 0 auto}input[type=checkbox],input[type=radio]{width:24px;height:24px;accent-color:var(--green)}input[type=range]{min-height:44px;margin-bottom:0}.positions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.positions label{display:flex;align-items:center;gap:8px;min-height:48px;padding:8px;border:1px solid #718174;border-radius:8px;cursor:pointer}.positions label:has(input:checked){background:#e3eddc;border:2px solid #274e43;padding:7px}.positions input{margin:0;flex:0 0 auto}.positions span{font-size:.875rem}fieldset{border:0;padding:0;margin:20px 0}legend{font-weight:600}summary{cursor:pointer;min-height:44px;padding:9px 0;font-weight:600}details{margin-block:8px}details[open]{padding-bottom:8px}details p{margin-top:8px}.step button{margin:4px 0;width:100%}.step{gap:10px}aside{padding:20px}.workspace{grid-template-columns:minmax(0,1fr) 340px}.workflow{display:flex;gap:32px;flex-wrap:wrap;margin-block:24px;padding-left:24px;color:#354e3f}.workflow li{padding-right:10px}.notice{padding:14px 18px;border-left:4px solid #715125;background:#f4ebd9;color:#493b27;font-size:1rem}.error-panel{background:#fff1ed;border:2px solid #914034;border-radius:8px;padding:12px;margin-block:12px;color:#702e24}.error-panel button{background:white;color:#702e24}.error-panel p{color:#702e24}.error-panel #cameraTechnical{font-family:ui-monospace,monospace;font-size:.8125rem!important;word-break:break-word}.accessibility-note{margin-top:40px;padding-top:24px;border-top:1px solid #718174;max-width:900px}.accessibility-note h2{font-size:1.125rem}.accessibility-note p{font-size:1rem;color:#48584e}.skip-link{position:absolute;top:-100px;left:16px;background:white;color:#174e9c;padding:12px;z-index:1000;border:2px solid currentColor}.skip-link:focus{top:12px}.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important}dialog{width:min(620px,calc(100vw - 24px));max-width:calc(100vw - 24px);max-height:calc(100dvh - 32px);overflow:auto;padding:24px}dialog p,dialog li{font-size:1rem}dialog h3{font-size:1.0625rem}dialog .close{min-height:44px;min-width:44px}dialog a{color:#174e9c;text-decoration:underline;text-underline-offset:.2em}dialog li{margin-block:10px}dialog button{max-width:100%}#reset{margin-top:20px;width:100%}#cameraDetails{font-weight:600}#cameraDetails,#sourceDetails{margin-block:8px}#info h2{margin-right:55px}#slideText h3{margin-bottom:8px}.transport{flex-wrap:wrap}.provider{gap:10px}.brand{flex-wrap:wrap}.brand span{margin-left:0}.hero .poster p{overflow-wrap:normal}#sourceDetails{font-weight:600}
@media(max-width:1100px){.workspace{grid-template-columns:1fr}.welcome{gap:5%}}@media(max-width:650px){main{padding-inline:16px}.welcome{grid-template-columns:1fr}.brand span{display:none}.brand{font-size:24px}header{gap:12px;padding-inline:16px}header nav{width:100%;margin-left:0}header>.badge{display:none}header nav button{flex:1;font-size:.875rem}h1{font-size:2.5rem;letter-spacing:-1.5px}.studiohead{align-items:flex-start;flex-wrap:wrap}.studiohead h1{font-size:2rem}.workflow{display:block;padding-left:24px}.workflow li{margin-block:8px}.transport .spacer{display:none}.transport #present{width:100%}.poster{padding:12px}.poster>p{font-size:1.75rem}.orbits{font-size:50px}.login{max-width:none}.hero{max-width:100%}.positions{grid-template-columns:1fr 1fr}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
@media(forced-colors:active){button,.positions label,.notice,.error-panel{border:2px solid ButtonText}.positions label:has(input:checked){outline:2px solid Highlight}.primary{forced-color-adjust:auto}canvas{border:1px solid CanvasText}}

.style-options{display:grid;gap:8px}.style-options label{display:flex;align-items:center;gap:10px;min-height:48px;border:1px solid #718174;border-radius:8px;padding:9px;cursor:pointer}.style-options input{margin:0;flex:0 0 auto}.style-options label:has(input:checked){border:2px solid #274e43;padding:8px;background:#e3eddc}@media(forced-colors:active){.style-options label{border:2px solid ButtonText}.style-options label:has(input:checked){outline:2px solid Highlight}}
@media(min-width:1101px) and (min-height:800px){.workspace>div:first-child{position:sticky;top:16px;align-self:start}}
/* Presenlo corporate identity. Coral is an accent; indigo carries controls and text. */
@font-face{font-family:Manrope;src:url('fonts/Manrope-Regular.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}@font-face{font-family:Manrope;src:url('fonts/Manrope-SemiBold.ttf') format('truetype');font-style:normal;font-weight:600;font-display:swap}@font-face{font-family:Manrope;src:url('fonts/Manrope-ExtraBold.ttf') format('truetype');font-style:normal;font-weight:800;font-display:swap}
:root{--indigo:#343469;--coral:#D97763;--ivory:#FAF7F2;--charcoal:#292D38;--lavender:#EEEDF7;--green:var(--indigo);font-family:Manrope,ui-sans-serif,system-ui,sans-serif;color:var(--charcoal);background:var(--ivory)}
.brand{display:inline-flex;flex:0 0 auto;max-width:100%;letter-spacing:normal}.brand img{display:block;width:250px;max-width:100%;height:auto}.brand:focus-visible{border-radius:5px}header{border-bottom-color:#d5d3e0}button{border-color:#78768e;color:var(--charcoal);font-weight:600}button:hover{background:var(--lavender)}.primary{color:#fff;background:var(--indigo);border-color:var(--indigo)}.primary:hover{background:#24244e}.badge{background:var(--lavender);color:var(--indigo);font-weight:600}.eyebrow{color:var(--indigo);font-weight:800}.welcome h1 em{font-family:Manrope,ui-sans-serif,system-ui,sans-serif;color:var(--indigo);font-style:normal;font-weight:800}.intro,.brand span,.login>p,.login small,.caption,.studiohead p,.hint,.step p,.tiny,.accessibility-note p{color:#525166}.hero{border-color:#d5d3e0;box-shadow:0 28px 70px #34346912}.poster{background:var(--lavender)}.poster>p{font-family:Manrope,ui-sans-serif,system-ui,sans-serif;color:var(--indigo);font-weight:800}.orbits{color:var(--coral)}.minihead span:last-child{color:var(--indigo)}canvas{box-shadow:0 10px 30px #34346910}aside{border-color:#d5d3e0}.step>span{background:var(--lavender);color:var(--indigo)}.positions label,.style-options label{border-color:#78768e}.positions label:has(input:checked),.style-options label:has(input:checked){background:var(--lavender);border-color:var(--indigo)}.workflow{color:var(--indigo)}.notice{border-left-color:var(--coral);background:var(--lavender);color:var(--charcoal)}hr{border-top-color:#d5d3e0}.accessibility-note{border-top-color:#78768e}.skip-link,dialog a{color:var(--indigo)}dialog{border-color:#d5d3e0;background:var(--ivory);color:var(--charcoal)}dialog::backdrop{background:#292d3866}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible,[tabindex="-1"]:focus-visible{outline-color:var(--indigo)}input[type=checkbox],input[type=radio],input[type=range]{accent-color:var(--indigo)}.danger{color:#923e32;border-color:#923e32}
@media(max-width:650px){.brand img{width:220px}header nav{width:100%}}
@media(forced-colors:active){.brand{background:Canvas}.positions label:has(input:checked),.style-options label:has(input:checked){outline-color:Highlight}}
.appearance-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.appearance-options label{position:relative;display:grid;place-items:center;min-height:140px;padding:8px;border:1px solid #78768e;border-radius:10px;cursor:pointer;background:#FAF7F2}.appearance-options label:has(input:checked){border:2px solid #343469;padding:7px;background:#EEEDF7}.appearance-options label:has(input:focus-visible){outline:3px solid #343469;outline-offset:3px}.appearance-options canvas{width:100%;max-width:140px;aspect-ratio:185/183;background:transparent;box-shadow:none;border-radius:0}.appearance-check{position:absolute;right:6px;top:4px;display:none;color:#343469;font-size:20px;font-weight:800}.appearance-options label:has(input:checked) .appearance-check{display:block}@media(forced-colors:active){.appearance-options label{border:2px solid ButtonText}.appearance-options label:has(input:checked){outline:2px solid Highlight}.appearance-options label:has(input:focus-visible){outline:3px solid Highlight}.appearance-check{color:CanvasText}}
/* Preview first; guided setup below it. */
.workspace{display:flex;flex-direction:column;gap:32px}.workspace>div:first-child{position:static;top:auto;align-self:stretch}.preview-panel{width:100%;min-width:0}.preview-panel #output{width:min(100%,calc(44vh * 16 / 9));height:auto;max-height:none;margin-inline:auto}.preview-panel .transport{justify-content:center}.preview-panel .stagehead,.preview-panel .hint,.preview-panel>details{max-width:1000px;margin-inline:auto}.setup-flow{background:#fff;border:1px solid #d5d3e0;border-radius:14px;padding:28px;min-width:0}.flow-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}.flow-heading h2{margin:0}.flow-heading a{color:#343469;min-height:44px;display:inline-flex;align-items:center;text-underline-offset:.2em}.flow-steps{list-style:none;margin:20px 0 28px;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.flow-steps button{width:100%;display:flex;gap:10px;align-items:center;justify-content:center;background:#FAF7F2;min-height:52px}.flow-steps button span{display:inline-grid;place-items:center;min-width:28px;height:28px;border-radius:50%;background:#EEEDF7}.flow-steps button[aria-current=step]{border:2px solid #343469;background:#EEEDF7;font-weight:800}.flow-steps button[aria-current=step] span{background:#343469;color:#fff}.flow-panel{min-width:0}.flow-panel h3{font-size:1.4rem;color:#343469;margin-top:0}.flow-panel>.step{margin:0}.flow-panel>.step>div{width:100%}.flow-panel button{margin-right:8px;margin-block:6px}.flow-panel .tiny{max-width:75ch}.flow-panel #cameraError{max-width:700px}.flow-panel fieldset{margin-top:16px}.customize-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px}.customize-grid>div{min-width:0}.appearance-options{max-width:410px}.style-options{max-width:480px}.customize-grid #reset{max-width:350px}.flow-footer{border-top:1px solid #d5d3e0;padding-top:20px;margin-top:28px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}.flow-footer p{margin:0 auto;color:#525166}.flow-footer .primary{margin-left:auto}.studio-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.studio-actions .danger{width:auto;margin:0}.setup-review{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.setup-review>div{padding:16px;background:#FAF7F2;border:1px solid #d5d3e0;border-radius:10px}.setup-review dt{font-weight:800;color:#343469}.setup-review dd{margin:8px 0 0}.launch-instructions li{margin-bottom:12px}.flow-panel .row{max-width:480px}.flow-panel input[type=range]{max-width:480px}.flow-panel .positions{max-width:480px}
@media(max-width:700px){.setup-flow{padding:18px}.flow-steps{grid-template-columns:1fr 1fr;gap:8px}.flow-steps button{font-size:.875rem;justify-content:flex-start}.customize-grid{grid-template-columns:1fr;gap:16px}.setup-review{grid-template-columns:1fr}.flow-footer{gap:10px}.flow-footer .primary{width:100%;margin-left:0}.studio-actions button{font-size:.875rem}.preview-panel #output{width:100%}}
@media(forced-colors:active){.flow-steps button[aria-current=step]{outline:2px solid Highlight}.flow-steps button span{border:1px solid ButtonText}}
/* Persistent selections reflect actual state, not the last clicked command. */
.selection-control{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-width:180px}.selection-control[aria-pressed=true]{background:#EEEDF7;border:2px solid #343469;color:#343469;box-shadow:inset 0 0 0 1px #343469;font-weight:800}.selection-control[aria-pressed=true]::after{content:'✓';font-size:1.15em;line-height:1}.style-options .option-check,.positions .option-check{margin-left:auto;color:#343469;font-size:20px;font-weight:800;visibility:hidden;flex:0 0 auto}.style-options label:has(input:checked) .option-check,.positions label:has(input:checked) .option-check{visibility:visible}.row:has(input[type=checkbox]){padding:10px 12px;border:1px solid #78768e;border-radius:8px;min-height:52px}.row:has(input[type=checkbox]:checked){background:#EEEDF7;border:2px solid #343469;padding:9px 11px;font-weight:600}.audience-state{padding:12px 16px;border:1px solid #78768e;border-radius:8px;color:#525166;background:#FAF7F2}.audience-state.is-open{border:2px solid #343469;color:#343469;background:#EEEDF7;font-weight:600}.flow-footer .window-open{box-shadow:0 0 0 3px #EEEDF7;outline:2px solid #343469;outline-offset:2px}@media(forced-colors:active){.selection-control[aria-pressed=true],.row:has(input:checked){border:2px solid Highlight}.option-check{color:CanvasText!important}}