:root{--primary:#0084ff;--bg:#f0f2f5;--panel:#fff;--panel2:#f7f8fa;--text:#050505;--muted:#65676b;--line:#e4e6eb;--bubble-in:#e4e6eb;--bubble-out:#0084ff;--bubble-out-text:#fff;--hover:#f2f3f5;--selected:#e7f3ff;--danger:#d92d20;--shadow:0 12px 40px rgba(0,0,0,.18);--app-height:100dvh;--app-top:0px;--details-width:340px;font-family:Arial,Helvetica,sans-serif;color-scheme:light}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#0f1113;--panel:#18191a;--panel2:#242526;--text:#e4e6eb;--muted:#b0b3b8;--line:#3a3b3c;--bubble-in:#3a3b3c;--hover:#2d2f31;--selected:#263b55;--shadow:0 12px 40px rgba(0,0,0,.55);color-scheme:dark}}
:root[data-theme="dark"]{--bg:#0f1113;--panel:#18191a;--panel2:#242526;--text:#e4e6eb;--muted:#b0b3b8;--line:#3a3b3c;--bubble-in:#3a3b3c;--hover:#2d2f31;--selected:#263b55;--shadow:0 12px 40px rgba(0,0,0,.55);color-scheme:dark}
:root[data-theme="light"]{color-scheme:light}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--bg);color:var(--text)}button,input,textarea,select{font:inherit;color:inherit}button,select,input,textarea{border:1px solid var(--line);background:var(--panel);border-radius:10px}button{cursor:pointer;min-height:38px;padding:8px 12px}button:hover{background:var(--hover)}button:disabled{opacity:.48;cursor:not-allowed}.hidden{display:none!important}.svg-sprite{position:absolute;width:0;height:0;overflow:hidden}.icon-button,.composer-button,.send-button{display:grid;place-items:center;padding:0;border-radius:50%;flex:none}.icon-button{width:40px;height:40px}.icon-button svg,.composer-button svg,.send-button svg,.search-wrap svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.fill{fill:currentColor;stroke:none}.primary-button,.send-button{background:var(--primary);color:#fff;border-color:var(--primary);font-weight:700}.send-button{width:40px;height:40px}.tap-button.clicked{animation:tapPulse .2s ease}@keyframes tapPulse{50%{transform:scale(.86)}}.spinner{width:18px;height:18px;border:2px solid color-mix(in srgb,var(--primary),transparent 70%);border-top-color:var(--primary);border-radius:50%;animation:spin .75s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
.login-screen{height:100%;display:grid;place-items:center;padding:24px}.login-card{width:min(420px,100%);display:grid;gap:12px;padding:26px;background:var(--panel);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow)}.login-card h1{margin:0 0 8px}.login-card input{padding:13px}.error-text{color:var(--danger);min-height:1.2em;margin:0}
.staff-app{position:fixed;top:var(--app-top);left:0;width:100vw;height:var(--app-height);display:grid;grid-template-columns:300px minmax(0,1fr);grid-template-rows:minmax(0,1fr);background:var(--bg);overflow:hidden}.staff-app.details-open{grid-template-columns:300px minmax(0,1fr) var(--details-width)}
.sidebar,.conversation-pane,.details-panel,.empty-state{min-width:0;min-height:0;background:var(--panel)}.sidebar{display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;border-right:1px solid var(--line);overflow:hidden}.sidebar-header,.conversation-header,.details-panel>header{display:flex;align-items:center;gap:10px;padding:10px 12px;border-bottom:1px solid var(--line);min-height:62px}.sidebar-header>div,.header-copy{display:grid;min-width:0;flex:1}.sidebar-header small,.header-copy span{color:var(--muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.toolbar{display:grid;gap:8px;padding:10px;border-bottom:1px solid var(--line)}.search-wrap{position:relative}.search-wrap svg{position:absolute;left:10px;top:50%;transform:translateY(-50%);color:var(--muted);width:18px}.search-wrap input{width:100%;padding:11px 10px 11px 34px}.filter-row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:5px}.filter-row select,#labelFilter{min-width:0;padding:8px 5px;width:100%}.conversation-list{overflow:auto;overscroll-behavior:contain}.conversation-card{position:relative;display:grid;grid-template-columns:46px minmax(0,1fr) auto;gap:9px;padding:10px 10px;border-bottom:1px solid var(--line);cursor:pointer;min-height:70px;background:var(--panel)}.conversation-card:hover{background:var(--hover)}.conversation-card.active{background:var(--selected);color:var(--text)}.conversation-card.active:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--primary)}.avatar,.header-avatar{position:relative;border-radius:50%;display:grid;place-items:center;background:#dbeafe;color:#0759bd;font-weight:700;overflow:visible}.avatar{width:42px;height:42px}.header-avatar{width:42px;height:42px}.avatar img,.header-avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%}.online-dot{position:absolute;right:-1px;bottom:1px;width:12px;height:12px;border:2px solid var(--panel);border-radius:50%;background:#31a24c}.conversation-copy{display:grid;align-content:center;gap:3px;min-width:0}.conversation-copy strong,.conversation-copy>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.conversation-copy>span{font-size:13px;color:var(--muted)}.typing-preview{color:var(--primary)!important;font-style:italic}.label-mini{display:flex;gap:3px;overflow:hidden}.label-mini i{font-style:normal;font-size:10px;padding:1px 5px;border-radius:999px;color:#fff;white-space:nowrap}.conversation-side{text-align:right;font-size:10px;color:var(--muted);white-space:nowrap}.unread{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 6px;margin-top:6px;border-radius:999px;background:var(--primary);color:#fff;font-size:11px;font-weight:700}.sidebar-footer{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:8px;border-top:1px solid var(--line)}
.empty-state{display:grid;place-items:center;color:var(--muted)}.conversation-pane{display:grid;grid-template-rows:auto auto minmax(0,1fr);overflow:hidden}.conversation-header{padding:8px 12px}.mobile-back{display:none}.header-copy strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.header-actions{display:flex;align-items:center;gap:6px}.header-actions select{padding:8px;min-width:88px}.pane-tabs{display:flex;border-bottom:1px solid var(--line);padding:0 10px}.pane-tabs button{border:0;border-radius:0;background:transparent;padding:12px 18px;color:var(--muted);min-height:42px}.pane-tabs button.active{color:var(--primary);border-bottom:3px solid var(--primary);font-weight:700}.pane{display:none;min-height:0;overflow:hidden}.pane.active{display:flex;flex-direction:column}.message-list{flex:1;min-height:0;overflow:auto;padding:12px 14px 8px;overscroll-behavior:contain;scrollbar-gutter:stable}.message-row{position:relative;display:flex;flex-direction:column;width:100%;padding:3px 0;touch-action:pan-y;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;--swipe-x:0px}.message-row .bubble,.message-row .reply-preview,.message-row .reaction-bar,.message-row .message-meta,.message-row .delivery-status,.message-row .pin-mark{transform:translateX(var(--swipe-x));transition:transform .16s ease}.message-row.swiping .bubble,.message-row.swiping .reply-preview,.message-row.swiping .reaction-bar,.message-row.swiping .message-meta,.message-row.swiping .delivery-status,.message-row.swiping .pin-mark{transition:none}.message-row.employee,.message-row.system{align-items:flex-end}.message-row.customer{align-items:flex-start}.swipe-reply-cue{position:absolute;top:50%;left:8px;transform:translateY(-50%) scale(.5);opacity:0;color:var(--primary);font-size:22px;transition:.15s}.message-row.swiping .swipe-reply-cue{opacity:1;transform:translateY(-50%) scale(1)}.bubble{max-width:min(70%,720px);padding:9px 13px;border-radius:18px;line-height:1.35;overflow-wrap:anywhere;background:var(--bubble-in)}.employee .bubble,.system .bubble{background:var(--bubble-out);color:var(--bubble-out-text)}.message-row.deleted:not(.owner-visible) .bubble{font-style:italic;color:var(--muted)}.deleted-badge{font-size:10px;color:var(--danger);margin:2px 8px}.reply-preview{max-width:min(66%,680px);padding:5px 10px;margin-bottom:2px;border:0;border-left:3px solid var(--primary);background:color-mix(in srgb,var(--bubble-in),transparent 20%);color:var(--muted);font-size:12px;text-align:left}.message-meta{font-size:10px;color:var(--muted);margin:3px 8px}.reaction-bar{display:flex;gap:3px;margin:-5px 8px 0;z-index:1}.reaction-chip{min-height:24px;padding:2px 7px;border-radius:999px;background:var(--panel);box-shadow:0 1px 4px rgba(0,0,0,.18);font-size:13px}.pin-mark{font-size:10px;color:var(--muted);margin:2px 8px}.delivery-status{height:19px;display:flex;align-items:center;justify-content:flex-end;margin:0 7px}.delivery-status svg{width:16px;height:16px;fill:none;stroke:var(--muted);stroke-width:1.7}.delivery-status .delivered-circle .status-fill{fill:var(--muted);stroke:var(--muted)}.receipt-avatar{width:17px;height:17px;border-radius:50%;object-fit:cover;border:1px solid var(--panel)}.receipt-avatar.generic{display:grid;place-items:center;background:#dbeafe;color:#0759bd;font-size:9px;font-weight:bold}.attachment-media{display:block;max-width:min(360px,58vw);max-height:360px;border-radius:13px;object-fit:cover}.attachment-link{border:0;background:transparent;padding:0;min-height:0}.attachments{display:grid;gap:5px}.attachment{color:inherit;display:block;padding:5px 0;max-width:360px;overflow-wrap:anywhere}.highlight{animation:messageFlash 1.8s ease}@keyframes messageFlash{0%,100%{filter:none;transform:scale(1)}35%{filter:brightness(1.35);transform:scale(1.025);box-shadow:0 0 0 8px color-mix(in srgb,var(--primary),transparent 70%)}}
.edge-loader{display:flex;justify-content:center;align-items:center;gap:8px;padding:7px;color:var(--primary);font-size:13px}.edge-loader button{border:0;background:transparent;color:var(--primary);min-height:0;padding:4px}.bottom-refresh{position:absolute;left:50%;bottom:76px;transform:translateX(-50%);background:var(--panel);border:1px solid var(--line);border-radius:999px;box-shadow:var(--shadow);z-index:10}.typing-indicator{display:flex;align-items:center;gap:8px;padding:5px 14px 7px;color:var(--muted);font-size:12px}.typing-dots{display:flex;gap:3px;padding:7px 10px;background:var(--bubble-in);border-radius:999px}.typing-dots i{width:6px;height:6px;border-radius:50%;background:var(--muted);animation:typingBounce 1.1s infinite}.typing-dots i:nth-child(2){animation-delay:.16s}.typing-dots i:nth-child(3){animation-delay:.32s}@keyframes typingBounce{0%,60%,100%{transform:translateY(0);opacity:.45}30%{transform:translateY(-4px);opacity:1}}.reply-bar{display:flex;align-items:center;gap:8px;padding:7px 12px;border-top:1px solid var(--line);background:var(--panel2);font-size:12px}.reply-bar span{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.reply-bar button{min-height:28px;padding:2px 8px;border:0;background:transparent}.composer{display:flex;align-items:flex-end;gap:5px;padding:8px 9px max(8px,env(safe-area-inset-bottom));border-top:1px solid var(--line);background:var(--panel);z-index:20}.composer-button{width:38px;height:38px;border:0;color:var(--primary);background:color-mix(in srgb,var(--primary),transparent 91%)}.composer textarea{flex:1;min-width:0;max-height:118px;resize:none;padding:10px 13px;border-radius:22px;background:var(--panel2);line-height:20px}.emoji-picker{position:absolute;right:55px;bottom:62px;z-index:50;width:min(360px,calc(100% - 20px));max-height:270px;overflow:auto;display:grid;grid-template-columns:repeat(8,1fr);gap:2px;padding:8px;background:var(--panel);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow)}.emoji-picker button{font-size:22px;border:0;background:transparent;padding:5px;min-height:36px}.upload-queue{display:grid;gap:5px;padding:6px 10px;border-top:1px solid var(--line);max-height:190px;overflow:auto}.upload-item{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:8px;align-items:center;padding:6px;background:var(--panel2);border-radius:10px}.upload-preview{width:44px;height:44px;object-fit:cover;border-radius:8px;background:var(--line);display:grid;place-items:center}.upload-copy{display:grid;gap:3px}.progress{height:5px;border-radius:999px;background:var(--line);overflow:hidden}.progress i{display:block;height:100%;background:var(--primary);width:0}.recording-panel{display:flex;align-items:center;gap:8px;padding:8px;border-top:1px solid var(--line);background:var(--panel)}.recording-panel canvas{flex:1;min-width:0;height:42px}.record-cancel{color:var(--danger)}.record-send{background:var(--primary);color:#fff}
.details-panel{border-left:1px solid var(--line);overflow:auto;display:block}.details-panel>header{position:sticky;top:0;background:var(--panel);z-index:2}.details-panel section,.details-panel>#detailsBody{padding:12px;border-bottom:1px solid var(--line)}.details-panel h3{margin:0 0 10px;font-size:14px}.details-panel p{margin:6px 0;font-size:13px;overflow-wrap:anywhere}.details-panel section>button,.details-panel section>input{width:100%;margin:4px 0}.assigned-label{display:flex;align-items:center;gap:5px;margin:4px 0;padding:4px 6px;border-radius:8px;background:var(--panel2)}.assigned-label span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}.assigned-label button{width:22px;height:22px;min-height:22px;padding:0;border:0;border-radius:50%;font-size:13px}.label-combobox{position:relative}.label-combobox input{width:100%;padding:10px}.suggestion-list{position:absolute;left:0;right:0;top:calc(100% + 3px);max-height:220px;overflow:auto;background:var(--panel);border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow);z-index:20}.suggestion-list button{width:100%;border:0;border-radius:0;text-align:left}.note-form{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:8px;padding:10px;border-bottom:1px solid var(--line)}.note-form textarea{min-height:68px;padding:10px;resize:vertical}.note-heading{display:flex;align-items:center;justify-content:space-between;padding:8px 12px}.note-list{overflow:auto;padding:0 10px 10px}.note-card{padding:10px;margin:7px 0;border:1px solid var(--line);border-radius:12px;background:var(--panel2)}.note-card header{display:flex;justify-content:space-between;color:var(--muted);font-size:11px}.media-filter{display:flex;gap:5px;padding:8px;border-bottom:1px solid var(--line)}.media-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:8px;padding:10px;overflow:auto}.media-card{min-width:0;border:1px solid var(--line);border-radius:12px;padding:7px;background:var(--panel2)}.media-card img,.media-card video{width:100%;height:130px;object-fit:cover;border-radius:8px}
.sidebar-footer button,.details-panel button,.dialog-actions button{background:var(--panel)}
dialog{color:var(--text);background:var(--panel);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);padding:0;width:min(520px,calc(100vw - 24px));max-height:min(88dvh,840px)}dialog::backdrop{background:rgba(0,0,0,.5)}dialog>header{display:flex;align-items:center;justify-content:space-between;padding:13px 15px;border-bottom:1px solid var(--line)}dialog>header button{border:0;background:transparent;font-size:22px;padding:2px 7px;min-height:30px}dialog form,.dialog-actions{display:grid;gap:10px;padding:14px}dialog input,dialog textarea,dialog select{width:100%;padding:11px}dialog textarea{min-height:110px;resize:vertical}.wide-dialog{width:min(860px,calc(100vw - 24px))}.action-sheet{width:min(460px,calc(100vw - 18px));padding:10px;position:fixed;inset:auto 0 max(8px,env(safe-area-inset-bottom)) 0;margin:auto}.action-sheet>button{display:block;width:100%;border:0;text-align:left;background:transparent}.quick-reactions{display:grid;grid-template-columns:repeat(6,1fr);gap:5px;padding:4px}.quick-reactions button{font-size:24px;border-radius:50%;padding:5px}.selectable-message{padding:16px;white-space:pre-wrap;user-select:text;-webkit-user-select:text}.dialog-wide-button{width:calc(100% - 28px);margin:0 14px 14px}.search-results{padding:10px;overflow:auto;max-height:70dvh}.search-result{display:block;width:100%;text-align:left;padding:10px;margin:5px 0;background:var(--panel2);border:1px solid var(--line);border-radius:10px}.info-list{padding:14px}.info-list p{margin:8px 0}.employee-create-form{grid-template-columns:1fr 1.3fr 1.3fr .8fr auto;align-items:end}.employee-list{padding:10px;overflow:auto}.employee-card{display:grid;grid-template-columns:1fr 1.3fr .7fr 1fr;gap:7px;padding:8px;border-bottom:1px solid var(--line)}.employee-actions{display:flex;gap:4px;grid-column:1/-1}.image-viewer{width:100vw;height:100dvh;max-width:none;max-height:none;border:0;border-radius:0;background:rgba(0,0,0,.96);color:#fff}.viewer-stage{position:absolute;inset:50px 60px 58px;display:grid;place-items:center;overflow:auto}.viewer-stage img{max-width:100%;max-height:100%;object-fit:contain;transform-origin:center}.viewer-close,.viewer-arrow{position:absolute;z-index:2;background:rgba(255,255,255,.15);color:#fff;border:0}.viewer-close{right:14px;top:12px;width:40px;height:40px}.viewer-arrow{top:50%;font-size:38px;width:45px;height:60px}.viewer-prev{left:9px}.viewer-next{right:9px}.viewer-toolbar{position:absolute;bottom:8px;left:0;right:0;display:flex;justify-content:center;align-items:center;gap:12px}.viewer-toolbar a,.viewer-toolbar button{color:#fff;background:rgba(255,255,255,.15);border:0;padding:8px 13px;border-radius:9px}.viewer-copied{position:absolute;top:16px;left:50%;transform:translateX(-50%);background:#fff;color:#111;padding:7px 12px;border-radius:999px}.toast{position:fixed;left:50%;bottom:80px;transform:translateX(-50%);z-index:999;background:#111;color:#fff;padding:9px 14px;border-radius:999px;box-shadow:var(--shadow);max-width:min(90vw,600px);text-align:center}
@media(max-width:1180px){.staff-app.details-open{grid-template-columns:290px minmax(0,1fr)}.details-panel{position:fixed;right:0;top:var(--app-top);height:var(--app-height);width:min(var(--details-width),92vw);z-index:70;box-shadow:var(--shadow)}}
@media(max-width:760px){.staff-app,.staff-app.details-open{grid-template-columns:1fr}.sidebar{grid-column:1}.conversation-pane,.empty-state{grid-column:1;position:absolute;inset:0;z-index:20}.conversation-pane.hidden,.empty-state.hidden{display:none}.mobile-back{display:grid}.header-actions #claimButton,.header-actions select{display:none}.conversation-header{padding:6px}.pane-tabs button{flex:1;padding:10px 4px}.composer{gap:3px}.composer-button{width:34px;height:34px}.send-button{width:36px;height:36px}.bubble{max-width:82%}.employee-create-form,.employee-card{grid-template-columns:1fr}.filter-row{grid-template-columns:1fr 1fr}.filter-row select:last-child{grid-column:1/-1}.note-form{grid-template-columns:1fr}.viewer-stage{inset:50px 8px 58px}.viewer-arrow{display:none}}

.message-row .bubble,.reaction-chip,.quick-reactions{-webkit-user-select:none!important;user-select:none!important;-webkit-touch-callout:none!important}
.selectable-message,.selectable-message *{-webkit-user-select:text!important;user-select:text!important;-webkit-touch-callout:default!important}

/* 20260726c stability and desktop/mobile interaction fixes */
.older-arrows{font-size:23px;line-height:1;color:var(--primary);animation:olderNudge 1.2s ease-in-out infinite}
@keyframes olderNudge{0%,100%{transform:translateY(2px);opacity:.55}50%{transform:translateY(-2px);opacity:1}}
.hover-reply-button{display:none;position:absolute;top:50%;transform:translateY(-50%);z-index:4;width:30px;height:30px;min-height:30px;padding:0;border:0;border-radius:50%;background:var(--panel2);color:var(--primary);box-shadow:0 1px 4px rgba(0,0,0,.16)}
.message-row .bubble{position:relative}
.message-row.employee .hover-reply-button,.message-row.system .hover-reply-button{right:100%;left:auto;margin-right:8px}
.message-row.customer .hover-reply-button{left:100%;right:auto;margin-left:8px}
@media(hover:hover) and (pointer:fine){
  .message-row:hover .hover-reply-button{display:grid;place-items:center}
  .swipe-reply-cue{display:none!important}
  .message-row .bubble,.message-row .reply-preview,.message-row .reaction-bar,.message-row .message-meta,.message-row .delivery-status,.message-row .pin-mark{transform:none!important}
}
.message-list{overflow-x:hidden!important;scrollbar-gutter:auto}
.message-row{overflow:visible;contain:layout style}
.highlight{animation:messageFlash 5.4s ease!important}
.urgent-button{color:#fff!important;background:#d92d20!important;border-color:#d92d20!important;font-weight:700}
.profile-preview{width:76px;height:76px;border-radius:50%;object-fit:cover;border:2px solid var(--line)}
.profile-preview.placeholder{display:grid;place-items:center;background:var(--panel2);color:var(--muted);font-size:12px}
.image-viewer[open]{display:block}.viewer-stage img{will-change:transform;image-rendering:auto}
@media(max-width:760px){
  .staff-app,.staff-app.details-open{display:block;position:fixed;inset:var(--app-top) 0 auto;height:var(--app-height)}
  .sidebar{position:absolute;inset:0;display:grid;z-index:10}
  .conversation-pane{position:absolute;inset:0;z-index:20}
  .details-panel{position:absolute;inset:0;width:100%;height:100%;z-index:40;border:0}
  .empty-state{display:none!important}
  .staff-app:not(.conversation-mobile-open) .conversation-pane{display:none!important}
  .staff-app.conversation-mobile-open .sidebar{display:none!important}
  .details-panel.hidden{display:none!important}
  .mobile-back{display:grid!important}
  .conversation-header{min-height:58px}
  .header-copy span{max-width:48vw}
}

/* 20260726g stability and data-correctness fixes */
.message-row .bubble{user-select:text!important;-webkit-user-select:text!important;-webkit-touch-callout:default!important}
.message-row.deleted-employee .bubble{opacity:.72;border:1px dashed var(--muted)}
.message-row.deleted-employee::after{content:"Deleted";font-size:10px;color:var(--muted);margin:1px 9px}
.conversation-card.unread-card{background:color-mix(in srgb,var(--primary) 13%,var(--panel));border-left:4px solid var(--primary)}
.conversation-card.unread-card.active{background:color-mix(in srgb,var(--primary) 24%,var(--panel))}
.bottom-refresh{min-width:38px;min-height:38px;padding:10px;border-radius:50%}
.viewer-stage{overflow:hidden}.viewer-stage img{width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain;transform:scale(1);transition:transform .12s ease;will-change:auto}
.viewer-toolbar{flex-wrap:wrap}.viewer-toolbar button,.viewer-toolbar a{min-width:38px}
.employee-login-link{width:100%;min-height:70px;resize:vertical}

.clickable-avatar{cursor:zoom-in}

/* 20260726h layout, themes, unread, media fit, and management controls */
:root{--sidebar-width:300px;--details-width:340px;--unread-bg:rgba(220,38,38,.085);--unread-border:#dc2626}
.staff-app{grid-template-columns:var(--sidebar-width) minmax(0,1fr)!important;position:fixed}.staff-app.details-open{grid-template-columns:var(--sidebar-width) minmax(0,1fr) var(--details-width)!important}
.column-resizer{position:fixed;top:var(--app-top);height:var(--app-height);width:8px;z-index:80;cursor:col-resize;background:transparent;touch-action:none}.column-resizer:hover,.column-resizer.dragging{background:color-mix(in srgb,var(--primary) 30%,transparent)}.left-resizer{left:calc(var(--sidebar-width) - 4px)}.right-resizer{right:calc(var(--details-width) - 4px)}.staff-app:not(.details-open) .right-resizer{display:none}
.conversation-card.unread-card{background:var(--unread-bg)!important;border-left:4px solid var(--unread-border)!important}.conversation-card.unread-card.active{background:var(--selected)!important;border-left-color:var(--primary)!important}.conversation-card.active:not(.unread-card){background:var(--selected)!important}
.scroll-latest{position:absolute;right:18px;bottom:72px;z-index:20;width:42px;height:42px;border:0;border-radius:50%;background:var(--primary);color:#fff;font-size:25px;box-shadow:0 6px 18px rgba(0,0,0,.25);display:grid;place-items:center}
.danger-button{background:var(--danger)!important;color:#fff!important;border-color:var(--danger)!important;font-weight:700}.owner-selection-toggle{position:absolute;left:5px;top:5px;z-index:7;width:19px;height:19px;accent-color:var(--danger)}.message-row.selected-for-delete{outline:2px solid var(--danger);outline-offset:2px;border-radius:12px}.deleted-badge{cursor:pointer;text-decoration:underline;text-decoration-style:dotted}
.viewer-stage{overflow:auto!important;display:flex!important;align-items:center!important;justify-content:center!important}.viewer-stage img{display:block!important;width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;object-fit:contain!important;transform-origin:center center!important}.image-viewer[open]{display:block!important}
.media-card{cursor:pointer}.media-card .jump-media{width:100%;margin-top:6px;min-height:30px;padding:4px 7px}
.announcement-card.expired{border-color:#ef4444;background:color-mix(in srgb,#ef4444 8%,var(--panel))}.announcement-card.expired strong::after{content:"Expired";display:inline-block;margin-left:8px;padding:2px 7px;border-radius:999px;background:#dc2626;color:#fff;font-size:10px}.typing-live-draft{display:block;max-width:520px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--primary);font-weight:600}
.referral-summary{padding:8px;border-radius:10px;background:var(--panel2);margin-top:6px}.referral-summary button{width:100%;margin-top:5px}.installed-yes{color:#15803d}.installed-no{color:var(--muted)}

:root[data-style-theme="messenger"]{--primary:#0084ff;--bg:#f0f2f5;--panel:#fff;--panel2:#f7f8fa;--text:#050505;--muted:#65676b;--line:#e4e6eb;--bubble-in:#e4e6eb;--bubble-out:#0084ff;--bubble-out-text:#fff;--hover:#f2f3f5;--selected:#dcecff;color-scheme:light}
:root[data-style-theme="business"]{--primary:#155e75;--bg:#e9f0f2;--panel:#fff;--panel2:#f1f6f7;--text:#102a33;--muted:#60757d;--line:#cbd9dd;--bubble-in:#e3edf0;--bubble-out:#155e75;--bubble-out-text:#fff;--hover:#e7f0f2;--selected:#d6eef3;color-scheme:light}
:root[data-style-theme="midnight"]{--primary:#6ea8ff;--bg:#090d16;--panel:#101827;--panel2:#182236;--text:#eff6ff;--muted:#a6b4c7;--line:#263349;--bubble-in:#243044;--bubble-out:#245fc7;--bubble-out-text:#fff;--hover:#1c2940;--selected:#243e63;color-scheme:dark}
:root[data-style-theme="cute"]{--primary:#e8579a;--bg:#fff1f8;--panel:#fffafd;--panel2:#fff0f7;--text:#51233a;--muted:#91677c;--line:#f3cfe1;--bubble-in:#fde8f2;--bubble-out:#e8579a;--bubble-out-text:#fff;--hover:#fdeaf3;--selected:#ffdced;color-scheme:light}
:root[data-style-theme="warm"]{--primary:#d97706;--bg:#fff5e8;--panel:#fffdf8;--panel2:#fff5e6;--text:#442914;--muted:#8a6a50;--line:#ecd8bf;--bubble-in:#f5e6d2;--bubble-out:#d97706;--bubble-out-text:#fff;--hover:#faecd9;--selected:#ffe3bd;color-scheme:light}
@media(max-width:1180px){.staff-app.details-open{grid-template-columns:var(--sidebar-width) minmax(0,1fr)!important}.column-resizer.right-resizer{display:none}}
@media(max-width:760px){.column-resizer{display:none!important}.staff-app,.staff-app.details-open{display:block!important}.scroll-latest{right:13px;bottom:70px}}

/* 20260726h-final: deterministic image fit and selectable desktop text */
.viewer-stage{position:absolute!important;inset:50px 60px 64px!important;overflow:hidden!important;display:block!important;padding:0!important}
.viewer-stage img{position:absolute!important;inset:0!important;margin:auto!important;display:block!important;width:auto!important;height:auto!important;max-width:calc(100% - 16px)!important;max-height:calc(100% - 16px)!important;object-fit:contain!important;transform-origin:center center!important}
.message-row .bubble{user-select:text!important;-webkit-user-select:text!important;-webkit-touch-callout:default!important}
@media(max-width:760px){.viewer-stage{inset:50px 8px 64px!important}}

/* 20260727b selection, composer attachments, and full theme geometry */
:root{
  --bubble-radius-in:18px 18px 18px 6px;
  --bubble-radius-out:18px 18px 6px 18px;
  --composer-radius:22px;
  --control-radius:10px;
  --message-gap:3px;
  --theme-font:Arial,Helvetica,sans-serif;
}
body{font-family:var(--theme-font)}
.message-row{padding-top:var(--message-gap);padding-bottom:var(--message-gap)}
.message-row.customer .bubble{border-radius:var(--bubble-radius-in)}
.message-row.employee .bubble,.message-row.system .bubble{border-radius:var(--bubble-radius-out)}
.composer textarea{border-radius:var(--composer-radius)}
button,input,textarea,select,dialog{border-radius:var(--control-radius)}
.message-list.selection-mode .message-row{padding-left:34px}
.owner-selection-toggle{position:absolute!important;left:7px!important;top:50%!important;transform:translateY(-50%)!important;width:19px!important;height:19px!important;margin:0!important;z-index:8!important;accent-color:var(--danger)}
.composer.drag-active{outline:2px dashed var(--primary);outline-offset:-4px;background:color-mix(in srgb,var(--primary) 8%,var(--panel))}
.emoji-picker{position:fixed!important;right:10px!important;bottom:auto!important;z-index:300!important}

:root[data-style-theme="messenger"]{--bubble-radius-in:18px 18px 18px 5px;--bubble-radius-out:18px 18px 5px 18px;--composer-radius:22px;--control-radius:10px;--message-gap:3px;--theme-font:Arial,Helvetica,sans-serif}
:root[data-style-theme="business"]{--bubble-radius-in:8px;--bubble-radius-out:8px;--composer-radius:7px;--control-radius:6px;--message-gap:5px;--theme-font:Inter,Arial,Helvetica,sans-serif}
:root[data-style-theme="midnight"]{--bubble-radius-in:14px 14px 14px 3px;--bubble-radius-out:14px 14px 3px 14px;--composer-radius:14px;--control-radius:12px;--message-gap:4px;--theme-font:system-ui,-apple-system,"Segoe UI",sans-serif}
:root[data-style-theme="cute"]{--bubble-radius-in:25px 25px 25px 8px;--bubble-radius-out:25px 25px 8px 25px;--composer-radius:28px;--control-radius:18px;--message-gap:7px;--theme-font:"Trebuchet MS",Arial,sans-serif}
:root[data-style-theme="warm"]{--bubble-radius-in:14px 14px 14px 2px;--bubble-radius-out:14px 14px 2px 14px;--composer-radius:10px;--control-radius:8px;--message-gap:6px;--theme-font:Georgia,"Times New Roman",serif}

:root[data-style-theme="messenger"][data-color-mode="light"]{--bg:#f0f2f5;--panel:#fff;--panel2:#f7f8fa;--text:#050505;--muted:#65676b;--line:#e4e6eb;--bubble-in:#e4e6eb;--hover:#f2f3f5;--selected:#dcecff;color-scheme:light}
:root[data-style-theme="messenger"][data-color-mode="dark"]{--bg:#0f1113;--panel:#18191a;--panel2:#242526;--text:#e4e6eb;--muted:#b0b3b8;--line:#3a3b3c;--bubble-in:#3a3b3c;--hover:#2d2f31;--selected:#263b55;color-scheme:dark}
@media(prefers-color-scheme:dark){:root[data-style-theme="messenger"][data-color-mode="system"]{--bg:#0f1113;--panel:#18191a;--panel2:#242526;--text:#e4e6eb;--muted:#b0b3b8;--line:#3a3b3c;--bubble-in:#3a3b3c;--hover:#2d2f31;--selected:#263b55;color-scheme:dark}}


/* 20260727e pannable image viewer and expanded staff themes */
.viewer-stage{position:absolute!important;inset:50px 60px 64px!important;overflow:hidden!important;display:block!important;touch-action:none!important;cursor:zoom-in;user-select:none;-webkit-user-select:none}
.viewer-stage.zoomed{cursor:grab}.viewer-stage.zoomed:active{cursor:grabbing}
.viewer-stage img{position:absolute!important;inset:0!important;margin:auto!important;display:block!important;width:auto!important;height:auto!important;max-width:calc(100% - 16px)!important;max-height:calc(100% - 16px)!important;object-fit:contain!important;transform-origin:center center!important;will-change:transform;user-select:none;-webkit-user-drag:none}
@media(max-width:760px){.viewer-stage{inset:50px 8px 64px!important}}

:root[data-style-theme="ocean"]{--primary:#087ea4;--bg:#e8f8fc;--panel:#f8fdff;--panel2:#eaf8fb;--text:#073b4c;--muted:#4e7480;--line:#bde8f2;--bubble-in:#d6f2f8;--bubble-out:#087ea4;--bubble-out-text:#fff;--hover:#dff4f8;--selected:#c8edf7;--bubble-radius-in:20px 20px 20px 2px;--bubble-radius-out:20px 20px 2px 20px;--composer-radius:24px;--control-radius:16px;--message-gap:5px;--theme-font:"Segoe UI",Arial,sans-serif;color-scheme:light}
:root[data-style-theme="forest"]{--primary:#2f7d4a;--bg:#edf6ec;--panel:#fbfdf9;--panel2:#eef6ec;--text:#173b25;--muted:#64806c;--line:#cfe1cf;--bubble-in:#e0eee0;--bubble-out:#2f7d4a;--bubble-out-text:#fff;--hover:#e3efe2;--selected:#d3ead4;--bubble-radius-in:5px 18px 18px 18px;--bubble-radius-out:18px 5px 18px 18px;--composer-radius:8px;--control-radius:10px;--message-gap:6px;--theme-font:Verdana,Arial,sans-serif;color-scheme:light}
:root[data-style-theme="royal"]{--primary:#6d28d9;--bg:#f4effd;--panel:#fcfaff;--panel2:#f2eafd;--text:#30145e;--muted:#78649d;--line:#ddd0f5;--bubble-in:#ebe1fb;--bubble-out:#6d28d9;--bubble-out-text:#fff;--hover:#eee5fb;--selected:#e2d3fa;--bubble-radius-in:16px 4px 16px 4px;--bubble-radius-out:4px 16px 4px 16px;--composer-radius:16px;--control-radius:4px;--message-gap:6px;--theme-font:Georgia,"Times New Roman",serif;color-scheme:light}
:root[data-style-theme="neon"]{--primary:#00d084;--bg:#06110d;--panel:#0a1a14;--panel2:#10271e;--text:#e8fff5;--muted:#86bca5;--line:#174f39;--bubble-in:#123426;--bubble-out:#00a86b;--bubble-out-text:#001b10;--hover:#123326;--selected:#164b37;--bubble-radius-in:2px 16px 2px 16px;--bubble-radius-out:16px 2px 16px 2px;--composer-radius:2px;--control-radius:2px;--message-gap:7px;--theme-font:"Trebuchet MS",Arial,sans-serif;color-scheme:dark}
:root[data-style-theme="minimal"]{--primary:#111827;--bg:#f5f5f5;--panel:#fff;--panel2:#fafafa;--text:#111827;--muted:#6b7280;--line:#d1d5db;--bubble-in:#fff;--bubble-out:#111827;--bubble-out-text:#fff;--hover:#f3f4f6;--selected:#e5e7eb;--bubble-radius-in:0;--bubble-radius-out:0;--composer-radius:0;--control-radius:0;--message-gap:9px;--theme-font:Arial,Helvetica,sans-serif;color-scheme:light}
:root[data-style-theme="minimal"] .bubble{border:1px solid var(--line);box-shadow:none}
:root[data-style-theme="neon"] .bubble{box-shadow:0 0 10px color-mix(in srgb,var(--primary) 28%,transparent)}

/* 20260727h saved replies, broadcast messages, and filtered-unread notice */
.remove-filters{width:100%;background:#fff1f2!important;border-color:#fda4af!important;color:#b91c1c!important;font-weight:700}
.filtered-unread-notice{position:sticky;top:0;z-index:15;display:grid;grid-template-columns:46px minmax(0,1fr);gap:9px;align-items:center;min-height:70px;padding:10px;background:rgba(239,68,68,.16);border-bottom:1px solid rgba(220,38,38,.35);color:#991b1b;cursor:pointer;animation:noticePulse .35s ease}
.filtered-unread-notice .notice-icon{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:#dc2626;color:#fff;font-weight:800}
.filtered-unread-notice strong{display:block}.filtered-unread-notice small{display:block;margin-top:3px;color:inherit;opacity:.8}
@keyframes noticePulse{50%{transform:scale(.985);filter:brightness(1.07)}}
.composer-input-wrap{position:relative;flex:1;min-width:0}.composer-input-wrap textarea{width:100%;display:block}
.quick-reply-suggestions{position:absolute;left:0;right:0;bottom:calc(100% + 7px);z-index:180;background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);overflow:hidden}
.quick-reply-option{display:block;width:100%;padding:9px 11px;border:0;border-bottom:1px solid var(--line);border-radius:0;text-align:left;background:var(--panel)}
.quick-reply-option:last-child{border-bottom:0}.quick-reply-option.active{background:var(--selected)}.quick-reply-option strong{display:block}.quick-reply-option span{display:block;margin-top:2px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.saved-reply-form label{display:grid;gap:5px}.saved-reply-list{padding:10px;max-height:52dvh;overflow:auto}.saved-reply-card{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;padding:10px;border-bottom:1px solid var(--line)}.saved-reply-card strong,.saved-reply-card p{grid-column:1}.saved-reply-card p{margin:0;color:var(--muted);white-space:pre-wrap}.saved-reply-card .reply-actions{grid-column:2;grid-row:1/3;display:grid;gap:5px;align-content:start}
.announcement-upload-list{display:grid;gap:6px}.announcement-upload-item{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center;padding:8px;background:var(--panel2);border:1px solid var(--line);border-radius:10px}.announcement-card .attachment-summary{display:block;margin-top:5px;color:var(--muted)}
.announcement-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.announcement-mode{flex:none;padding:3px 8px;border-radius:999px;background:var(--selected);color:var(--primary);font-size:11px;font-weight:700}.announcement-attachment-summary{display:flex;flex-wrap:wrap;gap:6px;margin:7px 0}.announcement-attachment-summary a{max-width:100%;padding:4px 8px;border:1px solid var(--line);border-radius:999px;color:var(--primary);text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.announcement-upload-item.pending{display:block;color:var(--muted);font-style:italic}


/* 20260727j: stable media, rich replies, owner audit details and link previews */
.reaction-arming .quick-reactions button{pointer-events:none!important}
.reply-preview{display:flex;align-items:center;gap:8px;min-height:42px;white-space:normal;border-radius:9px}
.reply-preview-thumb{width:42px;height:42px;flex:0 0 42px;object-fit:cover;border-radius:8px;background:#111}
.reply-preview-copy{display:flex;min-width:0;flex-direction:column;gap:2px;overflow:hidden}
.reply-preview-copy strong,.reply-preview-copy span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.reply-preview-copy strong{color:var(--text);font-size:12px}
.link-preview-host:empty{display:none}
.link-preview-card{display:flex;overflow:hidden;margin-top:8px;max-width:min(420px,58vw);border:1px solid var(--line);border-radius:12px;background:var(--panel2);color:var(--text);text-decoration:none}
.link-preview-card>img{width:108px;min-height:82px;object-fit:cover;background:var(--panel)}
.link-preview-copy{display:flex;min-width:0;flex:1;flex-direction:column;justify-content:center;gap:3px;padding:9px}
.link-preview-copy strong,.link-preview-copy span,.link-preview-copy small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.link-preview-description{color:var(--muted);font-size:12px}
.link-preview-copy small{color:var(--muted);font-size:11px}
.message-audio{display:block;min-width:min(330px,58vw);min-height:40px}
.detail-history-section{margin:12px 0;padding:10px;border:1px solid var(--line);border-radius:12px;background:var(--panel2)}
.detail-history-section h3{margin:0 0 8px;font-size:14px}
.detail-history-section article{display:flex;flex-direction:column;gap:3px;padding:7px 0;border-top:1px solid var(--line)}
.detail-history-section article:first-of-type{border-top:0}
.detail-history-section small{color:var(--muted)}
.detail-link-button{display:block;width:100%;margin:4px 0;padding:7px 9px;text-align:left;border:1px solid var(--line);border-radius:8px;background:var(--panel);color:var(--primary)}
.contacts-empty{margin:0;font-size:13px;color:var(--muted)}
.contact-shared{margin:5px 0 0;font-size:13px}
.may-know-person{display:flex;flex-direction:column;gap:2px}
.may-know-person small{color:var(--muted)}
.may-know-person:disabled{opacity:.55;cursor:default}


/* 20260727k: stable media rows, multiline messages and direct double-tap reaction */
.bottom-refresh{display:none!important}
.message-row .bubble,.message-text{white-space:pre-wrap;overflow-wrap:anywhere;word-break:break-word}
.video-attachment{display:grid;gap:5px;max-width:min(360px,58vw)}
.attachment-video{display:block;width:min(360px,58vw);max-width:100%;height:auto;min-height:190px;aspect-ratio:16/9;object-fit:contain;background:#111;border-radius:13px}
.attachment-video.metadata-ready{min-height:0}
.media-open-link{justify-self:end;color:inherit;font-size:11px;text-decoration:underline;padding:2px 3px}
.message-row.double-tap-reacted .bubble{animation:quickReactionPulse .34s ease}
@keyframes quickReactionPulse{0%,100%{transform:translateX(var(--swipe-x)) scale(1)}45%{transform:translateX(var(--swipe-x)) scale(1.045);filter:brightness(1.12)}}

/* 20260727n: staff realtime notification banner */
.staff-notification-banner{
  position:fixed;z-index:10050;top:max(12px,env(safe-area-inset-top));left:14px;
  width:min(390px,calc(100vw - 28px));display:flex;flex-direction:column;gap:3px;
  padding:12px 14px;border:1px solid var(--border);border-radius:14px;
  background:var(--panel);color:var(--text);box-shadow:0 14px 42px rgba(0,0,0,.26);
  text-align:left;cursor:pointer;animation:staffNoticeIn .22s ease-out;
}
.staff-notification-banner strong{font-size:14px}.staff-notification-banner span{font-size:13px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@keyframes staffNoticeIn{from{opacity:0;transform:translateY(-12px) scale(.97)}to{opacity:1;transform:none}}

.typing-indicator.draft-only .typing-dots{display:none}

.alerts-button{font-size:18px;line-height:1}

.label-chip{display:inline-block;font-size:11px;font-weight:700;padding:3px 10px;border-radius:999px;cursor:pointer;white-space:nowrap;border:1px solid rgba(0,0,0,.08);line-height:1.5}
.assigned-label .label-chip{border-left:none;padding-left:10px}
.label-color-row{display:flex;align-items:center;gap:10px;margin-top:9px;flex-wrap:wrap}
.label-color-row label{display:flex;align-items:center;gap:5px;font-size:12px;color:var(--muted);border:none;background:none;padding:0;min-height:0}
.label-color-row input[type=color]{width:36px;height:30px;padding:2px;border-radius:8px;cursor:pointer}
.color-dialog{border:none;border-radius:16px;padding:0;background:var(--panel);color:var(--text);box-shadow:var(--shadow);width:min(320px,92vw)}
.color-dialog header{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-bottom:1px solid var(--line)}
.color-dialog header button{border:none;background:none;font-size:20px;min-height:0;padding:0 4px}
.color-dialog .color-body{padding:14px;display:grid;gap:12px}
.color-dialog input[type=color]{width:100%;height:46px;padding:3px;border-radius:10px;cursor:pointer}
.color-dialog .swatches{display:flex;flex-wrap:wrap;gap:8px}
.color-dialog .swatches button{width:30px;height:30px;border-radius:50%;padding:0;border:1px solid var(--line)}
.color-dialog .dialog-actions{padding:12px 14px;border-top:1px solid var(--line)}
.color-dialog::backdrop{background:rgba(0,0,0,.45)}

/* 20260729h staff visual refresh: softer depth, focus rings, refined avatars/badges/composer */
.conversation-card{border-bottom:1px solid color-mix(in srgb,var(--line) 55%,transparent);transition:background .12s ease}
.conversation-copy strong{font-size:14.5px;letter-spacing:.1px}
.conversation-copy>span{font-size:12.5px}
.avatar,.header-avatar,.receipt-avatar.generic{background:linear-gradient(135deg,color-mix(in srgb,var(--primary) 24%,var(--panel)),color-mix(in srgb,var(--primary) 9%,var(--panel)));color:color-mix(in srgb,var(--primary) 72%,var(--text))}
.avatar,.header-avatar{box-shadow:0 1px 3px rgba(0,0,0,.14)}
.online-dot{box-shadow:0 0 0 2px var(--panel),0 0 6px color-mix(in srgb,#31a24c 65%,transparent)}
.unread{box-shadow:0 2px 6px color-mix(in srgb,var(--primary) 42%,transparent)}
.label-mini i{box-shadow:0 1px 2px rgba(0,0,0,.14)}
.bubble{box-shadow:0 1px 1.5px rgba(0,0,0,.07)}
:root[data-style-theme="minimal"] .bubble{box-shadow:none}
.reaction-chip{border:1px solid var(--line)}
.pane-tabs button.active{border-bottom-width:3px}
.composer{box-shadow:0 -1px 0 var(--line),0 -7px 18px rgba(0,0,0,.035)}
.composer textarea{border:1px solid var(--line);transition:border-color .12s ease,box-shadow .12s ease}
.composer textarea:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 22%,transparent)}
.search-wrap input:focus,.filter-row select:focus,.toolbar input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 18%,transparent)}
.primary-button,.send-button{box-shadow:0 2px 9px color-mix(in srgb,var(--primary) 38%,transparent)}
.primary-button:hover,.send-button:hover{filter:brightness(1.06);background:var(--primary)}
.composer-button:hover{background:color-mix(in srgb,var(--primary) 16%,var(--panel))}
.staff-notification-banner{box-shadow:0 16px 44px rgba(0,0,0,.30),0 0 0 1px color-mix(in srgb,var(--primary) 30%,transparent)}

/* 20260729h new themes */
:root[data-style-theme="slate"]{--primary:#4f6b8f;--bg:#eef1f5;--panel:#fff;--panel2:#f4f6f9;--text:#1e293b;--muted:#64748b;--line:#d8dee7;--bubble-in:#e7ecf2;--bubble-out:#4f6b8f;--bubble-out-text:#fff;--hover:#eaeef4;--selected:#dbe4ef;--bubble-radius-in:13px 13px 13px 4px;--bubble-radius-out:13px 13px 4px 13px;--composer-radius:14px;--control-radius:9px;--message-gap:4px;--theme-font:"Segoe UI",Inter,Arial,sans-serif;color-scheme:light}
:root[data-style-theme="sunset"]{--primary:#f2542d;--bg:#fff3ee;--panel:#fffaf8;--panel2:#fff1ea;--text:#4a2213;--muted:#9c6650;--line:#f6d5c6;--bubble-in:#ffe1d4;--bubble-out:#f2542d;--bubble-out-text:#fff;--hover:#ffeae1;--selected:#ffd9c9;--bubble-radius-in:20px 20px 20px 5px;--bubble-radius-out:20px 20px 5px 20px;--composer-radius:24px;--control-radius:14px;--message-gap:5px;--theme-font:"Segoe UI",Arial,sans-serif;color-scheme:light}
:root[data-style-theme="graphite"]{--primary:#8ea2c4;--bg:#121417;--panel:#1b1e24;--panel2:#232730;--text:#e8ebf0;--muted:#9aa3b2;--line:#333a46;--bubble-in:#2a2f3a;--bubble-out:#3c4a63;--bubble-out-text:#fff;--hover:#232833;--selected:#2b3648;--bubble-radius-in:13px 13px 13px 4px;--bubble-radius-out:13px 13px 4px 13px;--composer-radius:14px;--control-radius:9px;--message-gap:4px;--theme-font:system-ui,-apple-system,"Segoe UI",sans-serif;color-scheme:dark}
.accent-row{display:flex;align-items:center;justify-content:space-between;gap:10px}
.accent-controls{display:flex;align-items:center;gap:8px}
.accent-controls input[type=color]{width:44px;height:32px;padding:2px;border-radius:8px;cursor:pointer}
.accent-controls button{min-height:32px;padding:5px 12px}

/* 20260729k circular profile-picture avatars. height:100% never resolves against the
   grid/flex parent, so a portrait img kept its aspect (42x84) and border-radius made an
   oval. Absolutely filling the square box + object-fit:cover center-crops into a circle. */
.avatar,.header-avatar,.receipt-avatar,.receipt-avatar.generic,.profile-preview{flex:0 0 auto}
.avatar>img,.header-avatar>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:50%}
.receipt-avatar,.profile-preview{object-fit:cover}

/* 20260729k menu redesign (sections), per-event sound rows, viewer HD button */
.menu-body{gap:0!important;padding:0!important;max-height:min(74dvh,680px);overflow:auto}
.menu-section{padding:13px 16px;border-bottom:1px solid var(--line);display:grid;gap:11px}
.menu-section:last-child{border-bottom:0}
.menu-section>h4{margin:0;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.07em;color:var(--muted)}
.menu-section>label{display:grid;gap:5px;font-size:13px}
.menu-section .toggle-row,.menu-section .sound-row,.menu-section .accent-row{display:flex;align-items:center;justify-content:space-between;gap:10px}
.menu-section .sound-row select{width:auto;min-width:134px;flex:0 0 auto;padding:7px 8px}
.menu-section>button{width:100%}
.menu-hint{color:var(--muted);font-size:12px;line-height:1.4}
.viewer-hd.active{background:var(--primary)!important;color:#fff!important;font-weight:700}

/* 20260729m staged attachments (no auto-send) tray + one-click image copy button */
.pending-tray{display:flex;flex-wrap:wrap;gap:9px;padding:9px 10px;border-top:1px solid var(--line);background:var(--panel2)}
.pending-chip{position:relative;width:60px;height:60px;flex:0 0 auto}
.pending-thumb{width:60px;height:60px;border-radius:10px;object-fit:cover;cursor:pointer;border:1px solid var(--line);display:grid;place-items:center;background:var(--panel);overflow:hidden}
.pending-thumb.pending-icon{font-size:26px}
.pending-remove{position:absolute;top:-6px;right:-6px;width:20px;height:20px;min-height:20px;padding:0;border-radius:50%;border:0;background:var(--danger);color:#fff;font-size:13px;line-height:1;display:grid;place-items:center;box-shadow:0 1px 4px rgba(0,0,0,.3)}
.image-attachment{position:relative;display:inline-block;max-width:100%}
.image-copy-button{position:absolute;top:6px;right:6px;width:30px;height:30px;min-height:30px;padding:0;display:grid;place-items:center;border-radius:8px;border:0;background:rgba(0,0,0,.5);color:#fff;opacity:0;transition:opacity .12s ease}
.image-attachment:hover .image-copy-button,.image-copy-button:focus-visible{opacity:1}
.image-copy-button.copied{background:var(--primary);opacity:1}
@media(hover:none){.image-copy-button{opacity:.82}}


/* 20260729p generated theme library (staff) */
:root[data-style-theme="sky"]{--primary:#0ea5e9;--bg:#ecf8fd;--panel:#ffffff;--panel2:#f4fbfe;--text:#0b273c;--muted:#3484ae;--line:#cfedfb;--bubble-in:#def3fc;--bubble-out:#0ea5e9;--bubble-out-text:#ffffff;--hover:#e7f6fd;--selected:#cfedfb;--bubble-radius-in:20px 20px 20px 4px;--bubble-radius-out:20px 20px 4px 20px;--composer-radius:24px;--control-radius:14px;--message-gap:5px;--theme-font:"Segoe UI",Arial,sans-serif;color-scheme:light}
:root[data-style-theme="teal"]{--primary:#0d9488;--bg:#ecf6f5;--panel:#ffffff;--panel2:#f4fafa;--text:#0b242f;--muted:#347c7d;--line:#cfeae7;--bubble-in:#def1ef;--bubble-out:#0d9488;--bubble-out-text:#ffffff;--hover:#e7f4f3;--selected:#cfeae7;--bubble-radius-in:22px;--bubble-radius-out:22px;--composer-radius:26px;--control-radius:20px;--message-gap:6px;--theme-font:"Segoe UI",Arial,sans-serif;color-scheme:light}
:root[data-style-theme="emerald"]{--primary:#059669;--bg:#ebf7f3;--panel:#ffffff;--panel2:#f4faf8;--text:#0a242a;--muted:#307d6e;--line:#cdeae1;--bubble-in:#ddf1eb;--bubble-out:#059669;--bubble-out-text:#ffffff;--hover:#e6f4f0;--selected:#cdeae1;--bubble-radius-in:14px 14px 14px 3px;--bubble-radius-out:14px 14px 3px 14px;--composer-radius:12px;--control-radius:10px;--message-gap:4px;--theme-font:"Segoe UI",Arial,sans-serif;color-scheme:light}
:root[data-style-theme="lime"]{--primary:#65a30d;--bg:#f3f8ec;--panel:#ffffff;--panel2:#f8fbf4;--text:#18261d;--muted:#608440;--line:#e0edcf;--bubble-in:#eaf3de;--bubble-out:#65a30d;--bubble-out-text:#ffffff;--hover:#f0f6e7;--selected:#e0edcf;--bubble-radius-in:20px 20px 20px 4px;--bubble-radius-out:20px 20px 4px 20px;--composer-radius:24px;--control-radius:14px;--message-gap:5px;--theme-font:"Segoe UI",Arial,sans-serif;color-scheme:light}
:root[data-style-theme="amber"]{--primary:#d97706;--bg:#fcf4eb;--panel:#ffffff;--panel2:#fdf9f4;--text:#28201c;--muted:#9a6e3c;--line:#f7e4cd;--bubble-in:#faeddd;--bubble-out:#d97706;--bubble-out-text:#ffffff;--hover:#fbf1e6;--selected:#f7e4cd;--bubble-radius-in:14px 14px 14px 3px;--bubble-radius-out:14px 14px 3px 14px;--composer-radius:12px;--control-radius:10px;--message-gap:4px;--theme-font:Georgia,"Times New Roman",serif;color-scheme:light}
:root[data-style-theme="coral"]{--primary:#fb6f51;--bg:#fff3f1;--panel:#ffffff;--panel2:#fff9f7;--text:#2d1f27;--muted:#ab6a62;--line:#fee2dc;--bubble-in:#feece8;--bubble-out:#fb6f51;--bubble-out-text:#ffffff;--hover:#fff1ee;--selected:#fee2dc;--bubble-radius-in:22px;--bubble-radius-out:22px;--composer-radius:26px;--control-radius:20px;--message-gap:6px;--theme-font:"Segoe UI",Arial,sans-serif;color-scheme:light}
:root[data-style-theme="rose"]{--primary:#e11d48;--bg:#fdedf0;--panel:#ffffff;--panel2:#fef5f7;--text:#291426;--muted:#9e405d;--line:#f9d2da;--bubble-in:#fbe0e6;--bubble-out:#e11d48;--bubble-out-text:#ffffff;--hover:#fce8ed;--selected:#f9d2da;--bubble-radius-in:20px 20px 20px 4px;--bubble-radius-out:20px 20px 4px 20px;--composer-radius:24px;--control-radius:14px;--message-gap:5px;--theme-font:"Segoe UI",Arial,sans-serif;color-scheme:light}
:root[data-style-theme="bubblegum"]{--primary:#ec4899;--bg:#fdf0f7;--panel:#ffffff;--panel2:#fef7fa;--text:#2a1a31;--muted:#a45686;--line:#fbdaeb;--bubble-in:#fce6f1;--bubble-out:#ec4899;--bubble-out-text:#ffffff;--hover:#fdedf5;--selected:#fbdaeb;--bubble-radius-in:22px;--bubble-radius-out:22px;--composer-radius:26px;--control-radius:20px;--message-gap:6px;--theme-font:"Trebuchet MS",Arial,sans-serif;color-scheme:light}
:root[data-style-theme="lavender"]{--primary:#8b5cf6;--bg:#f6f2fe;--panel:#ffffff;--panel2:#faf8ff;--text:#1d1c3e;--muted:#7360b4;--line:#e8defd;--bubble-in:#efe9fe;--bubble-out:#8b5cf6;--bubble-out-text:#ffffff;--hover:#f3effe;--selected:#e8defd;--bubble-radius-in:20px 20px 20px 4px;--bubble-radius-out:20px 20px 4px 20px;--composer-radius:24px;--control-radius:14px;--message-gap:5px;--theme-font:"Segoe UI",Arial,sans-serif;color-scheme:light}
:root[data-style-theme="indigo"]{--primary:#4f46e5;--bg:#f1f0fd;--panel:#ffffff;--panel2:#f7f7fe;--text:#15193c;--muted:#5555ac;--line:#dcdafa;--bubble-in:#e7e6fb;--bubble-out:#4f46e5;--bubble-out-text:#ffffff;--hover:#edecfc;--selected:#dcdafa;--bubble-radius-in:20px 20px 20px 4px;--bubble-radius-out:20px 20px 4px 20px;--composer-radius:24px;--control-radius:14px;--message-gap:5px;--theme-font:Inter,system-ui,Arial,sans-serif;color-scheme:light}
:root[data-style-theme="sand"]{--primary:#b45309;--bg:#f9f1eb;--panel:#ffffff;--panel2:#fcf7f4;--text:#231b1d;--muted:#885c3e;--line:#f0ddce;--bubble-in:#f5e8de;--bubble-out:#b45309;--bubble-out-text:#ffffff;--hover:#f8eee6;--selected:#f0ddce;--bubble-radius-in:14px 14px 14px 3px;--bubble-radius-out:14px 14px 3px 14px;--composer-radius:12px;--control-radius:10px;--message-gap:4px;--theme-font:Georgia,"Times New Roman",serif;color-scheme:light}
:root[data-style-theme="mint"]{--primary:#10b981;--bg:#ecf9f5;--panel:#ffffff;--panel2:#f4fcf9;--text:#0c292e;--muted:#368e7a;--line:#cff1e6;--bubble-in:#dff6ee;--bubble-out:#10b981;--bubble-out-text:#ffffff;--hover:#e7f8f2;--selected:#cff1e6;--bubble-radius-in:20px 20px 20px 4px;--bubble-radius-out:20px 20px 4px 20px;--composer-radius:24px;--control-radius:14px;--message-gap:5px;--theme-font:"Segoe UI",Arial,sans-serif;color-scheme:light}
:root[data-style-theme="cocoa"]{--primary:#7c5e48;--bg:#f5f2f0;--panel:#ffffff;--panel2:#f9f8f7;--text:#1b1d26;--muted:#6c615d;--line:#e5dfda;--bubble-in:#ede9e6;--bubble-out:#7c5e48;--bubble-out-text:#ffffff;--hover:#f2efed;--selected:#e5dfda;--bubble-radius-in:14px 14px 14px 3px;--bubble-radius-out:14px 14px 3px 14px;--composer-radius:12px;--control-radius:10px;--message-gap:4px;--theme-font:Georgia,"Times New Roman",serif;color-scheme:light}
:root[data-style-theme="cherry"]{--primary:#dc2626;--bg:#fceeee;--panel:#ffffff;--panel2:#fdf5f5;--text:#281521;--muted:#9c454c;--line:#f8d4d4;--bubble-in:#fae2e2;--bubble-out:#dc2626;--bubble-out-text:#ffffff;--hover:#fce9e9;--selected:#f8d4d4;--bubble-radius-in:7px;--bubble-radius-out:7px;--composer-radius:8px;--control-radius:6px;--message-gap:5px;--theme-font:"Segoe UI",Arial,sans-serif;color-scheme:light}
:root[data-style-theme="grape"]{--primary:#9333ea;--bg:#f6effd;--panel:#ffffff;--panel2:#faf6fe;--text:#1e173c;--muted:#774cae;--line:#e9d6fb;--bubble-in:#f0e3fc;--bubble-out:#9333ea;--bubble-out-text:#ffffff;--hover:#f4ebfd;--selected:#e9d6fb;--bubble-radius-in:22px;--bubble-radius-out:22px;--composer-radius:26px;--control-radius:20px;--message-gap:6px;--theme-font:"Segoe UI",Arial,sans-serif;color-scheme:light}
:root[data-style-theme="aqua"]{--primary:#06b6d4;--bg:#ebf9fc;--panel:#ffffff;--panel2:#f4fcfd;--text:#0a2939;--muted:#308da3;--line:#cdf0f6;--bubble-in:#ddf5f9;--bubble-out:#06b6d4;--bubble-out-text:#ffffff;--hover:#e6f8fb;--selected:#cdf0f6;--bubble-radius-in:20px 20px 20px 4px;--bubble-radius-out:20px 20px 4px 20px;--composer-radius:24px;--control-radius:14px;--message-gap:5px;--theme-font:"Segoe UI",Arial,sans-serif;color-scheme:light}
:root[data-style-theme="honey"]{--primary:#eab308;--bg:#fdf9eb;--panel:#ffffff;--panel2:#fefcf4;--text:#2a291d;--muted:#a28c3d;--line:#fbf0ce;--bubble-in:#fcf5de;--bubble-out:#eab308;--bubble-out-text:#111827;--hover:#fdf7e6;--selected:#fbf0ce;--bubble-radius-in:14px 14px 14px 3px;--bubble-radius-out:14px 14px 3px 14px;--composer-radius:12px;--control-radius:10px;--message-gap:4px;--theme-font:"Trebuchet MS",Arial,sans-serif;color-scheme:light}
:root[data-style-theme="flamingo"]{--primary:#f472b6;--bg:#fef4f9;--panel:#ffffff;--panel2:#fff9fc;--text:#2c1f35;--muted:#a86b94;--line:#fde3f0;--bubble-in:#feecf5;--bubble-out:#f472b6;--bubble-out-text:#111827;--hover:#fef1f8;--selected:#fde3f0;--bubble-radius-in:22px;--bubble-radius-out:22px;--composer-radius:26px;--control-radius:20px;--message-gap:6px;--theme-font:"Trebuchet MS",Arial,sans-serif;color-scheme:light}
:root[data-style-theme="steelblue"]{--primary:#3b6ea5;--bg:#eff3f8;--panel:#ffffff;--panel2:#f6f8fb;--text:#121f33;--muted:#4b698c;--line:#d8e2ed;--bubble-in:#e5ebf3;--bubble-out:#3b6ea5;--bubble-out-text:#ffffff;--hover:#ebf0f6;--selected:#d8e2ed;--bubble-radius-in:14px 14px 14px 3px;--bubble-radius-out:14px 14px 3px 14px;--composer-radius:12px;--control-radius:10px;--message-gap:4px;--theme-font:Inter,system-ui,Arial,sans-serif;color-scheme:light}
:root[data-style-theme="sage"]{--primary:#6b8e6b;--bg:#f3f6f3;--panel:#ffffff;--panel2:#f8faf8;--text:#18232a;--muted:#63796e;--line:#e1e8e1;--bubble-in:#ebf0eb;--bubble-out:#6b8e6b;--bubble-out-text:#ffffff;--hover:#f0f4f0;--selected:#e1e8e1;--bubble-radius-in:7px;--bubble-radius-out:7px;--composer-radius:8px;--control-radius:6px;--message-gap:5px;--theme-font:Verdana,Geneva,sans-serif;color-scheme:light}
:root[data-style-theme="plum"]{--primary:#a21caf;--bg:#f8edf9;--panel:#ffffff;--panel2:#fbf5fb;--text:#201334;--muted:#7e4090;--line:#ecd2ef;--bubble-in:#f2e0f4;--bubble-out:#a21caf;--bubble-out-text:#ffffff;--hover:#f6e8f7;--selected:#ecd2ef;--bubble-radius-in:20px 20px 20px 4px;--bubble-radius-out:20px 20px 4px 20px;--composer-radius:24px;--control-radius:14px;--message-gap:5px;--theme-font:"Segoe UI",Arial,sans-serif;color-scheme:light}
:root[data-style-theme="midnightblue"]{--primary:#6ea8ff;--bg:#151c2a;--panel:#222e42;--panel2:#2a374e;--text:#e9ebf0;--muted:#8ea4c8;--line:#455c7e;--bubble-in:#34445d;--bubble-out:#6ea8ff;--bubble-out-text:#111827;--hover:#2f3d54;--selected:#425c8c;--bubble-radius-in:20px 20px 20px 4px;--bubble-radius-out:20px 20px 4px 20px;--composer-radius:24px;--control-radius:14px;--message-gap:5px;--theme-font:-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color-scheme:dark}
:root[data-style-theme="graphitedark"]{--primary:#8ea2c4;--bg:#181c24;--panel:#272d3a;--panel2:#2f3644;--text:#e9ebf0;--muted:#97a3b7;--line:#4f5a6c;--bubble-in:#3b4352;--bubble-out:#8ea2c4;--bubble-out-text:#111827;--hover:#353c4a;--selected:#4d5a77;--bubble-radius-in:14px 14px 14px 3px;--bubble-radius-out:14px 14px 3px 14px;--composer-radius:12px;--control-radius:10px;--message-gap:4px;--theme-font:-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color-scheme:dark}
:root[data-style-theme="neondark"]{--primary:#00e58a;--bg:#0a231e;--panel:#133631;--panel2:#18413b;--text:#e9ebf0;--muted:#6fb5a7;--line:#246e5b;--bubble-in:#1e5046;--bubble-out:#00e58a;--bubble-out-text:#111827;--hover:#1b483f;--selected:#1c7164;--bubble-radius-in:7px;--bubble-radius-out:7px;--composer-radius:8px;--control-radius:6px;--message-gap:5px;--theme-font:"Trebuchet MS",Arial,sans-serif;color-scheme:dark}
:root[data-style-theme="cyber"]{--primary:#f000b8;--bg:#220c23;--panel:#351638;--panel2:#3f1d42;--text:#e9ebf0;--muted:#b275b4;--line:#6c2969;--bubble-in:#4e224f;--bubble-out:#f000b8;--bubble-out-text:#ffffff;--hover:#461e48;--selected:#6e2373;--bubble-radius-in:7px;--bubble-radius-out:7px;--composer-radius:8px;--control-radius:6px;--message-gap:5px;--theme-font:"Courier New",monospace;color-scheme:dark}
:root[data-style-theme="dracula"]{--primary:#bd93f9;--bg:#1d1a29;--panel:#2d2b41;--panel2:#37344d;--text:#e9ebf0;--muted:#a49fc6;--line:#5d557c;--bubble-in:#44405c;--bubble-out:#bd93f9;--bubble-out-text:#111827;--hover:#3d3953;--selected:#5d5589;--bubble-radius-in:20px 20px 20px 4px;--bubble-radius-out:20px 20px 4px 20px;--composer-radius:24px;--control-radius:14px;--message-gap:5px;--theme-font:"Courier New",monospace;color-scheme:dark}
:root[data-style-theme="nord"]{--primary:#88c0d0;--bg:#181f25;--panel:#26313b;--panel2:#2e3b46;--text:#e9ebf0;--muted:#95abba;--line:#4d6370;--bubble-in:#3a4954;--bubble-out:#88c0d0;--bubble-out-text:#111827;--hover:#34414c;--selected:#4b647c;--bubble-radius-in:14px 14px 14px 3px;--bubble-radius-out:14px 14px 3px 14px;--composer-radius:12px;--control-radius:10px;--message-gap:4px;--theme-font:Inter,system-ui,Arial,sans-serif;color-scheme:dark}
:root[data-style-theme="carbon"]{--primary:#94a3b8;--bg:#191c23;--panel:#282d38;--panel2:#303742;--text:#e9ebf0;--muted:#98a3b4;--line:#515a69;--bubble-in:#3c434f;--bubble-out:#94a3b8;--bubble-out-text:#111827;--hover:#363c48;--selected:#4f5a73;--bubble-radius-in:7px;--bubble-radius-out:7px;--composer-radius:8px;--control-radius:6px;--message-gap:5px;--theme-font:Inter,system-ui,Arial,sans-serif;color-scheme:dark}
:root[data-style-theme="ember"]{--primary:#fb923c;--bg:#231a16;--panel:#362b26;--panel2:#41342f;--text:#e9ebf0;--muted:#b59e91;--line:#705544;--bubble-in:#514036;--bubble-out:#fb923c;--bubble-out-text:#111827;--hover:#483931;--selected:#725549;--bubble-radius-in:14px 14px 14px 3px;--bubble-radius-out:14px 14px 3px 14px;--composer-radius:12px;--control-radius:10px;--message-gap:4px;--theme-font:-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color-scheme:dark}
:root[data-style-theme="emeralddark"]{--primary:#34d399;--bg:#0f2120;--panel:#1a3434;--panel2:#213e3d;--text:#e9ebf0;--muted:#7db0ab;--line:#346960;--bubble-in:#294d49;--bubble-out:#34d399;--bubble-out-text:#111827;--hover:#244442;--selected:#2e6b69;--bubble-radius-in:20px 20px 20px 4px;--bubble-radius-out:20px 20px 4px 20px;--composer-radius:24px;--control-radius:14px;--message-gap:5px;--theme-font:-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color-scheme:dark}
:root[data-style-theme="golddark"]{--primary:#fbbf24;--bg:#231f14;--panel:#363123;--panel2:#413b2b;--text:#e9ebf0;--muted:#b5ab8a;--line:#70633c;--bubble-in:#514932;--bubble-out:#fbbf24;--bubble-out-text:#111827;--hover:#48412d;--selected:#726441;--bubble-radius-in:14px 14px 14px 3px;--bubble-radius-out:14px 14px 3px 14px;--composer-radius:12px;--control-radius:10px;--message-gap:4px;--theme-font:Georgia,"Times New Roman",serif;color-scheme:dark}
:root[data-style-theme="oceandark"]{--primary:#22d3ee;--bg:#0d2128;--panel:#18343f;--panel2:#1e3e4b;--text:#e9ebf0;--muted:#78b0c3;--line:#2f6979;--bubble-in:#254d5a;--bubble-out:#22d3ee;--bubble-out-text:#111827;--hover:#214451;--selected:#286b86;--bubble-radius-in:20px 20px 20px 4px;--bubble-radius-out:20px 20px 4px 20px;--composer-radius:24px;--control-radius:14px;--message-gap:5px;--theme-font:"Segoe UI",Arial,sans-serif;color-scheme:dark}
:root[data-style-theme="violetdark"]{--primary:#a78bfa;--bg:#1b1a29;--panel:#2a2a41;--panel2:#33334d;--text:#e9ebf0;--muted:#9e9cc6;--line:#56537d;--bubble-in:#403e5c;--bubble-out:#a78bfa;--bubble-out-text:#111827;--hover:#393754;--selected:#55528a;--bubble-radius-in:22px;--bubble-radius-out:22px;--composer-radius:26px;--control-radius:20px;--message-gap:6px;--theme-font:"Segoe UI",Arial,sans-serif;color-scheme:dark}
:root[data-style-theme="matrix"]{--primary:#22c55e;--bg:#0d1f1a;--panel:#18322b;--panel2:#1e3c34;--text:#e9ebf0;--muted:#78ad9a;--line:#2f644e;--bubble-in:#254a3d;--bubble-out:#22c55e;--bubble-out-text:#ffffff;--hover:#214237;--selected:#286655;--bubble-radius-in:7px;--bubble-radius-out:7px;--composer-radius:8px;--control-radius:6px;--message-gap:5px;--theme-font:"Courier New",monospace;color-scheme:dark}
:root[data-style-theme="crimsondark"]{--primary:#fb7185;--bg:#23171e;--panel:#362631;--panel2:#412f3a;--text:#e9ebf0;--muted:#b595a5;--line:#704b5a;--bubble-in:#513945;--bubble-out:#fb7185;--bubble-out-text:#111827;--hover:#48333e;--selected:#724962;--bubble-radius-in:7px;--bubble-radius-out:7px;--composer-radius:8px;--control-radius:6px;--message-gap:5px;--theme-font:-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color-scheme:dark}

/* 20260729p theme picker grid */
.theme-open-button{display:flex;align-items:center;justify-content:space-between;gap:8px;width:auto;min-width:150px;padding:8px 12px}
.theme-open-caret{color:var(--muted)}
.theme-picker-dialog{width:min(560px,calc(100vw - 24px))}
.theme-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:10px;padding:14px;max-height:70dvh;overflow:auto}
.theme-card{display:grid;gap:6px;padding:6px;border:1px solid var(--line);border-radius:12px;background:var(--panel);cursor:pointer;min-height:0}
.theme-card.active{border-color:var(--primary);box-shadow:0 0 0 2px color-mix(in srgb,var(--primary) 45%,transparent)}
.theme-swatch{position:relative;display:block;height:56px;border-radius:9px;overflow:hidden;border:1px solid rgba(0,0,0,.08)}
.theme-swatch .tb-in{position:absolute;left:8px;top:11px;width:46%;height:13px;border-radius:8px}
.theme-swatch .tb-out{position:absolute;right:8px;top:30px;width:52%;height:13px;border-radius:8px}
.theme-swatch .tb-dot{position:absolute;right:7px;bottom:6px;width:12px;height:12px;border-radius:50%;box-shadow:0 0 0 2px rgba(255,255,255,.55)}
.theme-card-name{font-size:11px;font-weight:600;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--text)}

/* 20260729s staff collaboration: viewer chips, collab bar, typing lock, shake */
.staff-collab-bar{display:flex;flex-direction:column;gap:4px;padding:7px 12px;border-top:1px solid var(--line);background:var(--panel2);font-size:12.5px}
.collab-line{display:flex;gap:6px;align-items:baseline;min-width:0}
.collab-line strong{flex:none;font-weight:700;font-size:12px}
.collab-line.typing strong{color:var(--primary)}
.collab-line.draft strong{color:var(--muted)}
.collab-line span{color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-style:italic}
.viewer-chips{display:flex;align-items:center;flex:none;padding-left:4px}
.viewer-chip{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--primary);color:#fff;font-size:10px;font-weight:700;border:2px solid var(--panel);margin-left:-6px;box-shadow:0 1px 3px rgba(0,0,0,.22)}
.viewer-chip:first-child{margin-left:0}
.composer.typing-locked textarea{opacity:.68;cursor:not-allowed}
.composer.shake{animation:composerShake .4s ease}
@keyframes composerShake{0%,100%{transform:translateX(0)}15%,55%{transform:translateX(-7px)}35%,75%{transform:translateX(7px)}90%{transform:translateX(-3px)}}

/* 20260729u verified / locked contact-channel buttons (email + phone verification) */
.channel-verified{background:color-mix(in srgb,#22c55e 16%,var(--panel))!important;border-color:color-mix(in srgb,#22c55e 52%,var(--line))!important;color:var(--text)!important;font-weight:700;opacity:1!important}
.channel-locked{opacity:.58}

/* 20260729w Messenger-style scroll-to-latest: centered pill-circle with a chevron */
.scroll-latest{left:50%;right:auto!important;transform:translateX(-50%);width:40px;height:40px;background:var(--panel);color:var(--primary);border:1px solid var(--line);box-shadow:0 4px 14px rgba(0,0,0,.20);font-size:0}
.scroll-latest::after{content:"";width:10px;height:10px;border-right:2.4px solid currentColor;border-bottom:2.4px solid currentColor;transform:rotate(45deg);margin-top:-3px}

/* 20260729y manual referrer picker */
.referrer-picker{display:grid;gap:10px;padding:14px}
.referrer-picker input{width:100%;padding:11px 12px}
.referrer-picker .search-results{max-height:56dvh;overflow:auto;padding:0}

/* 20260729aa collapsible filters inside search field */
.search-wrap input{padding-right:42px}
.filter-toggle{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:30px;height:30px;display:flex;align-items:center;justify-content:center;border:none;background:transparent;color:var(--muted);cursor:pointer;border-radius:8px;padding:0}
.filter-toggle svg{width:18px;height:18px}
.filter-toggle:hover{background:color-mix(in srgb,var(--primary) 12%,transparent);color:var(--primary)}
.filter-toggle.active{background:color-mix(in srgb,var(--primary) 16%,transparent);color:var(--primary)}
.filter-active-dot{position:absolute;top:2px;right:2px;min-width:15px;height:15px;padding:0 3px;border-radius:999px;background:var(--primary);color:#fff;font-size:9px;font-weight:800;line-height:15px;text-align:center;box-shadow:0 0 0 2px var(--bg,#fff)}
.filter-panel{display:grid;gap:8px}

/* 20260729af new-message counter on the scroll-to-latest button */
.scroll-latest-count{position:absolute;top:-7px;right:-7px;min-width:20px;height:20px;padding:0 5px;border-radius:999px;background:#fa3e3e;color:#fff;font-size:11px;font-weight:800;line-height:20px;text-align:center;box-shadow:0 2px 8px rgba(0,0,0,.35);pointer-events:none}

/* 20260729ak header cleanup: Claim/Unclaim removed from UI (JS + backend kept),
   Find button + status dropdown relocated into the Chat/Notes/Media tab row. */
#claimButton,#unclaimButton{display:none!important}
.pane-tabs{align-items:center}
.pane-tabs button[data-pane]{flex:0 0 auto}
.pane-tabs .pane-tab-action{flex:0 0 auto;align-self:center}
.pane-tabs .pane-tab-action::after{display:none!important}
.pane-tabs #conversationSearchButton{margin-left:auto;width:36px;height:36px;min-height:36px;padding:0;border-radius:9px;display:grid;place-items:center;background:var(--panel2);color:var(--primary)}
.pane-tabs #conversationSearchButton svg{width:18px;height:18px}
#statusSelect.pane-tab-action{height:34px;min-height:34px;padding:4px 10px;border-radius:9px;font-size:13px;margin-left:8px;background:var(--panel2)}

/* 20260729am tab buttons show colorful emoji (Chat / Private notes / Media) */
.pane-tabs button[data-pane]{display:grid;place-items:center;padding:6px 18px;font-size:20px;line-height:1}

/* 20260729ao footer buttons show colorful emoji (customer link / announcements) */
#sidebar .sidebar-footer button{display:grid;place-items:center;font-size:20px;line-height:1}

/* 20260729ar internal Team chat */
.team-member-row{display:flex;align-items:center;gap:9px;margin:7px 0}
.team-member-row small{color:var(--muted);display:block;font-size:11.5px}
.team-member-dot{width:10px;height:10px;border-radius:50%;background:var(--muted);opacity:.45;flex:none}
.team-member-dot.online{background:#31a24c;opacity:1;box-shadow:0 0 0 3px color-mix(in srgb,#31a24c 25%,transparent)}
