/* One shared gutter: the icon's outer margin equals both content edge gaps. */
:root{--edge-space:8px;--upper-open:0px;--lower-open:0px;--scroll-width:16px;--scroll-track:#e4e6e9;--scroll-edge:#c2c6cb;--scroll-thumb-top:#fff;--scroll-thumb-bottom:#d9dde2}
:root[data-theme=dark]{--scroll-track:#222426;--scroll-edge:#151719;--scroll-thumb-top:#5c6065;--scroll-thumb-bottom:#35383c}
#community-icons{padding:12px var(--edge-space) 0;gap:12px}
.community-icon{width:56px;height:56px;padding:0;border-radius:11px;display:block;overflow:hidden}
.community-icon img{width:100%;height:100%;object-fit:cover;display:block;border-radius:inherit}
.community-icon.active{outline-offset:2px}
#add-community{width:56px;height:56px}
#rail>.globe svg{width:28px;height:28px}
.rail-bottom .rail-button>svg{width:26px;height:26px}
#discover-view{padding-left:0;padding-right:calc(var(--edge-space) + var(--scroll-width));scrollbar-gutter:auto}
.chat-host{position:relative}
.chat-history{display:flex;flex-direction:column;padding:var(--edge-space) calc(var(--edge-space) + var(--scroll-width)) var(--edge-space) var(--edge-space);scrollbar-gutter:auto;overflow-anchor:none}
.message-list{margin-top:auto;flex:0 0 auto;min-width:0}
.message:last-child{margin-bottom:0}
.message{margin-bottom:18px}
.message-body{max-width:none}
.message-head{max-width:288px}
[data-custom-scroll]{scrollbar-width:none!important}
[data-custom-scroll]::-webkit-scrollbar{display:none!important}
#main,#nav-scroll,.chat-host{position:relative}
#nav-scroll{padding-right:0;scrollbar-width:none}
#nav-scroll::-webkit-scrollbar{display:none}
.scroll-track{position:absolute;width:16px;z-index:9;display:flex;flex-direction:column;background:linear-gradient(90deg,var(--scroll-edge),var(--scroll-track) 28%,var(--scroll-track) 80%,var(--scroll-edge));border-left:1px solid var(--scroll-edge);border-right:1px solid var(--scroll-edge);box-shadow:inset 1px 0 2px #00000017;user-select:none}
.scroll-arrow{height:16px;min-height:16px;width:14px;padding:0;font:11px/14px system-ui;background:var(--raised);border-top:1px solid #ffffff55;border-bottom:1px solid var(--scroll-edge);color:var(--muted);box-shadow:0 1px 2px #0002;border-radius:2px}
.scroll-arrow:active{background:var(--inset);box-shadow:inset 0 1px 2px #0003}
.scroll-well{position:relative;flex:1;min-height:0}
.scroll-thumb{position:absolute;top:0;left:1px;width:12px;min-height:14px;border:1px solid var(--scroll-edge);border-radius:5px;background:linear-gradient(90deg,var(--scroll-thumb-bottom),var(--scroll-thumb-top) 35%,var(--scroll-thumb-bottom));box-shadow:inset 1px 0 #ffffff60,1px 1px 2px #0003;cursor:grab;touch-action:none;display:flex;align-items:center;justify-content:center}
.scroll-thumb>span{width:6px;height:12px;background:repeating-linear-gradient(0deg,var(--scroll-edge) 0 1px,transparent 1px 4px);pointer-events:none}
.scroll-thumb.dragging{cursor:grabbing;filter:brightness(.94)}
.scroll-track.inactive .scroll-thumb{opacity:.35;cursor:default;box-shadow:none}
.scroll-track.inactive .scroll-thumb>span{display:none}
.scroll-thumb:focus-visible{outline:1px solid var(--accent);outline-offset:-1px}
/* Retained upper/lower workspaces: the toolbar moves with the exposed panel. */
.toolbar-drawer{height:0;min-height:0;flex:0 0 auto;overflow:hidden;background:var(--bg);position:relative;z-index:11}
.chat-pullouts #upper-drawer{height:var(--upper-open)}
.chat-pullouts #lower-drawer{height:var(--lower-open)}





#top-pull,.composer-pull,#bottom-pull{touch-action:none;cursor:ns-resize}
#top-pull:after,.composer-pull:after,#bottom-pull:after{width:14px;height:12px;background:repeating-linear-gradient(0deg,currentColor 0 1px,transparent 1px 5px)}
body.chat-pullouts.upper-extended #topbar{border-radius:0 0 14px 14px;box-shadow:var(--toolbar-shadow-down)}
body.chat-pullouts.lower-extended #bottom-bar{border-radius:14px 14px 0 0;box-shadow:var(--toolbar-shadow-up)}
body.chat-room #community-pages>.community-page:not([hidden])>.chat-host>.chat-composer{bottom:var(--lower-open);padding-left:32px;padding-right:var(--edge-space)}
body.chat-room #community-pages>.community-page:not([hidden])>.chat-host>.chat-composer:before,body.chat-room #community-pages>.community-page:not([hidden])>.chat-host>.chat-composer:after{display:none}
.composer-pull{position:absolute;left:0;top:0;width:32px;height:48px;min-width:32px}
body.chat-room.lower-extended #community-pages>.community-page:not([hidden])>.chat-host>.chat-composer{border-radius:14px 14px 0 0;box-shadow:var(--toolbar-shadow-up)}
body.chat-room #bottom-bar>#bottom-pull{visibility:visible;pointer-events:none}
.chat-room #topbar{flex-shrink:0}
@media(max-width:760px){:root{--edge-space:6px}.community-icon{width:42px;height:42px;border-radius:9px}#community-icons{padding-inline:var(--edge-space)}#add-community{width:42px;height:42px}.chat-history{padding:var(--edge-space) calc(var(--edge-space) + var(--scroll-width)) var(--edge-space) var(--edge-space)}.composer-pull{width:26px;min-width:26px}body.chat-room #community-pages>.community-page:not([hidden])>.chat-host>.chat-composer{padding-left:26px;padding-right:var(--edge-space)}}



/* Continuous chrome casts onto content, in collapsed and pulled-out states. */
:root{--toolbar-shadow-down:0 1px 2px #00000016,0 5px 10px #00000020;--toolbar-shadow-up:0 -1px 2px #00000016,0 -5px 10px #00000020}
:root[data-theme=dark]{--toolbar-shadow-down:0 1px 2px #00000040,0 5px 10px #00000065;--toolbar-shadow-up:0 -1px 2px #00000040,0 -5px 10px #00000065}
#topbar,.nav-title,#rail>.globe{box-shadow:var(--toolbar-shadow-down)}
#topbar{z-index:12}
#bottom-bar,.nav-footer,.rail-bottom>.profile{box-shadow:var(--toolbar-shadow-up)}
body.chat-room #community-pages>.community-page:not([hidden])>.chat-host>.chat-composer{box-shadow:var(--toolbar-shadow-up)}
body.chat-room #bottom-bar,body.chat-room.lower-extended #bottom-bar{box-shadow:none}
