/* The camera fills the entire preview, preserving proportions with a centered crop. */
.studio{padding-left:0;padding-right:0;padding-top:0}
.mirror-frame{max-width:none}
.has-camera canvas{object-fit:cover}
.remote-video{position:absolute;inset:0;display:none;background:#000}
.remote-video{width:100%;height:100%;object-fit:contain;background:#000}
.mirror-panel.has-render .remote-video{display:block}
.mirror-panel.has-render canvas{visibility:hidden}
.capture-controls,.camera-button{z-index:3}
.upload-role{flex:0 0 104px;height:108px;border-radius:12px;background:#292929;color:#eee;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;font-size:14px;cursor:pointer}
.upload-role:hover{background:#343434}.upload-role:focus-within{outline:2px solid #3297ff;outline-offset:4px}.upload-role.is-disabled{opacity:.4;pointer-events:none}.upload-role input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}.upload-plus{font-size:34px;font-weight:200;line-height:1}.role-divider{height:108px;width:1px;background:#454545;flex:0 0 1px}
@media(max-width:600px){.upload-role{flex-basis:76px;height:90px;font-size:12px}.upload-plus{font-size:28px}.role-divider{height:90px}}
.screen-mode .role-strip,.screen-mode .capture-buttons,.screen-mode .result-actions{display:none}
.screen-mode .studio{gap:0;padding-bottom:0}.screen-mode .mirror-panel{height:100dvh}.screen-mode .capture-controls{bottom:34px}.screen-mode #timer{font-size:38px}
.screen-mode .camera-button{top:26px;right:26px;transform:none;padding:12px 18px;font-size:12px;background:#f3f3ef;color:#111;border:0;border-radius:12px}
.screen-mode .mirror-panel.has-camera .camera-button{display:none}.screen-mode #inline-status{top:22px}.screen-mode .result-screen{min-height:100dvh}
.lobby{position:fixed;inset:0;z-index:2;display:grid;grid-template-columns:1.2fr .8fr;align-items:center;gap:7vw;padding:7vh 9vw;background:linear-gradient(90deg,#090b09f4 0%,#11150feb 55%,#090b09e6 100%);backdrop-filter:blur(8px)}.lobby-copy{max-width:650px}.lobby-seal{display:grid;place-items:center;width:62px;height:62px;border:1px solid #d8ba79;color:#d8ba79;border-radius:7px;font:36px serif}.lobby-copy>p{margin:32px 0 14px;color:#96866a;font:12px monospace;letter-spacing:3px}.lobby h1{font:clamp(42px,5vw,82px)/1.35 "Songti SC",serif;letter-spacing:5px;margin:0}.queue-summary{display:flex;gap:25px;align-items:center;margin-top:42px;color:#a6ad9f;font-size:15px}.queue-summary strong{color:#e3c37e;font-size:28px;margin:0 5px}.queue-summary span+span{padding-left:25px;border-left:1px solid #3a4035}.qr-card{justify-self:center;width:min(320px,26vw);padding:24px;background:#f5f4ec;color:#171a15;border-radius:22px;text-align:center;box-shadow:0 25px 80px #0007}.qr-card img{display:block;width:100%;aspect-ratio:1;border-radius:9px}.qr-card strong{display:block;font-size:22px;margin-top:18px}.qr-card span{display:block;color:#73776e;font-size:11px;margin-top:9px}.screen-mode .lobby[hidden]{display:none!important}@media(max-width:800px){.lobby{grid-template-columns:1fr;text-align:center;padding:35px}.lobby-copy{display:none}.qr-card{width:min(300px,72vw)}}
.join-overlay{position:fixed;z-index:5;left:28px;bottom:28px;background:#111d;border:1px solid #ffffff22;border-radius:18px;padding:15px;backdrop-filter:blur(14px);box-shadow:0 12px 50px #0007}.join-overlay>div{display:grid;grid-template-columns:118px 210px;grid-template-rows:auto auto;column-gap:17px;align-items:center}.join-overlay img{width:118px;height:118px;grid-row:1/3;border-radius:9px;background:white}.join-overlay span{font-size:25px;font-weight:650;align-self:end}.join-overlay small{font-size:11px;color:#aaa;line-height:1.8;align-self:start;margin-top:8px}.screen-mode:not(.queue-visible) .join-overlay{display:none}@media(max-width:700px){.join-overlay{left:14px;bottom:14px}.join-overlay>div{grid-template-columns:90px 165px}.join-overlay img{width:90px;height:90px}.join-overlay span{font-size:20px}}
