:root{--purple1: #8b83d8;--purple2: #7c70f3;--purple3: #6627ba;--dark1: #0e0b24;--dark2: #161240;--light1: #ffffff;--light3: #b6b5bd;--muted: #6b6893;--green: #35ff49;--red1: #b42222;--red2: #ff6565;--bg-app: linear-gradient(220.28deg, #352b79 -7.76%, #161339 61.15%, #0e0b24 95.6%);--tile-bg: linear-gradient(160deg, #221f3d 0%, #161240 100%);--card-border: rgba(255, 255, 255, .12);--card-fill: rgba(255, 255, 255, .05)}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:Inter,sans-serif;background:var(--dark1);color:var(--light1)}a{color:var(--purple2)}a:hover{color:var(--purple1)}button,input{font-family:Inter,sans-serif}input::placeholder{color:var(--muted)}input:focus{outline:none;border-color:var(--purple2)!important}.screen-center{position:relative;min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--bg-app);overflow:hidden;padding:24px}.ambient-glow{position:absolute;top:-180px;left:50%;transform:translate(-50%);width:820px;height:820px;border-radius:50%;background:radial-gradient(circle,#7c70f338,#7c70f300 70%);pointer-events:none}.text-input{width:100%;height:52px;border-radius:14px;border:1.5px solid var(--card-border);background:var(--card-fill);color:var(--light1);font-size:15px;font-weight:500;padding:0 18px}.btn{height:52px;border:none;border-radius:14px;font-size:16px;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:10px;transition:background .15s,opacity .15s}.btn:disabled{opacity:.6;cursor:not-allowed}.btn--primary{width:100%;background:var(--purple2);color:var(--light1)}.btn--primary:hover:not(:disabled){background:var(--purple1)}.btn--ghost{width:96px;background:transparent;border:1.5px solid var(--card-border);color:var(--light1)}.btn--ghost:hover{background:#ffffff14}.btn--discord{width:100%;background:#ffffff0f;border:1.5px solid var(--card-border);color:var(--light1)}.btn--discord:hover:not(:disabled){background:#ffffff1a}.form-error{color:var(--red2);font-size:13px;font-weight:500;margin:0;text-align:center}.divider{display:flex;align-items:center;gap:12px;margin:2px 0}.divider span{flex:1;height:1px;background:var(--card-border)}.divider em{font-style:normal;font-size:12px;color:var(--muted);font-weight:500}.join-row{display:flex;align-items:stretch;gap:10px}.link-toggle{align-self:flex-start;background:none;border:none;padding:0;color:var(--purple1);font-size:13px;font-weight:600;cursor:pointer}.link-toggle:hover{color:var(--purple2)}.profile-chip{position:absolute;top:28px;right:32px;display:flex;align-items:center;gap:10px;background:#ffffff0f;border:1px solid var(--card-border);border-radius:100px;padding:6px 16px 6px 6px;cursor:pointer;transition:background .15s;color:var(--light1);font-size:14px;font-weight:600}.profile-chip:hover{background:#ffffff1a}.profile-chip__avatar{width:32px;height:32px;border-radius:50%;object-fit:cover;flex-shrink:0}.profile-card{position:relative;display:flex;flex-direction:column;align-items:stretch;gap:18px;width:min(380px,100%)}.profile-title{margin:0 0 4px;font-size:26px;font-weight:800;color:var(--light1);text-align:center;letter-spacing:-.5px}.avatar-picker{align-self:center;position:relative;width:120px;height:120px;border-radius:50%;border:none;padding:0;cursor:pointer;background:transparent}.avatar-picker__img{width:100%;height:100%;border-radius:50%;object-fit:cover;border:3px solid var(--card-border)}.avatar-picker__badge{position:absolute;right:2px;bottom:2px;width:36px;height:36px;border-radius:50%;background:var(--purple2);display:flex;align-items:center;justify-content:center;border:3px solid var(--dark1)}.lobby-card{position:relative;display:flex;flex-direction:column;align-items:stretch;gap:18px;width:min(400px,100%)}.lobby-preview{width:100%;aspect-ratio:4 / 3;border-radius:18px;background:var(--tile-bg);display:flex;align-items:center;justify-content:center;overflow:hidden}.lobby-preview__video{width:100%;height:100%;object-fit:cover;transform:scaleX(-1)}.lobby-preview__cat{width:40%;max-width:140px;height:auto;opacity:.9}.mic-level{width:100%;height:6px;border-radius:3px;background:#ffffff14;overflow:hidden}.mic-level__fill{height:100%;background:var(--green);border-radius:3px;transition:width .08s linear}.lobby-toggles{display:flex;gap:10px}.lobby-toggle--icon{flex:0 0 48px}.settings-panel{display:flex;flex-direction:column;gap:12px;background:#ffffff0a;border:1px solid var(--card-border);border-radius:14px;padding:16px}.settings-panel__field{display:flex;flex-direction:column;gap:6px;font-size:12px;color:var(--light3);font-weight:500}.settings-panel__field select{height:40px;border-radius:10px;border:1.5px solid var(--card-border);background:var(--card-fill);color:var(--light1);font-size:13px;padding:0 10px}.settings-panel__toggle{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--light1);font-weight:500;cursor:pointer}.settings-panel__toggle input{width:16px;height:16px;accent-color:var(--purple2)}.lobby-toggle{flex:1;height:48px;border-radius:12px;border:1.5px solid var(--card-border);background:#ffffff0f;color:var(--light1);font-size:13px;font-weight:600;display:flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;transition:background .15s,border-color .15s}.lobby-toggle:hover:not(:disabled){background:#ffffff1a}.lobby-toggle:disabled{opacity:.5;cursor:not-allowed}.lobby-toggle--off{border-color:#ff656566;color:var(--red2)}.home-card{position:relative;display:flex;flex-direction:column;align-items:center;gap:26px;width:min(480px,100%)}.home-card__logo{width:88px;height:auto;opacity:.95}.home-card__cat{width:156px;height:auto}.home-card__heading{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center}.home-card__heading h1{margin:0;font-size:34px;font-weight:800;color:var(--light1);letter-spacing:-.5px}.home-card__heading p{margin:0;font-size:15px;color:var(--light3);line-height:1.5;max-width:360px}.home-card__actions{display:flex;flex-direction:column;align-items:stretch;gap:12px;width:100%}.call-screen{display:flex;flex-direction:column;height:100vh;background:var(--dark1)}.call-topbar{height:72px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;padding:0 28px;background:#ffffff08;border-bottom:1px solid rgba(255,255,255,.08)}.call-topbar__meta{display:flex;align-items:center;gap:18px;color:var(--light3);font-size:13px;font-weight:500}.call-topbar__room-name{color:var(--light1);font-weight:600}.call-topbar__count{display:flex;align-items:center;gap:8px}.room-code-chip{position:relative;display:flex;align-items:center;gap:10px;background:#ffffff0f;border:1px solid var(--card-border);border-radius:10px;padding:8px 14px;cursor:pointer;color:var(--light1)}.room-code-chip:hover{background:#ffffff1a}.room-code-chip__label{font-size:13px;color:var(--light3);font-weight:500}.room-code-chip__code{font-size:14px;font-weight:700;letter-spacing:.5px;font-variant-numeric:tabular-nums}.room-code-chip__copied{position:absolute;top:100%;left:0;margin-top:6px;font-size:12px;color:var(--green);background:#0e0b24e6;padding:4px 8px;border-radius:6px;white-space:nowrap}.call-content{flex:1;display:flex;flex-direction:row;min-height:0}.call-grid{flex:1;min-width:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));grid-auto-rows:minmax(200px,1fr);gap:16px;padding:24px 28px 132px;overflow:auto}.chat-panel{flex-shrink:0;width:320px;display:flex;flex-direction:column;background:#ffffff08;border-left:1px solid rgba(255,255,255,.08)}.chat-panel__header{height:56px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;padding:0 16px;border-bottom:1px solid rgba(255,255,255,.08);color:var(--light1);font-weight:600;font-size:14px}.chat-panel__close{border:none;background:transparent;cursor:pointer;padding:4px;display:flex}.chat-panel__messages{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:12px}.chat-panel__empty{color:var(--light3);font-size:12px;line-height:1.5;margin:0}.chat-panel__message{display:flex;flex-direction:column;gap:2px}.chat-panel__message-author{font-size:12px;font-weight:600;color:var(--purple1)}.chat-panel__message-text{font-size:14px;color:var(--light1);line-height:1.4;word-break:break-word}.chat-panel__form{flex-shrink:0;display:flex;gap:8px;padding:12px;border-top:1px solid rgba(255,255,255,.08)}.chat-panel__input{flex:1;height:40px;border-radius:10px;border:1.5px solid var(--card-border);background:var(--card-fill);color:var(--light1);font-size:13px;padding:0 12px}.chat-panel__send{width:40px;height:40px;border-radius:10px;border:none;background:var(--purple2);display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0}.chat-panel__send:disabled{opacity:.5;cursor:not-allowed}.video-tile{position:relative;border-radius:18px;background:var(--tile-bg);display:flex;align-items:center;justify-content:center;overflow:hidden}.video-tile__video{width:100%;height:100%;object-fit:cover}.video-tile__placeholder{display:flex;align-items:center;justify-content:center}.video-tile__cat{width:40%;max-width:150px;height:auto;opacity:.9}.video-tile__avatar-img{width:112px;height:112px;border-radius:50%;object-fit:cover}.video-tile__label{position:absolute;left:16px;bottom:16px;display:flex;align-items:center;gap:8px;background:#0e0b248c;border-radius:9px;padding:6px 12px;color:var(--light1);font-size:13px;font-weight:600}.video-tile__badge{position:absolute;top:16px;left:50%;transform:translate(-50%);font-size:12px;font-weight:600;padding:6px 12px;border-radius:8px}.video-tile__signal-wrap{position:relative;display:flex;align-items:center}.video-tile__signal{display:flex;align-items:flex-end;gap:2px;margin-left:2px;cursor:default}.video-tile__signal-bar{width:3px;border-radius:1px;transition:background .2s}.video-tile__signal-tooltip{position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%);display:none;flex-direction:column;align-items:center;gap:2px;background:#141032f2;border:1px solid var(--card-border);border-radius:8px;padding:6px 10px;white-space:nowrap;font-size:11px;color:var(--light1);z-index:1}.video-tile__signal-wrap:hover .video-tile__signal-tooltip{display:flex}.video-tile__badge--sharing{background:#7c70f340;color:var(--purple1)}.video-tile__hand{position:absolute;top:16px;right:16px;font-size:22px;line-height:1;filter:drop-shadow(0 1px 3px rgba(0,0,0,.5))}.video-tile__volume{position:absolute;right:16px;bottom:16px;display:flex;align-items:center;gap:6px;background:#0e0b248c;border-radius:9px;padding:6px 10px;opacity:0;transition:opacity .15s}.video-tile:hover .video-tile__volume{opacity:1}.video-tile__volume input[type=range]{width:64px;accent-color:var(--purple2);cursor:pointer}.video-tile__reaction{position:absolute;left:50%;bottom:60px;transform:translate(-50%);font-size:40px;line-height:1;pointer-events:none;animation:reaction-float 2.5s ease-out forwards}@keyframes reaction-float{0%{opacity:0;transform:translate(-50%,10px) scale(.6)}15%{opacity:1;transform:translate(-50%) scale(1.1)}30%{transform:translate(-50%) scale(1)}to{opacity:0;transform:translate(-50%,-70px) scale(1)}}.quality-menu--reactions{flex-direction:row;padding:8px;min-width:0;gap:6px}.reaction-menu__emoji{border:none;background:transparent;font-size:22px;padding:6px 8px;border-radius:9px;cursor:pointer;line-height:1}.reaction-menu__emoji:hover{background:#ffffff1a}.video-tile__expand{position:absolute;top:16px;right:16px;width:34px;height:34px;border-radius:8px;border:none;background:#0e0b248c;display:flex;align-items:center;justify-content:center;cursor:pointer;opacity:0;transition:opacity .15s,background .15s}.video-tile:hover .video-tile__expand{opacity:1}.video-tile__expand:hover{background:#0e0b24d9}.video-tile--focused{cursor:default}.video-tile--speaking{box-shadow:0 0 0 3px var(--green) inset}.video-tile--thumb{cursor:pointer}.video-tile--thumb .video-tile__label{left:8px;bottom:8px;padding:3px 8px;font-size:11px;gap:5px}.video-tile--thumb .video-tile__label svg{width:11px;height:11px}.video-tile--thumb .video-tile__avatar-img{width:56px;height:56px}.video-tile--thumb .video-tile__cat{width:44px}.call-grid--focused{display:flex;flex-direction:column;gap:12px;padding:24px 28px 132px;overflow:hidden}.call-grid__main{flex:1;min-height:0}.call-grid__main .video-tile{width:100%;height:100%}.call-grid__thumbs{flex-shrink:0;display:flex;gap:10px;overflow-x:auto;padding-bottom:4px}.call-grid__thumbs .video-tile{flex-shrink:0;width:160px;height:100px}.start-audio-btn{position:absolute;top:90px;left:50%;transform:translate(-50%);z-index:5;height:44px;padding:0 20px;border-radius:12px;border:1px solid var(--card-border);background:var(--purple2);color:var(--light1);font-family:Inter,sans-serif;font-size:14px;font-weight:600;cursor:pointer;box-shadow:0 4px 16px #00000059}.start-audio-btn:hover{background:var(--purple1)}.call-controls{position:absolute;left:50%;bottom:28px;transform:translate(-50%);display:flex;align-items:center;flex-wrap:wrap;justify-content:center;gap:10px;row-gap:10px;background:#141032d9;border:1px solid var(--card-border);border-radius:22px;padding:12px 14px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);max-width:calc(100vw - 32px)}.call-controls__btn{width:52px;height:52px;flex-shrink:0;border-radius:16px;border:none;background:#ffffff14;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s}.call-controls__btn:hover{background:#ffffff24}.call-controls__btn--label{width:auto;padding:0 20px;gap:9px;background:#7c70f324;color:var(--purple1);font-size:14px;font-weight:600}.call-controls__btn--leave{background:var(--red1)}.call-controls__btn--leave:hover{background:#d13a3a}.quality-menu{position:absolute;bottom:calc(100% + 10px);left:50%;transform:translate(-50%);display:flex;flex-direction:column;gap:4px;background:#141032f2;border:1px solid var(--card-border);border-radius:14px;padding:8px;min-width:190px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.quality-menu__item{text-align:left;padding:9px 12px;border-radius:9px;border:none;background:transparent;color:var(--light1);font-size:13px;font-weight:500;cursor:pointer}.quality-menu__item:hover{background:#ffffff14}.quality-menu__audio-toggle{display:flex;align-items:center;gap:8px;padding:8px 10px;font-size:13px;color:var(--light1);font-weight:500;cursor:pointer}.quality-menu__audio-toggle input{width:15px;height:15px;accent-color:var(--purple2)}.quality-menu__divider{height:1px;background:var(--card-border);margin:2px 4px}.call-controls__divider{width:1px;height:28px;flex-shrink:0;background:var(--card-border);margin:0 4px}@media (hover: none){.video-tile__volume,.video-tile__expand{opacity:1}}@media (max-width: 680px){.screen-center{padding:16px}.profile-chip{top:14px;right:14px;padding:5px 12px 5px 5px;font-size:13px}.call-topbar{height:auto;min-height:60px;padding:10px 14px;flex-wrap:wrap;row-gap:8px}.call-topbar__meta{gap:10px;font-size:12px}.call-topbar__room-name{max-width:38vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.room-code-chip{padding:6px 10px;gap:6px}.room-code-chip__label{display:none}.call-grid{grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px;padding:12px 10px 150px}.call-grid--focused{gap:8px;padding:12px 10px 150px}.call-grid__thumbs .video-tile{width:96px;height:68px}.call-content{position:relative}.chat-panel{position:absolute;top:0;right:0;bottom:0;left:0;z-index:20;width:100%}.video-tile__label{left:8px;bottom:8px;padding:4px 9px;font-size:12px;gap:6px}.video-tile__badge,.video-tile__hand{top:8px}.video-tile__expand{top:8px;right:8px;width:30px;height:30px}.video-tile__volume{right:8px;bottom:8px;padding:5px 8px}.video-tile__volume input[type=range]{width:48px}.start-audio-btn{top:auto;bottom:100px}.call-controls{bottom:10px;gap:6px;row-gap:8px;padding:8px 10px;border-radius:18px;max-width:calc(100vw - 16px)}.call-controls__btn{width:44px;height:44px;border-radius:13px}.call-controls__btn svg{width:18px;height:18px}.call-controls__btn--label{width:44px;padding:0}.call-controls__btn--label span{display:none}.call-controls__divider{height:22px}}@media (max-width: 480px){.lobby-toggles{flex-wrap:wrap}.lobby-toggle{flex:1 1 calc(50% - 5px);font-size:12px}}