.room-grid-layout{display:grid;grid-template-columns:minmax(320px,0.92fr) minmax(360px,1.08fr);gap:clamp(10px,1.6vw,20px);align-items:start;width:100%;min-width:0}.room-grid-layout>.members-area{margin-bottom:0}#room-chat-panel,.room-info-panel,.room-members-panel{min-height:100%}.room-info-panel{background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(248,250,252,.96));border:1px solid rgba(148,163,184,.18);box-shadow:0 18px 38px rgba(15,23,42,.05)}body.dark .room-info-panel{background:linear-gradient(180deg,rgba(26,32,44,.98),rgba(15,23,42,.98));border-color:rgba(71,85,105,.34);box-shadow:0 16px 34px rgba(0,0,0,.22)}.room-header-compact{display:flex;flex-direction:column;gap:14px;min-width:0}.room-title-main{min-width:0}.room-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;min-width:0}.room-name-display{display:flex;align-items:center;gap:10px;min-width:0;font-size:clamp(1.02rem, 1.05rem + .55vw, 1.48rem);line-height:1.28;font-weight:800;letter-spacing:.01em}#current-room-title.room-name-display{gap:0}.room-name-display>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.room-name-display.editable{cursor:text}.room-name-display.editable:hover{color:var(--accent)}.room-title-icon-actions{display:flex;align-items:center;gap:8px;flex:0 0 auto}.room-icon-btn{width:40px;height:40px;border-radius:var(--radius-control);border:1px solid rgba(148,163,184,.22);background:linear-gradient(180deg,rgba(255,255,255,.94),rgba(241,245,249,.92));color:var(--text-primary);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;font-size:1rem;box-shadow:0 10px 22px rgba(15,23,42,.06);transition:transform .16s,border-color .16s,box-shadow .16s,background-color .16s}.room-icon-btn:hover{transform:translateY(-1px);border-color:rgba(59,130,246,.32);box-shadow:0 14px 24px rgba(37,99,235,.12)}.room-icon-btn.is-active{color:var(--accent);background:rgba(37,99,235,.1);border-color:rgba(59,130,246,.42);box-shadow:0 14px 24px rgba(37,99,235,.14)}.room-icon-btn:disabled{opacity:.45;cursor:not-allowed;box-shadow:none}.room-icon-btn.room-icon-btn-danger:hover{color:#ef4444;border-color:rgba(239,68,68,.38);box-shadow:0 14px 24px rgba(239,68,68,.1)}body.dark .room-icon-btn{background:linear-gradient(180deg,rgba(30,41,59,.96),rgba(15,23,42,.96));border-color:rgba(71,85,105,.38);box-shadow:0 12px 24px rgba(0,0,0,.18)}body.dark .room-icon-btn.is-active{background:rgba(59,130,246,.18);border-color:rgba(96,165,250,.42);box-shadow:0 14px 24px rgba(37,99,235,.18)}.room-title-edit{display:flex;flex-direction:column;gap:8px;min-width:0}.room-title-edit input{width:min(520px,100%);height:48px;padding:0 16px;border-radius:var(--radius-control);border:1px solid rgba(148,163,184,.26);background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(248,250,252,.96));color:var(--text-primary);box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 8px 20px rgba(15,23,42,.04)}.room-title-edit input:focus{outline:0;border-color:rgba(59,130,246,.55);box-shadow:0 0 0 4px rgba(59,130,246,.12),0 12px 24px rgba(37,99,235,.08)}body.dark .room-title-edit input{background:linear-gradient(180deg,rgba(30,41,59,.96),rgba(15,23,42,.98));border-color:rgba(71,85,105,.42);box-shadow:inset 0 1px 0 rgba(255,255,255,.03),0 10px 22px rgba(0,0,0,.18)}.room-title-edit-hint{font-size:.82rem;color:var(--text-secondary)}.room-meta-line{display:flex;align-items:center;gap:8px;flex-wrap:nowrap;min-width:0;flex:1 1 auto;overflow-x:auto;padding-bottom:2px;color:var(--text-secondary);scrollbar-width:none}.room-meta-line::-webkit-scrollbar{display:none}.room-meta-item,.room-meta-line .mini-badge,.room-meta-sep{flex:0 0 auto}.room-meta-item{font-size:.82rem;font-weight:700;letter-spacing:.01em}.room-meta-sep{opacity:.48}.room-meta-line .mini-badge{margin-top:0;font-size:.74rem;padding:3px 10px}.room-info-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap}.room-panel-kicker{display:inline-flex;align-items:center;padding:5px 12px;border-radius:999px;background:var(--accent-soft);border:1px solid var(--accent-outline);color:var(--accent);font-size:.8rem;font-weight:700;margin-bottom:10px}.room-info-title h2{font-size:clamp(1rem, 1.1rem + .45vw, 1.4rem);line-height:1.35}.room-info-actions,.room-info-button-row{display:flex;gap:10px;flex-wrap:wrap}.room-info-actions{justify-content:flex-end}.room-info-actions .btn,.room-info-button-row .btn{min-width:0;flex:1 1 132px}.room-rename-card{margin-top:18px;padding:16px;border-radius:16px;border:1px solid rgba(148,163,184,.18);background:rgba(255,255,255,.72)}body.dark .room-rename-card{background:rgba(15,23,42,.58);border-color:rgba(71,85,105,.34)}.room-rename-input-wrap label{display:block;margin-bottom:8px;font-weight:700;color:var(--text-primary)}.room-rename-input-wrap input{padding:0 16px;border-radius:14px;border:1px solid rgba(148,163,184,.26);color:var(--text-primary);box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 8px 20px rgba(15,23,42,.04)}.room-rename-input-wrap input:focus{outline:0;border-color:rgba(59,130,246,.55);box-shadow:0 0 0 4px rgba(59,130,246,.12),0 12px 24px rgba(37,99,235,.08)}body.dark .room-rename-input-wrap input{background:linear-gradient(180deg,rgba(30,41,59,.96),rgba(15,23,42,.98));border-color:rgba(71,85,105,.42);box-shadow:inset 0 1px 0 rgba(255,255,255,.03),0 10px 22px rgba(0,0,0,.18)}.room-info-button-row{margin-top:14px}.room-members-panel{position:relative;overflow:hidden;isolation:isolate}.room-members-panel .member-list,.room-members-panel .members-header,.room-members-panel .speaking-summary{position:relative;z-index:1}.room-members-panel .member-list{display:flex;flex-direction:column;flex-wrap:nowrap;gap:12px;max-height:540px;overflow:auto;padding-right:6px}.members-voice-overlay{position:absolute;inset:0;z-index:6;display:block;padding:0;border-radius:inherit;text-align:center;background:linear-gradient(180deg,rgba(255,255,255,.28),rgba(248,250,252,.44));backdrop-filter:blur(16px) saturate(1.08);-webkit-backdrop-filter:blur(16px) saturate(1.08);box-shadow:inset 0 1px 0 rgba(255,255,255,.28);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .22s,visibility .22s}.members-voice-overlay-content{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:8px;width:100%;height:100%;padding:24px 20px;text-align:center}.members-voice-overlay strong{color:var(--text-primary);font-size:1rem;font-weight:800;line-height:1.2}.members-voice-overlay span{color:var(--text-secondary);font-size:.82rem;line-height:1.6}.member-voice-overlay span:empty,.members-voice-overlay span:empty{display:none}.room-members-panel.is-voice-connecting>:not(.members-voice-overlay){filter:blur(8px);opacity:.2;transform:scale(.995);pointer-events:none;user-select:none;transition:filter .22s,opacity .22s,transform .22s}.room-members-panel.is-voice-connecting .members-voice-overlay{opacity:1;visibility:visible}body.dark .members-voice-overlay{background:linear-gradient(180deg,rgba(15,23,42,.28),rgba(15,23,42,.46));box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}.room-members-panel .member-list li{width:100%;padding:clamp(6px,.62vw,8px) clamp(10px,1vw,14px);border-radius:clamp(12px,1vw,15px);display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:4px;position:relative;overflow:visible;background:linear-gradient(180deg,rgba(255,255,255,.94),rgba(248,250,252,.96));border:1px solid rgba(148,163,184,.16);box-shadow:0 10px 22px rgba(15,23,42,.05)}.room-members-panel .member-list li:not(.self){padding-top:4x;padding-bottom:4px}body.dark .room-members-panel .member-list li{background:linear-gradient(180deg,rgba(30,41,59,.92),rgba(15,23,42,.96));border-color:rgba(71,85,105,.34);box-shadow:0 12px 24px rgba(0,0,0,.18)}.room-members-panel .member-list li::before{display:none;content:none}.room-members-panel .member-list li::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:0;background:linear-gradient(135deg,rgba(96,165,250,.18),rgba(37,99,235,.28));opacity:calc(var(--speak-level, 0) * .92);transition:opacity .16s;will-change:opacity}body.dark .room-members-panel .member-list li::after{background:linear-gradient(135deg,rgba(59,130,246,.22),rgba(14,165,233,.26))}.room-members-panel .member-list li.speaking{--speaking-ring:rgba(59,130,246,.10);--speaking-ring-strong:rgba(59,130,246,.18);--speaking-shadow:rgba(37,99,235,.10);--speaking-shadow-strong:rgba(37,99,235,.14);--speaking-glow-soft:rgba(96,165,250,.12);--speaking-glow:rgba(59,130,246,.16);animation:none;will-change:auto}body.dark .room-members-panel .member-list li.speaking{--speaking-ring:rgba(96,165,250,.12);--speaking-ring-strong:rgba(147,197,253,.20);--speaking-shadow:rgba(37,99,235,.14);--speaking-shadow-strong:rgba(59,130,246,.20);--speaking-glow-soft:rgba(96,165,250,.16);--speaking-glow:rgba(96,165,250,.22)}.room-members-panel .member-list li>:not(.member-admin-card-media){position:relative;z-index:1}.room-members-panel .member-actions{margin-left:0;width:100%;justify-content:flex-end;align-items:center}.room-members-panel .member-list li.has-action-menu .member-main{padding-right:48px}.member-card-head{display:flex;align-items:center;min-width:0;width:100%;min-height:0}.member-action-anchor{position:absolute;top:10px;right:10px;z-index:4;display:flex;align-items:flex-start;justify-content:flex-end}.member-action-menu-wrap{position:absolute;top:10px;right:10px;z-index:4;display:flex;flex-direction:column;align-items:flex-end;gap:8px}.member-action-trigger{width:32px;height:32px;border-radius:12px;border:1px solid rgba(148,163,184,.24);background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(241,245,249,.96));color:var(--text-secondary);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;font-size:1.12rem;line-height:1;box-shadow:0 8px 18px rgba(15,23,42,.08);transition:transform .16s,border-color .16s,box-shadow .16s,color .16s,background-color .16s}.member-action-trigger:hover{transform:translateY(-1px);border-color:var(--accent-outline);box-shadow:0 14px 24px rgba(var(--accent-rgb),.14);box-shadow:0 12px 22px rgba(37,99,235,.12)}.member-action-menu-wrap.is-open .member-action-trigger,.member-action-trigger.is-open{color:var(--accent);border-color:rgba(59,130,246,.38);box-shadow:0 12px 24px rgba(37,99,235,.14)}body.dark .member-action-trigger{background:linear-gradient(180deg,rgba(30,41,59,.96),rgba(15,23,42,.98));border-color:rgba(71,85,105,.42);box-shadow:0 12px 22px rgba(0,0,0,.18)}.member-action-menu{width:min(280px,calc(100vw - 84px));padding:10px;border-radius:16px;border:1px solid rgba(148,163,184,.22);background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(248,250,252,.98));box-shadow:0 20px 36px rgba(15,23,42,.14);display:flex;flex-direction:column;gap:8px}.member-action-popover{position:fixed;left:0;top:0;z-index:1300;width:min(280px,calc(100vw - 84px));max-height:min(420px,calc(100vh - 24px));overflow-y:auto;padding:10px;border-radius:16px;border:1px solid rgba(148,163,184,.22);background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(248,250,252,.98));box-shadow:0 20px 36px rgba(15,23,42,.14);display:flex;flex-direction:column;gap:8px;scrollbar-width:thin}body.dark .member-action-menu,body.dark .member-action-popover{background:var(--bg-panel);border-color:var(--border-light);box-shadow:0 18px 34px rgba(0,0,0,.3)}.member-menu-item{width:100%;min-height:36px;display:inline-flex;align-items:center;justify-content:center;text-align:center;font-weight:700}.member-menu-note{padding:10px 12px;border-radius:14px;border:1px dashed rgba(148,163,184,.26);background:rgba(148,163,184,.08);color:var(--text-secondary);font-size:.78rem;line-height:1.5;font-weight:700}.member-menu-self-audio{width:100%;flex-direction:column;align-items:stretch}.member-menu-self-audio .self-audio-btn{width:100%;min-width:0}.member-menu-volume{display:flex;flex-direction:column;gap:8px;width:100%;padding:10px 12px;border-radius:14px;border:1px solid rgba(148,163,184,.2);background:rgba(148,163,184,.08)}.member-menu-volume-head{display:flex;align-items:center;justify-content:space-between;gap:8px;color:var(--text-secondary);font-size:.78rem;font-weight:700}.member-menu-volume-head strong{color:var(--accent);font-size:.82rem}.member-menu-volume input[type=range]{width:100%;min-width:0;margin:0}body.dark .member-menu-note,body.dark .member-menu-volume{background:rgba(71,85,105,.18);border-color:rgba(71,85,105,.36)}#room-chat-panel{align-self:start;display:grid;grid-template-rows:auto minmax(0,340px) auto auto;transition:transform .18s,box-shadow .18s,background .18s,border-color .18s,color .18s}.room-settings-modal{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(15,23,42,.48);backdrop-filter:blur(10px)}body.dark .room-settings-modal{background:rgba(0,0,0,.58)}.room-settings-dialog{width:min(920px,100%);max-height:calc(100vh - 40px);overflow:auto;background:var(--bg-card);color:var(--text-primary);border:1px solid var(--border-light);border-radius:var(--radius-card);box-shadow:var(--shadow);padding:24px}.room-settings-header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:18px}.room-settings-header h3{margin-bottom:6px;font-size:1.2rem}.room-settings-header p{color:var(--text-secondary);font-size:.95rem}.modal-close-btn{width:42px;height:42px;border:1px solid var(--border-light);border-radius:50%;background:var(--btn-secondary-bg);color:var(--text-primary);cursor:pointer;font-size:1.05rem;flex:0 0 auto}.modal-close-btn:hover{background:var(--border-light)}.room-settings-panel{margin-bottom:0}body.modal-open{overflow:hidden}.room-header-row{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"title leave" "actions actions";gap:16px 18px;align-items:start;margin-bottom:18px}.room-title-block{grid-area:title;min-width:0}.room-title-actions{grid-area:actions;display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:12px;width:100%;padding:14px 16px;border:1px solid rgba(148,163,184,.22);border-radius:var(--radius-panel);background:linear-gradient(180deg,rgba(255,255,255,.84),rgba(255,255,255,.62));box-shadow:0 8px 20px rgba(15,23,42,.035)}.room-title-actions .btn{min-width:142px;border-radius:14px}.room-rename-input-wrap{min-width:0}.room-header-row>#leave-room-btn{grid-area:leave}.room-rename-input-wrap input{width:100%;height:48px;border-radius:var(--radius-control);background:rgba(255,255,255,.92)}.room-rename-hint{margin-top:7px;font-size:.84rem;color:var(--text-secondary)}#call-interface{display:flex;flex-direction:column;gap:clamp(12px,1.8vw,20px);overflow:visible;padding-bottom:0}#call-interface .status-bar{min-width:0;width:100%}.room-workspace{display:grid;grid-template-columns:minmax(0,1fr) 370px;grid-template-areas:"controls chat" "members members";gap:18px 22px;align-items:start}.room-left-column,.room-right-column{min-width:0;display:contents}.room-left-column>.device-panel{grid-area:controls;margin-bottom:0}.members-area.members-bottom{grid-area:members;display:flex;flex-direction:column;gap:10px;padding-top:16px;min-height:0;margin-bottom:0}.room-right-column>#room-chat-panel{grid-area:chat}.speaking-summary{display:flex;align-items:center;gap:8px;margin-bottom:12px;padding:10px 12px;border-radius:var(--radius-control);background:rgba(37,99,235,.08);border:1px solid rgba(37,99,235,.16);color:var(--text-secondary);font-size:.9rem;font-weight:700;min-height:44px}.speaking-summary.active{color:var(--accent);box-shadow:0 0 0 1px rgba(37,99,235,.08) inset}body.dark .speaking-summary{background:rgba(59,130,246,.12);border-color:rgba(59,130,246,.26)}.member-list{max-height:168px;overflow-y:auto;padding-right:6px;align-content:flex-start}#room-chat-panel{min-height:0;align-self:start;display:grid;grid-template-rows:auto minmax(0,286px) auto auto;gap:0;padding-bottom:16px;margin-bottom:0}#room-chat-messages{min-height:286px;height:286px;max-height:286px}.status-bar{margin-top:0}@media (max-width:980px){body{align-items:flex-start}.header-main-row{align-items:stretch}.header-tools{width:100%;justify-content:space-between;margin-left:0}.lobby-toolbar{grid-template-columns:1fr}.toolbar-actions{justify-content:stretch;flex-wrap:wrap;justify-content:stretch}.toolbar-actions .btn{flex:1 1 150px}.room-header-row{grid-template-columns:1fr;grid-template-areas:"title" "leave" "actions"}.room-title-actions{align-items:stretch;grid-template-columns:1fr}.room-title-actions .btn{width:100%;min-width:0}.room-rename-input-wrap{min-width:100%}.room-workspace{grid-template-columns:1fr;grid-template-areas:"controls" "chat" "members"}.member-list{max-height:none}#room-chat-panel{grid-template-rows:auto minmax(0,260px) auto auto}#room-chat-messages{min-height:260px;height:260px;max-height:260px}.room-grid-layout{gap:12px}.members-area{padding:16px;border-radius:20px}#room-chat-send-btn,.mini-btn,.room-info-actions .btn,.room-info-button-row .btn{padding:10px 12px;font-size:.82rem}.speaking-summary{min-height:40px;padding:8px 10px;font-size:.82rem}}@media (max-width:1180px){.room-grid-layout{grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-width:0;align-items:stretch}.room-info-panel{grid-column:1/-1}}@media (max-width:820px){body{padding:12px;align-items:flex-start}.header-title-cluster{flex-direction:column;align-items:flex-start;gap:8px}.header-room-inline{width:100%}.room-meta-row{flex-direction:column;align-items:flex-start;gap:8px}.header-sub-row .header-room-inline,.header-sub-row .room-meta-line{width:100%;max-width:100%}.header-tools{width:100%;justify-content:space-between}.room-title-row{flex-direction:column;align-items:stretch}.room-title-icon-actions{width:100%;justify-content:flex-start}.room-title-edit input{width:100%}.room-meta-item{font-size:.76rem}.room-grid-layout{grid-template-columns:1fr;min-width:0}#room-chat-panel,.room-info-panel,.room-members-panel{grid-column:auto}.room-info-actions,.room-info-button-row{width:100%}.room-info-actions .btn,.room-info-button-row .btn,.single-login-input .btn{flex:1 1 160px}.room-members-panel .member-list li{flex-direction:column}.room-members-panel .member-list{max-height:none}.room-members-panel .member-actions{width:100%;margin-left:0;justify-content:flex-start}.member-secondary-line{flex-wrap:nowrap;align-items:center}.member-role-wrap{flex:1 1 auto;min-width:0}.member-volume-control{min-width:104px;width:auto;margin-left:auto;flex:0 0 auto}.member-volume-control input[type=range]{width:min(140px,34vw)}#room-chat-panel{grid-template-rows:auto minmax(0,280px) auto auto}#room-chat-messages{min-height:280px;height:280px;max-height:280px}.room-settings-dialog{padding:18px;border-radius:22px}}@media (max-width:640px){body{padding:10px}.header-main-row{gap:10px}.header-room-inline{gap:8px;align-items:flex-start}.header-room-divider{display:none}.room-meta-row{gap:6px}.header-tools{gap:8px;flex-direction:column-reverse;align-items:stretch}.header-tools .header-account-chip,.header-tools .header-login-btn,.header-tools .room-title-icon-actions,.header-tools .theme-toggle{width:100%;justify-content:space-between}.room-name-display{font-size:.98rem}.room-title-icon-actions{gap:6px}.room-icon-btn{width:36px;height:36px;border-radius:12px;font-size:.92rem}.card{padding:16px;border-radius:22px}.header{gap:10px;align-items:flex-start;flex-direction:column}.header h1{font-size:1.2rem;flex-wrap:wrap}.create-form,.device-panel,.join-form,.login-section,.members-area{padding:14px;border-radius:18px}.room-panel-kicker{font-size:.68rem;padding:4px 8px;margin-bottom:6px}.members-header h3,.room-info-title h2{font-size:.95rem}.badge,.member-role,.member-speaking-badge,.mini-badge{font-size:.68rem}.room-meta-line .mini-badge{font-size:.66rem;padding:3px 8px}.room-rename-card{padding:12px;margin-top:12px}#room-chat-input,.room-rename-input-wrap input{height:44px;padding:0 12px;border-radius:14px;font-size:.84rem}.member-list li{padding:10px 12px;border-radius:14px;font-size:.78rem}.member-avatar{width:34px;height:34px;border-radius:12px;font-size:.82rem}.member-primary-line{gap:6px}.member-secondary-line{gap:8px}.member-state-badge{font-size:.62rem}.member-level-bar{height:6px}.member-volume-control{font-size:.68rem;min-width:96px}.member-volume-control input[type=range]{width:min(126px,38vw)}.member-actions{width:100%;justify-content:flex-start}.member-action-anchor{top:8px;right:8px}.member-self-audio-group{width:100%}.self-audio-btn{flex:1 1 0;min-width:0}.member-actions [data-volume]{width:100%!important}.room-chat-input-row{flex-direction:column;align-items:stretch}.room-chat-input-wrap{width:100%;flex:1 1 100%;min-width:0}.room-chat-input-wrap label{display:none}#room-chat-input{width:100%;min-width:0;box-sizing:border-box}.room-chat-action-buttons{width:100%;display:flex;gap:10px}#room-chat-image-upload-btn{display:inline-flex}#room-chat-image-upload-btn,#room-chat-send-btn{flex:1 1 0;width:100%;min-width:0;height:44px}#room-chat-panel{grid-template-rows:auto minmax(0,220px) auto auto}#room-chat-messages{min-height:220px;height:220px;max-height:220px;padding:10px;border-radius:16px}.room-chat-bubble{padding:8px 10px;border-radius:14px;font-size:.76rem}.room-chat-bubble.has-image{max-width:100%}#room-chat-status,.room-chat-meta,.room-rename-hint,.speaking-summary{font-size:.72rem}.speaking-summary{min-height:38px}.room-chat-attachment-preview{flex-direction:column;align-items:stretch;padding:10px 12px}.room-chat-attachment-card{align-items:flex-start}#room-chat-image-preview{width:52px;height:52px;border-radius:12px}.control-grid{grid-template-columns:1fr}}