/* Shared page chrome and independently scrolling sidebar sections. */
:root{--app-header-height:60px;--app-tabs-height:48px;--app-logo-size:32px;--app-control-size:36px;--app-chrome-padding:16px;--app-divider:#eedee4;--app-workspace-background:linear-gradient(180deg,#fff9fa 0,#fff 70%)}
.topbar,.works-header,.studio-header{height:var(--app-header-height)!important;min-height:var(--app-header-height)!important;max-height:var(--app-header-height)!important;flex:0 0 var(--app-header-height)!important;box-sizing:border-box!important;padding:10px var(--app-chrome-padding)!important;align-items:center!important;gap:10px!important;border-bottom:1px solid var(--app-divider)!important}
.topbar .brand img,.works-brand img,.studio-brand img{width:var(--app-logo-size)!important;height:var(--app-logo-size)!important;flex:0 0 var(--app-logo-size)!important;object-fit:contain}
.works-brand,.studio-brand{gap:8px!important;min-width:0}
.works-brand strong,.studio-brand strong,.topbar-copy strong{font:650 15px/1.25 system-ui!important;white-space:nowrap!important;max-width:none!important;overflow:hidden;text-overflow:ellipsis}
.works-close,.studio-header>.studio-close{width:var(--app-control-size)!important;height:var(--app-control-size)!important;min-width:var(--app-control-size)!important;min-height:var(--app-control-size)!important;flex:0 0 var(--app-control-size)!important;padding:0!important;border:1px solid var(--app-divider)!important;border-radius:10px!important;background:#fff!important;color:#70424f!important;font:24px/1 system-ui!important;display:inline-flex!important;align-items:center!important;justify-content:center!important}
.topbar-actions{gap:8px!important;flex-shrink:0}
.topbar-actions>button{width:var(--app-control-size)!important;height:var(--app-control-size)!important;min-width:var(--app-control-size)!important;min-height:var(--app-control-size)!important;padding:0!important}
.works-tabs,.studio-tabs{box-sizing:border-box!important;height:var(--app-tabs-height)!important;min-height:var(--app-tabs-height)!important;flex:0 0 var(--app-tabs-height)!important;padding:7px var(--app-chrome-padding)!important;gap:6px!important;align-items:center!important;scrollbar-width:none!important;border-bottom:1px solid var(--app-divider)!important}
.works-tabs::-webkit-scrollbar,.studio-tabs::-webkit-scrollbar{display:none}
/* The library and creation tabs use the same page navigation palette. */
.works-tabs .works-button,.studio-tabs .studio-button{background:transparent;border-color:transparent;color:var(--muted,#72656c)}
.works-tabs .works-button[aria-current=true],.studio-tabs .studio-button[aria-pressed=true]{background:#fff0f1;color:var(--red,#ef4148);border-color:#f8cdd1}
.studio-workspace{background:var(--app-workspace-background)}

.works-tabs button,.studio-tabs button{height:32px!important;min-height:32px!important;padding:6px 10px!important;font:500 12px/1.3 system-ui!important;flex:0 0 auto!important;border-radius:9px!important}
#studioPage .studio-layout{height:calc(100% - var(--app-header-height) - var(--app-tabs-height))!important}
.studio-actions>button,.works-detail-actions>button,.work-actions>button{min-height:36px;font-family:system-ui}
.rooms-drawer[open]{gap:0!important}
.rooms-drawer>.studio-nav{border:0!important;border-bottom:1px solid var(--app-divider)!important;margin:0!important}
.rooms-drawer>.ct-projects-section{border:0!important;border-bottom:1px solid var(--app-divider)!important;margin:0!important;padding:4px 0!important}
.rooms-conversations{flex:1 1 0;min-height:90px;overflow-y:auto;overflow-x:hidden;overscroll-behavior-y:contain;padding:5px 0;box-sizing:border-box;scrollbar-width:thin}
.rooms-conversations>.rooms-section-title{font:650 14px/1.4 system-ui!important;letter-spacing:0!important;text-transform:none!important;color:#68434f!important;margin:4px 0!important;padding:0 10px!important}
.rooms-conversations>.rooms-new,.rooms-conversations>.ct-bulk-tools>.rooms-manage{width:100%!important;height:34px!important;min-height:34px!important;margin:0!important;padding:6px 10px!important;display:flex!important;align-items:center!important;gap:10px!important;box-sizing:border-box!important;font:500 13px/1.3 system-ui!important}
.rooms-conversations>.ct-bulk-tools{border:0!important;margin:0!important;padding:0!important;overflow:visible!important;max-height:none!important}
.rooms-conversations>.rooms-list{display:block!important;overflow:visible!important;min-height:0!important;max-height:none!important;height:auto!important;padding:4px 0 0!important;margin:0!important;border:0!important;flex:none!important}
.rooms-list>.ct-room-group,.rooms-list>.ct-regular-section{border:0!important;margin:0!important;padding:0!important}
.rooms-list>.ct-room-group+.ct-regular-section{border-top:1px solid var(--app-divider)!important;margin-top:4px!important;padding-top:4px!important}
.rooms-drawer .rooms-row{padding-inline:0!important;margin-inline:0!important;gap:0!important;min-height:36px!important;box-sizing:border-box}
.rooms-drawer .rooms-row>.rooms-room{flex:1 1 0!important;min-width:0!important}
.rooms-drawer .rooms-more,.ct-project-group>summary>.ct-button,.ct-projects-section>header>.ct-button{box-sizing:border-box!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;width:32px!important;height:32px!important;min-width:32px!important;min-height:32px!important;max-width:32px!important;flex:0 0 32px!important;padding:0!important;margin:0!important;border:0!important;gap:0!important}
.rooms-drawer .rooms-more svg,.ct-project-group>summary>.ct-button svg,.ct-projects-section>header>.ct-button svg{width:20px!important;height:20px!important;min-width:20px!important;flex:0 0 20px!important}
.ct-project-group>summary,.ct-projects-section>header{padding-inline-end:0!important;margin-inline-end:0!important;gap:0!important}
.ct-project-group>summary>.ct-button>span,.ct-projects-section>header>.ct-button>span{display:none!important}
.rooms-load-more{display:flex!important;justify-content:center!important;width:100%;height:34px;margin:4px 0!important}
.rooms-drawer>.rooms-account{border-top:1px solid var(--app-divider)!important}
.message-quote{margin:4px 0 10px!important;padding:8px 10px!important;border:0!important;border-inline-start:3px solid #eaa4b4!important;border-radius:8px;background:#fceef2;max-width:100%;min-width:0;box-sizing:border-box}
.message-quote-source{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-align:start;white-space:pre-wrap;overflow-wrap:anywhere;width:100%;border:0;padding:0;background:transparent;color:inherit;font:12px/1.5 system-ui;cursor:pointer}
.message-quote-media:empty{display:none}
.message-quote-media .media-grid{display:flex!important;flex-wrap:nowrap!important;gap:6px;overflow-x:auto;margin-top:6px;max-width:100%}
.message-quote-media .media-tile{width:76px!important;min-width:76px!important;height:54px!important;min-height:54px!important;flex:0 0 76px!important;overflow:hidden;border-radius:7px}
.message-quote-media .media-tile img,.message-quote-media .media-tile video{width:100%;height:100%;object-fit:cover}
.message-quote-media .media-download{display:none!important}.message-quote-media .media-file{padding:5px!important;font-size:10px!important;overflow:hidden}.message-quote-media .media-file strong{font-size:10px!important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(max-width:600px){:root{--app-chrome-padding:10px}.topbar-actions{gap:6px!important}.studio-header{position:relative}.studio-view-toggle{position:absolute;right:10px;top:calc(var(--app-header-height) + var(--app-tabs-height) + 8px);z-index:3;padding:3px;border:1px solid var(--app-divider);border-radius:9px;background:#fff;box-shadow:0 2px 6px #7951640c}.studio-workspace,.studio-side{padding-top:48px!important}}
@media(max-height:520px){.rooms-conversations{min-height:70px}.rooms-drawer>.ct-projects-section{padding-block:0!important}}

.rooms-brand img,.rooms-mini-button:first-child img{width:var(--app-logo-size)!important;height:var(--app-logo-size)!important;object-fit:contain}

/* Seven Studio tabs share one persistent dialog, header and navigation strip. */
#studioPage .studio-library-pages{height:calc(100% - var(--app-header-height) - var(--app-tabs-height));min-height:0;overflow:hidden}
#studioPage .studio-library-pages>.works-body{height:100%;box-sizing:border-box}

/* Keep the shared header in place while its editor-only tools are inactive. */
#studioPage .studio-view-toggle[aria-hidden=true]{visibility:hidden;pointer-events:none}
/* The full-screen workspace already occupies its final position on entry. */
#studioPage[open]{animation:none;transform:none}
#studioPage .work-card,#studioPage .studio-preview>*{animation:none}