/* Inbox first on phones, with a full-width conversation after selection. */
:root{--bg:#171717;--sidebar:#121212;--bubble:#292929;--surface:#222222;--surface-hover:#2b2b2b;--line:#303030;--line-soft:#242424;--muted:#989898;--faint:#808080;--rail:340px}
[data-theme=light]{--bg:#fafaf8;--sidebar:#f3f3f0;--bubble:#e9e9e4;--surface:#e5e5e0;--surface-hover:#ddddd8;--line:#d6d6d1;--line-soft:#e4e4df;--muted:#676762;--faint:#777772}
.messenger,.messenger.thread-open{grid-template-columns:var(--rail) minmax(0,1fr)}
.messenger .sidebar,.messenger.thread-open .sidebar{padding:0 14px}
.sidebar-header{height:88px;min-height:88px;justify-content:flex-start;gap:12px;padding:12px 6px}
.toolbar-spacer{flex:1}.sidebar-header>.icon-button{width:42px;height:42px;border-radius:50%}.sidebar-header svg{width:23px;height:23px}
.sidebar-header .profile-button{width:42px;height:42px}.profile-avatar{width:42px;height:42px;font-size:15px;border:1px solid var(--line);box-shadow:0 0 0 3px var(--sidebar),0 0 0 4px var(--line-soft)}
.sidebar-footer{flex-direction:row;justify-content:flex-start;gap:10px;padding:10px 6px 18px;color:var(--faint);font-size:12px}.team-menu-button{width:36px;height:36px}
.inbox-search-panel .search-box{margin:0 4px 12px;height:44px;border-radius:14px}.inbox-search-panel input{font-size:16px}.inbox-search-panel kbd{display:none}
.conversation-list{gap:3px;padding:8px 0 12px}.conversation-row{justify-content:flex-start;min-height:85px;padding:12px 10px;gap:14px;border-radius:16px;text-align:left}.conversation-row .avatar{width:48px;height:48px}
.row-copy{position:static!important;width:auto!important;height:auto!important;padding:0!important;margin:0!important;overflow:hidden!important;clip-path:none!important;white-space:normal!important;flex:1;min-width:0}
.row-top{margin-bottom:6px;gap:8px}.row-name{font-size:16px;font-weight:500;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.row-time{font-size:11px;color:var(--faint)}.row-preview{font-size:14px;line-height:1.45}.rail-status{display:none}
.conversation-header{padding-inline:24px}.conversation-header .avatar{width:36px;height:36px}.header-person h2{font-weight:500;font-size:18px}.header-person>p{position:static!important;clip-path:none!important;width:auto!important;height:auto!important;margin:3px 0 0!important;white-space:nowrap!important;font-size:11px;color:var(--faint)}
.team-menu{top:auto;bottom:75px;left:24px}.empty-list{font-size:14px;padding:28px 16px}.message-feed{padding-top:30px}
.bot-creator{width:min(480px,calc(100vw - 24px));max-height:calc(100dvh - 24px);border:1px solid var(--line-soft);border-radius:32px;background:var(--sidebar);padding:0;overflow:auto;color:var(--text)}
.bot-creator .modal-head{display:flex;flex-direction:row-reverse;justify-content:flex-end;gap:16px;padding:24px 24px 0;border:0}.bot-creator .modal-head h2{font-size:18px;font-weight:500}.bot-creator #close-modal{width:42px;height:42px;border-radius:50%;background:var(--bg);color:var(--text)}
.bot-creator .modal-body{padding:0 28px 28px}.bot-creator form{display:flex;flex-direction:column}.bot-preview{display:grid;place-items:center;height:230px;flex-shrink:0}.bot-preview .avatar.big{width:172px;height:172px}
.bot-creator .bot-name{height:58px;border:0;border-radius:18px;background:var(--surface);text-align:center;font-size:21px;font-weight:500;margin:0}.bot-name::placeholder{color:var(--faint)}
.bot-shapes,.bot-colors{padding:0;border:0;display:grid;margin-inline:auto;gap:14px;flex-shrink:0}.bot-shapes{grid-template-columns:repeat(4,46px);margin-block:30px 26px;gap:16px 22px}.shape-choice{width:46px;height:46px;padding:6px;border-radius:50%;display:grid;place-items:center}.shape-choice[aria-pressed=true]{outline:2px solid var(--faint);outline-offset:2px}.shape-choice .bot-eyes{display:none}
.bot-colors{grid-template-columns:repeat(6,36px);gap:12px 14px;margin-block:0 22px;justify-content:center}.color-choice{width:36px;height:36px;padding:5px;border-radius:50%}.color-choice span{display:block;width:100%;height:100%;border-radius:50%;background:var(--swatch)}.color-choice[aria-pressed=true]{outline:2px solid var(--faint);outline-offset:1px}.color-choice:nth-of-type(n+7){transform:translateX(25px)}
.bot-create-note{font-size:11px;color:var(--faint);text-align:center;margin:0 0 18px;line-height:1.5}.create-bot-button{width:100%;height:50px;min-height:50px;border-radius:28px;font-size:17px;background:var(--user-bg);color:var(--user-ink)}.create-bot-button:disabled{opacity:.45}
@media(max-width:1000px) and (min-width:761px){:root{--rail:290px}.conversation-row{gap:10px;padding-inline:7px}.row-time{font-size:10px}.row-name{font-size:15px}}
@media(max-width:760px){
 body{padding:0;background:var(--sidebar)}.messenger,.messenger.thread-open,.messenger.details-open{display:block;position:relative;height:100dvh;border:0;border-radius:0;max-width:none;background:var(--sidebar)}
 .messenger .sidebar,.messenger.thread-open .sidebar{position:absolute;inset:0;display:flex;width:100%;height:100%;padding:env(safe-area-inset-top) 16px 0;border:0;background:var(--sidebar)}
 .messenger:not(.thread-open) .conversation{display:none}.messenger.thread-open .sidebar{display:none}.messenger.thread-open .conversation{display:flex;position:absolute;inset:0;width:100%;height:100%;padding-top:env(safe-area-inset-top);background:var(--sidebar)}
 .sidebar-header{height:94px;min-height:94px;padding:17px 7px;gap:12px}.sidebar-header .profile-button,.sidebar-header>.icon-button{width:44px;height:44px}.sidebar-header .profile-avatar{width:42px;height:42px;font-size:15px}.sidebar-header>.icon-button{border:1px solid var(--line-soft)}
 .conversation-list{gap:8px;padding:4px 0 16px}.conversation-row{min-height:80px;padding:13px 6px;gap:15px;border-radius:14px}.conversation-row.active{background:transparent}.conversation-row:active{background:var(--surface)}.conversation-row .avatar{width:46px;height:46px}.row-name{font-size:16px;font-weight:500}.row-top{margin-bottom:6px}.row-time{font-size:12px}.row-preview{font-size:14.5px;line-height:1.45}.sidebar-footer{padding-bottom:max(16px,env(safe-area-inset-bottom));font-size:11px;opacity:.8}
 .mobile-back{display:grid!important;width:36px;height:44px;color:var(--text)}.mobile-back svg{width:23px;height:23px}.conversation-header{height:72px;min-height:72px;padding:0 15px 0 6px;gap:9px;background:var(--sidebar)}.conversation-header .avatar{width:34px;height:34px}.header-person h2{font-size:17px}.header-actions>.icon-button{width:40px;height:40px}.header-person>p{font-size:10px}
 .message-feed{padding:23px 18px 20px}.bubble{font-size:16px;line-height:1.5;padding:13px 16px;max-width:92%;border-radius:21px}.user .bubble{max-width:88%;border-radius:21px}.compose-area{background:var(--sidebar);padding:10px 14px max(14px,env(safe-area-inset-bottom))}.composer{min-height:54px}.composer textarea{font-size:16px}.team-menu{top:auto;bottom:max(70px,calc(60px + env(safe-area-inset-bottom)));left:16px}.conversation-menu{top:calc(68px + env(safe-area-inset-top));right:12px}.pending-request{font-size:11px}
 .bot-creator{width:calc(100vw - 16px);max-height:calc(100dvh - 16px - env(safe-area-inset-top));border-radius:32px;margin:auto auto max(8px,env(safe-area-inset-bottom));}.bot-creator .modal-head{padding:16px 16px 0;gap:14px}.bot-creator .modal-body{padding:0 20px 24px}.bot-preview{height:218px}.bot-preview .avatar.big{width:166px;height:166px}.bot-creator .bot-name{height:54px;font-size:20px}.bot-shapes{margin-block:27px 23px}.bot-colors{margin-bottom:24px}.bot-create-note{margin-bottom:18px}
}
@media(max-width:360px){.messenger .sidebar{padding-inline:12px}.conversation-row{gap:12px}.row-time{font-size:10px}.row-name{font-size:15px}.row-preview{font-size:13px}.bot-creator .modal-body{padding-inline:16px}.bot-preview{height:158px}.bot-preview .avatar.big{width:130px;height:130px}.bot-shapes{margin-block:22px;gap:10px 19px}.bot-colors{gap:10px 8px;grid-template-columns:repeat(6,34px)}.color-choice:nth-of-type(n+7){transform:translateX(21px)}.bot-create-note{font-size:10px}}
@media(max-height:690px){.bot-preview{height:150px}.bot-preview .avatar.big{width:122px;height:122px}.bot-shapes{margin-block:20px;gap:12px 18px}.bot-colors{margin-bottom:16px}.bot-create-note{margin-bottom:12px}}
