[hidden]{display:none!important}
.profile-button{border:0;background:transparent;color:#ddd;padding:8px;cursor:pointer}
.profile-dialog{background:#181818;color:white;border:1px solid #444;border-radius:14px;width:min(400px,calc(100vw - 24px));max-height:90dvh;overflow:auto;padding:24px}.profile-dialog::backdrop{background:#000b}.profile-dialog h2{margin:0 0 20px}.profile-dialog button{background:#eee;border:0;color:#111;border-radius:8px;padding:10px 16px}.profile-actions{display:flex;justify-content:flex-end;gap:10px}.profile-dialog img{width:80px;height:80px;object-fit:cover;border-radius:14px}.profile-dialog input[type=file]{font-size:13px}.profile-dialog #profileError{color:#ccc;font-size:13px}
.call video:empty{display:block}
.call video[hidden]{display:none!important}
.typing{display:none}
.typing-bubble{display:flex;align-items:center;gap:5px;align-self:flex-start;flex-shrink:0;background:#272727;border-radius:10px;width:58px;height:34px;padding:0 14px}
.typing-bubble span{width:6px;height:6px;background:#aaa;border-radius:50%;animation:typing-hop 1.2s ease-in-out infinite}
.typing-bubble span:nth-child(2){animation-delay:.15s}
.typing-bubble span:nth-child(3){animation-delay:.3s}
@keyframes typing-hop{0%,60%,100%{transform:translateY(0);opacity:.5}30%{transform:translateY(-5px);opacity:1}}
@media(prefers-reduced-motion:reduce){.typing-bubble span{animation:none}}
body{background:#101010;color:#eee;font-family:Arial,Helvetica,sans-serif;height:100dvh}
.stars,.planet{display:none}
.logo,.avatar,.bubble.mine,.primary,.send{background:#eee;color:#141414;box-shadow:none}
.logo{border-radius:10px}.avatar{background:#303030;color:#fff;border-radius:12px}
.brand h1{font-size:30px;letter-spacing:-1px}.brand p,small,.usertext span,label,.empty,.typing{color:#929292}
form#authForm,aside,.chat,.chathead{background:#151515;border-color:#303030;backdrop-filter:none}
form#authForm{border-radius:12px}.tabs,input,textarea{background:#202020;border-color:#363636;color:#eee;border-radius:8px}
.tabs button.active,.user.active,.user:hover{background:#303030}.tabs button{color:#aaa}
input:focus,textarea:focus{border-color:#aaa}.primary,.send{border-radius:8px}.error{color:#eee}
main{min-width:0;overflow:hidden;grid-template-columns:300px minmax(0,1fr)}aside{min-height:0}aside header{border-color:#303030}
.chat{min-width:0;min-height:0}#conversation{min-height:0;grid-template-rows:74px minmax(0,1fr) auto auto}
.messages{min-height:0;overscroll-behavior:contain}.bubble{background:#272727;border-radius:10px;overflow-wrap:anywhere}.bubble.mine time{color:#555}
.actions button,#back{background:transparent;border-color:#383838;color:#eee;border-radius:8px}
.avatar.online:after{background:white;border-color:#151515}.call{background:#101010}.call video{display:block}.callinfo{pointer-events:none}.call.video-active .callinfo{top:24px;left:24px;position:absolute;text-align:left}.call.video-active .callinfo .avatar{display:none}
.callbuttons button{background:#333;color:white;width:auto;min-width:58px;padding:0 18px;font-size:14px;border-radius:10px}.callbuttons .hang{background:#eee;color:#111}.callbuttons .accept{background:white;color:black}
#localVideo{z-index:3}.callbuttons button[aria-pressed=true]{text-decoration:line-through;background:#666}
@media(max-width:700px){main{display:block;width:100%;height:100dvh}aside{position:absolute;inset:0;width:100%}.chat{display:none;transform:none;position:absolute;inset:0;width:100%;height:100%;z-index:3}.chat.open{display:block}main.chat-open aside{display:none}.chathead{padding:10px;gap:8px}.messages{padding:12px}#messageForm{padding:10px 10px max(10px,env(safe-area-inset-bottom))}.callbuttons{bottom:max(24px,env(safe-area-inset-bottom));gap:6px}.callbuttons button{padding:0 10px}#localVideo{width:110px;height:150px;right:10px;top:10px}}
