:root{--theme-bg-rgb: 0, 0, 0;--theme-text-rgb: 255, 255, 255;--theme-accent-rgb: 37, 99, 235;--theme-success-rgb: 40, 120, 40;--theme-danger-rgb: 255, 80, 80;--theme-warning-rgb: 160, 110, 20;--theme-control-opacity: .78;--theme-panel-opacity: .45;--theme-status-opacity: .55;--theme-hover-opacity: .5;--theme-border-opacity: 1;--theme-control-radius: 10px;--theme-panel-radius: 14px;--theme-card-radius: 20px;--theme-control-blur: 8px;--theme-status-blur: 10px;--theme-text-outline-color: #000;--theme-text-outline-offset: 1px;--theme-font-size-action: 13px;--theme-font-size-icon: 18px;--color-black: rgb(var(--theme-bg-rgb));--color-white: rgb(var(--theme-text-rgb));--color-white-rgb: rgb(var(--theme-text-rgb));--color-border: rgba(68, 68, 68, var(--theme-border-opacity));--color-border-strong: rgba(51, 51, 51, var(--theme-border-opacity));--color-border-hover: rgb(var(--theme-text-rgb));--color-muted: #aaa;--color-muted-dark: #888;--color-muted-deeper: #777;--color-brand: rgb(var(--theme-accent-rgb));--color-brand-hover: #3b82f6;--color-preview-on: #38b134;--color-preview-off: #802020;--color-meter-track: #222;--color-meter-fill: #44cc44;--surface-control: rgba(var(--theme-bg-rgb), var(--theme-control-opacity));--surface-control-spaced: rgba(var(--theme-bg-rgb), var(--theme-control-opacity));--surface-control-hover: rgba(var(--theme-bg-rgb), var(--theme-hover-opacity));--surface-pip: rgba(0,0,0,.75);--surface-status: rgba(var(--theme-bg-rgb), var(--theme-status-opacity));--surface-panel: rgba(var(--theme-bg-rgb), var(--theme-panel-opacity));--surface-enter: rgba(0,0,0,.72);--surface-enter-hover: rgba(255,255,255,.1);--surface-login-card: #101010;--surface-login-input: #1a1a1a;--state-active-green: rgba(var(--theme-success-rgb), .65);--state-active-green-compact: rgba(var(--theme-success-rgb), .65);--state-active-blue: rgba(40, 59, 120, .65);--state-active-amber: rgba(var(--theme-warning-rgb), .65);--state-active-red: rgba(var(--theme-danger-rgb), .65);--divider-subtle: rgba(255, 255, 255, .15);--divider-subtle-compact: rgba(255,255,255,.15);--chat-text-primary: rgba(255, 255, 255, .95);--chat-text-secondary: rgba(255, 255, 255, .85);--radius-control: var(--theme-control-radius);--radius-panel: var(--theme-panel-radius);--radius-card: var(--theme-card-radius);--blur-control: blur(var(--theme-control-blur));--blur-status: blur(var(--theme-status-blur));--transition-opacity: opacity .2s;--transition-pip: opacity .2s, transform .2s;--transition-control: background .15s, border-color .15s, transform .15s;--transition-control-alt: background .15s, transform .15s, border-color .15s;--transition-icon: background .15s, transform .15s;--transition-enter: background .2s, transform .2s;--transition-login: background .2s, transform .15s;--transition-control-state: background-color .2s, border-color .2s, color .2s, opacity .2s;--transition-preview: .2s;--transition-meter: width .18s ease-out;--text-shadow-outline: calc(0px - var(--theme-text-outline-offset)) calc(0px - var(--theme-text-outline-offset)) 0 var(--theme-text-outline-color), var(--theme-text-outline-offset) calc(0px - var(--theme-text-outline-offset)) 0 var(--theme-text-outline-color), calc(0px - var(--theme-text-outline-offset)) var(--theme-text-outline-offset) 0 var(--theme-text-outline-color), var(--theme-text-outline-offset) var(--theme-text-outline-offset) 0 var(--theme-text-outline-color);--shadow-control-on: 0 0 10px rgba(120, 255, 120, .1);--shadow-control-off: 0 0 12px rgba(255, 80, 80, .1);--shadow-active-green: 0 0 0 1px rgba(255, 255, 255, .25), 0 0 12px rgba(120, 255, 120, .12);--shadow-login: 0 0 50px rgba(0,0,0,.7)}html,body,#root{margin:0;width:100%;height:100%;overflow:hidden;background:var(--color-black);font-family:Arial}*{box-sizing:border-box}.app{width:100%;height:100%;position:relative;overflow:hidden;background:var(--color-black)}.program-feed{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;z-index:1}.program-player{width:100%;height:100%}.talent-view{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;overflow:hidden;background:var(--color-black);z-index:5;pointer-events:none}.talent-view video{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:contain;background:var(--color-black);transform:translateZ(0);backface-visibility:hidden;will-change:transform}.host-pip{position:absolute;right:20px;top:20px;width:320px;height:180px;overflow:hidden;background:var(--surface-pip);border:2px solid var(--color-border);border-radius:var(--radius-panel);z-index:20;transition:var(--transition-pip)}.host-pip.hide-pip{opacity:0;transform:scale(.95);pointer-events:none}.host-pip-video{position:relative;width:100%;height:100%;overflow:hidden;background:var(--color-black)}.host-pip-video video{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;transform:translateZ(0);backface-visibility:hidden;will-change:transform}.bottom-overlay{position:absolute;right:20px;bottom:20px;display:flex;align-items:flex-end;gap:10px;z-index:30;transition:var(--transition-opacity)}.control-button{transition:var(--transition-control-state)}.control-button-on{background:var(--state-active-green-compact)!important;border:1px solid var(--color-border)!important;color:var(--color-white-rgb)!important;box-shadow:var(--shadow-control-on)}.control-button-off{background:var(--state-active-red)!important;border:1px solid var(--color-border)!important;color:var(--color-white-rgb)!important;box-shadow:var(--shadow-control-off)}.bottom-overlay button.control-button-on:hover,.bottom-overlay button.control-button-off:hover{background:var(--surface-control-hover)!important;border-color:var(--color-border-hover)!important}.bottom-overlay button,.cog-action-button,.draw-button,.chat-panel button{height:42px;border-radius:var(--radius-control);border:1px solid var(--color-border);color:var(--color-white);cursor:pointer;transition:var(--transition-control)}.bottom-overlay button{padding:0 16px;background:var(--surface-control);text-shadow:var(--text-shadow-outline);font-size:var(--theme-font-size-action);letter-spacing:.5px;-webkit-backdrop-filter:var(--blur-control);backdrop-filter:var(--blur-control)}.bottom-overlay button:hover{background:var(--surface-control-hover);border-color:var(--color-border-hover)}.bottom-overlay button:active{transform:scale(.96)}.bottom-overlay button.active{border-color:var(--color-border);background:var(--state-active-green);box-shadow:var(--shadow-active-green)}.bottom-overlay button.active:hover{background:var(--surface-control-hover);border-color:var(--color-border-hover)}.mode-button{width:100px;align-items:center;border-color:var(--color-border)!important;color:var(--color-white);text-shadow:var(--text-shadow-outline);cursor:pointer;font-size:var(--theme-font-size-action);letter-spacing:.5px;-webkit-backdrop-filter:var(--blur-control);backdrop-filter:var(--blur-control);transition:var(--transition-control)}.stage-mode{background:var(--state-active-blue)!important;border-color:var(--color-border)!important}.conference-mode{background:var(--state-active-amber)!important;border-color:var(--color-border)!important}.mode-button.stage-mode:hover,.mode-button.conference-mode:hover{background:var(--surface-control-hover)!important;border-color:var(--color-border-hover)!important}.control-group{position:relative}.control-group-title{display:flex;align-items:center;justify-content:center;gap:12px;color:var(--color-muted);font-size:11px;letter-spacing:1px;margin-bottom:4px}.control-group-title:before,.control-group-title:after{content:"";flex:1;height:1px;background:var(--divider-subtle)}.control-group-buttons{display:flex;gap:10px;color:var(--color-white);text-shadow:var(--text-shadow-outline);cursor:pointer;font-size:var(--theme-font-size-action);letter-spacing:.5px;-webkit-backdrop-filter:var(--blur-control);backdrop-filter:var(--blur-control);transition:var(--transition-control)}.status-bar{position:absolute;top:20px;left:20px;display:flex;align-items:center;gap:20px;padding:10px 14px;border-radius:var(--radius-control);color:var(--color-white);background:var(--surface-status);-webkit-backdrop-filter:var(--blur-status);backdrop-filter:var(--blur-status);z-index:30}.copy-invite-button{border:1px solid var(--color-border);border-radius:var(--radius-control);padding:4px 8px;color:var(--color-white);background:var(--surface-control);cursor:pointer;font:inherit;letter-spacing:0}.copy-invite-button:hover{background:var(--surface-control-hover)}.cog-container{position:absolute;left:20px;bottom:20px;display:flex;align-items:flex-end;z-index:30}.cog-button,.chat-toggle,.draw-toggle{width:42px;height:42px;padding:0;border-radius:var(--radius-panel);border:1px solid var(--color-border);background:var(--surface-control-spaced);color:var(--color-white);font-size:var(--theme-font-size-icon);cursor:pointer;-webkit-backdrop-filter:var(--blur-control);backdrop-filter:var(--blur-control)}.cog-button{flex-shrink:0;display:flex;align-items:center;justify-content:center;line-height:1;transition:var(--transition-icon)}.cog-button:hover{background:var(--surface-control-hover);border-color:var(--color-border-hover)}.cog-button:active{transform:scale(.95)}.cog-menu{position:absolute;left:52px;bottom:0;display:flex;flex-direction:row;align-items:flex-start;gap:22px;padding:0}.cog-section{display:flex;flex-direction:column;gap:8px}.cog-title{color:var(--color-muted-dark);font-size:11px;font-weight:700;letter-spacing:1.5px;padding:0 2px}.cog-grid{display:grid;grid-template-rows:repeat(2,42px);grid-auto-flow:column;grid-auto-columns:140px;gap:10px}.cog-grid-single,.cog-grid-alt{display:flex;flex-direction:row;gap:10px}.cog-action-button{width:140px;padding:0 14px;background:var(--surface-control);text-shadow:var(--text-shadow-outline);font-size:var(--theme-font-size-action);letter-spacing:.5px;-webkit-backdrop-filter:var(--blur-control);backdrop-filter:var(--blur-control)}.cog-action-button:hover{background:var(--surface-control-hover);border-color:var(--color-border-hover)}.cog-action-button:active{transform:scale(.96)}.cog-action-button.active{border-color:var(--color-border);letter-spacing:.5px;background:var(--state-active-green);box-shadow:var(--shadow-active-green)}.cog-action-button.active:hover{background:var(--surface-control-hover);border-color:var(--color-border-hover)}.chat-container{position:absolute;left:20px;bottom:124px;z-index:30}.chat-panel{position:absolute;left:52px;bottom:0;width:440px;height:520px;padding:0;border:none;border-radius:var(--radius-panel);-webkit-backdrop-filter:none;backdrop-filter:none;display:flex;flex-direction:column;gap:10px}.chat-title{display:flex;align-items:center;justify-content:center;gap:12px;color:var(--color-muted);font-size:11px;letter-spacing:1px;padding-top:10px;margin-bottom:0}.chat-title:before,.chat-title:after{content:"";flex:1;height:1px;background:var(--divider-subtle-compact)}.chat-history{flex:1;min-height:0;background:var(--surface-panel);border-radius:var(--radius-panel);display:flex;flex-direction:column}.chat-message{word-break:break-word;overflow-wrap:anywhere}.chat-messages{flex:1;min-height:0;overflow-y:auto;padding:8px 12px;display:flex;flex-direction:column;gap:9px;color:var(--color-white);font-size:14px;font-weight:400;letter-spacing:.6px}.chat-input-area{display:flex;flex-direction:column;gap:10px}.chat-message:nth-child(odd) .chat-text{color:var(--chat-text-primary)}.chat-message:nth-child(2n) .chat-text{color:var(--chat-text-secondary)}.chat-sender{font-weight:600;margin-right:4px}.chat-text{font-weight:400}.chat-input{resize:none;height:100px;width:440px;padding:10px;border-radius:var(--radius-control);border:1px solid var(--color-border);background:var(--surface-panel);color:var(--color-white);font-size:14px;outline:none;-webkit-backdrop-filter:var(--blur-control);backdrop-filter:var(--blur-control)}.login-input::placeholder,.chat-input::placeholder{color:var(--color-muted)}.chat-toggle{margin-bottom:0;display:flex;align-items:center;justify-content:center;line-height:1;transition:var(--transition-control-alt)}.chat-toggle:hover{background:var(--surface-control-hover);border-color:var(--color-border-hover)}.chat-toggle:active{transform:scale(.95)}.chat-panel button{width:440px;background:var(--surface-panel);font-size:14px}.chat-panel button:hover{background:var(--surface-control-hover);border-color:var(--color-border-hover)}.show{opacity:1}.hide{opacity:0;pointer-events:none}.stage-entry.hidden{display:none}.stage-entry{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:transparent;z-index:25}.enter-button{position:relative;width:260px;height:80px;border-radius:var(--radius-panel);border:2px solid var(--color-white);background:var(--surface-enter);color:var(--color-white);font-size:24px;font-weight:600;letter-spacing:2px;opacity:1;visibility:visible;cursor:pointer;transition:var(--transition-enter)}.enter-button:hover{background:var(--surface-enter-hover);transform:scale(1.03)}.login-screen{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;justify-content:center;align-items:center;background:radial-gradient(circle at center,#111 0%,#050505 40%,var(--color-black) 100%);z-index:999}.login-card{width:420px;padding:40px;display:flex;flex-direction:column;gap:16px;background:var(--surface-login-card);border:1px solid var(--color-border-strong);border-radius:var(--radius-card);box-shadow:var(--shadow-login)}.login-title{margin:0;color:var(--color-white);font-size:38px;font-weight:700}.login-subtitle{color:var(--color-muted-deeper);margin-bottom:10px}.login-input{height:48px;padding:0 15px;border-radius:var(--radius-control);border:1px solid var(--color-border-strong);background:var(--surface-login-input);color:var(--color-white);font-size:16px;outline:none}.login-input:focus{border-color:var(--color-brand)}.login-button{height:50px;border:none;border-radius:var(--radius-control);background:var(--color-brand);color:var(--color-white);font-size:16px;cursor:pointer;transition:var(--transition-login)}.login-button:hover{background:var(--color-brand-hover)}.login-button:active{transform:scale(.98)}.preview-box{margin-top:20px;display:flex;flex-direction:column;gap:10px}.preview-video{width:100%;aspect-ratio:16/9;border-radius:var(--radius-control);object-fit:cover;background:var(--color-black)}.preview-controls{display:flex;gap:10px}.preview-controls .control-button{border:none;border-radius:var(--radius-control);padding:12px;cursor:pointer;background:var(--color-preview-on);color:var(--color-white);font-size:14px;transition:var(--transition-preview)}.preview-controls .control-button.disabled{background:var(--color-preview-off)}.mic-meter-container{width:100%;height:10px;background:var(--color-meter-track);border-radius:var(--radius-control);overflow:hidden;margin-top:10px}.mic-meter-bar{height:100%;border-radius:var(--radius-control);background:var(--color-meter-fill);transition:var(--transition-meter)}.drawing-canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;z-index:24;pointer-events:none}.drawing-canvas.drawing-enabled{pointer-events:auto;cursor:crosshair}.draw-controls{position:absolute;left:20px;bottom:72px;display:flex;align-items:flex-end;z-index:31}.draw-toggle{transition:var(--transition-control)}.draw-toggle:hover{background:var(--surface-control-hover);border-color:var(--color-border-hover)}.draw-toggle:active{transform:scale(.95)}.draw-menu{position:absolute;left:52px;bottom:0;display:flex;gap:10px}.draw-button{width:140px;padding:0 16px;background:var(--surface-control-spaced);text-shadow:var(--text-shadow-outline);font-size:var(--theme-font-size-action);letter-spacing:.5px;-webkit-backdrop-filter:var(--blur-control);backdrop-filter:var(--blur-control)}.draw-button:hover{background:var(--surface-control-hover);border-color:var(--color-border-hover)}.draw-button:active{transform:scale(.96)}.draw-button.active{border-color:var(--color-border);background:var(--state-active-green)}.draw-button.active:hover{background:var(--surface-control-hover);border-color:var(--color-border-hover)}.drawing-hidden{opacity:0;pointer-events:none}