.join-screen{min-height:100vh;display:grid;place-items:center;padding:24px}.join-card{width:min(440px,100%);background:var(--color-surface);border-radius:var(--radius-xl);padding:32px;box-shadow:var(--shadow-card);border:1px solid var(--color-border)}.join-card .logo{font-size:var(--text-2xl);font-weight:700;color:var(--color-forest);letter-spacing:-.02em;margin:0 0 8px}.join-card .tagline{color:var(--color-text-muted);margin:0 0 24px;font-size:var(--text-sm)}.join-card label{display:block;font-size:var(--text-sm);font-weight:600;margin-bottom:8px}.join-card input{width:100%;padding:12px 16px;border:1px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--text-lg);letter-spacing:.2em;text-transform:uppercase;margin-bottom:16px}.join-card input:focus{border-color:var(--color-forest-mid)}.btn-primary{width:100%;padding:14px 20px;background:var(--color-forest);color:#fff;border:none;border-radius:var(--radius-md);font-weight:600;font-size:var(--text-base)}.btn-primary:hover{background:var(--color-forest-mid)}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.join-error{color:var(--color-danger);font-size:var(--text-sm);margin-top:12px}.session-shell{min-height:100vh;padding:16px;display:flex;flex-direction:column;gap:0}.browser-frame{flex:1;display:flex;flex-direction:column;background:var(--color-surface);border-radius:var(--radius-shell);border:1px solid var(--color-border);box-shadow:var(--shadow-card);overflow:hidden;max-width:1400px;margin:0 auto;width:100%}.topbar{height:var(--topbar-height);display:flex;align-items:center;gap:16px;padding:0 20px;border-bottom:1px solid var(--color-border);background:var(--color-surface-elevated)}.topbar .brand{font-weight:700;font-size:var(--text-xl);color:var(--color-forest);flex-shrink:0}.session-meta{flex:1;min-width:0}.session-meta .title{font-weight:600;font-size:var(--text-sm);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:0}.session-meta .subtitle{margin:2px 0 0;font-size:var(--text-xs);color:var(--color-text-muted)}.topbar-actions{display:flex;align-items:center;gap:8px}.icon-btn{width:40px;height:40px;border:none;background:transparent;border-radius:var(--radius-sm);color:var(--color-icon);display:grid;place-items:center}.icon-btn:hover{background:var(--color-bg)}.btn-finish{padding:10px 18px;background:var(--color-forest);color:#fff;border:none;border-radius:var(--radius-md);font-weight:600;font-size:var(--text-sm)}.btn-finish:hover{background:var(--color-forest-mid)}.session-body{flex:1;display:flex;min-height:0}.stage{flex:1;display:flex;flex-direction:column;padding:16px;min-width:0}.video-wrap{position:relative;flex:1;min-height:280px;background:var(--color-forest-deep);border-radius:var(--radius-lg);overflow:hidden}.video-wrap video{width:100%;height:100%;object-fit:cover;display:block}.video-wrap .placeholder{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;color:var(--color-mint);font-size:var(--text-sm);text-align:center;padding:24px}.live-badge{position:absolute;top:16px;left:16px;display:flex;align-items:center;gap:8px;background:#0000008c;color:#fff;padding:6px 12px;border-radius:999px;font-size:var(--text-xs);font-weight:600}.live-badge .dot{width:8px;height:8px;border-radius:50%;background:var(--color-live);animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.session-timer{position:absolute;top:16px;left:100px;color:#fff;font-size:var(--text-xs);font-variant-numeric:tabular-nums;background:#0006;padding:6px 10px;border-radius:var(--radius-sm)}.pip-local{position:absolute;bottom:16px;right:16px;width:120px;height:90px;border-radius:var(--radius-md);overflow:hidden;border:2px solid rgba(255,255,255,.8);box-shadow:var(--shadow-subtle)}.pip-local video{width:100%;height:100%;object-fit:cover}.controls-bar{display:flex;justify-content:center;gap:8px;padding:16px 8px 8px;flex-wrap:wrap}.control-item{display:flex;flex-direction:column;align-items:center;gap:6px;min-width:64px}.control-item button{width:48px;height:48px;border-radius:50%;border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-icon);display:grid;place-items:center}.control-item button.active{background:var(--color-forest);color:#fff;border-color:var(--color-forest)}.control-item button.off{background:var(--color-live-soft);color:var(--color-live);border-color:#ffcdd2}.control-item span{font-size:var(--text-xs);color:var(--color-text-muted)}.control-item .rec-dot{width:8px;height:8px;background:var(--color-record);border-radius:50%;display:inline-block}.sidebar{width:var(--sidebar-width);border-left:1px solid var(--color-border);display:flex;flex-direction:column;background:var(--color-surface-elevated);flex-shrink:0}.sidebar-tabs{display:flex;border-bottom:1px solid var(--color-border)}.sidebar-tabs button{flex:1;padding:14px;border:none;background:transparent;font-weight:600;font-size:var(--text-sm);color:var(--color-text-muted);border-bottom:2px solid transparent}.sidebar-tabs button.active{color:var(--color-forest);border-bottom-color:var(--color-forest)}.sidebar-panel{flex:1;overflow:hidden;display:none;flex-direction:column}.sidebar-panel.active{display:flex}.scene-card{margin:12px;padding:16px;background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-primary-mid) 100%);color:#fff;border-radius:var(--radius-lg)}.scene-card h3{margin:0 0 8px;font-size:var(--text-sm);font-weight:600}.scene-card p{margin:0;font-size:var(--text-sm);line-height:1.45;opacity:.95}.scene-card .empty{opacity:.7;font-style:italic}.chat-feed{flex:1;overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:12px}.chat-message{display:flex;gap:10px;align-items:flex-start}.chat-message .avatar{width:32px;height:32px;border-radius:50%;background:var(--color-mint);color:var(--color-forest-deep);font-size:var(--text-xs);font-weight:700;display:grid;place-items:center;flex-shrink:0}.chat-message .bubble-wrap{flex:1;min-width:0}.chat-message .name{font-size:var(--text-xs);color:var(--color-text-muted);margin-bottom:4px}.chat-message .bubble{display:inline-block;padding:10px 14px;border-radius:var(--radius-md);font-size:var(--text-sm);line-height:1.4;max-width:100%}.chat-message.other .bubble{background:var(--color-chat-other)}.chat-message.mine .bubble{background:var(--color-chat-mine)}.chat-message.system .bubble{background:var(--color-chat-system);color:#fff}.chat-input-row{display:flex;gap:8px;padding:12px;border-top:1px solid var(--color-border)}.chat-input-row input{flex:1;border:1px solid var(--color-border);border-radius:var(--radius-md);padding:10px 14px}.chat-input-row button.send{padding:10px 16px;background:var(--color-forest);color:#fff;border:none;border-radius:var(--radius-md);font-weight:600}.hidden{display:none!important}@media(max-width:960px){.session-body{flex-direction:column}.sidebar{width:100%;max-height:40vh;border-left:none;border-top:1px solid var(--color-border)}}