body{min-height:100%;background:#070b14;color:#edf3fb}.shell{max-width:1500px;margin:0 auto;padding:24px}header{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:18px}h1{margin:0;font-size:30px}header p{margin:5px 0 0;color:#91a0b7}.status{padding:8px 12px;border-radius:999px;background:#171f30;color:#aab7ca;border:1px solid #27344b}.status.ok{background:#10281f;color:#8fe1ba;border-color:#27583f}.card{background:#101726;border:1px solid #202d43;border-radius:18px;padding:18px;box-shadow:0 18px 60px rgba(0,0,0,.22);min-width:0}.connect{display:grid;grid-template-columns:1fr 2fr auto;gap:12px;align-items:end;margin-bottom:18px}.workspace{display:grid;grid-template-columns:minmax(0,2fr) minmax(360px,1fr);gap:18px}.rightcol{display:flex;flex-direction:column;gap:18px;min-width:0}.preview #program{width:100%;border-radius:14px}.previewTop{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px}.previewTop strong{font-size:12px;letter-spacing:.08em}.previewTop span{display:block;color:#8292aa;font-size:12px;margin-top:2px}.hint{font-size:12px;color:#8090a8;margin-top:10px}.controls,.ticker,.chat,.giveaway{display:flex;flex-direction:column;gap:14px}.controls h2,.recording h2,.ticker h2,.chat h2,.giveaway h2{margin:0 0 2px}.controls label,.ticker label,.giveaway label,.connect label{display:flex;flex-direction:column;gap:6px;color:#b8c4d6;font-size:13px;min-width:0}.controls .check,.giveaway .check{flex-direction:row;align-items:center}.controls select,.controls input,.ticker select,.ticker input,.ticker textarea,.giveaway select,.giveaway textarea,.connect input,.chat input{background:#0a101c;border:1px solid #2b3952;color:#f5f8fc;border-radius:10px;padding:10px;max-width:100%;width:100%;min-width:0}.controls input[type=range]{padding:0}.controls input[type=color],.ticker input[type=color]{height:42px;padding:4px}.connect button,button{border:0;border-radius:10px;padding:11px 14px;background:#e8edf5;color:#0b1220;font-weight:700;cursor:pointer}.connect button:disabled,button:disabled{opacity:.45;cursor:not-allowed}.secondary{background:#233049;color:#eaf0f7}.danger{background:#492333;color:#ffdbe6}.actions{display:flex;gap:10px}.actions.wrap{flex-wrap:wrap}.positions>span{display:block;color:#b8c4d6;font-size:13px;margin-bottom:7px}.posgrid{display:grid;grid-template-columns:repeat(3,34px);gap:6px}.posgrid button{width:34px;height:28px;padding:0;background:#1d2a41;color:#c9d5e6}.posgrid button:hover{background:#34486b}.sectionHead{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.sectionHead p{margin:4px 0 0;color:#8494ab;font-size:12px}.timer{font-variant-numeric:tabular-nums;font-size:22px;font-weight:800;letter-spacing:.04em}.recordActions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:16px 0 10px}.recordBtn{background:#b91c1c;color:white}.stopBtn{background:#34202a;color:#ffd6df}.recordingMessage{font-size:12px;color:#8fa0b7;min-height:18px}.recordingPill{display:flex;align-items:center;gap:8px;border-radius:999px;padding:7px 10px;font-size:12px;font-weight:700;border:1px solid #2b3952;background:#151e2e;color:#aebbd0}.recordingPill .dot{width:8px;height:8px;border-radius:50%;background:#65758c}.recordingPill.live{background:#32151b;border-color:#6b2632;color:#ffd7dd}.recordingPill.live .dot{background:#ef4444;box-shadow:0 0 0 4px rgba(239,68,68,.14)}.recordingPill.stopping{background:#2f2615;border-color:#675229;color:#fde7ad}.recordingsHead{display:flex;align-items:center;justify-content:space-between;margin-top:18px;padding-top:16px;border-top:1px solid #202d43}.recordingsHead h3{margin:0;font-size:14px}.small{padding:7px 9px;font-size:12px}.recordingsList{display:flex;flex-direction:column;gap:8px;margin-top:10px;max-height:310px;overflow:auto}.empty{font-size:12px;color:#718198;padding:10px 0}.recordingRow{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px;border:1px solid #25334a;border-radius:11px;background:#0b111e}.recordingRow .name{font-size:12px;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.recordingRow .meta{font-size:11px;color:#7f90a8;margin-top:3px}.recordingRow .rowActions{display:flex;gap:6px}.recordingRow button{padding:7px 8px;font-size:11px}.recordingRow .download{background:#173b2d;color:#c8f6df}.recordingRow .delete{background:#43212d;color:#ffd6df}.badgeState{display:inline-block;margin-left:6px;padding:2px 6px;border-radius:999px;background:#233049;color:#bcd0e9;font-size:10px;text-transform:uppercase}.badgeState.complete{background:#173b2d;color:#aee9cd}.badgeState.failed{background:#43212d;color:#ffcad5}.sources h2{margin:0 0 2px}.sourceButtons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:16px 0 12px}.sourceOn{background:#155e45;color:#d8fff0}.deviceGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;min-width:0}.deviceGrid label{display:flex;flex-direction:column;gap:6px;color:#b8c4d6;font-size:12px;min-width:0;overflow:hidden}.deviceGrid select{display:block;width:100%;max-width:100%;min-width:0;background:#0a101c;border:1px solid #2b3952;color:#f5f8fc;border-radius:10px;padding:9px;text-overflow:ellipsis;overflow:hidden}.sourceMeta{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.sourceMeta span{font-size:11px;padding:5px 8px;border-radius:999px;background:#172033;color:#9fb0c7;border:1px solid #27344b}.onAirBadge{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:6px 9px;font-size:11px;font-weight:800;letter-spacing:.06em;border:1px solid #334155;white-space:nowrap}.onAirBadge.off{background:#151e2e;color:#8797ad}.onAirBadge.on{background:#4b1519;border-color:#8b252d;color:#ffd5d9;box-shadow:0 0 0 4px rgba(239,68,68,.08)}.effectsBox{margin-top:14px;padding:12px;border:1px solid #25334a;border-radius:12px;background:#0b111e}.subhead{font-size:13px;font-weight:800;margin-bottom:10px}.effectsGrid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) minmax(0,1fr);gap:10px}.effectsGrid label{display:flex;flex-direction:column;gap:6px;color:#b8c4d6;font-size:12px;min-width:0}.effectsGrid select,.effectsGrid input{width:100%;max-width:100%;min-width:0;background:#0a101c;border:1px solid #2b3952;color:#f5f8fc;border-radius:10px;padding:8px}.effectsGrid input[type=range]{padding:0}.fileLabel input{font-size:11px}.microcopy{font-size:11px;color:#7f90a8;margin-top:8px}.twoCol{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}.colourPair{display:grid;grid-template-columns:1fr 1fr;gap:8px}.miniBadge{padding:5px 8px;border-radius:999px;border:1px solid #334155;font-size:10px;font-weight:800;white-space:nowrap}.miniBadge.off{color:#91a0b7;background:#151e2e}.miniBadge.on{color:#baf7d4;background:#16382a;border-color:#286548}.chatList{height:280px;overflow:auto;display:flex;flex-direction:column;gap:8px;padding:4px}.chatMessage{border:1px solid #25334a;background:#0b111e;border-radius:11px;padding:9px}.chatMessage.host{border-color:#315774;background:#0e1b2a}.chatMessage .chatTop{display:flex;justify-content:space-between;gap:8px;align-items:center}.chatMessage .chatName{font-size:11px;font-weight:800;color:#cfe1f7}.chatMessage .chatTime{font-size:10px;color:#6f829c}.chatMessage .chatBody{font-size:12px;color:#e1e8f2;margin-top:4px;overflow-wrap:anywhere}.chatMessage .chatTools{margin-top:7px;display:flex;justify-content:flex-end}.chatMessage .chatTools button{font-size:10px;padding:5px 7px;background:#233049;color:#eaf0f7}.chatComposer{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}.chatComposer input{width:100%;min-width:0}.winnerResult{padding:14px;border-radius:12px;border:1px solid #2b3952;background:#0b111e;color:#dbe7f5;font-size:14px;font-weight:800;min-height:48px;display:flex;align-items:center}.winnerResult.hasWinner{border-color:#8a6b1f;color:#ffe680;background:#2c2410}.drawBtn{background:#7c3aed;color:#fff}.ticker textarea,.giveaway textarea{resize:vertical}.ticker .actions button{flex:1}
@media(max-width:1100px){.deviceGrid,.effectsGrid{grid-template-columns:1fr}.workspace{grid-template-columns:minmax(0,1.6fr) minmax(330px,1fr)}}
@media(max-width:900px){.connect,.workspace{grid-template-columns:1fr}.shell{padding:14px}.recordActions,.sourceButtons,.deviceGrid,.effectsGrid,.twoCol{grid-template-columns:1fr}.colourPair{grid-template-columns:1fr 1fr}}

/* v0.4.2 camera-effect usability fixes */
.virtualUpload{display:flex;flex-direction:column;gap:6px;min-width:0}.fieldLabel{color:#b8c4d6;font-size:12px}.hiddenFile{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important}.uploadButton{display:flex!important;align-items:center;justify-content:center;min-height:38px;padding:8px 10px!important;border:1px solid #2b3952;border-radius:10px;background:#172033;color:#eaf0f7!important;font-weight:700;cursor:pointer;text-align:center}.uploadButton:hover{background:#233049}.virtualFileRow{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:8px;align-items:center;min-width:0}.virtualFileRow img{width:42px;height:30px;object-fit:cover;border-radius:6px;border:1px solid #334155}.virtualFileRow span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#8fa0b7;font-size:11px}.effectsActions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:10px}.effectsActions button{min-width:170px}.effectsGrid>label,.effectsGrid>.virtualUpload{min-width:0}.effectsGrid select,.effectsGrid input[type=range]{max-width:100%;min-width:0}.deviceGrid select{box-sizing:border-box;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.effectsGrid{grid-template-columns:repeat(2,minmax(0,1fr))}.virtualUpload{grid-column:1/-1}
@media(max-width:1100px){.effectsGrid{grid-template-columns:1fr}.virtualUpload{grid-column:auto}}

.audioSafetyRow{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}.audioSafetyRow .miniBadge{white-space:nowrap}

/* v0.4.4 real broadcast lifecycle */
.liveActions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:16px 0 8px}.goLiveBtn{background:#b91c1c;color:#fff}.goLiveBtn:not(:disabled){box-shadow:0 0 0 3px rgba(239,68,68,.10)}.endLiveBtn{background:#34202a;color:#ffd6df}.liveActions button{min-height:44px}.onAirBadge.on::before{content:'●';margin-right:5px;color:#ef4444}@media(max-width:900px){.liveActions{grid-template-columns:1fr}}

/* v0.4.5 presenter identity + logo controls */
.connect{grid-template-columns:minmax(150px,.75fr) minmax(180px,1fr) minmax(260px,1.7fr) auto}
.branding{display:flex;flex-direction:column;gap:14px}.branding h2{margin:0 0 2px}.branding .check{display:flex;flex-direction:row;align-items:center;gap:8px;color:#b8c4d6;font-size:13px}.logoControls{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,.9fr) minmax(0,1fr);gap:10px;align-items:end}.logoControls>label{display:flex;flex-direction:column;gap:6px;color:#b8c4d6;font-size:12px;min-width:0}.logoControls select,.logoControls input[type=range]{width:100%;min-width:0;max-width:100%;background:#0a101c;border:1px solid #2b3952;color:#f5f8fc;border-radius:10px;padding:8px}.logoControls input[type=range]{padding:0}.branding .virtualFileRow img{width:54px;height:38px;object-fit:contain;background:#fff;border-radius:7px}.branding .actions button{flex:1}.connect input{overflow:hidden;text-overflow:ellipsis}
@media(max-width:1100px){.connect{grid-template-columns:1fr 1fr}.connect button{grid-column:1/-1}.logoControls{grid-template-columns:1fr}}
@media(max-width:700px){.connect{grid-template-columns:1fr}.connect button{grid-column:auto}}


/* v0.5.0 production shell: Meet-style stage + side control rail + bottom dock. */
body{background:#111318;color:#eef1f6}.shell{max-width:none;padding:14px 18px 92px}.shell>header{display:flex;align-items:center;justify-content:space-between;padding:4px 2px 12px}.shell>header h1{font-size:20px;margin:0}.shell>header p{margin:3px 0 0;color:#9aa4b4;font-size:12px}.workspace{grid-template-columns:minmax(0,1fr) 390px;gap:14px;align-items:start}.preview.card{position:sticky;top:14px;background:#090b0f;border-color:#252a33;min-height:calc(100vh - 126px)}.preview #program{min-height:calc(100vh - 220px);border-radius:18px;overflow:hidden}.rightcol{max-height:calc(100vh - 108px);overflow:auto;padding-right:4px}.card{background:#1b1e24;border:1px solid #2c313b;color:#edf1f7}.card p,.microcopy,.recordingMessage,.hint{color:#9da7b7}.connect.card{background:#171a20}.integrated .connect{display:none}.integrated .shell>header p{display:none}.meetDock{position:fixed;z-index:120;left:50%;bottom:16px;transform:translateX(-50%);display:flex;gap:10px;align-items:center;padding:9px 12px;border-radius:24px;background:rgba(24,27,33,.96);border:1px solid #343a46;box-shadow:0 14px 44px rgba(0,0,0,.45);backdrop-filter:blur(16px)}.meetDock button{min-width:64px;height:52px;border-radius:18px;border:1px solid #3b414e;background:#262a32;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:18px}.meetDock button span{font-size:10px;color:#c8cfda}.meetDock button:hover{background:#323743}.meetDock .dockLive{background:#b3261e;border-color:#d4473d}.meetDock .dockLive:hover{background:#cf352b}@media(max-width:1100px){.workspace{grid-template-columns:1fr}.preview.card{position:relative;top:auto;min-height:auto}.preview #program{min-height:56vw}.rightcol{max-height:none}.meetDock{max-width:calc(100% - 20px)}}

/* v0.6.0 — familiar Meet-style toolbar + hidden production drawer. */
.workspace{grid-template-columns:minmax(0,1fr)!important;gap:0!important}
.preview.card{position:relative!important;top:auto!important;min-height:calc(100vh - 126px)}
.preview #program{min-height:calc(100vh - 220px)}
.rightcol{position:fixed;z-index:210;top:0;right:0;bottom:0;width:min(430px,94vw);max-height:none!important;overflow:auto;padding:0 12px 28px;background:#15181e;border-left:1px solid #343a46;box-shadow:-18px 0 55px rgba(0,0,0,.42);transform:translateX(105%);transition:transform .18s ease}
.rightcol.open{transform:translateX(0)}
.drawerBackdrop{position:fixed;z-index:205;inset:0;background:rgba(0,0,0,.44);backdrop-filter:blur(2px)}
.studioDrawerHead{position:sticky;z-index:4;top:0;margin:0 -12px 12px;padding:12px 14px;display:flex;align-items:center;justify-content:space-between;background:rgba(21,24,30,.97);border-bottom:1px solid #343a46;backdrop-filter:blur(12px)}
.studioDrawerHead>div{display:flex;flex-direction:column;gap:2px}.studioDrawerHead strong{font-size:15px}.studioDrawerHead span{font-size:11px;color:#9da7b7}.studioDrawerHead button{width:36px;height:36px;border-radius:50%;padding:0;font-size:22px;background:#272b34;color:#fff}
.peopleList{display:flex;flex-direction:column;gap:8px;max-height:360px;overflow:auto}.personRow{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px;border:1px solid #2b3240;border-radius:12px;background:#11151c}.personName{font-weight:800;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.personMeta{font-size:10px;color:#8996a8;margin-top:3px}.personActions{display:flex;gap:6px;align-items:center}.personActions button{padding:7px 9px;font-size:11px}.personActions .inviteStage{background:#1f6f53;color:#e7fff4}.personActions .removeStage{background:#5a2530;color:#ffe4e9}.personBadge{font-size:9px;border-radius:999px;padding:4px 6px;border:1px solid #3a4557;color:#aeb9c9;white-space:nowrap}.personBadge.stage{background:#173b2d;border-color:#286548;color:#baf7d4}.personBadge.invited{background:#3c3218;border-color:#735f27;color:#ffe49a}
.meetDock{bottom:12px;gap:7px;padding:8px 10px;border-radius:22px;max-width:calc(100vw - 20px);overflow-x:auto;overflow-y:hidden;scrollbar-width:thin}
.meetDock>button,.dockSplit>button:first-child{min-width:62px;height:52px;border-radius:17px;border:1px solid #3b414e;background:#262a32;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:18px;padding:5px 8px;flex:0 0 auto}
.meetDock button span:not(.dockIcon){font-size:10px;color:#c8cfda}.dockIcon{font-size:18px;line-height:1}.dockSplit{position:relative;display:flex;align-items:stretch;flex:0 0 auto}.dockSplit>button:first-child{padding-right:16px}.dockSplit .dockCaret{position:absolute;right:2px;top:3px;width:18px;height:46px;min-width:0;border:0;border-left:1px solid #414754;border-radius:0 14px 14px 0;background:transparent;color:#bcc5d2;padding:0;font-size:12px;display:block}
.meetDock button.isOn,.dockSplit>button:first-child.isOn{background:#164b3b;border-color:#2d8065}.meetDock button.isOff,.dockSplit>button:first-child.isOff{background:#5a252b;border-color:#91424d}.meetDock .dockLive{background:#b3261e;border-color:#d4473d}.meetDock .dockLive.isLive{background:#7a1c18;box-shadow:0 0 0 3px rgba(239,68,68,.12)}.meetDock .dockEnd{background:#6b2026;border-color:#9b343e}.meetDock .dockEnd:hover{background:#842831}
body.drawerOpen{overflow:hidden}
@media(max-width:900px){.shell{padding:10px 10px 84px}.preview.card{min-height:auto}.preview #program{min-height:56vw}.meetDock{left:10px;right:10px;transform:none;justify-content:flex-start}.rightcol{width:min(430px,96vw)}}

/* v0.6.1 — non-blurring More drawer, Grid button and direct Host camera-shape picker. */
.drawerBackdrop{background:transparent!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
body.drawerOpen{overflow:auto}

.quickPopover{position:fixed;z-index:260;left:50%;bottom:82px;transform:translateX(-50%);width:min(360px,calc(100vw - 24px));padding:14px;border-radius:16px;background:#1b1f27;border:1px solid #3b4350;box-shadow:0 18px 55px rgba(0,0,0,.5)}
.quickPopover[hidden]{display:none}
.quickPopoverTitle{font-size:13px;font-weight:900;margin-bottom:10px;color:#f4f7fb}
.shapeChoices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.shapeChoices button{background:#2a303a;color:#eef3f8;border:1px solid #424b59;padding:10px 8px}
.shapeChoices button.active{background:#1d5a47;border-color:#3a8b6d;color:#e8fff6}
.quickPopoverNote{margin-top:9px;font-size:10px;line-height:1.4;color:#929eaf}

.meetDock #dockGrid.isOn{background:#2d4d72;border-color:#4b78a7}
.meetDock #dockHost.isOn{background:#3b345f;border-color:#655b94}

@media(max-width:900px){.quickPopover{bottom:78px}}

/* v0.6.2 — cleaner Google Meet-inspired Host Studio chrome and unified controls. */
:root{--meet-control:48px;--meet-icon:21px;--meet-gap:8px;--meet-bg:#202124;--meet-hover:#3c4043;--meet-off:#5f2126;--meet-live:#c5221f;--meet-blue:#174ea6}
body{background:#202124}
.shell{padding:10px 14px 88px}
.shell>header{height:48px;margin:0 0 8px;padding:0 4px;border:0}
.shell>header>div:first-child{min-width:0;display:flex;align-items:center;gap:10px}
.shell>header h1{font-size:17px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:min(58vw,780px)}
.shell>header p{display:none!important}
.status{font-size:12px;padding:6px 10px;background:#303134;border-color:#45474b;color:#d6d9de;box-shadow:none}
.status.ok{background:#153b2c;border-color:#2d654e;color:#b8e7d3}
.preview.card{padding:0!important;background:#111214!important;border:0!important;border-radius:14px!important;box-shadow:none!important;min-height:calc(100vh - 112px)!important;overflow:hidden}
.previewTop{height:42px;margin:0;padding:0 14px;border-bottom:1px solid #2b2d31;background:#191a1d}
.previewTop>div:first-child{display:flex;align-items:center;gap:8px}
.previewTop>div:first-child strong{font-size:11px;color:#c7c9ce;letter-spacing:.07em}
.previewTop>div:first-child span{margin:0;font-size:11px;color:#8f939b}
.preview #program{min-height:calc(100vh - 166px)!important;border-radius:0!important;background:#000}
.preview .hint{margin:0;padding:7px 12px;background:#17181b;border-top:1px solid #292b30;color:#8f949d;font-size:10px;text-align:center}
.recordingPill{padding:5px 9px;font-size:10px;background:#27282c;border-color:#3c3e43}

.meetDock{position:fixed;z-index:220;left:50%;bottom:10px;transform:translateX(-50%);display:flex;align-items:center;justify-content:center;gap:var(--meet-gap);padding:6px 10px;max-width:calc(100vw - 20px);overflow:visible;background:rgba(32,33,36,.96);border:1px solid #3c4043;border-radius:18px;box-shadow:0 8px 28px rgba(0,0,0,.38);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.dockGroup{display:flex;align-items:center;gap:var(--meet-gap)}
.dockDivider{width:1px;height:28px;background:#4a4d52;margin:0 2px;flex:0 0 auto}
.meetDock .meetControl,.dockSplit>.meetControl:first-child{position:relative;width:var(--meet-control);min-width:var(--meet-control);height:var(--meet-control);padding:0!important;border-radius:50%!important;border:0!important;background:#3c4043;color:#f1f3f4;display:grid;place-items:center;box-shadow:none;flex:0 0 auto;transition:background .12s ease,transform .12s ease,box-shadow .12s ease}
.meetDock .meetControl:hover,.dockSplit>.meetControl:first-child:hover{background:#4a4d51;transform:translateY(-1px)}
.meetDock .meetControl:focus-visible{outline:2px solid #8ab4f8;outline-offset:2px}
.meetDock .meetControl:disabled{opacity:.42;transform:none}
.dockIcon{width:var(--meet-icon);height:var(--meet-icon);display:grid;place-items:center;line-height:1;position:relative}
.dockIcon svg{display:block;width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.dockIcon svg .fillDot,.dockIcon svg .recordDot,.dockIcon svg .liveDot{fill:currentColor;stroke:none}
.dockLabel{position:absolute!important;width:1px;height:1px;padding:0!important;margin:-1px!important;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;font-size:1px!important}
.meetControl[data-label]::after{content:attr(data-label);position:absolute;left:50%;bottom:58px;transform:translateX(-50%) translateY(4px);padding:6px 8px;border-radius:5px;background:#2b2c2f;color:#f1f3f4;font-size:11px;font-weight:500;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .12s ease,transform .12s ease;box-shadow:0 3px 12px rgba(0,0,0,.34)}
.meetControl[data-label]:hover::after,.meetControl[data-label]:focus-visible::after{opacity:1;transform:translateX(-50%) translateY(0)}

.dockSplit{position:relative;display:block;width:var(--meet-control);height:var(--meet-control);flex:0 0 var(--meet-control)}
.dockSplit>.meetControl:first-child{position:absolute;inset:0}
.dockSplit .dockCaret{position:absolute!important;right:-4px!important;top:-4px!important;width:21px!important;min-width:21px!important;height:21px!important;padding:0!important;border-radius:50%!important;border:2px solid #202124!important;background:#4a4d51!important;color:#e8eaed!important;display:grid!important;place-items:center!important;z-index:3;box-shadow:0 2px 7px rgba(0,0,0,.3)}
.dockSplit .dockCaret:hover{background:#5a5d61!important}
.dockSplit .dockCaret svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}

.meetDock .meetControl.isOn{background:#d2e3fc;color:#174ea6}
.meetDock .meetControl.isOff{background:#5f2126;color:#f8d7da}
.meetDock .meetControl.isOff .dockIcon::after{content:"";position:absolute;left:-3px;right:-3px;top:50%;height:2px;background:currentColor;border-radius:999px;transform:rotate(-43deg);box-shadow:0 0 0 1px rgba(95,33,38,.3)}
.meetDock #dockShare.isOn,.meetDock #dockGrid.isOn,.meetDock #dockHost.isOn{background:#d2e3fc!important;color:#174ea6!important}
.meetDock #dockRecord.isOn{background:#fce8e6!important;color:#b3261e!important;box-shadow:0 0 0 3px rgba(234,67,53,.12)}
.meetDock .dockLive{background:#3c4043!important;color:#f1f3f4!important}
.meetDock .dockLive:hover{background:#4a4d51!important}
.meetDock .dockLive:not(.isLive){background:#c5221f!important;color:#fff!important}
.meetDock .dockLive.isLive{background:#fce8e6!important;color:#b3261e!important;box-shadow:0 0 0 3px rgba(234,67,53,.12)!important}
.meetDock .dockEnd{background:#c5221f!important;color:#fff!important}
.meetDock .dockEnd:hover{background:#a50e0e!important}

.rightcol{background:#202124;border-left:1px solid #3c4043;box-shadow:-10px 0 34px rgba(0,0,0,.34)}
.studioDrawerHead{background:rgba(32,33,36,.98);border-bottom-color:#3c4043}
.studioDrawerHead button{background:#3c4043}
.card{box-shadow:none}
.quickPopover{bottom:72px;background:#292a2d;border-color:#45474d;border-radius:14px;box-shadow:0 10px 30px rgba(0,0,0,.42)}
.shapeChoices button{min-height:40px;background:#3c4043;border-color:#4d5156}
.shapeChoices button.active{background:#d2e3fc;border-color:#d2e3fc;color:#174ea6}

@media(max-width:1120px){
  :root{--meet-control:44px;--meet-icon:20px;--meet-gap:6px}
  .meetDock{overflow-x:auto;overflow-y:visible;justify-content:flex-start;scrollbar-width:none;padding:6px 8px}
  .meetDock::-webkit-scrollbar{display:none}
  .dockDivider{display:none}
}
@media(max-width:760px){
  .shell{padding:8px 8px 78px}.shell>header{height:42px}.shell>header h1{font-size:15px;max-width:62vw}
  .preview.card{min-height:auto!important}.preview #program{min-height:56vw!important}.preview .hint{display:none}
  .meetDock{left:8px;right:8px;bottom:7px;transform:none;max-width:none;border-radius:15px}
  .dockGroup{gap:6px}
  .meetControl[data-label]::after{display:none}
}
.meetDock .meetControl.panelOpen{background:#d2e3fc!important;color:#174ea6!important}

/* v0.6.5 — direct stage interaction: click any presenter/shared tile to focus/restore. */
.preview #program .program-interactive-tile{cursor:pointer;position:relative;outline:none}
.preview #program .program-interactive-tile:focus-visible{box-shadow:inset 0 0 0 3px #8ab4f8}
.preview #program .program-interactive-tile::before{content:"Click to focus";position:absolute;left:12px;top:12px;z-index:35;padding:5px 8px;border-radius:999px;background:rgba(32,33,36,.78);color:#e8eaed;font-size:10px;font-weight:600;letter-spacing:.02em;opacity:0;transform:translateY(-2px);transition:opacity .12s ease,transform .12s ease;pointer-events:none}
.preview #program .program-interactive-tile:hover::before,.preview #program .program-interactive-tile:focus-visible::before{opacity:1;transform:none}
.preview #program .program-tile-controls{position:absolute;z-index:50;top:10px;right:10px;display:flex;align-items:center;gap:6px;opacity:0;transform:translateY(-2px);transition:opacity .12s ease,transform .12s ease;pointer-events:none}
.preview #program .program-interactive-tile:hover>.program-tile-controls,.preview #program .program-interactive-tile:focus-within>.program-tile-controls,.preview #program.program-focused .program-tile-controls{opacity:1;transform:none;pointer-events:auto}
.preview #program .program-tile-action{width:34px!important;min-width:34px!important;height:34px!important;padding:0!important;border:1px solid rgba(255,255,255,.16)!important;border-radius:50%!important;background:rgba(32,33,36,.88)!important;color:#f1f3f4!important;display:grid!important;place-items:center!important;box-shadow:0 2px 8px rgba(0,0,0,.3)!important;backdrop-filter:blur(8px)}
.preview #program .program-tile-action:hover{background:#4a4d51!important;transform:none!important}
.preview #program .program-tile-action.program-tile-close:hover{background:#a50e0e!important}
.preview #program .program-tile-action svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.preview #program.program-focused .program-grid{grid-template-columns:1fr!important;grid-template-rows:1fr!important}
.preview #program.program-focused .program-grid-item{width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;border-radius:0!important}
.preview #program.program-focused .program-grid-item video{width:100%;height:100%}
.preview #program.program-focused .program-interactive-tile::before{content:"Click to restore"}
@media(max-width:760px){.preview #program .program-interactive-tile::before{display:none}.preview #program .program-tile-controls{opacity:1;pointer-events:auto}.preview #program .program-tile-action{width:30px!important;min-width:30px!important;height:30px!important}}


/* v0.6.5 — desktop viewport fit, full-height chat drawer and true toolbar toggles. */
@media (min-width:901px){
  body.integrated{height:100dvh;overflow:hidden!important}
  body.integrated .shell{height:100dvh;max-height:100dvh;min-height:0;padding:8px 12px 76px!important;display:flex;flex-direction:column;overflow:hidden}
  body.integrated .shell>header{flex:0 0 44px;min-height:44px;margin:0!important;padding:0 2px 8px!important}
  body.integrated .shell>header h1{font-size:18px!important;line-height:1.1}
  body.integrated .status{padding:6px 10px;font-size:11px}
  body.integrated .workspace{flex:1 1 auto;min-height:0;height:auto!important;overflow:hidden}
  body.integrated .preview.card{height:100%;max-height:100%;min-height:0!important;display:flex;flex-direction:column;overflow:hidden!important}
  body.integrated .previewTop{flex:0 0 42px}
  body.integrated .preview #program{flex:1 1 auto;min-height:0!important;height:auto!important;width:auto!important;max-width:100%;max-height:100%;aspect-ratio:16/9!important;align-self:center}
  body.integrated .preview .hint{flex:0 0 auto;min-height:24px;padding:5px 10px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
}

/* Chat is a dedicated drawer mode: it consumes the whole opened side section. */
.rightcol[data-panel="chat"]{overflow:hidden!important;display:flex!important;flex-direction:column!important;padding-bottom:0!important}
.rightcol[data-panel="chat"]>.studioDrawerHead{flex:0 0 auto;margin-bottom:0!important}
.rightcol[data-panel="chat"]>section.card:not(.chat){display:none!important}
.rightcol[data-panel="chat"]>.chat.card{display:flex!important;flex:1 1 auto;min-height:0;margin:0 -12px!important;padding:14px 16px 16px!important;border:0!important;border-radius:0!important;box-shadow:none!important;background:#202124!important}
.rightcol[data-panel="chat"]>.chat.card .sectionHead{flex:0 0 auto}
.rightcol[data-panel="chat"]>.chat.card .chatList{flex:1 1 auto;height:auto!important;min-height:0;overflow:auto}
.rightcol[data-panel="chat"]>.chat.card .chatComposer{flex:0 0 auto}
.rightcol[data-panel="chat"]>.chat.card .microcopy{flex:0 0 auto}

/* v0.6.5 — clearer active states, invite/device popovers, clickable ticker and linkified chat. */
.meetDock .meetControl,
.dockSplit>.meetControl:first-child,
.meetDock .meetControl.isOff,
.meetDock .meetControl:not(.isOn):not(.dockEnd),
.meetDock .dockLive:not(.isLive){background:#3c4043!important;color:#f1f3f4!important;box-shadow:none!important}
.meetDock .meetControl.isOn,
.meetDock .meetControl.panelOpen,
.meetDock #dockShare.isOn,
.meetDock #dockGrid.isOn,
.meetDock #dockHost.isOn,
.meetDock #dockRecord.isOn,
.meetDock #dockInvite.isOn,
.meetDock .dockLive.isLive{background:#188038!important;color:#fff!important;box-shadow:0 0 0 3px rgba(24,128,56,.18)!important}
.meetDock .meetControl.isOff .dockIcon::after{background:#f1f3f4!important;box-shadow:none!important;opacity:.9}
.meetDock .dockEnd,.meetDock .dockEnd.isOff,.meetDock .dockEnd:not(.isOn){background:#c5221f!important;color:#fff!important}
.meetDock .dockEnd:hover{background:#a50e0e!important}
.meetDock .dockCaret{background:#4a4d51!important;color:#e8eaed!important}

/* The old 'Yeti Program' pill was only a preview/output label; the logo is the real branding. */
.program-badge{display:none!important}
.preview #program .program-ticker.visible{cursor:pointer;transition:filter .12s ease}
.preview #program .program-ticker.visible:hover{filter:brightness(1.15)}

.chatLink{color:#8ab4f8;text-decoration:underline;text-underline-offset:2px;overflow-wrap:anywhere}
.chatLink:hover{color:#aecbfa}

.deviceQuickMenu,.inviteMenu{position:fixed;z-index:270;bottom:72px;transform:translateX(-50%);width:min(360px,calc(100vw - 24px));padding:14px;border-radius:14px;background:#292a2d;border:1px solid #45474d;box-shadow:0 10px 30px rgba(0,0,0,.42)}
.deviceQuickMenu{left:50%}.inviteMenu{left:50%}
.deviceQuickMenu[hidden],.inviteMenu[hidden]{display:none}
.deviceQuickList{display:flex;flex-direction:column;gap:6px;max-height:320px;overflow:auto}
.deviceQuickChoice{width:100%;text-align:left;background:#3c4043;color:#f1f3f4;border:1px solid #4d5156;padding:10px 12px;border-radius:9px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.deviceQuickChoice:hover{background:#4a4d51}.deviceQuickChoice.selected{background:#174c2b;border-color:#2f8b4e;color:#dff7e6}
.deviceQuickEmpty{padding:10px 4px;color:#aeb4bd;font-size:12px}
.inviteIntro{font-size:12px;line-height:1.45;color:#bdc1c6;margin-bottom:12px}
.inviteField{display:flex;flex-direction:column;gap:6px;color:#bdc1c6;font-size:11px}
.inviteField input{width:100%;box-sizing:border-box;background:#202124;color:#f1f3f4;border:1px solid #5f6368;border-radius:9px;padding:10px;font-size:12px}
.inviteActions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}.inviteActions button{min-height:40px}
@media(max-width:760px){.deviceQuickMenu,.inviteMenu{bottom:70px;width:min(94vw,380px)}}


/* v0.6.5.6 UI clarity hotfix
   Inactive action/layout buttons are available, not disabled: dark grey with no strike-through.
   Only truly muted media controls (Mic/Camera) use the familiar diagonal slash. */
.meetDock .meetControl.isOff .dockIcon::after{
  display:none!important;
}
.meetDock #dockMic.isOff .dockIcon::after,
.meetDock #dockCamera.isOff .dockIcon::after{
  content:""!important;
  display:block!important;
  position:absolute!important;
  left:-3px!important;
  right:-3px!important;
  top:50%!important;
  height:2px!important;
  background:#f1f3f4!important;
  border-radius:999px!important;
  transform:rotate(-43deg)!important;
  box-shadow:none!important;
  opacity:.95!important;
}
/* Keep every inactive non-media control visually available and every active/open control green. */
.meetDock #dockShare.isOff,
.meetDock #dockGrid.isOff,
.meetDock #dockHost.isOff,
.meetDock #dockRecord.isOff,
.meetDock #dockPeople.isOff,
.meetDock #dockInvite.isOff,
.meetDock #dockChat.isOff,
.meetDock #dockMore.isOff{
  background:#3c4043!important;
  color:#f1f3f4!important;
}
.meetDock #dockShare.isOn,
.meetDock #dockGrid.isOn,
.meetDock #dockHost.isOn,
.meetDock #dockRecord.isOn,
.meetDock #dockPeople.isOn,
.meetDock #dockInvite.isOn,
.meetDock #dockChat.isOn,
.meetDock #dockMore.isOn,
.meetDock #dockPeople.panelOpen,
.meetDock #dockChat.panelOpen,
.meetDock #dockMore.panelOpen{
  background:#188038!important;
  color:#fff!important;
}


/* v0.6.7.1 — people waiting attention indicator. Host-studio UI only, never part of program/recording. */
#dockPeople{position:relative}
.peopleWaitingBadge{
  position:absolute;top:-5px;right:-5px;z-index:5;min-width:19px;height:19px;padding:0 5px;
  display:flex;align-items:center;justify-content:center;border-radius:999px;
  background:#1e8e3e;color:#fff;border:2px solid #202124;box-shadow:0 2px 8px rgba(0,0,0,.34);
  font-size:10px;font-weight:900;line-height:1;pointer-events:none;
}
.peopleWaitingBadge[hidden]{display:none!important}
#dockPeople.waitingPulse:not(.panelOpen){animation:yetiPeopleWaiting 1.15s ease-in-out infinite}
#dockPeople.waitingPulse:not(.panelOpen) .peopleWaitingBadge{animation:yetiPeopleBadge 1.15s ease-in-out infinite}
#dockPeople.waitingBurst:not(.panelOpen){animation:yetiPeopleBurst .42s ease-in-out 0s 3 alternate}
@keyframes yetiPeopleWaiting{0%,100%{box-shadow:0 0 0 0 rgba(52,168,83,0)}50%{box-shadow:0 0 0 5px rgba(52,168,83,.34)}}
@keyframes yetiPeopleBadge{0%,100%{transform:scale(1)}50%{transform:scale(1.16)}}
@keyframes yetiPeopleBurst{from{transform:translateY(0) scale(1)}to{transform:translateY(-2px) scale(1.08)}}
@media (prefers-reduced-motion:reduce){#dockPeople.waitingPulse,#dockPeople.waitingPulse .peopleWaitingBadge,#dockPeople.waitingBurst{animation:none!important}}

/* v0.6.7.4 — host-only Production Tools strip. These controls and drawers live
   outside #program, so they are never rendered into the audience/recording feed. */
.rightcol[data-panel="logo"]>section.card:not(.branding),
.rightcol[data-panel="giveaway"]>section.card:not(.giveaway),
.rightcol[data-panel="ticker"]>section.card:not(.ticker),
.rightcol[data-panel="layout"]>section.card:not(.controls),
.rightcol[data-panel="recordings"]>section.card:not(.recording){display:none!important}
.rightcol[data-panel="logo"],
.rightcol[data-panel="giveaway"],
.rightcol[data-panel="ticker"],
.rightcol[data-panel="layout"],
.rightcol[data-panel="recordings"]{overflow:auto!important}
.rightcol[data-panel="logo"]>.branding.card,
.rightcol[data-panel="giveaway"]>.giveaway.card,
.rightcol[data-panel="ticker"]>.ticker.card,
.rightcol[data-panel="layout"]>.controls.card,
.rightcol[data-panel="recordings"]>.recording.card{
  margin:0 -12px!important;padding:16px!important;border:0!important;border-radius:0!important;
  box-shadow:none!important;background:#202124!important;min-height:calc(100vh - 74px)
}
.dockProducerTools{position:relative}
.meetDock .producerTool .dockIcon svg{width:21px;height:21px}
/* v0.6.8.2 — Giveaway is neutral grey until its host tool is switched on/open. */
.meetDock #dockGiveaway,
.meetDock #dockGiveaway.isOff{
  background:#3c4043!important;color:#f1f3f4!important;box-shadow:none!important;
}
.meetDock #dockGiveaway:hover,
.meetDock #dockGiveaway.isOff:hover{background:#4a4d51!important;color:#f1f3f4!important}
.meetDock #dockGiveaway.isOn,
.meetDock #dockGiveaway.panelOpen{
  background:#f9ab00!important;color:#202124!important;
  box-shadow:0 0 0 3px rgba(249,171,0,.25)!important;
}
.meetDock #dockGiveaway.isOn:hover,
.meetDock #dockGiveaway.panelOpen:hover{background:#fbbc04!important;color:#202124!important}
.meetDock #dockGiveaway .dockIcon{color:inherit!important}
.meetDock #dockPip.panelOpen{box-shadow:0 0 0 3px rgba(24,128,56,.18)!important}
@media(max-width:1100px){.dockProducerTools{gap:6px}}

/* v0.6.7.5 default-logo controls */
.logoEnableCheck{padding:10px 12px;border:1px solid #315774;border-radius:11px;background:#0e1b2a;color:#d9e8f7!important;font-weight:700}.logoEnableCheck input{width:18px!important;height:18px!important;accent-color:#188038;flex:0 0 auto}.branding .virtualFileRow img{background:transparent!important;width:92px!important;height:34px!important;object-fit:contain!important}

/* v0.6.7.7 — host screen-share optimisation selector */
.screenShareModeBox{margin:10px 0 12px;padding:10px 12px;border:1px solid rgba(148,163,184,.18);border-radius:12px;background:rgba(15,23,42,.34)}
.screenShareModeBox label{display:flex;align-items:center;gap:10px;justify-content:space-between;margin:0}
.screenShareModeBox select{min-width:260px;max-width:100%}
.screenShareModeBox .microcopy{margin-top:7px}
@media (max-width:720px){.screenShareModeBox label{align-items:stretch;flex-direction:column}.screenShareModeBox select{width:100%;min-width:0}}

/* v0.6.8.1 — compact Present choices appear only after the host clicks Present. */
.presentShareMenu{position:fixed;z-index:1400;display:flex;gap:6px;padding:7px;border:1px solid rgba(148,163,184,.3);border-radius:12px;background:#202124;box-shadow:0 12px 34px rgba(0,0,0,.42);transform:translateX(-50%);white-space:nowrap}
.presentShareMenu[hidden]{display:none!important}
.presentShareMenu .presentShareChoice{display:inline-flex!important;align-items:center!important;justify-content:center!important;width:auto!important;min-width:108px!important;margin:0!important;padding:8px 10px!important;border:1px solid #5f6368!important;border-radius:9px!important;background:#3c4043!important;color:#e8eaed!important;font-size:11px!important;font-weight:800!important;line-height:1.15!important;text-align:center!important;box-shadow:none!important}
.presentShareMenu .presentShareChoice:hover{background:#4a4d51!important;border-color:#80868b!important;color:#fff!important}
.presentShareMenu .presentShareChoice.selected{background:#188038!important;border-color:#34a853!important;color:#fff!important;box-shadow:0 0 0 2px rgba(52,168,83,.16)!important}
.meetDock #dockShare.panelOpen{box-shadow:0 0 0 3px rgba(138,180,248,.22)!important}
.chatHeaderActions{display:flex;align-items:center;justify-content:flex-end;gap:7px;flex-wrap:wrap}
.chatHeaderActions button{white-space:nowrap}
@media(max-width:520px){.presentShareMenu .presentShareChoice{min-width:98px!important;padding:8px!important;font-size:10px!important}.chatHeaderActions{gap:5px}}

/* v0.6.9.5 — YetiWebinar CTA live host preview */
.ctaHostPreview{margin-top:12px;padding:14px;border-radius:14px;background:#0b1612;border:1px solid #2f6b49;box-shadow:0 12px 32px rgba(0,0,0,.28)}
.ctaHostPreview[hidden]{display:none!important}
.ctaHostPreview .ctaPreviewLabel{font-size:10px;letter-spacing:.08em;font-weight:900;color:#7dd69e;margin-bottom:7px}
.ctaHostPreview strong{display:block;font-size:17px;color:#f3fff7}
.ctaHostPreview p{margin:5px 0 10px;color:#a9c4b4;line-height:1.45}
.ctaHostPreview a{display:inline-block;padding:9px 12px;border-radius:9px;background:#16a34a;color:#fff!important;text-decoration:none;font-weight:900}

/* v0.6.9.8 — verified Go Live progress */
.goLiveProgress{position:fixed;z-index:5000;inset:0;display:grid;place-items:center;padding:20px;background:rgba(2,6,13,.78);backdrop-filter:blur(7px)}
.goLiveProgress[hidden]{display:none!important}
.goLiveProgressCard{width:min(560px,94vw);padding:26px;border-radius:22px;background:#111827;border:1px solid #334155;box-shadow:0 28px 90px rgba(0,0,0,.62)}
.goLiveProgressKicker{font-size:11px;font-weight:900;letter-spacing:.12em;color:#7ee2a8;margin-bottom:9px}
.goLiveProgressCard h2{margin:0 0 20px;color:#fff;font-size:24px}
.goLiveProgressTrack{height:14px;border-radius:999px;background:#253247;overflow:hidden;border:1px solid #36455e}
.goLiveProgressBar{height:100%;width:0;background:linear-gradient(90deg,#16803a,#52d780);transition:width .28s ease}
.goLiveProgressRow{display:flex;justify-content:space-between;gap:18px;margin-top:12px;color:#aebed3;font-size:13px}
.goLiveProgressRow strong{color:#fff}


/* v0.6.10.4 — detachable chat + Presentation Mode controls. */
.chatHeaderActions{display:flex;align-items:center;justify-content:flex-end;gap:6px;flex-wrap:wrap}
.newChatMessages{align-self:center;margin:7px auto 3px!important;padding:7px 12px!important;border-radius:999px!important;background:#1a73e8!important;color:#fff!important;font-size:11px!important;font-weight:800!important;box-shadow:0 5px 16px rgba(0,0,0,.24)}
.newChatMessages[hidden]{display:none!important}
.meetDock #dockPresentation.isOn{background:#188038!important;color:#fff!important;box-shadow:0 0 0 3px rgba(24,128,56,.18)!important}
.meetDock #dockPresentation.isOn .dockLabel{color:#fff!important}
.meetDock #dockPresentation.isOff{background:#3c4043!important;color:#f1f3f4!important}
@media(max-width:760px){.chatHeaderActions{justify-content:flex-start}.chatHeaderActions .small{flex:1 1 auto}}

/* v0.6.10.4 — make Presentation Mode unmistakable in the Program Preview header. */
.presentationQuick{margin-left:auto;border:1px solid #4b5563;background:#263042;color:#fff;border-radius:10px;padding:8px 12px;font-weight:700;white-space:nowrap;cursor:pointer}
.presentationQuick:hover:not(:disabled){background:#344258}
.presentationQuick.isOn{background:#188038;border-color:#28a745;box-shadow:0 0 0 3px rgba(24,128,56,.18)}
.presentationQuick:disabled{opacity:.48;cursor:not-allowed}
.previewTop{gap:10px;flex-wrap:wrap}
@media (max-width:720px){.presentationQuick{order:3;width:100%;margin-left:0}}