.esep-room-launch { margin: 12px 0; }
.esep-room-launch .esep-room-open { display: inline-flex; align-items: center; justify-content: center; gap: 12px; padding: 13px 19px; border: 1px solid #fff; border-radius: 9px; background: #161b22; color: #fff; font: 600 14px/1.3 system-ui, sans-serif; cursor: pointer; box-shadow: 0 3px 18px #0003; text-transform: none; }
.esep-room-launch .esep-room-open:hover { background: #333d48; color: #fff; }
.esep-room-launch.esep-room-below-image { display: block; position: static !important; width: 100%; float: none; clear: both; margin: 12px 0 0; padding: 0; text-align: center; pointer-events: auto; box-sizing: border-box; }
.esep-room-below-image button { max-width: 100%; }
dialog.esep-room-dialog { display: none; position: fixed; inset: 0; margin: 0; width: 100vw; height: 100vh; height: 100dvh; max-width: none; max-height: none; padding: 0; border: 0; background: #10151b; color: #fff; z-index: 2147483647; font: 14px/1.4 system-ui, sans-serif; overflow: hidden; box-sizing: border-box; }
dialog.esep-room-dialog[open] { display: flex; flex-direction: column; }
.esep-room-dialog::backdrop { background: #000c; }
.esep-room-dialog *, .esep-room-dialog *::before, .esep-room-dialog *::after { box-sizing: border-box; }
.esep-room-dialog button { min-height: 42px; border: 1px solid #55616e; background: #25313e; color: #fff; border-radius: 8px; padding: 8px 13px; font: 600 14px/1.25 system-ui, sans-serif; text-transform: none; cursor: pointer; margin: 0; }
.esep-room-dialog button:hover { background: #3a485a; color: #fff; }
.esep-room-dialog button:focus-visible, .esep-room-dialog input:focus-visible, .esep-room-stage:focus-visible, .esep-room-open:focus-visible { outline: 3px solid #78c6ff; outline-offset: -3px; }
.esep-room-dialog [hidden] { display: none !important; }
.esep-room-header { flex: 0 0 auto; display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: max(10px, env(safe-area-inset-top)) max(14px, env(safe-area-inset-right)) 10px max(14px, env(safe-area-inset-left)); }
.esep-room-header h2 { margin: 0; color: #fff; font: 600 17px/1.25 system-ui, sans-serif; }
.esep-room-stage { position: relative; flex: 1 1 auto; min-height: 80px; overflow: hidden; isolation: isolate; touch-action: none; background: #222c36; user-select: none; -webkit-user-select: none; cursor: grab; }
.esep-room-stage:active { cursor: grabbing; }
.esep-room-stage .esep-room-video { display: block; position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; pointer-events: none; }
.esep-room-stage .esep-room-photo { position: absolute; display: block; height: auto; max-width: none !important; max-height: none !important; margin: 0; padding: 0; border: 0; transform: translate(-50%, -50%); pointer-events: none; user-select: none; -webkit-user-drag: none; }
.esep-room-controls { flex: 0 0 auto; max-height: 48%; overflow-y: auto; padding: 10px max(14px, env(safe-area-inset-right)) max(10px, env(safe-area-inset-bottom)) max(14px, env(safe-area-inset-left)); background: #10151b; }
.esep-room-controls p { margin: 0 0 8px; font: inherit; color: inherit; }
.esep-room-hint, .esep-room-note { text-align: center; }
.esep-room-sizing { display: flex; gap: 8px; align-items: center; max-width: 620px; margin: 0 auto 8px; }
.esep-room-sizing label { margin: 0; color: #fff; font: inherit; }
.esep-room-sizing input { flex: 1; width: 80px; min-width: 30px; height: 36px; margin: 0; padding: 0; accent-color: #78c6ff; cursor: pointer; }
.esep-room-sizing output { min-width: 44px; text-align: right; font-variant-numeric: tabular-nums; color: #fff; }
.esep-room-actions { display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; }
.esep-room-controls .esep-room-status { margin: 8px 0; text-align: center; color: #c9e6ff; }
.esep-room-controls .esep-room-note { font-size: 11px; color: #b6c0cc; margin-bottom: 0; }
@media (max-width: 400px) { .esep-room-sizing label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); } }
@media (max-height: 500px) and (orientation: landscape) { .esep-room-header { padding-top: 5px; padding-bottom: 5px; } .esep-room-controls { max-height: 42%; padding-top: 5px; } .esep-room-controls .esep-room-hint { display: none; } }
