#chat-window-toggle{display:none;position:fixed;top:12px;left:12px;z-index:30;margin:0;min-height:70px;padding:14px 24px;border-radius:16px;font-size:24px;font-weight:800}
body.joined #chat-window-toggle{display:block}

#chat-dialog{position:fixed;top:92px;left:12px;margin:0;width:min(420px,calc(100vw - 24px));height:500px;max-width:none;max-height:calc(100dvh - 110px);box-sizing:border-box;padding:0;overflow:hidden;border:1px solid var(--line);border-radius:18px;background:#fffdfd;color:#333452;box-shadow:0 18px 55px #41527436}
#chat-dialog[data-size="1"]{height:320px}
#chat-dialog[data-size="2"]{height:410px}
#chat-dialog[data-size="3"]{height:500px}
#chat-dialog[data-size="4"]{height:590px}
#chat-dialog[data-size="5"]{height:680px}
#chat-dialog[open]{display:flex;flex-direction:column;z-index:29}
#chat-dialog::backdrop{background:transparent}
#chat-dialog #chat-panel{display:flex;flex:1;min-height:0;flex-direction:column;gap:0;padding:14px;background:transparent;box-shadow:none;border:0}
#chat-dialog .chat-titlebar{display:flex;align-items:center;flex-wrap:wrap;gap:8px;flex-shrink:0;margin:0 0 10px}
#chat-dialog .chat-titlebar h2{margin:0;font-size:18px;line-height:1.2}
#chat-dialog .chat-tabs{display:flex;gap:4px}
#chat-dialog .chat-tabs button{min-height:34px;padding:5px 9px;border-radius:9px;background:var(--button-bg);color:var(--button-text);box-shadow:inset 0 0 0 1px var(--button-border);font-size:13px;font-weight:800}
#chat-dialog .chat-tabs button[aria-pressed="true"]{background:#e3d9fa;color:#4e3c7c;box-shadow:inset 0 0 0 2px #957bbd}
#chat-dialog #chat-status{font-size:11px;color:#827694}
#chat-dialog .chat-window-actions{display:flex;align-items:center;gap:4px;margin-left:auto}
#chat-dialog .chat-window-actions button{min-width:30px;padding:5px 8px}
#chat-dialog .chat-routing{flex-shrink:0;padding:0 0 8px;margin:0 0 8px;border-bottom:1px solid var(--line)}
#chat-dialog #chat-channel[hidden]{display:none}
#chat-dialog .chat-routing select:not([hidden]){margin:0 0 5px}
#chat-dialog #chat-context{margin:0;font-size:11px;line-height:1.35}
#chat-dialog #chat-teacher-controls{display:none}
#chat-dialog #chat-latest{align-self:flex-start;flex-shrink:0;margin:0 0 6px}
#chat-dialog #chat-log{display:flex;flex:1;min-height:0;height:auto;max-height:none;flex-direction:column;gap:8px;overflow:auto;margin:0;padding:0;list-style:none}
#chat-dialog #chat-log li{flex-shrink:0}
#chat-dialog #chat-log li.channel-map .who,#chat-dialog #chat-log li.channel-map .text{color:#24202b}
#chat-dialog #chat-log li.channel-department .who,#chat-dialog #chat-log li.channel-department .text{color:#206b3e}
#chat-dialog #chat-log li.channel-direct .who,#chat-dialog #chat-log li.channel-direct .text{color:#6b7025}
#chat-dialog #chat-empty{flex-shrink:0;margin:8px 0;font-size:12px}
#chat-dialog #chat-form{display:flex;flex-shrink:0;gap:8px;margin:6px 0 0}
#chat-dialog #chat-input{min-width:0;flex:1}
#chat-dialog #chat-count,#chat-dialog #chat-rate-hint,#chat-dialog #chat-feedback{flex-shrink:0;margin:4px 0 0;font-size:11px;line-height:1.3}
#chat-dialog .visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

@media(max-width:520px){
  #chat-dialog{top:92px;left:8px;width:calc(100vw - 16px);max-height:calc(100dvh - 110px)}
  #chat-dialog[data-size="1"]{height:280px}
  #chat-dialog[data-size="2"]{height:360px}
  #chat-dialog[data-size="3"]{height:440px}
  #chat-dialog[data-size="4"]{height:520px}
  #chat-dialog[data-size="5"]{height:600px}
  #chat-dialog #chat-panel{padding:12px}
  #chat-dialog #chat-context,#chat-dialog #chat-rate-hint{font-size:10px}
}

@media(max-height:620px){
  #chat-dialog{top:92px;max-height:calc(100dvh - 110px)}
  #chat-dialog #chat-context,#chat-dialog #chat-rate-hint{display:none}
}

#chat-dialog[data-size="1"] #chat-context,#chat-dialog[data-size="1"] #chat-rate-hint{display:none}