/* Constrain every grid/flex boundary: a long friend list must scroll, not grow
   the document and push the composer/profile controls below the viewport. */
html,body{height:100%;min-height:0}
.app-shell{height:100dvh;max-height:100dvh;min-height:0;grid-template-rows:minmax(0,1fr);overflow:hidden}
.sidebar,.chat-area,.activity-panel{min-height:0;overflow:hidden}
.sidebar-scroll{flex:1 1 0;min-height:0;overflow-y:auto;overscroll-behavior:contain}
.sidebar>.workspace-title,.sidebar>.profile-bar,.sidebar>.voice-connected,.sidebar>.active-voice-roster{flex-shrink:0}
.chat-area>.messages{min-height:0;overflow-y:auto}
.draft-attachments{display:flex;gap:8px;flex-wrap:wrap;padding:8px 24px;flex-shrink:0;max-height:120px;overflow:auto}
.draft-attachment{display:flex;align-items:center;gap:8px;background:var(--surface);padding:5px 10px;border-radius:9px;max-width:100%;font-size:12px}
.draft-attachment>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.attachment-button{font-size:24px;flex:none}
.message-attachment{display:flex;flex-direction:column;align-items:flex-start;margin-top:10px;gap:8px;max-width:100%}
.attachment-image{max-width:min(420px,100%);max-height:320px;border-radius:10px;object-fit:contain;cursor:zoom-in}
.attachment-download{display:block;max-width:100%;overflow-wrap:anywhere;padding:10px 14px;border:1px solid var(--line);border-radius:8px;background:var(--surface);font-size:12px;color:var(--accent)}
.attachment-viewer{width:min(1100px,94vw)}
.attachment-viewer>img{display:block;max-width:100%;max-height:75dvh;object-fit:contain;margin:15px auto 0}
.crop-viewport{position:relative;overflow:hidden;isolation:isolate;width:fit-content;max-width:100%;margin:18px auto;border-radius:12px;background:#16171e}
.crop-viewport .image-crop-canvas{margin:0;border:0;border-radius:0;max-width:100%;max-height:50dvh;display:block}
.crop-frame{pointer-events:none;position:absolute;inset:10%;border:2px solid #fff;box-shadow:0 0 0 2000px #0009;z-index:1}
.crop-circle{border-radius:50%}.crop-banner{border-radius:5px}
.image-crop-dialog .crop-controls{padding-top:8px}
.dialog-close-form .icon-button{width:36px;height:36px;border-radius:50%;border:1px solid var(--line);background:var(--surface);font-size:24px;line-height:1}
.dialog-close-form .icon-button:hover{background:var(--hover)}
.dialog{overscroll-behavior:contain}