#bolha-public-chat{position:fixed;display:flex;flex-direction:column;box-sizing:border-box;z-index:24;border:1px solid #426485aa;border-radius:12px;background:#091a2cdb;color:#ecf3fc;box-shadow:0 5px 20px #0004;font:12px/1.4 system-ui;overflow:hidden}
#bolha-public-chat[hidden]{display:none}
#bolha-public-chat header{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:38px;padding:0 7px 0 11px;flex:none}
#bolha-public-chat strong{font-size:12px;font-weight:600}
#bolha-public-chat button{display:grid;place-items:center;flex:none;min-width:34px;min-height:32px;padding:3px 8px;border:1px solid #42648588;border-radius:7px;background:#203b56;color:#b8d5ff;font:16px system-ui;cursor:pointer}
#bolha-public-chat .city-chat-messages{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;padding:0 10px;scrollbar-width:thin}
#bolha-public-chat p{margin:0 0 8px;overflow-wrap:anywhere;white-space:pre-wrap;font-weight:400}
#bolha-public-chat b{color:#a9caff;font-weight:600}
#bolha-public-chat time{margin-left:6px;color:#9bb3ce;font-size:10px;white-space:nowrap}
#bolha-public-chat form{display:flex;gap:5px;padding:6px;flex:none;border-top:1px solid #42648555}
#bolha-public-chat input{box-sizing:border-box;width:0;min-width:0;flex:1;min-height:34px;padding:6px 8px;border:1px solid #4d6e8e;border-radius:7px;background:#10253a;color:#ecf3fc;font:16px system-ui}
#bolha-public-chat :is(input,button):focus-visible{outline:2px solid #91baff;outline-offset:-2px}
#bolha-public-chat .city-chat-status{display:block;padding:0 8px 5px;font-size:11px;color:#ffc58a;flex:none}
#bolha-public-chat .city-chat-status:empty{display:none}
#bolha-public-chat.city-chat-folded :is(.city-chat-messages,form,.city-chat-status){display:none}
@media(pointer:coarse){#bolha-public-chat button{min-height:36px;min-width:40px}}

/* Keep the composer available above a phone keyboard; the profile returns on blur. */
body.bolha-chat-typing :is(#bolha-profile,#profile-unfold,#phone-unfold,.bolha-turbo,#drive-pad,#heli-pad,#stick,#action,#help,#turn-help){visibility:hidden}

/* Mobile: leave the character visible; only the surfaces become translucent. */
@media(max-width:700px),(max-height:500px){
 #bolha-public-chat{background:#091a2ca8;border-color:#42648580;border-radius:10px;box-shadow:0 3px 12px #0003}
 #bolha-public-chat header{min-height:32px;padding:0 5px 0 8px;gap:4px}
 #bolha-public-chat .city-chat-brand{display:none}
 #bolha-public-chat .city-chat-messages{padding:0 7px;text-shadow:0 1px 2px #000b}
 #bolha-public-chat .city-chat-messages::-webkit-scrollbar{width:3px}
 #bolha-public-chat .city-chat-messages::-webkit-scrollbar-thumb{background:#9bb3ce88;border-radius:3px}
 #bolha-public-chat p{margin-bottom:4px}
 #bolha-public-chat form{padding:4px;gap:4px}
 #bolha-public-chat input{min-height:32px;padding:4px 6px;background:#10253ab8}
 #bolha-public-chat button{min-width:36px;min-height:36px;padding:2px 6px;background:#203b56b8}
 #bolha-public-chat header button{min-height:36px}
}

/* Replies keep the normal HUD compact; the draft adds room only while replying. */
#bolha-public-chat header strong{flex:1;min-width:0}
#bolha-public-chat header button[hidden],#bolha-public-chat .city-chat-reply-draft[hidden]{display:none}
#bolha-public-chat .city-chat-notices{font-size:12px;color:#ffdf82;padding:2px 4px}
#bolha-public-chat .city-chat-messages>p{touch-action:manipulation;border-radius:4px;cursor:pointer}
#bolha-public-chat .city-chat-messages>p:focus-visible{outline:1px solid #91baff;outline-offset:1px}
#bolha-public-chat .city-chat-selected{background:#476b8e55;box-shadow:inset 2px 0 #ffd25a}
#bolha-public-chat blockquote{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;white-space:normal;margin:3px 0;padding:2px 5px;border-left:2px solid #91baff;background:#10253a88;color:#c6d9ed;font-size:11px}
#bolha-public-chat .city-chat-reply-draft{display:flex;align-items:center;gap:4px;flex:none;min-height:34px;padding:1px 5px 1px 8px;border-top:1px solid #91baff55;background:#1a344b88}
#bolha-public-chat .city-chat-reply-draft>span{display:flex;flex-direction:column;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;color:#c6d9ed}
#bolha-public-chat .city-chat-reply-draft>button{min-width:36px;min-height:36px;padding:0}
#bolha-public-chat.city-chat-folded .city-chat-reply-draft{display:none}

#bolha-public-chat .city-chat-reply-draft>span>*{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Fold to a single HUD icon, keeping reply notifications on the corner. */
#bolha-public-chat .city-chat-toggle .hud-icon{display:none;width:24px;height:24px}
#bolha-public-chat.city-chat-folded{border:2px solid #7191b4;border-radius:14px;background:#0b1b2ce8;box-shadow:0 0 0 2px #09111c,0 6px 16px #0004}
#bolha-public-chat.city-chat-folded header{position:relative;min-height:0;height:100%;padding:0;gap:0}
#bolha-public-chat.city-chat-folded header strong,#bolha-public-chat.city-chat-folded .city-chat-toggle>.city-chat-chevron{display:none}
#bolha-public-chat.city-chat-folded .city-chat-toggle{width:100%;height:100%;min-width:0;min-height:0;padding:0;border:0;border-radius:11px;background:transparent;color:#b8d5ff}
#bolha-public-chat.city-chat-folded .city-chat-toggle .hud-icon{display:block}
#bolha-public-chat.city-chat-folded .city-chat-notices{position:absolute;right:0;bottom:0;z-index:1;min-width:20px;min-height:18px;padding:0 2px;border-radius:6px;font-size:10px;line-height:16px;background:#203b56}

#bolha-public-chat .city-chat-unread{display:none}
#bolha-public-chat.city-chat-folded .city-chat-unread:not([hidden]){display:block;position:absolute;right:0;top:0;min-width:18px;box-sizing:border-box;padding:1px 3px;border-radius:6px;background:#ffd25a;color:#172334;font:700 10px/16px system-ui;box-shadow:0 1px 4px #0006}
