/* Public preparation screens deliberately share no administration styles. */
body.prejoining{background:#fff;color:#172033;color-scheme:light;font-family:Arial,"Helvetica Neue",sans-serif;padding:0;margin:0;min-height:100svh}
.prejoining>.room-header,.prejoining #meeting-settings,.prejoining #workspace-tabs,.prejoining #room-layout,.prejoining #meeting-toolbar,.prejoining #tool-restrictions,.prejoining #meeting-notice{display:none!important}
.prejoining .meeting-app{max-width:1060px;margin:0 auto;padding:24px;display:block}.prejoining #meeting-entry{display:block;max-width:940px;width:100%;margin:0 auto;padding:0;border:0;background:#fff;box-shadow:none;border-radius:0}.prejoining #meeting-entry>:not(#prejoin){display:none!important}
#prejoin{display:none}.prejoining #prejoin{display:block;max-width:560px;margin:0 auto;padding:0 18px 36px;min-height:min(700px,95svh)}
#prejoin *{box-sizing:border-box}#prejoin [hidden]{display:none!important}.prejoin-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:42px}.prejoin-brand{font-size:25px;font-weight:700;letter-spacing:-1.2px;color:#0964f6;text-decoration:none}.prejoin-close{font-size:30px;color:#526070;text-decoration:none;min-width:44px;text-align:center;line-height:44px}
#prejoin h1{font-size:34px;font-weight:700;line-height:1.25;color:#172033;margin:0 0 26px;letter-spacing:-.5px}#prejoin-room-name{font-size:16px;color:#596778;overflow-wrap:anywhere;margin:0 0 22px}#prejoin label{display:grid;font-weight:400;font-size:16px;color:#26354a;gap:9px;margin:0 0 20px}
#prejoin input:not([type=checkbox]),#prejoin select{font:inherit;background:#fff;color:#172033;width:100%;min-width:0;min-height:54px;border:1px solid #9da8b6;border-radius:12px;padding:12px 14px;box-shadow:none}
#prejoin input:focus-visible,#prejoin select:focus-visible,#prejoin button:focus-visible,#prejoin a:focus-visible{outline:3px solid #0866d9;outline-offset:3px}#prejoin input[aria-invalid=true]{border-color:#b5203b}#prejoin .prejoin-check{display:flex;align-items:start;gap:12px;line-height:1.5;margin-bottom:18px}#prejoin input[type=checkbox]{width:22px;height:22px;flex:none;margin:1px 0;accent-color:#0866d9}
#prejoin-password{min-height:330px}#prejoin-account,.prejoin-private{font-size:14px;line-height:1.5;color:#596778}#prejoin-status:empty{display:none}#prejoin-status:not(:empty){padding:18px;background:#eef5ff;color:#24456f;border:1px solid #c5d9f3;border-radius:12px;line-height:1.6}#prejoin-error{font-size:15px;line-height:1.5;padding:16px;background:#fff0f3;color:#a31c35;border:1px solid #e9b9c3;border-radius:12px}
.prejoin-actions{display:flex;align-items:center;justify-content:flex-end;gap:14px;margin-top:36px;flex-wrap:wrap}#prejoin button,.prejoin-cancel{font:inherit;font-weight:500;min-height:48px;border:1px solid #8996a6;border-radius:11px;padding:11px 22px;color:#172033;background:#fff;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;cursor:pointer}#prejoin #join{background:#0866d9;color:white;border-color:#0866d9;min-width:146px;font-weight:600}#prejoin button:disabled{opacity:.55;cursor:wait}
.prejoining #prejoin[data-step=preview]{max-width:940px}#prejoin[data-step=preview] .prejoin-heading{margin-bottom:18px}#prejoin[data-step=preview] h1{font-size:25px;margin-bottom:10px}.prejoin-video{position:relative;background:#172033;border-radius:12px;overflow:hidden;aspect-ratio:16/9;display:grid;place-items:center;color:#fff}#prejoin-video{width:100%;height:100%;object-fit:contain;transform:scaleX(-1);position:absolute;inset:0}#prejoin-avatar{max-width:90%;text-align:center;overflow-wrap:anywhere;color:#fff;font-size:24px}#prejoin-video:not([hidden])+#prejoin-avatar{display:none}.prejoin-media-buttons{display:flex;gap:10px;position:absolute;bottom:16px;left:50%;transform:translateX(-50%);padding:8px;background:#1c222cde;border-radius:12px;white-space:nowrap}#prejoin .prejoin-media-buttons button{background:transparent;color:#fff;border-color:#6a7485;padding:10px 16px;font-size:14px}#prejoin .prejoin-media-buttons button[aria-pressed=false]{color:#ffbdc8;border-color:#e7788d}.prejoin-devices{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:18px 14px 0;background:#f2f5f8;border-radius:0 0 12px 12px}#prejoin .prejoin-devices label{font-size:14px;min-width:0}#prejoin .prejoin-devices select{font-size:14px;min-height:46px}#prejoin-device-error{color:#8a263b;background:#fff0f3;padding:12px;border-radius:10px;line-height:1.5}
.prejoining #lobby-inbox{color:#18263a;background:#effaf7;border-color:#b5ddd1;margin:0 auto 24px}.prejoining #lobby-inbox p{color:#315d50}.prejoining #lobby-inbox button{color:#142b28}
@media(max-width:600px){.prejoining .meeting-app{padding:16px 8px}#prejoin h1{font-size:28px}.prejoin-heading{margin-bottom:30px}.prejoin-actions{gap:10px;margin-top:24px}#prejoin button,.prejoin-cancel{padding-inline:15px}.prejoin-devices{grid-template-columns:1fr;gap:0}.prejoin-video{aspect-ratio:4/3}.prejoin-media-buttons{bottom:10px;gap:7px;padding:6px}#prejoin .prejoin-media-buttons button{padding:8px 12px;font-size:13px}}

/* Hosts keep their existing access panel and reclaim action before/after joining. */
body.prejoining.prejoin-manager #workspace-tabs{display:flex!important;margin-top:24px}body.prejoining.prejoin-manager #room-layout.with-panel{display:block!important}body.prejoining.prejoin-manager #meeting-stage{display:none}body.prejoining.prejoin-manager #workspace-content{background:#142033;padding:20px;color:#eef3ff;border-radius:14px}body.prejoining.prejoin-manager #workspace-content label{color:#eef3ff}

body.prejoining{--focus-ring:#0866d9}#prejoin .prejoin-check{flex-direction:row}

#prejoin-signin{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:10px 18px;color:#0866d9;text-decoration:none;border:1px solid #8996a6;border-radius:11px}#prejoin-signin:hover{text-decoration:underline}
/* Account security recovery remains visible when a live session is contained. */
body.prejoining #meeting-notice:not([hidden]):has(#meeting-security-link:not([hidden])){display:block!important;background:#fff0f3;color:#8e1830;border-color:#e4adba;position:static}body.prejoining #meeting-notice p{color:#8e1830}body.prejoining #meeting-security-link{display:inline-flex;background:#fff;color:#0866d9;border:1px solid #8996a6}

/* Preview proportions follow the 912 x 513 reference, including compact chrome.
   The full camera frame keeps its reference width; short windows scroll without covering the camera controls. */
.prejoining .meeting-app:has(#prejoin[data-step=preview]){max-width:976px;padding:12px 16px 16px}
.prejoining #meeting-entry:has(#prejoin[data-step=preview]){max-width:944px}
.prejoining #prejoin[data-step=preview]{width:100%;max-width:944px;min-height:0;padding:0 16px 16px}
#prejoin[data-step=preview] .prejoin-heading{height:44px;margin-bottom:12px;gap:12px}
#prejoin[data-step=preview] .prejoin-brand{font-size:18px;letter-spacing:-.7px;flex:none}
#prejoin-room-caption{flex:1;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:#27354a;font-size:14px}
#prejoin[data-step=preview] h1,#prejoin[data-step=preview] #prejoin-room-name,#prejoin[data-step=preview] .prejoin-private,.prejoin-device-label{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip-path:inset(50%);white-space:nowrap;border:0!important}
#prejoin[data-step=preview] .prejoin-video{width:100%;height:auto;min-height:0;aspect-ratio:16/9;border-radius:0;background:#172033}
#prejoin .prejoin-header-back{min-width:36px;width:36px;min-height:40px;padding:0;border:0;font-size:0;flex:none}
#prejoin .prejoin-header-back::before{content:'←';font-size:23px}
#prejoin[data-step=preview] .prejoin-close{min-width:36px;flex:none;font-size:26px}
#prejoin[data-step=preview] .prejoin-media-buttons{bottom:12px;padding:4px 10px;gap:4px;background:#303030ed;border-radius:8px}
#prejoin[data-step=preview] .prejoin-media-buttons button{display:flex;flex-direction:column;gap:4px;width:104px;min-height:66px;padding:4px 10px;border:0;border-radius:6px;font-size:15px;color:white}
#prejoin .prejoin-media-buttons svg{width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
#prejoin .prejoin-media-buttons button[aria-pressed=false]{color:#ffc1cd}
#prejoin .prejoin-media-buttons button[aria-pressed=true] .media-slash{display:none}
#prejoin[data-step=preview] .prejoin-devices{gap:12px;padding:12px;background:#f1f4f7;border-radius:0 0 6px 6px}
#prejoin .prejoin-devices label{position:relative;display:block;margin:0}
#prejoin .prejoin-devices label>svg{position:absolute;left:12px;top:50%;transform:translateY(-50%);width:22px;height:22px;fill:none;stroke:#727d8a;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
#prejoin .prejoin-devices .media-slash{display:none}
#prejoin .prejoin-devices select{height:46px;min-height:46px;padding:9px 28px 9px 40px;text-overflow:ellipsis;font-size:14px;border-color:#bac2ce;border-radius:10px}
#prejoin[data-step=preview] .prejoin-actions{margin-top:24px;gap:12px;flex-wrap:nowrap}
#prejoin[data-step=preview] #prejoin-always-label{flex:1;min-width:0;margin:0;font-size:14px;gap:10px;align-items:center;line-height:1.45}
#prejoin[data-step=preview] #prejoin-signin,#prejoin[data-step=preview] #join{min-width:132px;height:48px;white-space:nowrap;font-size:16px}
#prejoin[data-step=preview] .prejoin-cancel{display:none}
@media(max-width:700px){
 .prejoining .meeting-app:has(#prejoin[data-step=preview]){padding:8px}
 .prejoining #prejoin[data-step=preview]{width:100%;padding:0 12px 16px}
 #prejoin[data-step=preview] .prejoin-heading{gap:8px}
 #prejoin[data-step=preview] .prejoin-devices{grid-template-columns:1fr;padding:10px;gap:10px}
 #prejoin[data-step=preview] .prejoin-actions{flex-wrap:wrap;margin-top:18px;gap:10px}
 #prejoin[data-step=preview] #prejoin-always-label{flex-basis:100%;margin-bottom:8px}
 #prejoin[data-step=preview] .prejoin-media-buttons{bottom:8px;padding:3px 6px}
 #prejoin[data-step=preview] .prejoin-media-buttons button{width:86px;min-height:56px;font-size:13px;gap:2px}
 #prejoin .prejoin-media-buttons svg{width:26px;height:26px}
 #prejoin[data-step=preview] #prejoin-signin,#prejoin[data-step=preview] #join{min-width:120px}
}

/* Keep the reference-sized camera on short/zoomed desktop windows.
   Scroll to the footer rather than covering the media controls with an overlay. */
#prejoin[data-step=preview] .prejoin-actions{background:#fff;padding:12px 0;margin-top:12px}

#prejoin #prejoin-fullscreen{flex:none;min-height:36px;padding:6px 10px;font-size:13px;border-color:#c4ccd6;border-radius:8px;color:#0866d9}
#prejoin:fullscreen{display:block!important;width:100vw!important;height:100svh!important;max-width:none!important;padding:12px 16px!important;margin:0!important;overflow:auto;background:#fff}
#prejoin:fullscreen>.prejoin-heading,#prejoin:fullscreen>#prejoin-preview,#prejoin:fullscreen>.prejoin-actions,#prejoin:fullscreen>#prejoin-error,#prejoin:fullscreen>#prejoin-status:not(:empty){width:min(100%,1280px,calc((100svh - 224px)*16/9));margin-inline:auto}
@media(max-width:480px){#prejoin-room-caption{font-size:12px}#prejoin #prejoin-fullscreen{font-size:12px;padding:6px}.prejoin-heading{gap:6px!important}}
/* Veyora room look for the preparation screens: same dark surfaces, accent and
   logo as the meeting itself. Sizes above stay unchanged, including the
   912 x 513 camera reference. */
body.prejoining{--room-bg:#0d0f12;--surface:#16191e;--surface-2:#1f232a;--surface-3:#2a2f37;--line:rgba(255,255,255,.08);--line-strong:rgba(255,255,255,.16);--text:#f3f5f7;--muted:#9aa4b1;--accent:#2fd3b5;--accent-strong:#5fe0c8;--accent-ink:#03241d;--focus-ring:#8fe9d7;background:var(--room-bg);color:var(--text);color-scheme:dark;font-family:Inter,"Segoe UI",system-ui,sans-serif;-webkit-font-smoothing:antialiased}
.prejoining #meeting-entry{background:transparent}
.prejoin-brand{display:inline-flex;align-items:center;gap:10px;font-size:18px;font-weight:700;letter-spacing:-.01em;color:var(--text,#f3f5f7);text-transform:capitalize}
.prejoin-brand::before{content:'V';display:grid;place-items:center;flex:none;width:32px;height:32px;border-radius:10px;background:linear-gradient(140deg,#4fe6c9,#169a82);color:#03241d;font-size:16px;font-weight:800;letter-spacing:-.02em;box-shadow:inset 0 0 0 1px rgba(255,255,255,.16)}
#prejoin[data-step=preview] .prejoin-brand{font-size:16px;letter-spacing:-.01em}
.prejoin-close{color:var(--muted);border-radius:10px;line-height:40px}
.prejoin-close:hover{color:var(--text);background:var(--surface-2)}
#prejoin h1{color:var(--text);letter-spacing:-.02em}
#prejoin-room-name,#prejoin-room-caption{color:var(--muted)}
#prejoin label{color:var(--text)}
#prejoin input:not([type=checkbox]),#prejoin select{background:var(--surface);color:var(--text);border:1px solid var(--line-strong);border-radius:12px}
#prejoin input:not([type=checkbox]):hover,#prejoin select:hover{border-color:rgba(255,255,255,.26)}
#prejoin input:not([type=checkbox]):focus,#prejoin select:focus{border-color:var(--accent);outline:0;box-shadow:0 0 0 3px rgba(47,211,181,.22)}
#prejoin input::placeholder{color:#6f7a87}
#prejoin input:focus-visible,#prejoin select:focus-visible,#prejoin button:focus-visible,#prejoin a:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
#prejoin input[aria-invalid=true]{border-color:#f87171}
#prejoin input[type=checkbox]{accent-color:var(--accent)}
#prejoin-account,.prejoin-private{color:var(--muted)}
#prejoin-status:not(:empty){background:rgba(47,211,181,.1);color:#c9f3ea;border-color:rgba(47,211,181,.3)}
#prejoin-error{background:#3a1d22;color:#fecaca;border-color:rgba(239,68,68,.45)}
#prejoin-device-error{background:#3a1d22;color:#fecaca}
#prejoin button,.prejoin-cancel,#prejoin-signin{border:1px solid var(--line-strong);border-radius:12px;background:transparent;color:var(--text);font-weight:600}
#prejoin button:hover:enabled,.prejoin-cancel:hover,#prejoin-signin:hover{background:var(--surface-2);text-decoration:none}
#prejoin #join{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);font-weight:700}
#prejoin #join:hover:enabled{background:var(--accent-strong);border-color:var(--accent-strong)}
#prejoin #prejoin-fullscreen{border-color:var(--line-strong);border-radius:10px;color:var(--text);background:transparent}
.prejoin-video,#prejoin[data-step=preview] .prejoin-video{background:#171a20;border-radius:16px 16px 0 0}
#prejoin-avatar{color:var(--muted)}
.prejoin-media-buttons,#prejoin[data-step=preview] .prejoin-media-buttons{background:rgba(9,10,12,.72);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:14px}
#prejoin .prejoin-media-buttons button,#prejoin[data-step=preview] .prejoin-media-buttons button{border:0;border-radius:10px;color:#fff;background:transparent}
#prejoin .prejoin-media-buttons button:hover:enabled{background:rgba(255,255,255,.1)}
#prejoin .prejoin-media-buttons button[aria-pressed=false]{color:#fca5a5;background:rgba(239,68,68,.16)}
.prejoin-devices,#prejoin[data-step=preview] .prejoin-devices{background:var(--surface);border:1px solid var(--line);border-top:0;border-radius:0 0 16px 16px}
#prejoin .prejoin-devices label>svg{stroke:var(--muted)}
#prejoin .prejoin-devices select{background:var(--room-bg);border-color:var(--line-strong)}
#prejoin[data-step=preview] .prejoin-actions{background:var(--room-bg)}
#prejoin:fullscreen{background:var(--room-bg,#0d0f12)}
.prejoining #lobby-inbox{color:var(--text);background:#11211e;border-color:rgba(47,211,181,.35)}
.prejoining #lobby-inbox p{color:#b6d8cf}
.prejoining #lobby-inbox button{color:var(--accent-ink)}
body.prejoining #meeting-notice:not([hidden]):has(#meeting-security-link:not([hidden])){background:#3a1d22;color:#fecaca;border-color:rgba(239,68,68,.45)}
body.prejoining #meeting-notice p{color:#fecaca}
body.prejoining #meeting-security-link{background:transparent;color:var(--accent-strong);border:1px solid var(--line-strong)}
body.prejoining.prejoin-manager #workspace-content{background:var(--surface);border:1px solid var(--line);color:var(--text)}
body.prejoining.prejoin-manager #workspace-content label{color:var(--text)}
@media(max-width:480px){.prejoin-brand{font-size:0;gap:0}#prejoin[data-step=preview] .prejoin-brand{font-size:0}}
@media(max-width:600px){#prejoin .prejoin-actions>:is(button,a,#prejoin-submit-slot){flex:1 1 40%}#prejoin #prejoin-submit-slot #join{width:100%}}