/* App shell: presentation only. Existing message, media and form nodes are retained. */
.mobile-app-nav,.app-message-options{display:none}
.chat{background:radial-gradient(ellipse at 10% 0,#9a83f008,transparent 52%),var(--bg)}
.message-content{box-shadow:0 3px 14px #00000009}.message-body{line-height:1.75}.chat-header h1{letter-spacing:-.6px}
@media(max-width:700px){
 :root{--app-dock-height:calc(64px + env(safe-area-inset-bottom));--app-dock-space:var(--app-dock-height)}
 body.mobile-app-active{height:var(--mobile-app-height,100dvh);overflow:hidden;background:var(--bg)}
 body.mobile-app-active #app{position:fixed;inset:0;height:var(--mobile-app-height,100dvh);min-height:0;padding:0;width:100%;max-width:none;overflow:hidden}
 body.mobile-app-active .chat{height:100%;min-height:0;padding-bottom:var(--app-dock-space);background:var(--bg)}
 .mobile-app-nav{position:fixed;z-index:52;inset:auto 0 0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:2px;align-items:start;height:var(--app-dock-height);padding:6px max(7px,env(safe-area-inset-left)) calc(5px + env(safe-area-inset-bottom));background:var(--panel);border-top:1px solid var(--line);box-shadow:0 -5px 24px #0000000a}
 .mobile-app-tab{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;position:relative;min-width:0;min-height:49px;padding:6px 2px;border-radius:14px;background:transparent;color:var(--muted);filter:none}
 .mobile-app-tab>.chat-ui-icon{width:21px;height:21px;flex:0 0 21px;stroke-width:1.7}.mobile-app-tab>span{font-size:9px;font-weight:650;letter-spacing:.1px}.mobile-app-tab[aria-current=page]{color:var(--accent);background:#a69afa12}.mobile-app-tab[aria-current=page]::before{content:"";position:absolute;top:2px;width:15px;height:2px;border-radius:4px;background:var(--accent)}
 .app-tab-badge{position:absolute;top:2px;right:calc(50% - 23px);display:grid;place-items:center;min-width:17px;height:17px;padding:0 4px;border:2px solid var(--panel);border-radius:20px;background:#d75c78;color:white;font-size:8px;font-weight:750}
 .chat .chat-header{min-height:calc(67px + env(safe-area-inset-top));padding:calc(10px + env(safe-area-inset-top)) 14px 10px;gap:10px;background:var(--panel);border:0;box-shadow:0 1px 0 var(--line);z-index:3}
 .chat-room-emblem{display:none}.chat-header #menuButton{display:grid;place-items:center;flex:0 0 38px;width:38px;height:38px;padding:9px;background:var(--input);border:1px solid var(--line);border-radius:13px;color:var(--accent)}
 .chat-header h1{font-size:17px;line-height:1.3;margin:0 0 3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-header p{font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.chat-room-copy{min-width:0}
 .chat-header .header-community-tools{gap:6px}.header-community-tools #communityMenuButton,.header-community-tools #adminMenuButton{width:34px;height:36px;flex-basis:34px;padding:8px;border-radius:12px}
 .chat-header .header-community-tools #connection{position:relative;width:13px;height:28px;min-width:13px;flex:0 0 13px;margin:0;padding:0;border:0;background:transparent;font-size:0;overflow:visible}
 #connection::before{content:"";position:absolute;inset:10px 2px;width:7px;height:7px;border-radius:50%;background:#e7b76c;box-shadow:0 0 0 3px #e7b76c10}#connection[data-app-connected=true]::before{background:#6ec9a6;box-shadow:0 0 0 3px #6ec9a610}
 .chat .chat-typing-band{height:34px;min-height:34px;padding:6px 17px;border:0;background:var(--panel);color:var(--muted)}.chat-typing-content{max-width:100%;font-size:10px;line-height:13px}.chat-typing-band #typingText{max-height:26px}.chat>.intro{display:none}
 .chat>.history{padding:6px 12px;margin:8px 0 3px;border:0;background:var(--panel);font-size:9px;color:var(--muted);box-shadow:none}
 .chat .messages{padding:9px 13px 16px;scroll-padding-bottom:16px;scrollbar-width:none;background-image:radial-gradient(ellipse at 100% 60%,#9c88ed05,transparent 65%)}.messages::-webkit-scrollbar{display:none}
 .messages .message{gap:8px;padding:7px 0 9px;align-items:flex-start}.messages .message>.avatar{width:29px;height:29px;flex:0 0 29px;margin-top:3px;border-radius:10px;box-shadow:none}
 .messages .message-content,.messages .message.own .message-content{position:relative;flex:0 1 auto;min-width:min(200px,calc(100% - 37px));max-width:calc(100% - 37px);padding:11px 12px 10px;border:1px solid var(--line);border-radius:5px 18px 18px;background:var(--panel);box-shadow:0 2px 7px #00000006}
 .messages .message.own .message-content{border-radius:18px 5px 18px 18px;background:linear-gradient(125deg,#9782f020,#9782f00d),var(--panel);border-color:#9782f02c}
 .message .message-meta{min-height:20px;margin:0 0 6px;padding-right:20px;gap:4px 6px;line-height:1.5}.message-meta>strong{font-size:11px}.message-meta>time{font-size:8px}.message-meta>.role-tag{font-size:6px;padding:2px 4px}.message-meta .chat-level-summary{gap:3px}.message-meta .chat-user-level{font-size:8px;padding:2px 5px}.message-meta .chat-user-insignia{width:18px;height:18px;font-size:11px;border-radius:6px}
 .message .app-message-options{position:absolute;top:4px;right:3px;display:grid;place-items:center;width:30px;height:30px;padding:0;border-radius:9px;background:transparent;color:var(--muted);font-size:24px;line-height:1;font-weight:650}.app-message-options[aria-expanded=true]{color:var(--accent);background:#a69afa12}
 .message .message-body{font-size:14px;line-height:1.7}.message-body a{word-break:break-word}.message .message-content blockquote{font-size:10px;padding:8px 9px;margin-bottom:9px;border-radius:0 9px 9px 0}
 .messages .message-actions{display:none;gap:4px;margin-top:9px;padding-top:8px;border-color:var(--line);opacity:1}.messages .message.app-actions-open .message-actions{display:flex}.message-actions button{min-height:30px;padding:6px;font-size:9px;background:var(--input);border-radius:8px}.message .reactions{gap:4px;margin-top:7px}.reactions button{min-height:27px;font-size:10px;padding:4px 8px}
 .message .video-card{margin:9px 0 3px;border-radius:12px;max-width:100%}.message .video-play{padding:20px 14px}.message-body .chat-sticker-image{max-width:min(160px,100%)}
 .chat .compose{padding:10px 12px 5px;background:var(--panel);border-top:1px solid var(--line);z-index:4}
 .compose #messageForm{gap:2px;padding:5px 6px;border:1px solid var(--line);border-radius:19px;background:var(--input);box-shadow:none}
 .compose #messageInput{height:42px;min-height:42px;max-height:112px;padding:9px 5px;border:0;font-size:16px!important;line-height:1.5;resize:none;box-shadow:none;outline:none}
 .compose #emojiButton,.compose #photoButton,.compose #stickerButton{width:31px;height:40px;min-width:31px;min-height:40px;flex:0 0 31px;padding:7px;background:transparent;border-radius:12px}.compose form>button[type=button]>.chat-ui-icon{width:19px;height:19px;flex-basis:19px}
 .compose #sendButton{display:grid;place-items:center;width:39px;height:40px;min-height:40px;flex:0 0 39px;padding:10px;border-radius:14px;font-size:0;background:linear-gradient(140deg,#a08bf4,#7964d3);box-shadow:0 4px 10px #7964d324}.compose #sendButton>.control-label{display:none}.compose #sendButton>.chat-ui-icon{width:18px;height:18px;flex-basis:18px}
 .compose .compose-note{display:flex;justify-content:flex-end;height:14px;min-height:14px;padding:3px 4px 0;font-size:8px;opacity:0}.compose.app-has-draft .compose-note{opacity:1}.compose-note>span:first-child{display:none}.compose-note #counter{font-size:8px}
 .compose #replyBar{padding:8px 10px;font-size:10px;margin-bottom:8px;background:var(--input);border-radius:12px}.compose .emoji-panel{bottom:100%;left:12px;max-width:calc(100vw - 24px);grid-template-columns:repeat(6,1fr);padding:8px;margin-bottom:8px;border-radius:18px}
 #newMessages{bottom:calc(var(--app-dock-space) + 100px);padding:9px 14px;font-size:10px;border-radius:20px}body.mobile-app-active>#toast{bottom:calc(var(--app-dock-space) + 90px);font-size:11px;padding:11px 15px;pointer-events:none}
 .sidebar-backdrop{bottom:var(--app-dock-space);height:auto}.sidebar,.menu-open .sidebar{bottom:var(--app-dock-space);height:calc(var(--mobile-app-height,100dvh) - var(--app-dock-space));border-radius:0 22px 0 0;box-shadow:16px 0 50px #0004;z-index:51}.sidebar .logo strong{font-size:15px}.sidebar-community{border-radius:16px}
 #modal{max-height:calc(var(--mobile-app-height,100dvh) - 20px);width:calc(100vw - 20px);border-radius:23px;padding:19px;border-color:var(--line)}#modal>header{padding-bottom:14px;margin-bottom:17px}#modalTitle{font-size:18px}#closeModal{width:34px;height:34px;padding:7px;border-radius:11px}
 #modal.modern-pm[open]{inset:0;margin:0;width:100vw;max-width:100vw;height:var(--mobile-app-height,100dvh);max-height:var(--mobile-app-height,100dvh);padding:calc(12px + env(safe-area-inset-top)) 12px max(10px,env(safe-area-inset-bottom));border:0;border-radius:0;display:flex;flex-direction:column}
 #modal.modern-pm>header{flex-shrink:0;padding:2px 4px 13px!important;margin-bottom:0!important;border-bottom:1px solid var(--line)}#modal.modern-pm #modalBody{flex:1;min-height:0;display:flex;flex-direction:column}
 #modal.modern-pm .pm-layout{flex:1;height:100%;min-height:0;margin-top:10px;border:0;border-radius:18px}#modal.modern-pm .pm-thread{padding:13px 8px 5px}#modal.modern-pm .pm-messages{scrollbar-width:none}#modal.modern-pm .pm-compose{border-radius:18px;background:var(--input);padding:5px}#modal.modern-pm .pm-compose textarea{font-size:16px!important}#modal.modern-pm .pm-message{border-radius:6px 17px 17px}#modal.modern-pm .pm-message.own{border-radius:17px 6px 17px 17px}
 #adminDrawer,#communityDrawer{height:var(--mobile-app-height,100dvh);max-height:var(--mobile-app-height,100dvh)}
 .auth-page{padding:24px 22px;background:radial-gradient(ellipse at 50% 0,#9c86f419,transparent 65%),var(--bg)}.auth-card{width:100%;max-width:440px;padding:24px 5px;background:transparent;border:0;box-shadow:none}.auth-card .brand-mark{margin:20px auto 26px;width:64px;height:64px;border-radius:23px;box-shadow:0 12px 32px #8170e71f}.auth-card h1{text-align:center;font-size:29px}.auth-card>.eyebrow,.auth-card>p{text-align:center}.auth-card .tabs{border:1px solid var(--line);border-radius:16px;padding:5px}.auth-card .tabs button{padding:12px 8px;border-radius:11px;font-size:12px}.auth-card input{font-size:16px;min-height:50px;border-radius:14px}.auth-card #authSubmit{min-height:50px;border-radius:15px}
 body.app-keyboard-open{--app-dock-space:0px}body.app-keyboard-open .mobile-app-nav{display:none}body.app-keyboard-open .chat .compose{padding-bottom:max(5px,env(safe-area-inset-bottom))}
 body.chat-maintenance-blocked .mobile-app-nav{display:none}
 body.light .message.own .message-content{background:linear-gradient(135deg,#e9e2fd,#f1edff);border-color:#dbd1f1}body.light .message-content{box-shadow:0 2px 9px #30294d04}body.light .mobile-app-nav{box-shadow:0 -4px 22px #31294d06}
 .mobile-app-tab:focus-visible,.app-message-options:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
}
@media(prefers-reduced-motion:reduce){.mobile-app-nav *,.app-message-options{transition:none;animation:none}}

/* Navigation workspace: the existing buttons and room state remain intact. */
.sidebar{padding:18px 15px;background:linear-gradient(165deg,#9280ef0b,transparent 45%),var(--panel);border-right:1px solid var(--line)}
.sidebar .sidebar-modern-header{margin-bottom:18px;padding:4px 5px 16px;border-bottom:1px solid var(--line)}
.sidebar .logo>span{width:46px;height:46px;flex-basis:46px;border-radius:17px;background:linear-gradient(145deg,#ad99ff,#715acb);box-shadow:0 7px 18px #7963d72b}
.sidebar .sidebar-community{position:relative;overflow:hidden;align-items:flex-start;flex-direction:column;gap:12px;border:1px solid #a18cf52a;background:linear-gradient(125deg,#a18cf51a,#a18cf506);padding:16px;border-radius:19px;margin-bottom:12px}
.sidebar-community:after{content:"✧";position:absolute;right:13px;top:7px;font-size:54px;color:#a18cf51c;pointer-events:none}.sidebar-community strong{font-size:14px}.sidebar-community small{font-size:10px}.sidebar-presence{font-size:10px;padding:5px 9px;background:#6cc7a210;border:1px solid #6cc7a224;border-radius:20px}
.sidebar .sidebar-search{margin-bottom:10px;border-radius:14px;padding:0 13px;min-height:46px}.sidebar .sidebar-search input{font-size:16px;padding:11px 0}
.sidebar .members-menu-entry{border-radius:15px;margin:0 0 22px;padding:12px;background:var(--input);border:1px solid var(--line)}
.sidebar .sidebar-label{font-size:9px;letter-spacing:1.4px;margin:0 5px 11px}.sidebar .sidebar-room-count{background:#a18cf518;color:var(--accent);border-radius:7px;padding:3px 8px}
.sidebar #rooms{gap:8px;padding-bottom:22px}.sidebar .room{position:relative;min-height:70px;padding:12px 11px;border:1px solid var(--line);border-radius:17px;background:var(--input);gap:10px}.sidebar .room.active{background:linear-gradient(120deg,#9b86ee25,#9b86ee0b);border-color:#a18cf554;box-shadow:0 5px 16px #7f69ce09}.sidebar .room.active:before{content:"";position:absolute;left:-1px;top:22px;bottom:22px;width:3px;border-radius:5px;background:var(--accent)}
.sidebar .room>.room-type-icon{box-sizing:content-box;width:20px;height:20px;flex-basis:20px;padding:10px;border-radius:13px;background:#a18cf516;color:var(--accent)}.sidebar-room-name{font-size:12px}.sidebar-room-type{font-size:9px}.sidebar .room-occupancy{padding:5px;border-radius:9px;font-size:10px;gap:3px}.sidebar .room-occupancy .chat-ui-icon{width:11px;height:11px;flex-basis:11px}
.sidebar .sidebar-bottom{padding-top:0;border-top:0;gap:16px}.sidebar .sidebar-section{padding:13px 10px 9px;border:1px solid var(--line);border-radius:18px;background:var(--bg)}.sidebar .sidebar-section-title{margin:0 3px 11px;font-size:8px;letter-spacing:1.5px}.sidebar .sidebar-section-items{gap:5px}
.sidebar .menu-action{padding:10px 8px;gap:11px;border-radius:13px;min-height:56px}.sidebar .menu-action>.chat-ui-icon{box-sizing:content-box;width:18px;height:18px;flex-basis:18px;padding:9px;border-radius:12px;background:#a18cf512;color:#b5a3f5}.sidebar .menu-action>.menu-chevron{width:12px;height:12px;flex-basis:12px;padding:0;background:transparent}.sidebar .sidebar-action-label{font-size:11px;font-weight:600}.sidebar .menu-item-detail{font-size:9px;line-height:1.5}.sidebar .menu-item-copy{gap:3px}
.sidebar-section-community #pmButton>.chat-ui-icon{background:#849fed18;color:#9eb6fa}.sidebar-section-community #mentionsButton>.chat-ui-icon{background:#ebae6918;color:#dfb27e}.sidebar-section-community #privateRoomsButton>.chat-ui-icon{background:#75c8ad18;color:#7ac5ad}
.sidebar .sidebar-section-discover #blogButton>.chat-ui-icon{background:#78bfb218;color:#85c7ba}.sidebar .sidebar-section-discover #blogNewsButton>.chat-ui-icon{background:#d6a27918;color:#e1b68e}
.sidebar .menu-quiz-card{padding:12px 9px 16px;border-radius:14px;background:linear-gradient(120deg,#9b86ee1e,#9b86ee09)}.sidebar .menu-quiz-card>.chat-ui-icon{width:22px;height:22px;flex-basis:22px;padding:9px}.sidebar .menu-level{font-size:8px;padding:5px}
.sidebar .sidebar-section-account .sidebar-section-items{grid-auto-rows:66px;gap:6px}.sidebar .sidebar-section-account .menu-action{padding:8px 4px;gap:5px;border-radius:12px}.sidebar .sidebar-section-account .menu-action>.chat-ui-icon{width:18px;height:18px;flex-basis:18px;padding:0;background:transparent}.sidebar .sidebar-section-account .sidebar-action-label{font-size:10px}.sidebar .me-badge{padding:13px;border-radius:17px;background:linear-gradient(120deg,#9b86ee16,#9b86ee06);border-color:#a18cf52a}
body.light .sidebar .menu-action>.chat-ui-icon{color:#7256bd}body.light .sidebar #pmButton>.chat-ui-icon{color:#486fb8}body.light .sidebar #mentionsButton>.chat-ui-icon{color:#a66e2e}body.light .sidebar #privateRoomsButton>.chat-ui-icon,body.light .sidebar #blogButton>.chat-ui-icon{color:#317e69}body.light .sidebar #blogNewsButton>.chat-ui-icon{color:#9d663b}
@media(max-width:700px){.sidebar,.menu-open .sidebar{width:min(350px,calc(100vw - 24px));padding:calc(17px + env(safe-area-inset-top)) 14px 20px;border-radius:0 24px 24px 0}.sidebar .sidebar-modern-header{padding-bottom:14px;margin-bottom:15px}.sidebar .sidebar-close{display:grid;place-items:center;width:34px;height:34px;padding:8px;border:1px solid var(--line);border-radius:12px;background:var(--input)}.sidebar .sidebar-close>.chat-ui-icon{width:18px;height:18px}.sidebar .sidebar-community{padding:15px}.sidebar .room{min-height:68px}.sidebar .sidebar-section{border-radius:17px}}

/* The keyboard changes the visible viewport; only message lists should scroll. */
@media(max-width:700px){
 html.chat-app-mobile{height:100%;overflow:hidden;overscroll-behavior:none}
 body.mobile-app-active{position:fixed;inset:0;width:100%;overscroll-behavior:none}
 body.mobile-app-active #app{top:var(--mobile-app-top,0px);bottom:auto}
 .chat>.chat-header,.chat>.chat-typing-band,.chat>.history,.chat>.compose{flex-shrink:0}
 .chat>.messages{overscroll-behavior-y:contain}
 #modal.modern-pm[open],#modal.profile-editor-modal[open]{position:fixed;top:var(--mobile-app-top,0px);bottom:auto}
 #modal.modern-pm .pm-layout,#modal.modern-pm .pm-thread{min-height:0}
 #modal.modern-pm .pm-thread>.pm-thread-header,#modal.modern-pm .pm-thread>.pm-status,#modal.modern-pm .pm-thread>.pm-older,#modal.modern-pm .pm-thread>.pm-compose,#modal.modern-pm .pm-thread>.pm-counter{flex-shrink:0}
 body.app-keyboard-open #modal.modern-pm .pm-older,body.app-keyboard-open #modal.modern-pm .pm-status{display:none}
}