
.join-layout{display:grid;grid-template-columns:380px 1fr;gap:18px}
.join-card,.stage-panel{padding-bottom:18px}
.join-inner{padding:18px 20px 0;display:grid;gap:14px}
.join-inner label{display:grid;gap:8px;font-size:12px;font-weight:700;color:var(--muted)}
.join-inner input{height:48px;border-radius:16px;border:1px solid var(--line);background:rgba(255,255,255,.02);padding:0 14px;color:var(--text)}
.stage-panel{display:flex;align-items:stretch}
.stage-frame{position:relative;margin:18px 20px 0;width:calc(100% - 40px);aspect-ratio:16/9;border-radius:24px;overflow:hidden;background:#000;border:1px solid var(--line)}
.stage{width:100%;height:100%;display:grid;place-items:center}
.stage video,.stage canvas{width:100%;height:100%;object-fit:cover;display:block}
.stage-overlay{position:absolute;left:16px;right:16px;bottom:16px;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:12px 16px;border-radius:18px;background:rgba(3,12,21,.7);backdrop-filter:blur(10px)}
.stage-overlay strong{font-size:16px}.stage-overlay span{font-size:12px;color:#bdd1ea}
.error-box,.debug-box{padding:12px 14px;border-radius:16px;border:1px solid var(--line);background:rgba(255,255,255,.02);font-size:12px;color:#ffb8b8;white-space:pre-wrap}
.hidden{display:none !important}
@media (max-width:1100px){.join-layout{grid-template-columns:1fr}}
