.error-boundary{align-items:center;background:linear-gradient(135deg,#ff4b4b26,#ff6b6b14);display:flex;justify-content:center;min-height:50vh}.error-boundary-content{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#1f2937f2;border:1px solid #ff4b4b33;border-radius:16px;box-shadow:0 10px 25px #ff4b4b1a,0 4px 10px #0000001a;max-width:500px;padding:2rem;text-align:center}.error-icon{filter:drop-shadow(0 2px 4px rgba(255,75,75,.3));font-size:3rem;margin-bottom:1rem}.error-boundary-content h2{color:#ff4b4b;font-size:1.5rem;font-weight:600;margin-bottom:1rem}.error-boundary-content p{color:#cbd5e1;line-height:1.6;margin-bottom:1.5rem}.error-details{background:#ff4b4b0d;border-radius:8px;margin:1.5rem 0;overflow:hidden;text-align:left}.error-details summary{background:#ff4b4b1a;border-bottom:1px solid #ff4b4b33;color:#d63031;cursor:pointer;font-weight:500;padding:.75rem 1rem;transition:background-color .2s ease}.error-details summary:hover{background:#ff4b4b26}.error-content{padding:1rem}.error-content p{color:#9ca3af;font-size:.875rem;margin-bottom:.5rem}.error-stack{background:#374151cc;border:1px solid #4b556399;border-radius:4px;color:#e2e8f0;font-size:.75rem;max-height:200px;overflow-x:auto;overflow-y:auto;padding:.75rem;white-space:pre-wrap}.error-actions{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center}.error-actions .btn-pill{min-width:140px}@media (max-width:480px){.error-boundary{min-height:40vh;padding:1rem}.error-boundary-content{padding:1.5rem}.error-actions{flex-direction:column}.error-actions .btn-pill{width:100%}}@media (prefers-color-scheme:dark){.error-boundary{background:linear-gradient(135deg,#ff4b4b26,#ff6b6b14)}.error-boundary-content{background:#1e1e1ef2;border:1px solid #ff4b4b4d;color:#e0e0e0}.error-boundary-content p{color:#b0b0b0}.error-details{background:#ff4b4b1a}.error-details summary{background:#ff4b4b26;color:#ff6b6b}.error-stack{background:#2a2a2a;border-color:#444;color:#e0e0e0}}@keyframes bounce{0%,20%,50%,80%,to{transform:translateY(0)}40%{transform:translateY(-30px)}60%{transform:translateY(-15px)}}.btn-pill.queue-active{animation:queuePulse .3s ease-out;background:linear-gradient(135deg,var(--primary-color) 0,var(--secondary-color) 100%);border:none;box-shadow:0 4px 15px #6366f14d;color:#fff}@keyframes queuePulse{0%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:scale(1)}}.icon.spinning{animation:spin 1s linear infinite}.add-url-form,.video-queue{-webkit-backface-visibility:hidden;backface-visibility:hidden;will-change:transform,opacity}.video-queue-container{transition:all .4s cubic-bezier(.68,-.55,.265,1.55)}.video-queue-enter{opacity:0;transform:translateY(-20px) scale(.95)}.video-queue-enter-active,.video-queue-exit{opacity:1;transform:translateY(0) scale(1)}.video-queue-exit-active{opacity:0;transform:translateY(-20px) scale(.95)}.animation-fallback{transition:all .3s ease}.animation-fallback.fade-in{animation:simpleFadeIn .3s ease-in-out}.animation-fallback.slide-in{animation:simpleSlideIn .3s ease-out}.animation-fallback.scale-in{animation:simpleScaleIn .2s ease-out}@keyframes simpleFadeIn{0%{opacity:0}to{opacity:1}}@keyframes simpleSlideIn{0%{opacity:0;transform:translateX(-300px)}to{opacity:1;transform:translateX(0)}}@keyframes simpleScaleIn{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.animation-loading{opacity:.7;transition:opacity .2s ease}.animation-loaded{opacity:1}.optimized-motion{-webkit-backface-visibility:hidden;backface-visibility:hidden;transform-style:preserve-3d;will-change:transform,opacity}.motion-safe{contain:layout style paint}@media (prefers-reduced-motion:reduce){.animation-fallback,.motion-safe,.optimized-motion{animation:none!important;transition:none!important}}@media (max-width:768px){.animation-fallback{animation-duration:.2s!important}.optimized-motion{transition-duration:.2s!important}}.account-settings{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#12141ed9;border:1px solid #ffffff14;border-radius:20px;box-shadow:0 20px 40px #06060c59;color:var(--text-primary);display:flex;flex-direction:column;gap:1.25rem;padding:1.25rem 1.35rem}.account-settings--desktop{margin-top:1.5rem}.account-settings__header{align-items:center;display:flex;gap:1rem;justify-content:space-between}.account-settings__header-info{align-items:center;display:flex;gap:.85rem}.account-settings__header-icon{color:var(--primary-color);filter:drop-shadow(0 4px 16px rgba(var(--primary-color-rgb),.35));font-size:1.6rem}.account-settings__header-info h3{color:#fff;font-size:1.1rem;font-weight:700;margin:0}.account-settings__header-info p{color:#f4f7ffa6;font-size:.82rem;margin:.25rem 0 0}.account-settings__close{align-items:center;background:#ffffff0f;border:none;border-radius:12px;color:#f4f7ffd9;cursor:pointer;display:inline-flex;height:36px;justify-content:center;transition:all var(--transition-normal);width:36px}.account-settings__close:hover{background:#ffffff1f;color:#fff}.account-settings__section{display:flex;flex-direction:column;gap:.85rem}.account-settings__section h4{color:#f4f7ffe6;font-size:.95rem;font-weight:700;margin:0}.account-settings__section p{color:#f4f7ff99;font-size:.82rem;line-height:1.45;margin:0}.account-settings__form{display:flex;flex-direction:column;gap:.85rem}.account-settings__field{display:flex;flex-direction:column;gap:.45rem}.account-settings__field-label{color:#f4f7ffc7;font-size:.82rem;font-weight:600;letter-spacing:.01em}.account-settings__input{background:linear-gradient(135deg,#1a1c26f5,#12141ef5);border:1px solid #ffffff24;border-radius:14px;color:#f4f7ff;font-size:.95rem;padding:.85rem 1rem;transition:border-color .18s ease,box-shadow .18s ease,background .18s ease;width:100%}.account-settings__input:focus{background:linear-gradient(135deg,#202430fa,#161822fa);border-color:rgba(var(--primary-color-rgb),.75);box-shadow:0 0 0 3px rgba(var(--primary-color-rgb),.22);outline:none}.account-settings__input::placeholder{color:#f4f7ff66}.account-settings__submit{align-self:flex-start;min-width:0}.account-settings__submit-loading,.account-settings__submit-loading svg{align-items:center;display:inline-flex;gap:.5rem}.account-settings__submit-loading .loading-icon{font-size:1rem}.account-settings__section--logout{border-top:1px solid #ffffff0f;padding-top:.5rem}.account-settings__logout{align-items:center;display:inline-flex;font-weight:600;gap:.6rem;min-width:0}.account-settings__feedback{align-items:center;border-radius:14px;display:flex;font-size:.85rem;font-weight:600;gap:.5rem;padding:.75rem 1rem}.account-settings__feedback--success{background:rgba(var(--success-color-rgb),.15);border:1px solid rgba(var(--success-color-rgb),.35);color:var(--success-color)}.account-settings__feedback--error{background:rgba(var(--error-color-rgb),.15);border:1px solid rgba(var(--error-color-rgb),.35);color:var(--error-color)}.account-settings__feedback-icon{font-size:1.1rem}.account-settings--mobile{background:none;border:none;box-shadow:none;color:inherit;gap:1.1rem;padding:1.4rem 1.3rem}.account-settings--mobile .account-settings__header-info h3{font-size:1.15rem}.account-settings--mobile .account-settings__section--logout{border-top:1px solid #ffffff14}.mobile-settings-sheet{background:linear-gradient(160deg,#0b0c12f5,#171822f5);border-radius:26px 26px 0 0;bottom:0;box-shadow:0 -24px 45px #00000073;left:0;max-height:88vh;overflow-y:auto;padding:1.6rem 1.4rem calc(1.6rem + env(safe-area-inset-bottom));position:fixed;right:0;z-index:10002}.mobile-settings-sheet::-webkit-scrollbar{width:6px}.mobile-settings-sheet::-webkit-scrollbar-thumb{background:#fff3;border-radius:4px}.mobile-settings-sheet::-webkit-scrollbar-track{background:#0000}.desktop-settings-overlay{backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);background:#06080e99;inset:0;position:fixed;z-index:10010}.desktop-settings-dialog{position:fixed;right:clamp(1rem,6vw,4rem);top:clamp(4rem,8vh,6rem);width:min(420px,calc(100% - 2rem));z-index:10011}@media (max-width:900px){.desktop-settings-dialog{left:1rem;right:1rem;width:auto}}.loading-screen.hidden{opacity:0;pointer-events:none}.loading-screen .vibio-logo{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite;filter:drop-shadow(0 4px 12px rgba(var(--primary-color-rgb),.3))}.loading-screen p{font-weight:500;letter-spacing:.025em;text-shadow:0 1px 3px #0003}.loading-screen .connection-status{background:#1a1a1a;border:1px solid #333;border-radius:var(--border-radius-lg);color:var(--text-muted);font-size:.9rem;margin-top:-1rem;padding:.5rem 1rem}.step-container{align-items:center;justify-content:center;min-height:100vh;padding:1rem;width:100%}.step-container .step-content{max-width:480px;padding:2rem 2.5rem;text-align:center;width:100%}.step-header .vibio-logo{filter:drop-shadow(0 4px 12px rgba(var(--primary-color-rgb),.3));margin:0 auto 1.5rem}.step-header h1{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,var(--primary-color),var(--secondary-color));-webkit-background-clip:text;background-clip:text;font-size:1.875rem;font-weight:700;margin-bottom:.75rem}.step-header p{color:var(--text-secondary);font-size:1rem;line-height:1.5}.step-header .connection-warning{align-items:center;background:rgba(var(--warning-color-rgb),.1);border:1px solid rgba(var(--warning-color-rgb),.3);border-radius:15px;color:var(--warning-color);display:inline-flex;font-size:.875rem;font-weight:500;gap:.5rem;margin-top:1rem;padding:.5rem 1rem}.join-form,.username-form{display:flex;flex-direction:column;gap:1rem;width:100%}.input-group{text-align:left}.input-group label{color:var(--text-primary);display:block;font-size:.875rem;font-weight:600;margin-bottom:.5rem}.form-input{background:#0f0f0f;border:2px solid #333;border-radius:15px;color:var(--text-primary);font-size:1rem;outline:none;padding:.875rem 1rem;transition:all var(--transition-normal);width:100%}.form-input:focus{background:#1a1a1a;border-color:var(--primary-color);box-shadow:0 0 0 3px rgba(var(--primary-color-rgb),.2)}.form-input.invalid{border-color:var(--error-color)}.input-validation{font-size:.875rem;margin-top:.5rem;min-height:1.25rem;text-align:left}.validation-error{color:var(--error-color)}.validation-success{color:var(--success-color)}.room-options{display:flex;flex-direction:column;gap:1.5rem;width:100%}.room-option{background:#0f0f0f;border:1px solid #333;border-radius:var(--border-radius-lg);padding:1.5rem;transition:all var(--transition-normal)}.room-option:hover{border-color:var(--primary-color);transform:translateY(-2px)}.room-option h3{font-size:1.25rem;margin-bottom:.5rem}.room-option p{color:var(--text-secondary);margin-bottom:1rem}.divider{align-items:center;color:var(--text-muted);display:flex;font-size:.875rem;font-weight:600;text-align:center;text-transform:uppercase}.divider:after,.divider:before{border-bottom:1px solid #333;content:"";flex:1 1}.divider:not(:empty):before{margin-right:.5em}.divider:not(:empty):after{margin-left:.5em}.step-info{color:var(--text-muted);font-size:.875rem;margin-top:2rem}.auth-step .step-content{background:#0f0f0ff2;border:1px solid #ffffff0d;border-radius:24px;box-shadow:0 20px 50px #00000073;max-width:430px;padding:2.2rem 2.4rem}.auth-step__toggle{align-items:center;background:#ffffff0d;border-radius:18px;display:inline-flex;gap:.5rem;justify-content:center;margin-bottom:1.25rem;overflow:hidden;padding:.5rem;position:relative}.auth-step__toggle-indicator{background:linear-gradient(135deg,rgba(var(--primary-color-rgb),.95),rgba(var(--secondary-color-rgb),.95));border-radius:14px;box-shadow:0 10px 22px rgba(var(--primary-color-rgb),.28);height:calc(100% - 12px);left:6px;position:absolute;top:6px;transition:transform .35s cubic-bezier(.22,1,.36,1),width .35s cubic-bezier(.22,1,.36,1),opacity .2s ease;width:calc(50% - .5rem);will-change:transform,width,opacity;z-index:0}.auth-step__toggle-btn.active{padding:.75rem .5rem .75rem 1.75rem!important}.auth-step__toggle-btn{background:#0000;border:none;border-radius:14px;color:var(--text-secondary);cursor:pointer;font-size:.95rem;font-weight:600;padding:.75rem 1.75rem;position:relative;transition:all var(--transition-normal);z-index:1}.auth-step__toggle-btn.active,.auth-step__toggle-btn:hover{color:#fff}.auth-step__toggle-btn.active:before{border-radius:inherit;content:"";inset:0;position:absolute;z-index:-1}.auth-step__form{display:flex;flex-direction:column;gap:1.5rem;text-align:left;width:100%}.auth-step__progress{align-items:center;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#12121cb3;border:1px solid #ffffff0f;border-radius:16px;display:flex;gap:.75rem;justify-content:space-between;padding:.65rem .85rem}.auth-progress__item{align-items:center;display:flex;gap:.55rem;min-width:0;position:relative;transition:gap .3s ease}.auth-progress__item:not(.auth-progress__item--label-visible){gap:0}.auth-progress__dot{align-items:center;background:#ffffff0f;border:1px solid #ffffff14;border-radius:50%;color:#f4f7ffb3;display:flex;font-size:.95rem;font-weight:700;height:2.1rem;justify-content:center;transition:all var(--transition-normal);width:2.1rem}.auth-progress__check{height:1.1rem;width:1.1rem}.auth-progress__label{color:var(--text-secondary);display:inline-block;font-size:.82rem;font-weight:600;letter-spacing:.01em;max-width:0;opacity:0;overflow:hidden;pointer-events:none;transform:translateY(6px);transition:opacity .3s ease,max-width .35s ease,transform .3s ease;white-space:nowrap}.auth-progress__item--label-visible .auth-progress__label{max-width:12rem;opacity:1;pointer-events:auto;transform:translateY(0)}.auth-progress__item--done .auth-progress__dot{background:linear-gradient(135deg,rgba(var(--primary-color-rgb),.95),rgba(var(--secondary-color-rgb),.95));border-color:rgba(var(--primary-color-rgb),.65);box-shadow:0 8px 18px rgba(var(--primary-color-rgb),.35);color:#fff}.auth-progress__item--active .auth-progress__dot{background:rgba(var(--primary-color-rgb),.16);border-color:rgba(var(--primary-color-rgb),.55);box-shadow:0 6px 16px rgba(var(--primary-color-rgb),.28);color:#fff}.auth-progress__item--locked .auth-progress__dot{border-style:dashed;opacity:.45}.auth-progress__item--optional .auth-progress__dot{background:#ffffff0a;border-style:dashed}.auth-progress__item--optional .auth-progress__label{font-style:italic;opacity:.75}.auth-input-label--hidden{clip:rect(0,0,0,0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.auth-step__flow{display:flex;flex-direction:column;gap:1.25rem}.auth-segment{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#12141ec7;border:1px solid #ffffff14;border-radius:20px;box-shadow:0 16px 35px #06060c66;padding:1.1rem 1.3rem;transition:border-color var(--transition-normal),box-shadow var(--transition-normal),transform .35s ease}.auth-segment--secondary{background:#141420d1}.auth-segment--optional{background:#161622c7}.auth-segment--completed{border-color:rgba(var(--primary-color-rgb),.6);box-shadow:0 18px 38px rgba(var(--primary-color-rgb),.22)}.auth-segment--active{animation:auth-segment-activate .45s cubic-bezier(.22,1,.36,1);border-color:rgba(var(--primary-color-rgb),.35)}.auth-segment--locked{border-style:dashed;box-shadow:none;opacity:.6}.auth-segment--placeholder{background:#14141e99;border-color:#ffffff1f;border-style:dashed}.auth-segment__header{align-items:flex-start;display:flex;gap:.85rem;justify-content:space-between;margin-bottom:.85rem}.auth-segment__number{align-items:center;background:#ffffff14;border:1px solid #ffffff1f;border-radius:50%;color:#f4f7ffbf;display:flex;font-size:1rem;font-weight:700;height:2rem;justify-content:center;width:2rem}.auth-segment--completed .auth-segment__number{background:linear-gradient(135deg,rgba(var(--primary-color-rgb),.9),rgba(var(--secondary-color-rgb),.9));border-color:rgba(var(--primary-color-rgb),.65);color:#fff}.auth-segment__title{flex:1 1;min-width:0}.auth-segment__title p{color:var(--text-secondary);font-size:.85rem;line-height:1.45;margin:.3rem 0 0}.auth-segment__status-icon{color:rgba(var(--primary-color-rgb),.9);height:1.25rem;width:1.25rem}.auth-segment__body{display:flex;flex-direction:column;gap:.75rem}.auth-segment__hint{color:#f4f7ffa6;font-size:.8rem;line-height:1.45}.auth-segment__gate{background:#1e1e28a6;border:1px dashed #fff3;border-radius:14px;color:#f4f7ff8c;font-size:.85rem;padding:.75rem 1rem}.auth-step__add-email{align-self:flex-start;background:rgba(var(--primary-color-rgb),.08);border:1px dashed rgba(var(--primary-color-rgb),.5);border-radius:14px;color:#fff;cursor:pointer;font-weight:600;padding:.6rem 1.2rem;transition:all var(--transition-normal)}.auth-step__add-email:hover{background:rgba(var(--primary-color-rgb),.18);box-shadow:0 10px 20px rgba(var(--primary-color-rgb),.25);transform:translateY(-1px)}.auth-step__remove-email{align-self:flex-start;background:#0000;border:none;color:#f4f7ffa6;cursor:pointer;font-size:.8rem;font-weight:600;padding:0;text-decoration:underline;-webkit-text-decoration-style:dotted;text-decoration-style:dotted}.auth-step__remove-email:hover{color:#f4f7ffe6}.auth-segment__optional-hint{color:#f4f7ff8c;font-size:.78rem;line-height:1.4}.auth-wizard__skip{align-self:flex-start;background:#0000;border:none;color:#f4f7ffad;cursor:pointer;font-size:.82rem;font-weight:600;margin-top:.35rem;padding:.25rem 0;text-decoration:underline;-webkit-text-decoration-style:dotted;text-decoration-style:dotted;transition:color var(--transition-normal)}.auth-wizard__skip:hover{color:#f4f7ffeb}.auth-wizard__actions{align-items:center;display:flex;gap:1rem;justify-content:space-between;margin-top:1.35rem}.auth-wizard__actions .btn-optimized{flex:1 1}.auth-wizard__back{background:#ffffff0a;border:1px solid #ffffff2e;border-radius:14px;color:#f4f7ffd1;padding:.75rem 1.25rem;transition:all var(--transition-normal)}.auth-wizard__actions .auth-step__submit{margin-top:0}.auth-wizard__back:hover{background:#ffffff14;transform:translateY(-1px)}.auth-wizard__back:disabled{cursor:not-allowed;opacity:.5;transform:none}.auth-step .input-group label{color:#f4f7ffdb;font-size:.95rem;font-weight:600}.auth-step .input-group input{background:linear-gradient(135deg,#161820f5,#10121af5);border:1px solid #ffffff1f;border-radius:16px;caret-color:var(--primary-color);color:#f4f7ff;font-size:1rem;padding:1rem 1.15rem;transition:border-color .18s ease,box-shadow .18s ease,background .18s ease}.auth-step .input-group input::placeholder{color:#f4f7ff73;transition:color .18s ease}.auth-step .input-group input:hover{background:linear-gradient(135deg,#1c1e28f5,#12141cf5);border-color:rgba(var(--primary-color-rgb),.5)}.auth-step .input-group input:focus{background:linear-gradient(135deg,#1f222dfa,#171a22fa);border-color:rgba(var(--primary-color-rgb),.85);box-shadow:0 0 0 3px rgba(var(--primary-color-rgb),.22)}.auth-step .input-group input:focus::placeholder{color:#f4f7ff47}.auth-step .error-message{background:rgba(var(--error-color-rgb),.12);border:1px solid rgba(var(--error-color-rgb),.35);border-radius:12px;color:var(--error-color);font-size:.9rem;margin-top:.25rem;padding:.75rem 1rem}.auth-step .validation-hint{color:var(--text-muted);font-size:.85rem;margin-top:-.5rem}.auth-step__submit{align-items:center;display:inline-flex;font-weight:600;gap:.65rem;justify-content:center;margin-top:.5rem;width:100%}.auth-step__oauth{margin-top:1.5rem;width:100%}.auth-step__divider{margin-bottom:1.25rem;position:relative;text-align:center}.auth-step__divider:after,.auth-step__divider:before{background:#ffffff26;content:"";height:1px;position:absolute;top:50%;width:calc(50% - 2rem)}.auth-step__divider:before{left:0}.auth-step__divider:after{right:0}.auth-step__divider span{background:var(--card-bg);color:var(--text-muted);font-size:.9rem;padding:0 .75rem;position:relative}.auth-step__google-btn{align-items:center;background:#fff;border:1px solid #0000001a;border-radius:14px;box-shadow:0 2px 8px #00000014;color:#1f1f1f;cursor:pointer;display:flex;font-size:.95rem;font-weight:600;gap:.75rem;justify-content:center;padding:.9rem 1.25rem;transition:all var(--transition-normal);width:100%}.auth-step__google-btn:hover:not(:disabled){background:#f8f9fa;box-shadow:0 4px 12px #0000001f;transform:translateY(-1px)}.auth-step__google-btn:active:not(:disabled){transform:translateY(0)}.auth-step__google-btn:disabled{cursor:not-allowed;opacity:.55;transform:none}.auth-step__google-icon{flex-shrink:0}.auth-step__alternate{align-items:center;display:flex;flex-direction:column;gap:.75rem;margin-top:1.75rem}.auth-step__guest-btn{background:#ffffff0f;border:1px solid #ffffff40;border-radius:14px;color:#fff;cursor:pointer;font-weight:600;padding:.85rem 1.65rem;transition:all var(--transition-normal);width:100%}.auth-step__guest-btn:hover{background:#ffffff1f;transform:translateY(-1px)}.auth-step__guest-btn:disabled{cursor:not-allowed;opacity:.55;transform:none}.auth-step__hint{color:var(--text-muted);font-size:.85rem;line-height:1.6;margin-top:.1rem;text-align:center}@media (max-width:600px){.auth-step .step-content{border-radius:20px;padding:1.85rem 1.4rem}.auth-step__toggle{width:100%}.auth-step__toggle-btn{flex:1 1;padding:.75rem 1rem}.auth-step__progress{flex-wrap:wrap;gap:.5rem}.auth-progress__dot{font-size:.85rem;height:1.85rem;width:1.85rem}.auth-progress__label{font-size:.75rem}.auth-step__flow{gap:1rem}.auth-segment{border-radius:18px;padding:.9rem 1.05rem}.auth-segment__title p{font-size:.8rem}.auth-step__add-email{text-align:center;width:100%}.auth-wizard__actions{flex-direction:column}.auth-wizard__actions .btn-optimized{width:100%}.auth-wizard__skip{align-self:center}.auth-step__alternate{gap:.6rem}}@keyframes auth-segment-activate{0%{opacity:0;transform:translateY(12px) scale(.97)}60%{opacity:1;transform:translateY(-4px) scale(1.01)}to{opacity:1;transform:translateY(0) scale(1)}}.video-player-wrapper{background:#000;border-radius:15px;box-shadow:0 20px 40px #0003;overflow:hidden;position:relative;width:100%}.controls-bar{align-items:center;background:linear-gradient(0deg,#000000b3,#0000);bottom:0;display:flex;gap:.75rem;left:0;opacity:1;padding:.75rem 1rem;position:absolute;right:0;transition:opacity .3s ease-in-out;z-index:10}.video-player-wrapper.inactive .controls-bar{opacity:0;pointer-events:none}.controls-bar .time{color:#fff;font-size:.875rem;text-shadow:0 1px 2px #00000080}.controls-bar .seek{flex-grow:1}.room-container .video-placeholder{align-items:center;aspect-ratio:9/17;background:linear-gradient(135deg,#37415199,#1f293766);border-radius:15px;color:#cbd5e1;display:flex;flex-direction:column;justify-content:center;margin:0 auto;max-width:380px;padding:40px 20px;text-align:center}.video-placeholder h3{color:#f8fafc;margin-bottom:15px}.video-player-wrapper iframe{border:none;border-radius:15px;height:100%;width:100%}.video-player-wrapper:fullscreen{border-radius:0;padding:0}.video-player-wrapper:fullscreen .embed-aspect{aspect-ratio:auto;height:100%;width:100%}.video-player-wrapper:fullscreen video{object-fit:contain}.queue-info{color:#9ca3af;font-size:.9rem;text-align:center}.participants-list.card{background:#374151cc;border-radius:15px;padding:15px}.participants-list h4{color:#f8fafc;font-size:1.1rem;margin-bottom:10px}.participants-list ul{list-style:none;margin:0;max-height:120px;overflow-y:auto;padding:0}.participants-list li{border-bottom:1px solid #0000000d;color:#666;padding:8px 0}.participants-list li:last-child{border-bottom:none}.participants-list li.host{color:var(--error-color);font-weight:700}.participant-info{align-items:center;display:flex;justify-content:space-between;width:100%}.participant-name{flex:1 1}.participant-mic{align-items:center;color:#666;display:flex;font-size:.9em}.host-indicator,.participants-list li.host .participant-mic{color:var(--error-color)}.host-indicator{align-items:center;display:flex;font-size:.85rem;font-weight:700;gap:4px}.participant-name .icon{color:gold;font-size:1rem;margin-left:6px}.add-video-overlay{align-items:center;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);background:#000c;bottom:0;display:flex;justify-content:center;left:0;padding:20px;position:fixed;right:0;top:0;z-index:9999}.add-video-modal{backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);background:linear-gradient(135deg,#111827fa,#1f2937f2 50%,#374151fa);border:1px solid #4b5563cc;border-radius:24px;box-shadow:0 25px 50px #0006,0 15px 35px #0000004d,0 5px 15px #0003;max-width:480px;overflow:hidden;padding:32px;position:relative;width:100%}.add-video-modal:before{animation:shimmer 3s ease-in-out infinite;background:linear-gradient(90deg,#6366f1,#8b5cf6 50%,#6366f1);background:linear-gradient(90deg,var(--primary-color,#6366f1) 0,var(--secondary-color,#8b5cf6) 50%,var(--primary-color,#6366f1) 100%);background-size:200% 100%;content:"";height:4px;left:0;position:absolute;right:0;top:0}.add-video-modal h3{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#f8fafc,#6366f1);background:linear-gradient(135deg,#f8fafc 0,var(--primary-color,#6366f1) 100%);-webkit-background-clip:text;background-clip:text;color:#f8fafc;font-size:1.5rem;font-weight:700;margin:0 0 24px;text-align:center}.add-video-modal .form-input{background:#374151e6;border:2px solid #4b5563cc;border-radius:16px;box-shadow:0 2px 8px #0003;color:#f8fafc;font-size:1rem;margin-bottom:24px;outline:none;padding:16px 20px;transition:all .3s cubic-bezier(.4,0,.2,1);width:100%}.add-video-modal .form-input::placeholder{color:#9ca3af;transition:color .3s ease}.add-video-modal .form-input:focus{background:#1f2937;border-color:#6366f1;border-color:var(--primary-color,#6366f1);box-shadow:0 0 0 4px #6366f11a,0 4px 12px #6366f126;transform:translateY(-1px)}.add-video-modal .form-input:focus::placeholder{color:#6b7280}.modal-actions{display:flex;gap:12px;justify-content:flex-end;margin-top:24px}.modal-actions .btn-pill{align-items:center;border:none;border-radius:50px;cursor:pointer;display:flex;font-size:.95rem;font-weight:600;gap:8px;justify-content:center;min-width:120px;overflow:hidden;padding:14px 28px;position:relative;transition:all .3s cubic-bezier(.4,0,.2,1)}.modal-actions .btn-pill:before{background:#fff3;border-radius:50%;content:"";height:0;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);transition:all .4s ease;width:0}.modal-actions .btn-pill:hover:before{height:200px;width:200px}.modal-actions .btn-pill.secondary{background:#4b55634d;border:2px solid #4b556380;color:#d1d5db}.modal-actions .btn-pill.secondary:hover{background:#94a3b833;border-color:#94a3b880;box-shadow:0 4px 12px #94a3b833;transform:translateY(-2px)}.modal-actions .btn-pill.primary{background:linear-gradient(135deg,#6366f1,#8b5cf6);background:linear-gradient(135deg,var(--primary-color,#6366f1) 0,var(--secondary-color,#8b5cf6) 100%);box-shadow:0 4px 16px #6366f14d,0 2px 8px #6366f133;color:#fff;text-shadow:0 1px 2px #0000001a}.modal-actions .btn-pill.primary:hover{background:linear-gradient(135deg,#4f46e5,#7c3aed);background:linear-gradient(135deg,var(--primary-dark,#4f46e5) 0,var(--secondary-dark,#7c3aed) 100%);box-shadow:0 6px 20px #6366f166,0 3px 12px #6366f14d;transform:translateY(-2px) scale(1.02)}.modal-actions .btn-pill:active{transform:translateY(-1px) scale(1.01);transition:all .1s ease}.modal-actions .btn-pill:focus-visible{outline:3px solid #6366f180;outline-offset:2px}.modal-actions .btn-pill.loading{opacity:.8;pointer-events:none}.modal-actions .btn-pill.loading:after{animation:spin 1s linear infinite;border:2px solid #0000;border-radius:50%;border-top-color:currentcolor;content:"";height:16px;margin-left:8px;position:absolute;width:16px}.confirm-modal-overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#000000b3;padding:1rem;z-index:10000}.confirm-modal{background:#1a1a1a;border:1px solid #333;border-radius:var(--border-radius-lg);box-shadow:0 10px 30px #0003;max-width:420px;padding:2rem;width:100%}.confirm-modal h3{color:var(--text-primary);font-size:1.25rem;margin-bottom:1rem;margin-top:0}.confirm-modal p{color:var(--text-secondary);line-height:1.6;margin-bottom:2rem}.confirm-modal-actions{gap:1rem;justify-content:flex-end}.error-boundary{background:#fef2f2;border:2px solid #fecaca;border-radius:var(--border-radius-lg);color:#991b1b;margin:2rem;padding:2rem;text-align:center}.error-boundary h2{color:#b91c1c;margin-top:0}.error-boundary pre{background:#fee2e2;border-radius:15px;font-size:.875rem;max-height:300px;overflow-y:auto;padding:1rem;text-align:left;white-space:pre-wrap;word-break:break-all}.lazy-loader{align-items:center;display:flex;justify-content:center;min-height:200px;padding:2rem}.lazy-loader-content{color:#9ca3af;text-align:center}.lazy-loader-content .icon{color:#8b5cf6;color:var(--accent-color,#8b5cf6);font-size:2rem;margin-bottom:1rem}.lazy-loader-content p{font-size:.875rem;margin:0}.step-loader{align-items:center;display:flex;justify-content:center;min-height:50vh;padding:2rem}.step-loader-content{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#1f2937f2;border:1px solid #8b5cf633;border-radius:15px;box-shadow:0 10px 25px #8b5cf61a,0 4px 10px #0000001a;max-width:400px;padding:3rem 2rem;text-align:center;width:100%}.step-loader-content .icon{color:#8b5cf6;color:var(--accent-color,#8b5cf6);filter:drop-shadow(0 2px 4px rgba(139,92,246,.3));font-size:3rem;margin-bottom:1.5rem}.step-loader-content .icon.large{font-size:4rem}.step-loader-content h3{color:#f8fafc;font-size:1.25rem;font-weight:600;margin-bottom:1.5rem}.loader-progress{background:#8b5cf633;border-radius:2px;height:4px;margin-top:1rem;overflow:hidden;width:100%}.loader-bar{animation:loading-progress 2s ease-in-out infinite;background:linear-gradient(90deg,#8b5cf6,#667eea 50%,#8b5cf6);background:linear-gradient(90deg,var(--accent-color,#8b5cf6) 0,var(--primary-color,#667eea) 50%,var(--accent-color,#8b5cf6) 100%);border-radius:2px;height:100%;transform-origin:left}.lazy-component-enter{opacity:0;transform:translateY(20px)}.lazy-component-enter-active{opacity:1;transform:translateY(0);transition:opacity .3s ease,transform .3s ease}@media (max-width:480px){.step-loader{min-height:40vh;padding:1rem}.step-loader-content{border-radius:16px;padding:2rem 1.5rem}.step-loader-content .icon{font-size:2.5rem}.step-loader-content .icon.large{font-size:3rem}}@media (prefers-color-scheme:dark){.lazy-loader-content{color:#b0b0b0}.step-loader-content{background:#1e1e1ef2;border:1px solid #8b5cf64d}.step-loader-content h3{color:#e0e0e0}.loader-progress{background:#8b5cf64d}}.lazy-error{align-items:center;display:flex;justify-content:center;min-height:200px;padding:2rem}.lazy-error-content{max-width:400px;text-align:center}.lazy-error-content .error-icon{font-size:2.5rem}.lazy-error-content .error-icon,.lazy-error-content h3{color:#ff4b4b;margin-bottom:1rem}.lazy-error-content p{color:#666;margin-bottom:1.5rem}.lazy-error-actions{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center}.loading-container{align-items:center;display:flex;flex-direction:column;gap:1rem;padding:2rem;text-align:center}.loading-spinner{animation:spin 1s linear infinite;border:3px solid #ffffff1a;border-radius:50%;border-top:3px solid var(--primary-color);height:40px;width:40px}.save-name-option{background:#ffffff05;border:1px solid #ffffff1a;border-radius:var(--border-radius-md);margin:1.5rem 0;padding:1rem}.checkbox-label{align-items:flex-start;cursor:pointer;display:flex;gap:.75rem;margin-bottom:.5rem;-webkit-user-select:none;user-select:none}.checkbox-label input[type=checkbox]{display:none}.checkbox-custom{background:#0000;border:2px solid #ffffff4d;border-radius:4px;flex-shrink:0;height:20px;margin-top:2px;position:relative;transition:all .2s ease;width:20px}.checkbox-custom:before{border:solid #fff;border-width:0 2px 2px 0;content:"";height:10px;left:5px;position:absolute;top:2px;transform:rotate(45deg) scale(0);transition:transform .2s ease;width:6px}.checkbox-label input[type=checkbox]:checked+.checkbox-custom{background:var(--primary-color);border-color:var(--primary-color)}.checkbox-label input[type=checkbox]:checked+.checkbox-custom:before{transform:rotate(45deg) scale(1)}.checkbox-text{color:var(--text-primary);font-size:.95rem;font-weight:500;line-height:1.4}.save-name-description{color:var(--text-muted);font-size:.85rem;line-height:1.4;margin:0 0 0 2.75rem}@media (max-width:480px){.save-name-option{margin:1rem 0;padding:.75rem}.checkbox-label{gap:.5rem}.save-name-description{font-size:.8rem;margin-left:2.25rem}}.confirm-modal-overlay{align-items:center;animation:overlayFadeIn .3s ease-out;background-color:#0009;bottom:0;display:flex;justify-content:center;left:0;padding:20px;position:fixed;right:0;top:0;z-index:1000}@keyframes overlayFadeIn{0%{opacity:0}to{opacity:1}}.confirm-modal-content{animation:modalFadeIn .3s ease-out;box-shadow:0 20px 60px #0000004d!important;max-width:450px;padding:25px 30px;text-align:center;width:100%}@keyframes modalFadeIn{0%{opacity:0;transform:scale(.9) translateY(20px)}to{opacity:1;transform:scale(1) translateY(0)}}.confirm-modal-title{color:#333;font-size:1.5rem;font-weight:600;margin-bottom:15px}.confirm-modal-message{color:#555;font-size:1.1rem;line-height:1.5;margin-bottom:25px}.confirm-modal-actions{display:flex;flex-wrap:wrap;gap:15px;justify-content:center}.confirm-modal-actions .btn-pill{font-weight:500;min-width:120px}@media (max-width:480px){.confirm-modal-overlay{padding:15px}.confirm-modal-content{max-width:100%;padding:20px}.confirm-modal-title{font-size:1.3rem}.confirm-modal-message{font-size:1rem}.confirm-modal-actions{flex-direction:column;gap:10px}.confirm-modal-actions .btn-pill{min-width:auto;width:100%}}:root{--primary-color:#6e49e1;--primary-color-rgb:110,73,225;--primary-dark:#5a3bb8;--secondary-color:#8b7cf6;--secondary-color-rgb:139,124,246;--accent-color:#6e49e1;--accent-color-rgb:110,73,225;--background-dark:#100b22;--background-light:#2b1e56;--surface-color:#2b1e56;--text-primary:#fff;--text-secondary:#b8b2c9;--text-muted:#8a829a;--border-color:#3d3154;--error-color:#ef4444;--error-color-rgb:239,68,68;--success-color:#10b981;--success-color-rgb:16,185,129;--warning-color:#f59e0b;--gradient-primary:linear-gradient(135deg,#6e49e1,#8b7cf6);--gradient-surface:linear-gradient(135deg,#2b1e56,#3d3154);--gradient-background:linear-gradient(135deg,#100b22,#2b1e56);--gradient-error:linear-gradient(135deg,var(--error-color) 0%,#dc2626 100%);--gradient-success:linear-gradient(135deg,var(--success-color) 0%,#059669 100%);--gradient-accent:linear-gradient(135deg,#6e49e1,#8b7cf6);--color-primary:var(--primary-color);--color-primary-hover:var(--primary-dark);--color-primary-alpha:rgba(var(--primary-color-rgb),0.2);--color-primary-hover-alpha:rgba(var(--primary-color-rgb),0.3);--color-primary-border:rgba(var(--primary-color-rgb),0.3);--color-secondary:var(--secondary-color);--color-accent:var(--accent-color);--color-text:var(--text-primary);--color-text-muted:var(--text-muted);--color-text-secondary:var(--text-secondary);--color-background:var(--background-dark);--color-surface:#1a1a1a;--color-border:#333;--color-error:var(--error-color);--color-success:var(--success-color);--color-warning:var(--warning-color);--space-xs:var(--spacing-xs);--space-sm:var(--spacing-sm);--space-md:var(--spacing-md);--space-lg:var(--spacing-lg);--space-xl:var(--spacing-xl);--space-2xl:var(--spacing-2xl);--scrollbar-width:4px;--scrollbar-track-bg:#0000;--scrollbar-thumb-bg:#0003;--scrollbar-thumb-hover-bg:#0000004d;--scrollbar-thumb-active-bg:#0006;--spacing-xs:0.25rem;--spacing-sm:0.5rem;--spacing-md:1rem;--spacing-lg:1.5rem;--spacing-xl:2rem;--spacing-2xl:3rem;--font-size-xs:0.75rem;--font-size-sm:0.875rem;--font-size-base:1rem;--font-size-lg:1.125rem;--font-size-xl:1.25rem;--font-size-2xl:1.5rem;--font-size-3xl:1.875rem;--line-height-tight:1.2;--line-height-normal:1.5;--line-height-relaxed:1.75;--transition-fast:0.15s cubic-bezier(0.4,0,0.2,1);--transition-normal:0.3s cubic-bezier(0.4,0,0.2,1);--transition-slow:0.5s cubic-bezier(0.4,0,0.2,1);--border-radius-sm:0.375rem;--border-radius-md:0.5rem;--border-radius-lg:0.75rem;--border-radius-xl:1rem;--shadow-sm:0 1px 2px 0 #0000000d;--shadow-md:0 4px 6px -1px #0000001a;--shadow-lg:0 10px 15px -3px #0000001a;--shadow-xl:0 20px 25px -5px #0000001a}*{scrollbar-color:#0003 #0000;scrollbar-color:var(--scrollbar-thumb-bg) var(--scrollbar-track-bg);scrollbar-width:thin}::-webkit-scrollbar{width:4px;width:var(--scrollbar-width)}::-webkit-scrollbar-track{background:#0000;background:var(--scrollbar-track-bg)}::-webkit-scrollbar-thumb,::-webkit-scrollbar-track{border-radius:2px;border-radius:calc(var(--scrollbar-width)/2)}::-webkit-scrollbar-thumb{background-color:#0003;background-color:var(--scrollbar-thumb-bg);-webkit-transition:background-color .15s cubic-bezier(.4,0,.2,1);transition:background-color .15s cubic-bezier(.4,0,.2,1);-webkit-transition:background-color var(--transition-fast);transition:background-color var(--transition-fast)}::-webkit-scrollbar-thumb:hover{background-color:#0000004d;background-color:var(--scrollbar-thumb-hover-bg)}::-webkit-scrollbar-thumb:active{background-color:#0006;background-color:var(--scrollbar-thumb-active-bg)}.btn-optimized{align-items:center;border:none;border-radius:10px;cursor:pointer;display:inline-flex;font-size:.875rem;font-weight:500;gap:.5rem;justify-content:center;line-height:1;overflow:hidden;padding:.75rem 1.5rem;position:relative;transform:translateZ(0);transition:all .15s cubic-bezier(.4,0,.2,1);transition:all var(--transition-fast);will-change:transform,box-shadow}.btn-optimized:disabled{cursor:not-allowed;opacity:.5;pointer-events:none}.btn-optimized:focus-visible{outline:2px solid #6e49e1;outline:2px solid var(--primary-color);outline-offset:2px}.btn-primary{background:linear-gradient(135deg,#6e49e1,#5a3bb8);background:linear-gradient(135deg,var(--primary-color),var(--primary-dark));box-shadow:0 4px 6px -1px #0000001a;box-shadow:var(--shadow-md);color:#fff}.btn-primary:hover:not(:disabled){box-shadow:0 10px 15px -3px #0000001a;box-shadow:var(--shadow-lg);transform:translateY(-1px)}.btn-primary:active{box-shadow:0 1px 2px 0 #0000000d;box-shadow:var(--shadow-sm);transform:translateY(0)}.btn-secondary{background:#1a1a1a;border:1px solid #333;color:#fff;color:var(--text-primary)}.btn-secondary:hover:not(:disabled){background:#2b1e56;background:var(--background-light);border-color:#6e49e1;border-color:var(--primary-color)}.btn-ghost{background:#0000;color:#b8b2c9;color:var(--text-secondary)}.btn-ghost:hover:not(:disabled){background:#1a1a1a;color:#fff;color:var(--text-primary)}.btn-danger{background:linear-gradient(135deg,#ef4444,#dc2626);background:linear-gradient(135deg,var(--error-color),#dc2626);box-shadow:0 4px 6px -1px #0000001a;box-shadow:var(--shadow-md);color:#fff;text-shadow:0 1px 2px #00000026}.btn-danger:hover:not(:disabled){background:linear-gradient(135deg,#dc2626,#b91c1c);box-shadow:0 10px 15px -3px #0000001a;box-shadow:var(--shadow-lg);transform:translateY(-1px)}.btn-success{background:linear-gradient(135deg,#10b981,#059669);background:linear-gradient(135deg,var(--success-color),#059669);box-shadow:0 4px 6px -1px #0000001a;box-shadow:var(--shadow-md);color:#fff}.btn-success:hover:not(:disabled){background:linear-gradient(135deg,#059669,#047857);box-shadow:0 10px 15px -3px #0000001a;box-shadow:var(--shadow-lg);transform:translateY(-1px)}.btn-optimized.icon-only{border-radius:50%;gap:0;height:44px;padding:.75rem;width:44px}.btn-optimized.icon-only .icon{height:1.25em;width:1.25em}.btn-optimized .badge{align-items:center;background:#ef4444;background:var(--error-color);border:2px solid #fff;border-radius:50%;color:#fff;display:none;font-size:.75rem;font-weight:600;height:20px;justify-content:center;line-height:1;position:absolute;right:-6px;top:-6px;width:20px}.btn-optimized.active{background:#10b981;background:var(--success-color);box-shadow:0 4px 6px -1px #0000001a;box-shadow:var(--shadow-md);color:#fff}.btn-optimized.btn-secondary.active,.btn-optimized.icon-only.btn-secondary.active{background:linear-gradient(135deg,#10b981,#059669);background:linear-gradient(135deg,var(--success-color),#059669);border-color:#10b98199;border-color:rgba(var(--success-color-rgb),.6);box-shadow:0 0 15px #10b98159;box-shadow:0 0 15px rgba(var(--success-color-rgb),.35);color:#fff}.btn-optimized.active .badge{display:inline-flex}.btn-optimized.muted{background:#ef4444;background:var(--error-color);box-shadow:0 4px 6px -1px #0000001a;box-shadow:var(--shadow-md);color:#fff}.btn-optimized.mic-button{position:relative;transition:all .3s cubic-bezier(.4,0,.2,1);transition:all var(--transition-normal)}.btn-optimized.mic-button.active{background:#10b981;background:var(--success-color);box-shadow:0 0 15px #10b98166;box-shadow:0 0 15px rgba(var(--success-color-rgb),.4);color:#fff}.btn-optimized.mic-button.muted{background:#ef4444;background:var(--error-color);box-shadow:0 0 15px #ef444466;box-shadow:0 0 15px rgba(var(--error-color-rgb),.4);color:#fff}.btn-optimized.mic-button.active:before{animation:micActivePulse 2s ease-in-out infinite;background:linear-gradient(45deg,#10b981,#6e49e1);background:linear-gradient(45deg,var(--success-color),var(--accent-color));opacity:.7}.btn-optimized.mic-button.active:before,.btn-optimized.mic-button.muted:before{border-radius:50%;bottom:-2px;content:"";left:-2px;position:absolute;right:-2px;top:-2px;z-index:-1}.btn-optimized.mic-button.muted:before{background:#ef4444;background:var(--error-color);opacity:.3}@keyframes micActivePulse{0%,to{opacity:.7;transform:scale(1)}50%{opacity:1;transform:scale(1.05)}}.mic-control-container{align-items:center;display:flex;flex-direction:column;gap:.25rem}.mic-status{font-size:.6875rem;font-weight:600;letter-spacing:.05em;line-height:1;text-transform:uppercase;transition:color .15s cubic-bezier(.4,0,.2,1);transition:color var(--transition-fast)}.mic-status.active{color:#10b981;color:var(--success-color)}.mic-status.muted{color:#ef4444;color:var(--error-color)}@media (max-width:768px){.mic-control-container{gap:.125rem}.mic-status{font-size:.625rem}}.fade-in{animation:fadeIn ease-out .3s cubic-bezier(.4,0,.2,1) forwards;animation:fadeIn var(--transition-normal) ease-out forwards}.fade-out{animation:fadeOut ease-in .3s cubic-bezier(.4,0,.2,1) forwards;animation:fadeOut var(--transition-normal) ease-in forwards}@keyframes slideInUp{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}@keyframes slideOutDown{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(100%)}}.slide-in-up{animation:slideInUp ease-out .3s cubic-bezier(.4,0,.2,1) forwards;animation:slideInUp var(--transition-normal) ease-out forwards}.slide-out-down{animation:slideOutDown ease-in .3s cubic-bezier(.4,0,.2,1) forwards;animation:slideOutDown var(--transition-normal) ease-in forwards}@keyframes scaleIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.scale-in{animation:scaleIn ease-out .15s cubic-bezier(.4,0,.2,1) forwards;animation:scaleIn var(--transition-fast) ease-out forwards}.pulse{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}.loader-optimized{animation:spin 1s ease-in-out infinite;border:2px solid #333;border-radius:50%;border-top:2px solid var(--primary-color);display:inline-block;height:20px;transform:translateZ(0);width:20px;will-change:transform}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.flex-1{flex:1 1}.gap-1{gap:.25rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.w-full{width:100%}.h-full{height:100%}.min-h-screen{min-height:100vh}.p-2{padding:.5rem}.p-4{padding:1rem}.p-6{padding:1.5rem}.m-2{margin:.5rem}.m-4{margin:1rem}.mt-2{margin-top:.5rem}.mb-4{margin-bottom:1rem}.text-center{text-align:center}.text-sm{font-size:.875rem}.text-lg{font-size:1.125rem}.text-xl{font-size:1.25rem}.font-medium{font-weight:500}.font-semibold{font-weight:600}.font-bold{font-weight:700}.text-primary{color:#fff;color:var(--text-primary)}.text-secondary{color:#b8b2c9;color:var(--text-secondary)}.text-muted{color:#8a829a;color:var(--text-muted)}.text-error{color:#ef4444;color:var(--error-color)}.text-success{color:#10b981;color:var(--success-color)}@media (max-width:640px){.card{border-radius:15px;padding:1rem}.btn-optimized{font-size:.8125rem;padding:.625rem 1.25rem}@media (max-width:640px){*{animation-duration:.2s;transition-duration:.2s}}}@media (min-width:641px) and (max-width:1024px){.card{padding:1.25rem}}@media (min-width:1025px){.card:hover{transform:translateY(-4px)}}@media (prefers-color-scheme:dark){:root{--background-dark:#000;--background-light:#0f0f0f;--surface-color:#1a1a1a;--border-color:#333}}@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms;animation-iteration-count:1;scroll-behavior:auto;transition-duration:.01ms}}@media print{*{background:#0000;box-shadow:none;color:#000;text-shadow:none}}.critical{contain:layout style paint;content-visibility:auto}.lazy-content{contain-intrinsic-size:200px;content-visibility:auto}.room-option-card-optimized{align-items:center;background:#1a1a1a;border:2px solid #333;border-radius:15px;cursor:pointer;display:flex;gap:12px;padding:1rem;text-align:left;transition:.3s cubic-bezier(.4,0,.2,1);transition:var(--transition-normal);width:100%}.room-option-card-optimized:hover{background:var(--surface-hover);border-color:#6e49e1;border-color:var(--primary-color);box-shadow:0 4px 6px -1px #0000001a;box-shadow:var(--shadow-md);transform:translateY(-1px)}.room-option-card-optimized .option-icon{align-items:center;background:linear-gradient(135deg,#6e49e1,#8b7cf6);background:linear-gradient(135deg,var(--primary-color),var(--secondary-color));border-radius:50%;color:#fff;display:flex;flex-shrink:0;font-size:1.125rem;height:36px;justify-content:center;width:36px}.room-option-card-optimized .option-content{flex:1 1}.room-option-card-optimized .option-content h3{color:#fff;color:var(--text-primary);font-size:1rem;font-weight:600;margin:0 0 4px}.room-option-card-optimized .option-content p{color:#b8b2c9;color:var(--text-secondary);font-size:.8125rem;line-height:1.3;margin:0}.room-option-card-optimized .option-arrow{color:#8a829a;color:var(--text-muted);font-size:1rem;transition:.15s cubic-bezier(.4,0,.2,1);transition:var(--transition-fast)}.room-option-card-optimized:hover .option-arrow{color:#6e49e1;color:var(--primary-color);transform:translateX(2px)}.step-container{overflow-x:hidden}.step-container,.step-content-flexible{box-sizing:border-box;display:flex;flex-direction:column;max-height:800px;overflow-y:auto}.step-content-flexible{flex:1 1;gap:1rem;min-height:0;padding:1.5rem}.step-content-flexible::-webkit-scrollbar{width:6px}.step-content-flexible::-webkit-scrollbar-track{background:#0000}.step-content-flexible::-webkit-scrollbar-thumb{background:#6e49e14d;background:rgba(var(--primary-color-rgb),.3);border-radius:3px}.step-content-flexible::-webkit-scrollbar-thumb:hover{background:#6e49e180;background:rgba(var(--primary-color-rgb),.5)}.step-content-flexible .header{flex-shrink:0;margin-bottom:1rem}.step-content-flexible .welcome-text{flex-shrink:0;margin-bottom:1.25rem}.step-content-flexible .logo-container{flex-shrink:0;margin-bottom:1rem}.step-content-flexible .room-options{flex:1 1;gap:.875rem;margin:0;min-height:0;padding:0}.step-content-flexible .divider{flex-shrink:0;margin:.875rem 0}.step-content-flexible .join-room-form{flex-shrink:0;margin-top:.5rem}.step-content-flexible .username-form{flex-shrink:0;margin-bottom:1.25rem}.step-content-flexible .step-info{flex-shrink:0;margin-top:1rem}@media (max-width:768px) and (max-height:800px){.step-content-flexible{gap:.875rem;padding:1.25rem}.step-content-flexible .header h1,.step-content-flexible .welcome-text h1{font-size:1.5rem;line-height:1.1;margin-bottom:.5rem}.step-content-flexible .header p,.step-content-flexible .welcome-text p{font-size:.9375rem;line-height:1.3}.step-content-flexible .room-option{padding:1rem}.step-content-flexible .room-option h3{font-size:1.125rem;margin-bottom:.375rem}.step-content-flexible .room-option p{font-size:.875rem}.step-content-flexible .btn-optimized{font-size:.875rem;padding:.75rem 1rem}.step-content-flexible .form-input{font-size:.875rem;padding:.75rem .875rem}}@media (max-width:480px) and (max-height:700px){.step-content-flexible{gap:.75rem;max-height:650px;padding:1rem}.step-content-flexible .header h1,.step-content-flexible .welcome-text h1{font-size:1.25rem;margin-bottom:.375rem}.step-content-flexible .header p,.step-content-flexible .welcome-text p{font-size:.875rem}.step-content-flexible .room-options{gap:.75rem}.step-content-flexible .room-option{padding:.875rem}.step-content-flexible .room-option h3{font-size:1rem;margin-bottom:.25rem}.step-content-flexible .room-option p{font-size:.8125rem}.step-content-flexible .btn-optimized{font-size:.8125rem;padding:.625rem .875rem}.step-content-flexible .form-input{font-size:.8125rem;padding:.625rem .75rem}.step-content-flexible .divider{font-size:.6875rem;margin:.5rem 0}}.btn-optimized,.card,.form-input,.room-option-card-optimized{transition:all .3s cubic-bezier(.4,0,.2,1);transition:all var(--transition-normal);will-change:transform,box-shadow,opacity}.btn-optimized:focus-visible,.form-input:focus{position:relative}.btn-optimized:focus-visible:after,.form-input:focus:after{animation:glowPulse 2s ease-in-out infinite;background:linear-gradient(45deg,#6e49e1,#8b7cf6);background:linear-gradient(45deg,var(--primary-color),var(--secondary-color));border-radius:inherit;bottom:-2px;content:"";filter:blur(8px);left:-2px;opacity:.3;position:absolute;right:-2px;top:-2px;z-index:-1}@keyframes glowPulse{0%,to{opacity:.3;transform:scale(1)}50%{opacity:.6;transform:scale(1.02)}}@media (hover:hover){.btn-optimized:hover:not(:disabled){transform:translateY(-2px) scale(1.02)}.btn-primary:hover:not(:disabled){box-shadow:0 10px 15px -3px #0000001a;box-shadow:var(--shadow-lg);transform:translateY(-1px)}.btn-secondary:hover:not(:disabled){background:#2b1e56;background:var(--background-light);border-color:#6e49e1;border-color:var(--primary-color)}.btn-ghost:hover:not(:disabled){background:#1a1a1a;color:#fff;color:var(--text-primary)}.btn-danger:hover:not(:disabled){background:linear-gradient(135deg,#dc2626,#b91c1c)}.btn-danger:hover:not(:disabled),.btn-success:hover:not(:disabled){box-shadow:0 10px 15px -3px #0000001a;box-shadow:var(--shadow-lg);transform:translateY(-1px)}.btn-success:hover:not(:disabled){background:linear-gradient(135deg,#059669,#047857)}.btn-optimized:hover:not(:disabled) .icon{transform:scale(1.1) rotate(2deg)}}.btn-optimized:active:not(:disabled){transform:translateY(0) scale(.98)}.loading-state{overflow:hidden;position:relative}.loading-state:before{animation:loadingShimmer 2s infinite;background:linear-gradient(90deg,#0000,#ffffff1a,#0000);content:"";height:100%;left:-100%;position:absolute;top:0;width:100%}@keyframes loadingShimmer{0%{left:-100%}50%{left:100%}to{left:100%}}.success-animation{animation:successBounce .6s ease-out}@keyframes successBounce{0%{transform:scale(1)}30%{transform:scale(1.1)}50%{transform:scale(.95)}70%{transform:scale(1.05)}to{transform:scale(1)}}.error-animation{animation:errorShake .6s ease-out}@keyframes errorShake{0%,to{transform:translateX(0)}10%,30%,50%,70%,90%{transform:translateX(-4px)}20%,40%,60%,80%{transform:translateX(4px)}}.fade-in-up{animation:fadeInUp .6s ease-out}.fade-out-down{animation:fadeOutDown .4s ease-in}@keyframes fadeOutDown{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(20px)}}.gradient-text{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#6e49e1,#8b7cf6);background:linear-gradient(135deg,var(--primary-color),var(--secondary-color));-webkit-background-clip:text;background-clip:text;font-weight:700}.text-shadow{text-shadow:0 1px 2px #0000001a}.code-text{background:#1a1a1a;border:1px solid #333;border-radius:.375rem;border-radius:var(--border-radius-sm);font-family:SF Mono,Monaco,Cascadia Code,Roboto Mono,Consolas,Courier New,monospace;font-size:.875rem;padding:.25rem .5rem}.active-press{transform:scale(.98);transition:transform .1s ease}.spinning{animation:spin 1s linear infinite}.pulse{animation:pulse 2s ease-in-out infinite}*{box-sizing:border-box;margin:0;padding:0}body,html{-webkit-text-size-adjust:100%;-webkit-overflow-scrolling:touch;min-height:100vh;min-height:100dvh}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;align-items:center;background:linear-gradient(135deg,#100b22,#2b1e56 50%,#6e49e1);color:var(--text-primary);display:flex;flex-direction:column;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;overscroll-behavior:none;touch-action:manipulation}.app-container{min-height:100dvh}.app-container.room-container{align-items:stretch;flex-direction:column;justify-content:flex-start;max-width:100%;min-height:100dvh}@media (max-width:799px){.app-container{padding:0}.app-container.room-container{padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right);padding-top:env(safe-area-inset-top)}}.app-container{align-items:center;display:flex;justify-content:center;max-width:1600px;min-height:100vh;padding:20px;width:100%}.app-container.room-container{align-items:stretch!important;flex-direction:column!important;justify-content:flex-start!important;max-width:1600px;min-height:100vh;padding:0;width:100%}.card{background:#0f0f0f;border:1px solid #333;border-radius:var(--border-radius-lg);box-shadow:var(--shadow-md);color:var(--text-primary);padding:1.5rem;transform:translateZ(0);transition:all var(--transition-normal);will-change:transform,box-shadow}.card:hover{border-color:var(--primary-color);box-shadow:var(--shadow-lg);transform:translateY(-2px)}.room-content .video-section .card,.video-section .card,.video-section .video-placeholder{transform:translateZ(0)}.room-content .video-section .card:hover,.video-section .card:hover,.video-section .video-placeholder:hover{border-color:var(--primary-color);box-shadow:var(--shadow-lg);transform:translateY(-1px) translateZ(0)}.logo{align-items:center;color:var(--error-color);display:flex;font-size:2rem;font-weight:700;gap:10px;justify-content:center;margin-bottom:20px;text-align:center}.logo.small{font-size:1.2rem;margin-bottom:0}.vibio-logo{border-radius:16px;filter:drop-shadow(0 2px 4px rgba(0,0,0,.1));max-width:100%;overflow:hidden;transition:all .3s ease}.vibio-logo:hover{filter:drop-shadow(0 4px 8px rgba(0,0,0,.15));transform:scale(1.05)}.error-message{background:#ff52521a;border:1px solid #ff525233;border-radius:10px;color:#d32f2f;margin:15px 0;padding:10px 15px;text-align:center}.room-option-card{align-items:center;background:#1a1a1a;border:2px solid #333;border-radius:var(--border-radius-lg);cursor:pointer;display:flex;gap:15px;padding:20px;text-align:left;transition:var(--transition-normal);width:100%}.room-option-card:hover{background:var(--surface-hover);border-color:var(--primary-color);box-shadow:var(--shadow-lg);transform:translateY(-2px)}.room-option-card .option-icon{align-items:center;background:linear-gradient(135deg,var(--primary-color),var(--secondary-color));border-radius:50%;color:#fff;display:flex;flex-shrink:0;font-size:1.5rem;height:48px;justify-content:center;width:48px}.room-option-card .option-content{flex:1 1}.room-option-card .option-content h3{color:var(--text-primary);font-size:1.2rem;font-weight:600;margin:0 0 8px}.room-option-card .option-content p{color:var(--text-secondary);font-size:.9rem;margin:0}@media (prefers-reduced-motion:reduce){*,:after,:before{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}@media print{*{animation:none!important;box-shadow:none!important;text-shadow:none!important;transition:none!important}*,.btn-optimized{background:#0000!important;color:#000!important}.btn-optimized{border:1px solid #000!important}}.smooth-scroll{scroll-behavior:smooth}@media (prefers-reduced-motion:reduce){.smooth-scroll{scroll-behavior:auto}}:root{--content-max-width:1280px;--sidebar-min-width:340px;--sidebar-max-width:450px}.room-step{-webkit-tap-highlight-color:transparent;background:var(--background-dark);flex-direction:column;flex-grow:1;min-height:100vh;min-height:100svh;min-height:100dvh;overflow:hidden;overscroll-behavior:contain;width:100%}.room-header,.room-step{border-radius:15px;display:flex}.room-header{align-items:center;-webkit-backdrop-filter:saturate(180%) blur(8px);backdrop-filter:saturate(180%) blur(8px);background:#1a1a1a;border-bottom:1px solid #333;box-shadow:0 2px 10px #00000026;flex-shrink:0;justify-content:space-between;padding:var(--space-md) var(--space-lg);position:-webkit-sticky;position:sticky;top:env(safe-area-inset-top,0);z-index:10}.room-info h2,.room-info p{margin:0}.room-info p{color:var(--text-secondary);font-size:.875rem;font-size:var(--font-size-sm,.875rem);margin-top:4px}.room-actions,.room-controls{align-items:center;display:flex;flex-wrap:wrap;gap:.5rem;justify-content:flex-end;margin-left:auto;padding-left:clamp(.75rem,2vw,1.25rem)}.room-header .btn,.room-header .btn-icon{background-color:color-mix(in oklab,#1a1a1a 70%,#0000);border:1px solid color-mix(in oklab,#333 70%,#0000);border-radius:9999px;color:var(--text-primary);cursor:pointer;font:inherit;font-size:.875rem;font-size:var(--font-size-sm,.875rem);line-height:1;padding:8px 16px;transition:background-color var(--transition-fast),border-color var(--transition-fast),transform var(--transition-fast),box-shadow var(--transition-fast)}.room-header .btn-icon:hover,.room-header .btn:hover{background-color:#6366f11f;background-color:var(--color-primary-alpha,rgba(var(--primary-color-rgb,99,102,241),.12));border-color:#6366f14d;border-color:var(--color-primary-border,rgba(var(--primary-color-rgb,99,102,241),.3))}.room-header .btn-icon{align-items:center;border-radius:50%;display:flex;height:36px;justify-content:center;padding:0;width:36px}.room-header .btn-icon.btn-danger,.room-header .btn.btn-danger{background:linear-gradient(135deg,var(--error-color),#dc2626);background:var(--gradient-error,linear-gradient(135deg,var(--error-color),#dc2626));border:none;color:#fff}@media (max-width:420px){.room-actions,.room-controls{gap:8px}.room-header .btn-icon{height:32px;width:32px}.room-header .btn{padding:8px 12px}}.room-content{-webkit-overflow-scrolling:touch;flex-grow:1;margin-inline:auto;max-width:1280px;max-width:var(--content-max-width);overflow-y:auto;padding:var(--space-md);scroll-padding-top:calc(var(--space-lg) + 56px)}.room-content,.video-section{display:flex;flex-direction:column;gap:var(--space-md);min-height:0;width:100%}.video-section{flex:1 1}.video-player-container{align-items:center;background:#000;border-radius:15px;display:flex;height:calc(100vh - 120px);justify-content:center;overflow:hidden;position:relative;width:100%}@media (max-width:799px){.video-player-container{border-radius:0;height:calc(100svh - 80px)}}@media (min-width:800px){.video-section{display:flex;flex-direction:column;gap:var(--space-md);height:100%;min-height:0;overflow:hidden;width:100%}}.video-player-container{flex:1 1;max-height:calc(100vh - 160px);min-height:400px}.video-player-container:-webkit-full-screen,.video-player-container:fullscreen{border-radius:0!important;height:100vh!important;max-height:100vh!important}.video-player-wrapper iframe,.video-player-wrapper video,.video-player-wrapper>video{background:#000!important}.video-player-wrapper.vertical video,.video-player-wrapper.vertical>video{aspect-ratio:9/16!important}.video-player-wrapper.horizontal video,.video-player-wrapper.horizontal>video{aspect-ratio:16/9!important;height:auto!important;object-fit:contain!important;width:100%!important}.sidebar{display:flex;flex-direction:column;flex-grow:1;gap:var(--space-md);min-height:0;width:100%}.participants-section{background:#1a1a1a;border:1px solid #ffffff0f;border-radius:15px;box-shadow:var(--shadow-md);flex-shrink:0;overflow:hidden}.participants-section h3{align-items:center;background:inherit;border-bottom:1px solid #333;display:flex;font-size:.9rem;font-weight:600;justify-content:space-between;padding:var(--space-sm) var(--space-md);position:-webkit-sticky;position:sticky;top:0;z-index:1}.participants-section .participants-count{color:var(--text-secondary);font-size:.85em;font-weight:600;padding-left:.25rem}.participants-list{-webkit-overflow-scrolling:touch;max-height:150px;overflow-y:auto;padding:var(--space-sm)}.participants-list .participant-item,.participants-list>div,.participants-list>li{align-items:center;border-bottom:1px solid #ffffff0f;border-radius:10px;display:flex;gap:var(--space-sm);padding:8px 10px;transition:background-color var(--transition-fast),transform var(--transition-fast)}.participants-list .participant-item:last-child,.participants-list>div:last-child,.participants-list>li:last-child{border-bottom:none}.participants-list .participant-item:hover,.participants-list>div:hover,.participants-list>li:hover{background:#ffffff0a}.participants-list .participant-item:focus-within,.participants-list>div:focus-within,.participants-list>li:focus-within{outline:2px solid #6366f140;outline:2px solid rgba(var(--primary-color-rgb,99,102,241),.25);outline-offset:2px}.participant-avatar{align-items:center!important;aspect-ratio:1/1!important;background:linear-gradient(135deg,var(--primary-color),var(--secondary-color))!important;border-radius:50%!important;box-shadow:var(--shadow-sm)!important;color:#fff!important;display:inline-flex!important;flex:0 0 32px!important;font-size:.85rem!important;font-weight:700!important;height:32px!important;justify-content:center!important;max-height:32px!important;max-width:32px!important;min-height:32px!important;min-width:32px!important;overflow:hidden!important;width:32px!important}.participant-avatar img{display:block;height:100%;object-fit:cover;width:100%}.participant-name{color:var(--text-primary);font-size:.9rem;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.participant-meta{color:var(--text-secondary);font-size:.78rem}.participant-badges{display:inline-flex;gap:6px;margin-left:6px}.badge{border-radius:9999px;font-size:.7rem;font-weight:700;line-height:1;padding:2px 6px}.badge-host{background:#6366f133;background:rgba(var(--primary-color-rgb,99,102,241),.2);border:1px solid #6366f159;border:1px solid rgba(var(--primary-color-rgb,99,102,241),.35);color:var(--text-primary)}.badge-you{background:#ffffff1f;border:1px solid #ffffff2e;color:var(--text-secondary)}.participant-spacer{flex:1 1}.participant-actions{align-items:center;display:inline-flex;gap:8px}.status-pill{background:#ffffff14;border:1px solid #ffffff1f;border-radius:9999px;color:var(--text-secondary);font-size:.7rem;line-height:1;padding:2px 8px}.status-pill.muted{background:#ef44441f;background:rgba(var(--error-color-rgb,239,68,68),.12);border-color:#ef444440;border-color:rgba(var(--error-color-rgb,239,68,68),.25);color:#fca5a5}.status-pill.speaking{background:#10b98126;background:rgba(var(--success-color-rgb,16,185,129),.15);border-color:#10b9814d;border-color:rgba(var(--success-color-rgb,16,185,129),.3);color:#86efac}.participants-empty{color:var(--text-secondary);font-size:.85rem;opacity:.8;padding:12px;text-align:center}.chat-section{background:#1a1a1a;border-radius:15px;display:flex;flex-direction:column;flex-grow:1;min-height:250px;overflow:hidden}.chat-section h3{border-bottom:1px solid #333;flex-shrink:0;font-size:.9rem;font-weight:600;padding:var(--space-sm) var(--space-md)}.participants-list,.room-content,.sidebar,.video-section{scrollbar-color:#333 #0000;scrollbar-width:thin}.participants-list::-webkit-scrollbar,.room-content::-webkit-scrollbar,.sidebar::-webkit-scrollbar,.video-section::-webkit-scrollbar{height:8px;width:8px}.participants-list::-webkit-scrollbar-thumb,.room-content::-webkit-scrollbar-thumb,.sidebar::-webkit-scrollbar-thumb,.video-section::-webkit-scrollbar-thumb{background:color-mix(in oklab,#333 70%,#0000);border-radius:8px}.participants-list::-webkit-scrollbar-track,.room-content::-webkit-scrollbar-track,.sidebar::-webkit-scrollbar-track,.video-section::-webkit-scrollbar-track{background:#0000}@media (min-width:800px){.room-content{grid-gap:var(--space-lg);display:grid;flex-direction:row;gap:var(--space-lg);grid-template-columns:minmax(0,1fr) clamp(340px,30vw,450px);grid-template-columns:minmax(0,1fr) clamp(var(--sidebar-min-width),30vw,var(--sidebar-max-width));padding:var(--space-lg)}.sidebar,.video-section{-webkit-overflow-scrolling:touch;height:100%;overflow-y:auto}.video-player-wrapper{max-height:none}.sidebar{flex-grow:0}}@media (min-width:1400px){.room-content{gap:calc(var(--space-lg)*1.25)}}@media (max-height:640px) and (min-width:800px){@media (min-width:800px){.video-player-wrapper.vertical{aspect-ratio:9/16!important;margin:0 auto!important;max-height:85vh!important;max-width:350px!important}.video-player-wrapper.horizontal{aspect-ratio:16/9!important;max-height:60vh!important;max-width:100%!important}.video-player-wrapper.vertical video,.video-player-wrapper.vertical>video{aspect-ratio:9/16!important;height:100%!important;object-fit:contain!important;width:auto!important}.video-player-wrapper.horizontal video,.video-player-wrapper.horizontal>video{aspect-ratio:16/9!important;height:auto!important;object-fit:contain!important;width:100%!important}}}.no-video-message{align-items:center;background-color:#334155;background-color:var(--surface-color,#334155);border:1px solid #475569;border:1px solid var(--border-color,#475569);border-radius:.75rem;border-radius:var(--border-radius-lg,.75rem);box-shadow:0 10px 15px -3px #0000001a;box-shadow:var(--shadow-lg,0 10px 15px -3px #0000001a);display:flex;flex:1 1;flex-direction:column;justify-content:center;min-height:100vh;padding:2rem;padding:var(--spacing-xl,2rem);text-align:center;width:100%}.no-video-message h3{color:#f8fafc;color:var(--text-primary,#f8fafc);font-size:1.25rem;font-size:var(--font-size-xl,1.25rem);margin-bottom:.5rem;margin-bottom:var(--spacing-sm,.5rem);margin-top:0}.no-video-message p{color:#cbd5e1;color:var(--text-secondary,#cbd5e1);margin-bottom:1.5rem;margin-bottom:var(--spacing-lg,1.5rem);margin-top:0;max-width:35ch}.no-video-message .btn{align-items:center;display:inline-flex;gap:.5rem;gap:var(--spacing-sm,.5rem);margin-top:1rem;margin-top:var(--spacing-md,1rem)}.chat-section.card{background:var(--color-surface);border:1px solid #4b556366;border-radius:var(--border-radius-lg);box-shadow:var(--shadow-lg);display:flex;flex-direction:column;flex-grow:1;padding:var(--space-lg)}.chat-section h3{border-radius:10px;color:var(--color-text);font-size:1.1rem;margin-bottom:var(--space-md)}.messages-list{display:flex;flex-direction:column;flex-grow:1;gap:var(--space-sm);overflow-y:auto;padding:.5rem 0 1rem}.message.message-item{animation:messageSlideIn var(--transition-normal) ease-out;background:var(--color-surface);border:1px solid var(--color-border);border-radius:15px;box-shadow:0 1px 3px #0000001a;margin:.5rem 0 var(--space-md) 0;padding:var(--space-md);padding-bottom:1.5rem;position:relative;transition:all var(--transition-normal)}.message.message-item:hover{background:#4b55634d;box-shadow:0 4px 12px #00000026;transform:translateY(-1px)}.message.own-message{background:var(--color-primary-alpha);border-color:var(--color-primary-border);margin-left:20px;position:relative}.message.own-message:before{background:var(--color-primary);border-radius:2px;content:"";height:60%;left:-10px;position:absolute;top:50%;transform:translateY(-50%);width:4px}.message.own-message:hover{background:var(--color-primary-hover-alpha);box-shadow:0 4px 12px var(--color-primary-alpha)}.message.sending{animation:messagePulse 1s infinite;opacity:.7}.message-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:4px}.message-author{color:var(--color-primary);font-size:.85rem;font-weight:700;margin-right:8px}.message-time{color:var(--color-text-muted);font-size:.75rem;opacity:.6}.message-time-wrapper{bottom:8px;position:absolute;right:12px}.message-content{align-items:flex-end;display:flex;gap:8px;justify-content:space-between}.message-text{word-wrap:break-word;color:var(--color-text);flex:1 1;line-height:1.4}.delivery-status{color:var(--color-text-muted);font-size:.7rem;margin-left:6px;min-width:16px;text-align:center}.delivery-status.delivered{color:#4caf50}.delivery-status.read{color:#8a2be2}.delivery-status.pending{color:#ff9800}.delivery-status.sending{animation:spin 1s linear infinite;color:#2196f3}.chat-input-form{flex-shrink:0;padding:var(--space-md)}.chat-input-wrapper{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid #333;border-radius:1.5rem;gap:.75rem;overflow:hidden;padding:.5rem;position:relative;transition:all var(--transition-normal)}.chat-input-wrapper:before{background:linear-gradient(135deg,rgba(var(--primary-color-rgb),.05),rgba(var(--secondary-color-rgb),.05));bottom:0;content:"";left:0;opacity:0;pointer-events:none;position:absolute;right:0;top:0;transition:opacity var(--transition-normal)}.chat-input-wrapper.focused{background:var(--background-light);border-color:var(--primary-color);box-shadow:0 0 0 3px rgba(var(--primary-color-rgb),.15),0 4px 12px #00000026;transform:translateY(-1px)}.chat-input-wrapper.focused:before{opacity:1}.chat-input-wrapper:hover:not(.focused){border-color:rgba(var(--primary-color-rgb),.5);box-shadow:0 3px 10px #0000001f;transform:translateY(-.5px)}@media (prefers-color-scheme:dark){.chat-input-wrapper{background:var(--background-light);border-color:#333;box-shadow:0 2px 8px #0000004d}.chat-input-wrapper.focused{background:#1a1a1a;box-shadow:0 0 0 3px rgba(var(--primary-color-rgb),.2),0 4px 12px #0006}.chat-input::placeholder{color:var(--text-muted)}}.chat-input{background:#0000;border:none;border-radius:1.25rem;color:var(--text-primary);flex:1 1;font-size:1rem;font-weight:500;outline:none;padding:.875rem 1.25rem;position:relative;transition:all var(--transition-fast);z-index:1}.chat-input::placeholder{color:var(--text-muted);font-weight:400}.chat-input:focus{background:rgba(var(--primary-color-rgb),.05)}.chat-send-btn{align-items:center;background:linear-gradient(135deg,var(--primary-color),var(--primary-dark));border:none;border-radius:50%;box-shadow:0 2px 8px rgba(var(--primary-color-rgb),.3);color:#fff;cursor:pointer;display:flex;flex-shrink:0;height:2.75rem;justify-content:center;overflow:hidden;position:relative;transition:all var(--transition-normal);width:2.75rem;z-index:1}.chat-send-btn:before{background:linear-gradient(135deg,#fff3,#ffffff1a);bottom:0;content:"";left:0;opacity:0;position:absolute;right:0;top:0;transition:opacity var(--transition-fast)}.chat-send-btn:hover:not(:disabled){background:linear-gradient(135deg,var(--primary-dark),var(--secondary-color));box-shadow:0 4px 12px rgba(var(--primary-color-rgb),.4);transform:translateY(-2px) scale(1.05)}.chat-send-btn:hover:not(:disabled):before{opacity:1}.chat-send-btn:active:not(:disabled){box-shadow:0 2px 6px rgba(var(--primary-color-rgb),.3);transform:translateY(-1px) scale(1.02)}.chat-send-btn:disabled{background:#1a1a1a;box-shadow:none;cursor:not-allowed;opacity:.5;transform:none}.chat-send-btn .spinning{animation:spin 1s linear infinite}.message-input-form input:disabled{cursor:not-allowed;opacity:.7}@keyframes messageSlideIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes messagePulse{0%,to{opacity:.7}50%{opacity:.9}}@media (max-width:600px){.chat-section.card{border-radius:var(--border-radius-sm);min-height:250px}.message.message-item{margin-bottom:var(--space-sm);padding:var(--space-sm)}.message.own-message{margin-left:var(--space-sm)}.message.own-message:before{left:-6px;width:3px}.chat-input-wrapper{border-radius:1.25rem;box-shadow:0 2px 6px #00000014;gap:.5rem;padding:.375rem}.chat-input{border-radius:1rem;font-size:16px;padding:.75rem 1rem}.chat-send-btn{box-shadow:0 2px 6px rgba(var(--primary-color-rgb),.25);height:2.5rem;width:2.5rem}.chat-input-form{padding:.75rem}.chat-input-wrapper.focused{box-shadow:0 0 0 2px rgba(var(--primary-color-rgb),.2),0 6px 16px #0000001f;transform:translateY(-2px)}}.chat-input-wrapper{align-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#1a1a1a;border:1px solid #444;border-radius:20px;box-shadow:0 2px 8px #0000001a;display:flex;padding:.25rem .5rem;transition:box-shadow .2s ease,border-color .2s ease}:root{--primary-color:#6366f1;--primary-color-rgb:99,102,241;--primary-dark:#4f46e5;--secondary-color:#8b5cf6;--secondary-color-rgb:139,92,246;--secondary-dark:#7c3aed;--gradient-primary:linear-gradient(135deg,#6366f1,#8b5cf6);--queue-fallback-bg:#111827f2;--queue-fallback-border:#374151cc;--queue-fallback-shadow:0 8px 32px #0000004d}.video-queue-panel{background:#111827e6;border-left:1px solid #374151cc;border-left:1px solid var(--queue-fallback-border);border-radius:16px 0 0 16px;box-shadow:-2px 0 8px #0000004d;display:flex;flex-direction:column;height:100vh;max-width:min(420px,35vw);min-width:280px;overflow-y:auto;position:fixed;right:0;top:0;transform:translateX(0);transition:transform .4s cubic-bezier(.2,.1,0,.2,1);width:100%;z-index:1000}.video-queue-panel.animating{will-change:transform}.queue-header{align-items:center;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#1f2937cc;border-bottom:2px solid #4b556399;display:flex;flex-shrink:0;justify-content:space-between;min-height:76px;padding:24px 20px 20px;position:relative}.queue-header:after{background:linear-gradient(90deg,#0000,#6366f14d 50%,#0000);background:linear-gradient(90deg,#0000 0,rgba(var(--primary-color-rgb,99,102,241),.3) 50%,#0000 100%);bottom:0;content:"";height:1px;left:20px;position:absolute;right:20px}.queue-header h3{-webkit-text-fill-color:#0000;align-items:center;background:#f8fafc;background:linear-gradient(135deg,#f8fafc,#6366f1);background:linear-gradient(135deg,#f8fafc 0,var(--primary-color,#6366f1) 100%);-webkit-background-clip:text;background-clip:text;color:#f8fafc;display:flex;font-size:1.3rem;font-weight:700;gap:12px;margin:0}.queue-header h3 svg{fill:#e3e3e3;height:32px;margin-right:5px;width:32px}.queue-close-btn,.queue-header .btn-optimized.icon-only.btn-ghost{align-items:center;background:#374151e6;border:1px solid #4b5563cc;border-radius:12px;color:#9ca3af;cursor:pointer;display:flex;font-size:20px;height:44px;justify-content:center;overflow:hidden;padding:0;position:relative;transition:all .3s cubic-bezier(.4,0,.2,1);width:44px}.queue-close-btn:before,.queue-header .btn-optimized.icon-only.btn-ghost:before{background:radial-gradient(circle,#ef444433 0,#0000 70%);content:"";height:0;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);transition:all .3s ease;width:0}.queue-close-btn:hover,.queue-header .btn-optimized.icon-only.btn-ghost:hover{background:#374151f2;border-color:#ef444499;color:#ef4444;transform:scale(1.05) rotate(90deg)}body.queue-closing .queue-close-btn,body.queue-closing .queue-header .btn-optimized.icon-only.btn-ghost{animation:queueCloseSpin .35s cubic-bezier(.4,0,.2,1);background:#374151f2;border-color:#ef444499;color:#ef4444}@keyframes queueCloseSpin{0%{transform:rotate(0deg) scale(1)}60%{transform:rotate(90deg) scale(1.05)}to{transform:rotate(0deg) scale(1)}}.queue-close-btn:hover:before,.queue-header .btn-optimized.icon-only.btn-ghost:hover:before{height:100%;width:100%}.queue-close-btn:focus-visible,.queue-header .btn-optimized.icon-only.btn-ghost:focus-visible{outline:2px solid #6366f1;outline:2px solid var(--primary-color);outline-offset:2px}.queue-content{display:flex;flex:1 1;flex-direction:column;justify-content:flex-start;overflow:hidden;padding:0 20px 10px}.add-url-form{background:linear-gradient(135deg,#1f2937f2,#374151e6);border:2px solid #6366f126;border:2px solid rgba(var(--primary-color-rgb,99,102,241),.15);border-radius:16px;margin-bottom:20px;overflow:hidden;padding:24px;position:relative;transition:all .3s ease}.add-url-form:before{background:linear-gradient(135deg,#6366f1,#8b5cf6);background:var(--gradient-primary,linear-gradient(135deg,#6366f1 0,#8b5cf6 100%));content:"";height:3px;left:0;opacity:.6;position:absolute;right:0;top:0}.add-url-form:focus-within{border-color:#6366f166;border-color:rgba(var(--primary-color-rgb,99,102,241),.4);box-shadow:0 8px 25px #6366f126;box-shadow:0 8px 25px rgba(var(--primary-color-rgb,99,102,241),.15);transform:translateY(-2px)}.url-input-group{align-items:stretch;display:flex;gap:12px}.url-input-group input{background:#374151e6;border:2px solid #4b5563cc;border-radius:12px;color:#f8fafc;flex:1 1;font-size:.95rem;outline:none;padding:16px 20px;transition:all .3s cubic-bezier(.4,0,.2,1)}.url-input-group input::placeholder{color:#9ca3af;transition:color .3s ease}.url-input-group input:focus{background:#1f2937;border-color:#6366f1;border-color:var(--primary-color,#6366f1);box-shadow:0 0 0 3px #6366f11a,0 4px 12px #6366f126;box-shadow:0 0 0 3px rgba(var(--primary-color-rgb,99,102,241),.1),0 4px 12px rgba(var(--primary-color-rgb,99,102,241),.15);transform:translateY(-1px)}.url-input-group input:focus::placeholder{color:#6b7280}.url-input-group .btn-optimized{border-radius:12px;font-size:.9rem;font-weight:600;overflow:hidden;padding:16px 24px;position:relative;transition:all .3s cubic-bezier(.4,0,.2,1)}.url-input-group .btn-optimized:before{background:#fff3;border-radius:50%;content:"";height:0;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);transition:all .4s ease;width:0}.url-input-group .btn-optimized:hover:before{height:200px;width:200px}.queue-list{flex:1 1;margin:0 -8px;max-height:calc(100vh - 300px);min-height:120px;overflow-y:auto;padding:0 8px;scrollbar-color:#6366f1 #e2e8f04d;scrollbar-color:var(--primary-color,#6366f1) #e2e8f04d;scrollbar-width:thin}.queue-list::-webkit-scrollbar{width:6px}.queue-list::-webkit-scrollbar-track{background:#3741514d;border-radius:3px}.queue-list::-webkit-scrollbar-thumb{background:linear-gradient(135deg,#6366f1,#8b5cf6);background:var(--gradient-primary,linear-gradient(135deg,#6366f1 0,#8b5cf6 100%));border-radius:3px;-webkit-transition:all .3s ease;transition:all .3s ease}.queue-list::-webkit-scrollbar-thumb:hover{background:linear-gradient(135deg,#4f46e5,#7c3aed);background:linear-gradient(135deg,var(--primary-dark,#4f46e5),var(--secondary-dark,#7c3aed))}.queue-item{align-items:center;background:#374151cc;border:1px solid #4b556399;border-radius:14px;display:flex;justify-content:space-between;margin-bottom:10px;margin-top:10px;overflow:hidden;padding:14px 16px;position:relative;transition:all .3s cubic-bezier(.4,0,.2,1)}.queue-item:before{background:linear-gradient(90deg,#0000,#6366f11a 50%,#0000);content:"";height:100%;left:-100%;position:absolute;top:0;transition:left .5s ease;width:100%}.queue-item:hover{background:#1f2937f2;border-color:#6366f14d;box-shadow:0 6px 20px #0003,0 3px 10px #0000001a;transform:translateY(-2px) scale(1.01)}.queue-item:hover:before{left:100%}.queue-item.current{animation:currentGlow 3s ease-in-out infinite;background:linear-gradient(135deg,#6366f126,#8b5cf61a);border:2px solid #6366f166;box-shadow:0 6px 20px #6366f133,0 3px 10px #6366f126;position:relative}.queue-item.current:after{background:linear-gradient(135deg,#6366f1,#8b5cf6);border-radius:0 8px 8px 0;bottom:0;content:"";left:0;position:absolute;top:0;width:4px}@keyframes currentGlow{0%,to{box-shadow:0 4px 12px #6366f126,0 2px 6px #6366f11a;box-shadow:0 4px 12px rgba(var(--primary-color-rgb,99,102,241),.15),0 2px 6px rgba(var(--primary-color-rgb,99,102,241),.1)}50%{box-shadow:0 6px 16px #6366f133,0 3px 8px #6366f126;box-shadow:0 6px 16px rgba(var(--primary-color-rgb,99,102,241),.2),0 3px 8px rgba(var(--primary-color-rgb,99,102,241),.15)}}.queue-item-info{align-items:center;display:flex;flex:1 1;gap:16px;min-width:0}.queue-item-number{align-items:center;color:#9ca3af;display:flex;font-size:1.1rem;font-weight:700;justify-content:center;min-width:32px}.queue-item.current .queue-item-number{color:#6366f1;font-size:1.2rem}.queue-item-details{flex:1 1;min-width:0}.queue-item-title{color:#f8fafc;font-size:.95rem;font-weight:600;line-height:1.4;margin-bottom:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.queue-item.current .queue-item-title{color:#4f46e5}.queue-item-author{color:#9ca3af;font-size:.8rem;margin-bottom:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.queue-item-added{color:#6b7280;font-size:.75rem;font-style:italic}.queue-item-number .icon{animation:pulse 2s ease-in-out infinite;color:#10b981;font-size:1.2rem}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.05)}}.queue-empty{background:#1f293780;border:2px dashed #4b5563cc;border-radius:12px;color:#9ca3af;font-style:italic;margin:20px 0 10px;padding:30px 20px;text-align:center}.queue-empty:before{content:"○";display:block;font-size:2rem;margin-bottom:10px;opacity:.6}.empty-queue-hint{color:#9ca3af;font-size:.85rem;font-style:normal;font-weight:500;margin-top:8px}.queue-actions{align-items:center;background:linear-gradient(180deg,#1f2937cc,#111827e6);border-top:1px solid #4b556399;bottom:0;box-shadow:0 -4px 12px #0003;display:flex;gap:12px;justify-content:center;margin:0 -20px -20px;padding:16px 20px;position:-webkit-sticky;position:sticky;z-index:5}.queue-actions:before{background:linear-gradient(90deg,#0000,#6366f133 50%,#0000);background:linear-gradient(90deg,#0000 0,rgba(var(--primary-color-rgb,99,102,241),.2) 50%,#0000 100%);content:"";height:1px;left:20px;position:absolute;right:20px;top:0}.queue-actions .btn-optimized.btn-primary.full-width{align-items:center;background:linear-gradient(135deg,#6366f1,#8b5cf6);background:linear-gradient(135deg,var(--primary-color,#6366f1) 0,var(--secondary-color,#8b5cf6) 100%);border:none;border-radius:16px;box-shadow:0 4px 16px #6366f14d,0 2px 8px #6366f133;box-shadow:0 4px 16px rgba(var(--primary-color-rgb,99,102,241),.3),0 2px 8px rgba(var(--primary-color-rgb,99,102,241),.2);color:#fff;display:flex;font-size:1rem;font-weight:700;gap:12px;height:56px;justify-content:center;overflow:hidden;position:relative;text-shadow:0 1px 2px #0000001a;transition:all .3s cubic-bezier(.4,0,.2,1)}.queue-actions .btn-optimized.btn-primary.full-width:before{background:linear-gradient(90deg,#0000,#fff3 50%,#0000);content:"";height:100%;left:-100%;position:absolute;top:0;transition:left .6s ease;width:100%}.queue-actions .btn-optimized.btn-primary.full-width:hover{background:linear-gradient(135deg,#4f46e5,#7c3aed);background:linear-gradient(135deg,var(--primary-dark,#4f46e5) 0,var(--secondary-dark,#7c3aed) 100%);box-shadow:0 6px 20px #6366f166,0 3px 12px #6366f14d;box-shadow:0 6px 20px rgba(var(--primary-color-rgb,99,102,241),.4),0 3px 12px rgba(var(--primary-color-rgb,99,102,241),.3);transform:translateY(-2px) scale(1.02)}.queue-actions .btn-optimized.btn-primary.full-width:hover:before{left:100%}.queue-actions .btn-optimized.btn-primary.full-width:active{transform:translateY(-1px) scale(1.01);transition:all .1s ease}.queue-actions .btn-optimized.btn-primary.full-width:focus-visible{outline:3px solid #6366f180;outline:3px solid rgba(var(--primary-color-rgb,99,102,241),.5);outline-offset:2px}.queue-actions .btn-optimized.btn-primary.full-width svg{filter:drop-shadow(0 1px 1px rgba(0,0,0,.1));height:20px;width:20px}.queue-loading{align-items:center;color:#9ca3af;display:flex;justify-content:center;padding:40px}.queue-loading:before{animation:spin 1s linear infinite;border:2px solid #374151cc;border-radius:50%;border-top-color:#6366f1;border-top:2px solid var(--primary-color);content:"";height:20px;margin-right:12px;width:20px}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@media screen and (max-width:768px){.video-queue-panel{border-left:none;border-top:1px solid #e2e8f0cc;height:100vh;width:100%}.queue-header{min-height:64px;padding:20px 16px 16px}.queue-header h3{font-size:1.2rem}.queue-content{padding:0 16px 16px}.add-url-form{margin-bottom:16px;padding:20px}.url-input-group{flex-direction:column;gap:12px}.url-input-group input{padding:14px 16px}.url-input-group .btn-optimized{padding:14px 20px;width:100%}.queue-actions{align-items:center;display:flex;justify-content:center;margin:0 -16px -16px;padding:17px 16px}.queue-actions .btn-optimized.btn-primary.full-width{border-radius:14px;font-size:.95rem;height:52px}.queue-item{margin-bottom:10px;padding:16px}.queue-item-info{gap:12px}.queue-item-title{font-size:.9rem}}@media screen and (max-width:480px){.video-queue-panel{width:100%}.queue-header{min-height:56px;padding:16px 12px 12px}.queue-header h3{font-size:1.1rem;gap:8px}.queue-header .btn-optimized.icon-only.btn-ghost{font-size:18px;height:40px;width:40px}.queue-content{padding:0 12px}.add-url-form{margin-bottom:12px;padding:16px}.url-input-group input{font-size:.9rem;padding:12px 14px}.url-input-group .btn-optimized{font-size:.85rem;padding:12px 16px}.queue-actions{align-items:center;display:flex;justify-content:center;margin:10px -12px -12px;padding:14px 12px}.queue-actions .btn-optimized.btn-primary.full-width{border-radius:12px;font-size:.9rem;height:48px}.queue-item{margin-bottom:8px;padding:12px 10px}.queue-item-info{gap:10px}.queue-item-number{font-size:1rem;min-width:28px}.queue-item-title{font-size:.85rem}.queue-item-author{font-size:.75rem}.queue-item-added{font-size:.7rem}.queue-empty{margin:15px 0 10px;padding:30px 16px}.queue-empty:before{font-size:1.8rem}}@media screen and (min-width:1440px){.video-queue-panel{width:480px}.queue-header{min-height:84px;padding:28px 24px 24px}.queue-header h3{font-size:1.4rem}.queue-content{padding:0 24px 24px}.add-url-form{padding:28px}.url-input-group input{font-size:1rem;padding:18px 22px}.url-input-group .btn-optimized{font-size:.95rem;padding:18px 28px}.queue-actions{align-items:center;display:flex;justify-content:center;margin:0 -24px -24px;padding:24px}.queue-actions .btn-optimized.btn-primary.full-width{border-radius:18px;font-size:1.1rem;height:60px}.queue-item{margin-bottom:14px;padding:20px 24px}.queue-item-info{gap:18px}.queue-item-title{font-size:1rem}}.video-queue-panel.entering{animation:slideInRight .4s cubic-bezier(.4,0,.2,1) forwards}.video-queue-panel.exiting{animation:slideOutRight .3s cubic-bezier(.4,0,.2,1) forwards}@keyframes slideInRight{0%{opacity:0;transform:translateX(100%)}to{opacity:1;transform:translateX(0)}}@keyframes slideOutRight{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(100%)}}.queue-header .btn-optimized.icon-only.btn-ghost:focus-visible,.url-input-group .btn-optimized:focus-visible,.url-input-group input:focus-visible{outline:2px solid #6366f1;outline:2px solid var(--primary-color);outline-offset:2px}@media (prefers-contrast:high){.video-queue-panel{background:#fffffffa;border-left:2px solid #000}.queue-item{border:1px solid #666}.queue-item.current{border:2px solid #06c}}@media (prefers-reduced-motion:reduce){.queue-header .btn-optimized.icon-only.btn-ghost,.queue-item,.url-input-group .btn-optimized,.url-input-group input,.video-queue-panel{transition:none}.queue-item-number .icon,.queue-item.current,.queue-loading:before{animation:none}}│ │
.queue-actions{gap:12px}.queue-actions .btn-optimized.full-width{flex-grow:0;margin-bottom:0!important;margin-top:0!important;width:auto}.queue-actions .btn-primary{font-weight:700}.queue-actions .btn-danger{background:#0000;border:2px solid #ef4444;border:2px solid var(--error-color,#ef4444);box-shadow:none;color:#ef4444;color:var(--error-color,#ef4444);flex-grow:0;transition:all .2s ease}.queue-actions .btn-danger:hover{background:#ef44441a;background:rgba(var(--error-color-rgb,239,68,68),.1);box-shadow:0 0 15px #ef444433;box-shadow:0 0 15px rgba(var(--error-color-rgb,239,68,68),.2);color:#ef4444;color:var(--error-color,#ef4444);transform:none}.add-url-form,.video-queue-panel{overflow:hidden;transform-origin:top center;will-change:transform,opacity}.add-url-form[data-exit=true],.video-queue-panel[data-exit=true]{pointer-events:none}.add-url-form *,.video-queue-panel *{-webkit-backface-visibility:hidden;backface-visibility:hidden}@media (max-width:768px){.vibio-logo{max-height:2rem}.logo.small .vibio-logo{max-height:1.5rem}}@media (max-width:799px){.room-step:not(.mobile-room-step){display:none}.room-header{flex-direction:column;gap:var(--space-md);min-height:auto;padding:var(--space-md);text-align:center}.room-info h2{font-size:1.2rem}.room-controls{flex-wrap:wrap;gap:var(--space-sm);justify-content:center;padding-left:0}.sidebar{height:auto}.video-queue{max-height:calc(100vh - 200px);max-width:500px}.queue-list{min-height:150px}.add-video-form{background:var(--background-dark);bottom:0;display:flex;flex-direction:column;left:0;padding:calc(1rem + env(safe-area-inset-top)) 1rem 1rem;position:fixed;right:0;top:0;z-index:1001}.add-video-form .form-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:2rem}.add-video-form .form-header h3{font-size:1.3rem;margin:0}.add-video-form button,.add-video-form input,.add-video-form select{border-radius:12px;font-size:1rem;margin-bottom:1rem;padding:1rem}}@media (min-width:800px) and (max-width:1199px){.mobile-room-step{display:none!important}.participants-list{max-height:220px}.chat-section{min-height:380px}.room-header{padding-left:1.5rem;padding-right:1.25rem}.room-controls{gap:.5rem;justify-content:flex-end}.queue-list{max-height:calc(100vh - 350px);min-height:250px}}@media (max-width:375px){.room-info h2{font-size:1.1rem}.participants-list{max-height:120px}.chat-section{min-height:200px}}@media (min-width:1200px){.mobile-room-step{display:none!important}.participants-list{max-height:300px}.chat-section{min-height:500px}.room-header{padding-left:2rem;padding-right:1.25rem}.room-controls{gap:.5rem;justify-content:flex-end}}@media (min-width:1600px){.mobile-room-step{display:none!important}.participants-list{max-height:350px}.chat-section{min-height:400px}.room-header{padding-left:2rem;padding-right:1rem}.room-controls{gap:.5rem;justify-content:flex-end}}@media (-webkit-min-device-pixel-ratio:2),(min-resolution:192dpi){.video-player-wrapper{image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges}}:root{--mobile-nav-offset:calc(54px + 1.35rem)}.mobile-navigation{animation:slideUpFadeIn .5s cubic-bezier(.4,0,.2,1);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);background:#1a1a1a;border-radius:15px 15px 0 0;border-top:1px solid #333;bottom:0;box-shadow:0 -4px 20px #100b224d;justify-content:space-between;left:0;padding:.675rem .9rem calc(.675rem + env(safe-area-inset-bottom));position:fixed;right:0;z-index:1000}.mobile-navigation,.nav-items{align-items:center;display:flex}.nav-items{flex:1 1;gap:0;justify-content:space-evenly}.nav-item{align-items:center;background:#0000;border:none;border-radius:12px;color:var(--text-secondary);cursor:pointer;display:flex;font-weight:500;height:54px;justify-content:flex-start;min-width:54px;overflow:hidden;padding:0 15px;position:relative;transition:background-color .3s ease,color .3s ease;width:54px}.nav-item.active{background:#6e49e1;color:#fff}.nav-item:hover:not(.active){background:#b8b2c91a;color:var(--text-primary)}.nav-icon-container{flex-shrink:0;transition:none}.nav-item-label{font-size:.9rem;font-weight:500;margin-left:10px;white-space:nowrap}.nav-badge{border:2px solid #6e49e1;left:32px;top:8px;z-index:2}.nav-item:not(.active) .nav-badge{border-color:#1a1a1a}.menu-button{transform:translateY(-1px) scale(1.02)}.nav-icon-container{align-items:center;display:flex;font-size:1.35rem;justify-content:center;position:relative;transition:all .3s cubic-bezier(.4,0,.2,1)}.nav-icon-container svg{height:1.5em;transition:all .3s cubic-bezier(.4,0,.2,1);width:1.5em}.nav-item.active .nav-icon-container svg{transform:scale(1.1)}.nav-item:hover .nav-icon-container svg{transform:scale(1.05)}.nav-badge{align-items:center;animation:badgePulse 2s infinite;background:var(--error-color);border:2px solid #1a1a1a;border-radius:50%;color:#fff;display:flex;font-size:.7rem;font-weight:700;height:18px;justify-content:center;line-height:1;min-width:18px;position:absolute;right:-6px;top:-6px;transition:all .3s cubic-bezier(.4,0,.2,1)}@keyframes navItemActivate{0%{box-shadow:0 0 0 #6e49e100;transform:translateY(0) scale(1)}50%{box-shadow:0 0 20px #6e49e166;transform:translateY(-3px) scale(1.08)}to{box-shadow:0 0 16px #6e49e14d;transform:translateY(-2px) scale(1.05)}}@keyframes badgePulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.1)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUpMenu{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}@keyframes slideDownMenu{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(100%)}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}@keyframes fadeInSlideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.nav-item:first-child{animation:fadeInUp .6s cubic-bezier(.4,0,.2,1) .2s both}.nav-item:nth-child(2){animation:fadeInUp .6s cubic-bezier(.4,0,.2,1) .3s both}.nav-item:nth-child(3){animation:fadeInUp .6s cubic-bezier(.4,0,.2,1) .4s both}.nav-item:nth-child(4){animation:fadeInUp .6s cubic-bezier(.4,0,.2,1) .5s both}.section-transition-enter{opacity:0;transform:translateX(100%)}.section-transition-enter-active{transition:all .4s cubic-bezier(.4,0,.2,1)}.section-transition-enter-active,.section-transition-exit{opacity:1;transform:translateX(0)}.section-transition-exit-active{opacity:0;transform:translateX(-100%);transition:all .4s cubic-bezier(.4,0,.2,1)}.menu-button:active,.nav-item:active{transform:translateY(0) scale(.98)}.nav-badge:hover{animation:none;transform:scale(1.2)}.nav-label{display:none}.mic-button{align-items:center;background:#1a1a1a;border:2px solid #333;border-radius:50%;color:var(--text-secondary);cursor:pointer;display:flex;height:48px;justify-content:center;margin:0 .5rem;transition:all .2s ease;width:48px}.mic-button.enabled{background:var(--success-color);border-color:var(--success-color);color:#fff}.mic-button.muted{background:var(--error-color);border-color:var(--error-color);color:#fff}.mic-button:hover{transform:scale(1.05)}.menu-button{align-items:center;animation:fadeInUp .6s cubic-bezier(.4,0,.2,1) .2s both;background:#1a1a1a;border:1px solid #333;border-radius:10px;color:var(--text-primary);cursor:pointer;display:flex;font-size:1.35rem;height:54px;justify-content:center;width:54px}.menu-button,.menu-button svg{transition:all .3s cubic-bezier(.4,0,.2,1)}.menu-button svg{height:1.5em;width:1.5em}.menu-button:hover{background:#6e49e11a;border-color:#6e49e14d;transform:translateY(-1px) scale(1.02)}.menu-button:hover svg{transform:rotate(90deg) scale(1.1)}.mobile-menu-overlay{animation:fadeIn .3s ease-out;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);background:#100b22cc;top:0;z-index:1001}.mobile-menu,.mobile-menu-overlay{bottom:0;left:0;position:fixed;right:0}.mobile-menu{animation:slideUpMenu .4s cubic-bezier(.4,0,.2,1);background:#1a1a1a;border-top-left-radius:20px;border-top-right-radius:20px;max-height:70vh;overflow-y:auto;padding-bottom:env(safe-area-inset-bottom);z-index:1002}.menu-header{border-bottom:1px solid #333;justify-content:space-between;padding:1.5rem 1.5rem 1rem}.menu-header,.room-info{align-items:center;display:flex}.room-info{flex:1 1;gap:1rem;padding-right:.55rem}.room-info h3{color:var(--text-primary);font-size:1.2rem;font-weight:600;margin:0}.room-actions{gap:.5rem}.room-action-btn,.room-actions{align-items:center;display:flex}.room-action-btn{background:#6e49e11a;border:1px solid #6e49e133;border-radius:8px;color:#6e49e1;cursor:pointer;font-size:1.25rem;height:36px;justify-content:center;transition:all .2s ease;width:36px}.room-action-btn:hover{background:#6e49e133;border-color:#6e49e166;transform:scale(1.05)}.close-menu-btn{align-items:center;background:var(--error-color);border:none;border-radius:20%;color:var(--text-primary);cursor:pointer;display:flex;height:35px;justify-content:center;transition:all .2s ease;width:35px}.close-menu-btn:hover{background:#ffffff26;border-color:#333}.menu-content{padding:1rem 1.5rem 1.5rem}.menu-section{margin-bottom:1.5rem}.menu-section:last-child{margin-bottom:0}.menu-section h4{color:var(--text-secondary);font-size:.9rem;font-weight:600;letter-spacing:.05em;margin:0 0 .75rem;text-transform:uppercase}.menu-item{align-items:center;animation:fadeInUp .4s cubic-bezier(.4,0,.2,1) forwards;background:#0000;border:1px solid #333;border-radius:12px;color:var(--text-primary);cursor:pointer;display:flex;font-size:1rem;gap:.75rem;margin-bottom:.5rem;opacity:0;padding:1rem;text-align:left;transition:all .3s cubic-bezier(.4,0,.2,1);width:100%}.menu-item:first-child{animation-delay:.1s}.menu-item:nth-child(2){animation-delay:.2s}.menu-item:nth-child(3){animation-delay:.3s}.menu-item:nth-child(4){animation-delay:.4s}.menu-item:nth-child(5){animation-delay:.5s}.menu-item:last-child{margin-bottom:0}.menu-item:hover{background:#6e49e11a;border-color:#6e49e14d;color:#6e49e1}.menu-item.danger{color:var(--error-color)}.menu-item.danger:hover{background:#ef44441a}.mobile-menu.closing{animation:slideDownMenu .3s cubic-bezier(.4,0,.2,1)}.mobile-menu-overlay.closing{animation:fadeOut .3s ease-out}.mobile-content-section{animation:fadeInSlideUp .4s cubic-bezier(.4,0,.2,1);backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);background:#000;bottom:0;display:flex;flex-direction:column;left:0;overflow:hidden;padding-bottom:calc(54px + 1.35rem + env(safe-area-inset-bottom));padding-bottom:calc(var(--mobile-nav-offset, 75px) + env(safe-area-inset-bottom));padding-top:env(safe-area-inset-top);position:fixed;right:0;top:0;z-index:100}.mobile-content-section.hidden{display:none}.mobile-section-header{align-items:center;background:#1a1a1a;border-bottom:1px solid #333;border-radius:0 0 15px 15px;display:flex;flex-shrink:0;justify-content:space-between;padding:1rem 1.5rem}.mobile-section-header h2{color:var(--text-primary);font-size:1.3rem;font-weight:600;margin:0}.mobile-section-content{-webkit-overflow-scrolling:touch;flex:1 1;overflow-y:auto}@media (max-width:375px){.mobile-navigation{padding:.5rem .75rem calc(.5rem + env(safe-area-inset-bottom))}.nav-items{gap:.25rem}.nav-item{min-height:50px;min-width:50px;padding:.5rem}.nav-icon-container,.nav-item{font-size:1.25rem}.nav-icon-container svg{height:1.25em;width:1.25em}.nav-label{display:none}.menu-button{font-size:1.25rem;height:50px;width:50px}.menu-button svg{height:1.25em;width:1.25em}}@media (max-height:500px) and (orientation:landscape){.mobile-menu{max-height:80vh}.menu-content{padding:.75rem 1.5rem 1rem}.menu-section{margin-bottom:1rem}}@media (min-width:800px){.mobile-menu,.mobile-menu-overlay,.mobile-navigation{display:none}.mobile-content-section{background:#0000;overflow:visible;padding:0;position:static;z-index:auto}.mobile-section-header{display:none}.mobile-section-content{overflow:visible;padding:0}}.mobile-header-buttons{align-items:center;display:flex;gap:.5rem}@media (max-width:799px){.mobile-room-step{background:var(--background-dark);height:100vh;height:100svh;overflow:hidden;position:relative}.btn{-webkit-tap-highlight-color:transparent;align-items:center;border:none;border-radius:12px;cursor:pointer;display:inline-flex;font-size:1rem;font-weight:600;gap:.5rem;justify-content:center;min-height:44px;padding:.875rem 1.5rem;transition:all .2s ease;-webkit-user-select:none;user-select:none}.btn-primary{background:#6e49e1;box-shadow:0 4px 16px #6e49e14d;color:#fff}.btn-primary:hover:not(:disabled){background:#5a3bb8;box-shadow:0 6px 20px #6e49e166;transform:translateY(-1px)}.btn-secondary{background:#1a1a1a;border:2px solid #333;color:var(--text-primary)}.btn-secondary:hover:not(:disabled){background:#6e49e11a;border-color:#6e49e1;color:#6e49e1}.btn-danger{background:var(--error-color);color:#fff}.btn-danger:hover:not(:disabled){background:var(--error-color-hover);transform:translateY(-1px)}.btn:disabled{cursor:not-allowed;opacity:.6;transform:none}.btn:active:not(:disabled){transform:translateY(0)}.mobile-video-container{box-sizing:border-box;display:flex;flex-direction:column;gap:1rem;height:100%;padding-bottom:calc(75px + env(safe-area-inset-bottom));padding-bottom:calc(var(--mobile-nav-offset, 75px) + env(safe-area-inset-bottom))}.mobile-video-container .video-player-wrapper{background:#000;border-radius:12px;max-height:80vh;overflow:hidden;width:100%}.no-video-placeholder{align-items:center;background:#1a1a1a;border:2px dashed #333;border-radius:12px;box-sizing:border-box;display:flex;flex-direction:column;height:100%;justify-content:center;min-height:200px;padding:2rem;text-align:center}.no-video-placeholder h3{color:var(--text-primary);font-size:1.2rem;margin:0 0 .5rem}.no-video-placeholder p{color:var(--text-secondary);font-size:.9rem;margin:0 0 1.5rem}.mobile-overlay{backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);background:#00000080;inset:0;position:fixed;z-index:9998}.mobile-add-video-form{background:#1a1a1a;border-top-left-radius:20px;border-top-right-radius:20px;bottom:0;box-shadow:0 -4px 20px #0003;left:0;padding-bottom:env(safe-area-inset-bottom);position:fixed;right:0;z-index:9999!important}.mobile-add-video-form .form-header{align-items:center;border-bottom:1px solid #333;display:flex;justify-content:space-between;padding:1.5rem 1.5rem 1rem}.mobile-add-video-form .form-header h3{color:var(--text-primary);font-size:1.2rem;font-weight:600;margin:0}.mobile-add-video-form .close-btn{align-items:center;background:#ffffff1a;border:none;border-radius:50%;color:var(--text-primary);cursor:pointer;display:flex;font-size:1.5rem;height:32px;justify-content:center;line-height:1;width:32px}.mobile-add-video-form form{padding:1.5rem}.mobile-add-video-form input{background:var(--background-dark);border:2px solid #333;border-radius:12px;color:var(--text-primary);font-size:1rem;margin-bottom:1rem;padding:1rem;transition:border-color .2s ease;width:100%}.mobile-add-video-form input:focus{border-color:var(--color-primary);outline:none}.mobile-add-video-form .form-actions{display:flex;gap:1rem}.mobile-add-video-form .form-actions .btn{align-items:center;border:none;border-radius:12px;cursor:pointer;display:flex;flex:1 1;font-size:1rem;font-weight:600;gap:.5rem;justify-content:center;padding:1rem;transition:all .2s ease}.mobile-chat-section{padding-bottom:env(safe-area-inset-bottom)}.mobile-chat-container{display:flex;flex-direction:column;height:100%;min-height:0}.mobile-chat-messages{-webkit-overflow-scrolling:touch;flex:1 1 auto;min-height:0;overflow-y:auto;padding:1rem}.mobile-chat-input-form{border-top:1px solid #333;flex-shrink:0}.mobile-chat-input-wrapper{align-items:center;background:#1a1a1a;border:2px solid #333;border-radius:25px;display:flex;gap:.75rem;margin:8px;padding:.5rem;transition:border-color .2s ease}.mobile-chat-input-wrapper:focus-within{border-color:var(--color-primary)}.mobile-chat-input{background:#0000;border:none;border-radius:20px;color:var(--text-primary);flex:1 1;font-size:1rem;outline:none;padding:.75rem 1rem}.mobile-chat-input::placeholder{color:var(--text-secondary)}.mobile-chat-send-btn{align-items:center;background:var(--color-primary);border:none;border-radius:50%;color:#fff;cursor:pointer;display:flex;flex-shrink:0;height:44px;justify-content:center;transition:all .2s ease;width:44px}.mobile-chat-send-btn:disabled{cursor:not-allowed;opacity:.5}.mobile-chat-send-btn:not(:disabled):hover{background:var(--color-primary-hover);transform:scale(1.05)}.empty-queue-placeholder{align-items:center;background:#1a1a1a;border:2px dashed #333;border-radius:12px;display:flex;flex-direction:column;height:95%;justify-content:center;margin:1rem 8px;min-height:45%;overflow:hidden;padding:2rem;text-align:center}.mobile-content-section:has(.empty-queue-placeholder) .mobile-section-content{overflow:hidden}.mobile-section-content.no-scroll{overflow:hidden}.empty-queue-placeholder:before{content:"○";display:block;font-size:2rem;font-style:italic;margin-bottom:10px;opacity:.6}.empty-queue-placeholder h3{color:var(--text-primary);font-size:1.2rem;margin:0 0 .5rem}.empty-queue-placeholder p{color:var(--text-secondary);font-size:.9rem;margin:0 0 1.5rem}.mobile-queue-list{display:flex;flex-direction:column;gap:1rem;margin:1rem;padding-bottom:calc(75px + env(safe-area-inset-bottom));padding-bottom:calc(var(--mobile-nav-offset, 75px) + env(safe-area-inset-bottom))}.mobile-queue-item{align-items:center;background:#1a1a1a;border:2px solid #0000;border-radius:12px;display:flex;gap:1rem;padding:1rem;position:relative;transition:all .2s ease}.mobile-queue-item.current{background:var(--color-primary-alpha);border-color:var(--color-primary)}.mobile-queue-item:hover{background:#ffffff0d}.queue-item-thumbnail{align-items:center;background:var(--background-dark);border-radius:8px;display:flex;flex-shrink:0;height:60px;justify-content:center;overflow:hidden;position:relative;width:80px}.queue-item-thumbnail img{height:100%;object-fit:cover;width:100%}.thumbnail-placeholder{color:var(--text-secondary)}.current-indicator{background:var(--color-primary);border-radius:4px;color:#fff;font-size:.6rem;font-weight:700;left:4px;letter-spacing:.05em;padding:2px 6px;position:absolute;text-transform:uppercase;top:4px}.queue-item-info{flex:1 1;min-width:0}.queue-item-info h4{color:var(--text-primary);font-size:1rem;font-weight:600}.queue-item-info h4,.queue-item-info p{margin:0 0 .25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.queue-item-info p{color:var(--text-secondary);font-size:.85rem}.queue-item-info .duration{background:#ffffff1a;border-radius:4px;color:var(--text-secondary);font-size:.75rem;padding:2px 6px}.queue-item-remove{align-items:center;background:var(--error-color);border:none;border-radius:50%;color:#fff;cursor:pointer;display:flex;flex-shrink:0;height:36px;justify-content:center;transition:all .2s ease;width:36px}.queue-item-remove:hover{background:var(--error-color-hover);transform:scale(1.05)}.mobile-participants-list{display:flex;flex-direction:column;padding-bottom:calc(75px + env(safe-area-inset-bottom));padding-bottom:calc(var(--mobile-nav-offset, 75px) + env(safe-area-inset-bottom))}.mobile-participant-item{align-items:center;background:#1a1a1a;border-radius:12px;display:flex;gap:1rem;margin:8px;padding:1rem;transition:all .2s ease}.mobile-participant-item:hover{background:#ffffff0d}.mobile-participant-item .participant-avatar{align-items:center!important;aspect-ratio:1/1!important;background:linear-gradient(135deg,var(--color-primary),var(--secondary-color))!important;border-radius:50%!important;color:#fff!important;display:flex!important;flex-shrink:0!important;font-size:1.2rem!important;font-weight:700!important;height:48px!important;justify-content:center!important;max-height:48px!important;max-width:48px!important;min-height:48px!important;min-width:48px!important;overflow:hidden!important;width:48px!important}.mobile-participant-item .participant-avatar img{height:100%;object-fit:cover;width:100%}.mobile-participant-item .participant-info{flex:1 1;min-width:0}.mobile-participant-item .participant-name{color:var(--text-primary);font-size:1rem;font-weight:600;margin-bottom:.25rem}.mobile-participant-item .participant-badges{display:flex;gap:.5rem;margin-top:.25rem}.mobile-participant-item .badge{align-items:center;border-radius:12px;display:inline-flex;font-size:.7rem;font-weight:700;gap:.25rem;letter-spacing:.05em;padding:2px 8px;text-transform:uppercase}.mobile-participant-item .badge-host{background:rgba(var(--color-primary-rgb),.2);border:1px solid rgba(var(--color-primary-rgb),.3);color:var(--color-primary)}.mobile-participant-item .participant-status{align-items:flex-end;display:flex;flex-direction:column;gap:.25rem}.mobile-participant-item .status-pill{border-radius:12px;font-size:.7rem;font-weight:600;letter-spacing:.05em;padding:4px 8px;text-transform:uppercase}.mobile-participant-item .status-pill.muted{background:rgba(var(--error-color-rgb),.2);border:1px solid rgba(var(--error-color-rgb),.3);color:var(--error-color)}.mobile-participant-item .status-pill.speaking{background:rgba(var(--success-color-rgb),.2);border:1px solid rgba(var(--success-color-rgb),.3);color:var(--success-color)}@media (max-width:375px){.mobile-queue-item{gap:.75rem;padding:.75rem}.queue-item-thumbnail{height:45px;width:60px}.queue-item-info h4{font-size:.9rem}.queue-item-info p{font-size:.8rem}.mobile-participant-item{gap:.75rem;padding:.75rem}.mobile-participant-item .participant-avatar{border-radius:50%!important;flex-shrink:0!important;font-size:1.2rem!important;height:48px!important;min-height:48px!important;min-width:48px!important;width:48px!important}.mobile-participant-item .participant-name{font-size:.9rem}}@media (max-height:500px) and (orientation:landscape){.mobile-video-container .video-player-wrapper{max-height:60vh}.empty-queue-placeholder,.no-video-placeholder{min-height:150px;padding:1.5rem}.mobile-chat-messages{max-height:250px}}}.mobile-card{backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);background:#1a1a1a;border:1px solid #333;border-radius:16px;box-shadow:0 4px 20px #100b224d}.mobile-card:hover{border-color:#6e49e14d;box-shadow:0 8px 32px #6e49e133}.mobile-input{background:#2b1e5699;border:2px solid #333;border-radius:12px;color:var(--text-primary);font-size:1rem;padding:1rem;transition:all .2s ease;width:100%}.mobile-input:focus{background:#2b1e56cc;border-color:#6e49e1;box-shadow:0 0 0 4px #6e49e11a;outline:none}.mobile-input::placeholder{color:var(--text-secondary)}.mobile-toggle{background:#333;border-radius:14px;cursor:pointer;height:28px;position:relative;transition:all .3s ease;width:52px}.mobile-toggle.active{background:#6e49e1;box-shadow:0 0 16px #6e49e166}.mobile-toggle:after{background:#fff;border-radius:50%;box-shadow:0 2px 8px #0003;content:"";height:24px;left:2px;position:absolute;top:2px;transition:all .3s ease;width:24px}.mobile-toggle.active:after{transform:translateX(24px)}.mobile-progress{background:#3d315499;border-radius:3px;height:6px;overflow:hidden;width:100%}.mobile-progress-fill{background:linear-gradient(90deg,#6e49e1,#8b7cf6);border-radius:3px;box-shadow:0 0 8px #6e49e14d;height:100%;transition:width .3s ease}.mobile-notification{backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);background:#1a1a1a;border:1px solid #333;border-radius:12px;box-shadow:0 4px 20px #100b2266;margin:.5rem;padding:1rem}.mobile-notification.success{background:#10b9811a;border-color:var(--success-color)}.mobile-notification.error{background:#ef44441a;border-color:var(--error-color)}.mobile-notification.primary{background:#6e49e11a;border-color:#6e49e1}.mobile-icon-gradient{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#6e49e1,#8b7cf6);-webkit-background-clip:text;background-clip:text}.mobile-glow-button{background:#6e49e1;border:none;border-radius:12px;color:#fff;cursor:pointer;font-weight:600;overflow:hidden;padding:1rem 1.5rem;position:relative;transition:all .3s ease}.mobile-glow-button:before{background:linear-gradient(45deg,#6e49e1,#8b7cf6,#6e49e1);border-radius:14px;bottom:-2px;content:"";left:-2px;opacity:0;position:absolute;right:-2px;top:-2px;transition:opacity .3s ease;z-index:-1}.mobile-glow-button:hover:before{opacity:1}.mobile-glow-button:hover{box-shadow:0 8px 32px #6e49e166;transform:translateY(-2px)}.mobile-avatar{align-items:center;background:#1a1a1a;border:2px solid #333;border-radius:50%;color:var(--text-primary);display:flex;font-weight:600;height:44px;justify-content:center;transition:all .2s ease;width:44px}.mobile-avatar.online{border-color:#6e49e1;box-shadow:0 0 16px #6e49e14d}.mobile-dialog{backdrop-filter:blur(30px);-webkit-backdrop-filter:blur(30px);background:#1a1a1a;border:1px solid #333;border-radius:20px;box-shadow:0 20px 60px #100b2280;overflow:hidden}.mobile-dialog-header{background:linear-gradient(135deg,#6e49e1,#8b7cf6);color:#fff;padding:1.5rem}.mobile-dialog-content{padding:1.5rem}.mobile-list-item{border-bottom:1px solid #333;cursor:pointer;padding:1rem;transition:all .2s ease}.mobile-list-item:hover{background:#6e49e10d}.mobile-list-item:last-child{border-bottom:none}.mobile-pulse{animation:mobile-pulse 2s cubic-bezier(.4,0,.6,1) infinite}@keyframes mobile-pulse{0%,to{opacity:1}50%{opacity:.5}}.mobile-fab{background:linear-gradient(135deg,#6e49e1,#8b7cf6);border:none;border-radius:50%;bottom:100px;box-shadow:0 8px 32px #6e49e166;color:#fff;cursor:pointer;font-size:1.5rem;height:56px;position:fixed;right:20px;transition:all .3s ease;width:56px;z-index:999}.mobile-fab:hover{box-shadow:0 12px 40px #6e49e199;transform:scale(1.1)}.mobile-tabs{background:#2b1e5699;border-radius:12px;display:flex;margin-bottom:1rem;padding:4px}.mobile-tab{background:#0000;border:none;border-radius:8px;color:var(--text-secondary);cursor:pointer;flex:1 1;font-weight:500;padding:.75rem;text-align:center;transition:all .2s ease}.mobile-tab.active{background:#6e49e1;box-shadow:0 2px 8px #6e49e14d;color:#fff}.mobile-status-dot{border:2px solid #1a1a1a;border-radius:50%;height:12px;position:absolute;right:-2px;top:-2px;width:12px}.mobile-status-dot.online{background:var(--success-color)}.mobile-status-dot.offline{background:var(--text-muted)}.mobile-status-dot.busy{background:var(--warning-color)}@media (max-width:375px){.mobile-card{border-radius:12px;margin:.5rem}.mobile-dialog{border-radius:16px;margin:1rem}.mobile-fab{bottom:90px;font-size:1.25rem;height:48px;right:16px;width:48px}}.fade-enter{opacity:0}.fade-enter-active{opacity:1;transition:opacity .3s cubic-bezier(.4,0,.2,1)}.fade-exit{opacity:1}.fade-exit-active{opacity:0;transition:opacity .3s cubic-bezier(.4,0,.2,1)}.slide-left-enter{transform:translateX(100%)}.slide-left-enter-active{transform:translateX(0);transition:transform .4s cubic-bezier(.4,0,.2,1)}.slide-left-exit{transform:translateX(0)}.slide-left-exit-active{transition:transform .4s cubic-bezier(.4,0,.2,1)}.slide-left-exit-active,.slide-right-enter{transform:translateX(-100%)}.slide-right-enter-active{transform:translateX(0);transition:transform .4s cubic-bezier(.4,0,.2,1)}.slide-right-exit{transform:translateX(0)}.slide-right-exit-active{transform:translateX(100%);transition:transform .4s cubic-bezier(.4,0,.2,1)}.slide-up-enter{transform:translateY(100%)}.slide-up-enter-active{transition:transform .4s cubic-bezier(.4,0,.2,1)}.slide-up-enter-active,.slide-up-exit{transform:translateY(0)}.slide-up-exit-active{transform:translateY(100%);transition:transform .4s cubic-bezier(.4,0,.2,1)}.scale-enter{opacity:0;transform:scale(.9)}.scale-enter-active{transition:all .3s cubic-bezier(.4,0,.2,1)}.scale-enter-active,.scale-exit{opacity:1;transform:scale(1)}.scale-exit-active{opacity:0;transform:scale(.9);transition:all .3s cubic-bezier(.4,0,.2,1)}.animate-on-mount{animation:fadeInUp .6s cubic-bezier(.4,0,.2,1)}.animate-delayed{animation:fadeInUp .6s cubic-bezier(.4,0,.2,1) .2s both;opacity:0}.animate-bounce-in{animation:bounceIn .8s cubic-bezier(.4,0,.2,1)}.animate-pulse-soft{animation:pulseSoft 2s ease-in-out infinite}.animate-glow{animation:glow 3s ease-in-out infinite}@keyframes bounceIn{0%{opacity:0;transform:scale(.3) translateY(50px)}50%{opacity:1;transform:scale(1.05) translateY(-10px)}70%{transform:scale(.9) translateY(0)}to{opacity:1;transform:scale(1) translateY(0)}}@keyframes pulseSoft{0%,to{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.02)}}@keyframes glow{0%,to{box-shadow:0 0 10px #6e49e133}50%{box-shadow:0 0 20px #6e49e166}}.nav-section-enter{opacity:0;transform:translateY(20px) scale(.95)}.nav-section-enter-active{transition:all .4s cubic-bezier(.4,0,.2,1)}.nav-section-enter-active,.nav-section-exit{opacity:1;transform:translateY(0) scale(1)}.nav-section-exit-active{opacity:0;transform:translateY(-20px) scale(.95);transition:all .4s cubic-bezier(.4,0,.2,1)}.touch-feedback{transition:all .15s cubic-bezier(.4,0,.2,1)}.touch-feedback:active{opacity:.8;transform:scale(.96)}.loading-shimmer{animation:shimmer 2s infinite;background:linear-gradient(90deg,#2b1e5666 25%,#6e49e133 50%,#2b1e5666 75%);background-size:200% 100%}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.stagger-item{animation:fadeInUp .6s cubic-bezier(.4,0,.2,1) forwards;opacity:0;transform:translateY(20px)}.stagger-item:first-child{animation-delay:.1s}.stagger-item:nth-child(2){animation-delay:.2s}.stagger-item:nth-child(3){animation-delay:.3s}.stagger-item:nth-child(4){animation-delay:.4s}.stagger-item:nth-child(5){animation-delay:.5s}.stagger-item:nth-child(6){animation-delay:.6s}.stagger-item:nth-child(7){animation-delay:.7s}.stagger-item:nth-child(8){animation-delay:.8s}.will-change-transform{will-change:transform}.will-change-opacity{will-change:opacity}.will-change-auto{will-change:auto}@media (prefers-reduced-motion:reduce){*,:after,:before{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.animate-bounce-in,.animate-delayed,.animate-glow,.animate-on-mount,.animate-pulse-soft,.stagger-item{animation:none!important;opacity:1!important;transform:none!important}}.cookie-consent-banner{animation:slideUpFadeIn .3s ease-out;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);background:#000000f2;border-top:1px solid #ffffff1a;bottom:0;box-shadow:0 -4px 20px #0000004d;left:0;padding:20px;position:fixed;right:0;z-index:10000}@keyframes slideUpFadeIn{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}.cookie-banner-content{color:#fff;margin:0 auto;max-width:1200px}.cookie-banner-main{align-items:center;display:flex;gap:20px;justify-content:space-between}.cookie-banner-text h3{align-items:center;color:#fff;display:flex;font-size:1.2rem;font-weight:600;gap:8px;margin:0 0 8px}.cookie-banner-text p{color:#ccc;font-size:.95rem;line-height:1.4;margin:0;max-width:600px}.cookie-banner-actions{align-items:center;display:flex;flex-shrink:0;gap:12px}.cookie-banner-settings{margin:0 auto;max-width:800px}.cookie-banner-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:20px}.cookie-banner-header h3{align-items:center;color:#fff;display:flex;font-size:1.3rem;font-weight:600;gap:8px;margin:0}.btn-close{align-items:center;background:none;border:none;border-radius:50%;color:#ccc;cursor:pointer;display:flex;font-size:1.5rem;height:32px;justify-content:center;transition:all .2s ease;width:32px}.btn-close:hover{background:#ffffff1a;color:#fff}.cookie-categories{margin-bottom:24px}.cookie-category{background:#ffffff0d;border:1px solid #ffffff1a;border-radius:8px;margin-bottom:20px;padding:16px}.cookie-category-header{margin-bottom:8px}.cookie-toggle{align-items:center;cursor:pointer;display:flex;gap:12px;-webkit-user-select:none;user-select:none}.cookie-toggle input[type=checkbox]{display:none}.toggle-slider{background:#444;border-radius:12px;flex-shrink:0;height:24px;position:relative;transition:background .3s ease;width:44px}.toggle-slider:before{background:#fff;border-radius:50%;content:"";height:20px;left:2px;position:absolute;top:2px;transition:transform .3s ease;width:20px}.cookie-toggle input[type=checkbox]:checked+.toggle-slider{background:#007bff;background:var(--accent-color,#007bff)}.cookie-toggle input[type=checkbox]:checked+.toggle-slider:before{transform:translateX(20px)}.toggle-slider.disabled{background:#007bff;background:var(--accent-color,#007bff);cursor:not-allowed;opacity:.7}.toggle-slider.disabled:before{transform:translateX(20px)}.toggle-label{display:flex;flex-direction:column;gap:2px}.toggle-label strong{color:#fff;font-size:1rem;font-weight:600}.required-badge{background:#28a745;border-radius:4px;color:#fff;font-size:.7rem;font-weight:500;letter-spacing:.5px;padding:2px 6px;text-transform:uppercase}.cookie-category-description{color:#aaa;font-size:.9rem;line-height:1.4;margin:0 0 0 56px}.btn-cookie{align-items:center;border:none;border-radius:6px;cursor:pointer;display:inline-flex;font-size:.9rem;font-weight:500;justify-content:center;min-width:120px;padding:10px 20px;text-decoration:none;transition:all .2s ease}.btn-cookie.btn-primary{background:#007bff;background:var(--accent-color,#007bff);color:#fff}.btn-cookie.btn-primary:hover{background:#0056b3;background:var(--accent-hover,#0056b3);box-shadow:0 4px 12px #007bff4d;transform:translateY(-1px)}.btn-cookie.btn-secondary{background:#ffffff1a;border:1px solid #fff3;color:#fff}.btn-cookie.btn-secondary:hover{background:#ffffff26;border-color:#ffffff4d}.btn-cookie.btn-tertiary{background:#0000;border:1px solid #666;color:#ccc}.btn-cookie.btn-tertiary:hover{background:#ffffff0d;border-color:#888;color:#fff}@media (max-width:768px){.cookie-consent-banner{padding:16px}.cookie-banner-main{align-items:stretch;flex-direction:column;gap:16px;text-align:center}.cookie-banner-actions{flex-direction:column;gap:8px}.btn-cookie{min-width:auto;width:100%}.cookie-banner-text p{max-width:none}.cookie-category-description{margin-left:0;margin-top:8px}}@media (max-width:480px){.cookie-banner-header{align-items:flex-start;flex-direction:column;gap:12px}.cookie-banner-header h3{font-size:1.1rem}.cookie-toggle{align-items:flex-start;flex-direction:column;gap:8px}.toggle-label{order:-1}}@media (prefers-contrast:high){.cookie-consent-banner{background:#000;border-top:2px solid #fff}.cookie-category{background:#111;border:1px solid #333}.btn-cookie.btn-secondary{background:#333;border-color:#666}}@media (prefers-reduced-motion:reduce){.cookie-consent-banner{animation:none}.btn-cookie,.toggle-slider,.toggle-slider:before{transition:none}}
/*# sourceMappingURL=main.057bf2fc.css.map*/