/* CrewChat desktop: the same page shell, with only the roster on a separate surface. */
@media(min-width:760px) {
 #seafix-demo .sf-chat-mobile-toolbar { position:relative; display:flex; align-items:center; gap:4px; min-height:48px; border-bottom:1px solid var(--sf-line); }
 #seafix-demo .sf-chat-mobile-toolbar>button { display:grid; place-items:center; flex:none; min-height:44px; padding:10px 12px; margin:0; border:0; border-radius:0; background:transparent; color:var(--sf-muted); font-size:15px; line-height:1.4; }
 #seafix-demo .sf-chat-mobile-toolbar>[data-chat-view] { position:relative; }
 #seafix-demo .sf-chat-mobile-toolbar>[data-chat-view][aria-pressed=true] { color:var(--sf-text); font-weight:650; }
 #seafix-demo .sf-chat-mobile-toolbar>[data-chat-view][aria-pressed=true]::after { content:""; position:absolute; bottom:0; left:12px; right:12px; height:2px; border-radius:2px; background:currentColor; }
 #seafix-demo .sf-chat-mobile-toolbar>#sf-chat-search-toggle { margin-left:auto; }
 #seafix-demo .sf-chat-mobile-toolbar>:is(#sf-chat-search-toggle,#sf-chat-more-toggle) { width:44px; padding:0; color:var(--sf-text); }
 #seafix-demo .sf-chat-mobile-toolbar svg { width:20px; height:20px; stroke-width:1.7; }
 #seafix-demo #sf-chat-more-panel { position:absolute; right:0; top:calc(100% + 4px); z-index:28; padding:6px; border:1px solid var(--sf-line); border-radius:12px; background:var(--sf-surface); box-shadow:0 8px 30px rgb(0 0 0 / .1); }
 #seafix-demo #sf-chat-more-panel[hidden] { display:none; }
 #seafix-demo #sf-chat-more-panel button { display:flex; align-items:center; gap:8px; min-height:44px; padding:8px 12px; border:0; background:transparent; color:var(--sf-text); font-size:14px; }
 #seafix-demo #sf-chat-search-panel { margin:8px 4px 0; animation:sf-chat-search-open 160ms ease-out; }
 #seafix-demo #sf-chat-search-panel[hidden] { display:none; }
 #seafix-demo #sf-chat-search-close { display:grid; }
 #seafix-demo .sf-chat-page #sf-chat-search { width:100%; min-height:44px; padding:10px 44px 10px 34px; font-size:16px; }
 #seafix-demo .sf-chat-mobile-filters { display:flex; align-items:center; gap:6px; padding:10px 4px; overflow-x:auto; scrollbar-width:none; }
 #seafix-demo .sf-chat-mobile-filters[hidden] { display:none; }
 #seafix-demo .sf-chat-mobile-filters button { display:flex; align-items:center; justify-content:center; gap:4px; flex:none; min-height:36px; padding:7px 10px; margin:0; border:1px solid var(--sf-line); border-radius:20px; background:transparent; color:var(--sf-muted); font-size:12px; white-space:nowrap; }
 #seafix-demo .sf-chat-mobile-filters button[aria-pressed=true] { background:light-dark(#303239,#e3e4e8); border-color:transparent; color:light-dark(#fff,#17191d); }
 #seafix-demo #sf-chat-filter-unread { font-size:11px; font-weight:650; }
 #seafix-demo .sf-chat-mobile-archive-heading { display:block; margin:4px 10px 10px; color:var(--sf-muted); font-size:13px; }
 #seafix-demo .sf-chat-mobile-archive-heading[hidden] { display:none; }
 #seafix-demo #sf-chat-roster-note { margin:0 10px 8px; }
 #seafix-demo .sf-chat-mobile-contact { margin:0; border:0; border-bottom:1px solid var(--sf-line); border-radius:0; background:transparent; }
 #seafix-demo .sf-chat-mobile-contact:is(.is-selected,.is-unread) { border-color:var(--sf-line); background:transparent; }
 #seafix-demo .sf-chat-mobile-contact .sf-chat-person { min-height:80px; gap:12px; padding:10px 8px; border-radius:0; }
 #seafix-demo .sf-chat-mobile-contact.is-directory .sf-chat-person { min-height:68px; }
 #seafix-demo .sf-chat-mobile-contact .sf-chat-avatar { width:44px; height:44px; flex-basis:44px; font-size:16px; }
 #seafix-demo .sf-chat-mobile-contact .sf-chat-dot[data-state=offline] { background:#c43b4b; }
 #seafix-demo .sf-chat-mobile-contact .sf-chat-person-copy { height:auto; justify-content:center; gap:3px; }
 #seafix-demo .sf-chat-contact-title { display:flex!important; align-items:baseline; gap:8px; }
 #seafix-demo .sf-chat-contact-title strong { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:14px; line-height:18px; }
 #seafix-demo .sf-chat-contact-title time { flex:none; margin-left:auto; color:var(--sf-muted); font-size:11px; font-weight:400; }
 #seafix-demo .sf-chat-mobile-contact .sf-chat-person-copy>span:not(.sf-chat-contact-title) { font-size:12px; line-height:16px; }
 #seafix-demo .sf-chat-mobile-contact .sf-chat-preview { font-size:13px; line-height:17px; }
 #seafix-demo .sf-chat-mobile-contact.is-unread .sf-chat-preview { color:var(--sf-text); font-weight:600; }
 #seafix-demo .sf-chat-mobile-contact .sf-chat-contact-actions { width:24px; padding-right:6px; }
 #seafix-demo .sf-chat-mobile-contact.is-directory .sf-chat-contact-actions { width:0; padding:0; }
 #seafix-demo .sf-chat-mobile-contact .sf-chat-favorite { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); }
 #seafix-demo .sf-chat-mobile-contact .sf-chat-favorite:focus-visible { position:static; width:24px; height:32px; margin:0; clip-path:none; }
 #seafix-demo .sf-chat-mobile-contact .sf-chat-count { color:light-dark(#fff,#17191d); background:light-dark(#23262c,#e3e4e8); }
 #seafix-demo .sf-chat-group { margin:0; }
 #seafix-demo .sf-chat-group>summary { min-height:48px; padding:10px 8px; font-size:13px; border-bottom:1px solid var(--sf-line); }
 #seafix-demo .sf-chat-group>summary>small { font-size:12px; }
 #seafix-demo .sf-chat-group>summary>svg { width:16px!important; height:16px!important; }
 #seafix-demo .sf-chat-mobile-filter-select { position:relative; display:block; padding:12px 4px 0; }
 #seafix-demo .sf-chat-mobile-filter-select[hidden] { display:none; }
 #seafix-demo #sf-chat-filter-toggle { display:flex; align-items:center; gap:8px; min-height:44px; padding:8px 6px; border:0; border-radius:8px; background:transparent; color:var(--sf-muted); font-size:13px; line-height:18px; font-weight:500; white-space:nowrap; }
 #seafix-demo #sf-chat-filter-toggle svg { width:15px!important; height:15px!important; stroke-width:1.7; transition:transform 160ms ease; }
 #seafix-demo #sf-chat-filter-toggle[aria-expanded=true] svg { transform:rotate(180deg); }
 #seafix-demo #sf-chat-filter-panel { position:absolute; top:calc(100% - 4px); left:4px; z-index:29; width:min(260px,calc(100vw - 32px)); padding:6px; border:1px solid var(--sf-line); border-radius:14px; background:var(--sf-chat-paper); box-shadow:0 6px 22px rgb(0 0 0 / .07); }
 #seafix-demo #sf-chat-filter-panel[hidden] { display:none; }
 #seafix-demo #sf-chat-filter-panel button { display:flex; align-items:center; gap:10px; width:100%; min-height:44px; padding:10px; border:0; border-radius:8px; background:transparent; color:var(--sf-muted); font-size:13px; text-align:left; }
 #seafix-demo #sf-chat-filter-panel button[aria-pressed=true] { color:var(--sf-text); font-weight:600; background:var(--sf-chat-field); }
 #seafix-demo #sf-chat-filter-panel button:focus-visible { outline:1px solid var(--sf-line); outline-offset:-1px; background:var(--sf-chat-field); }
 #seafix-demo #sf-chat-filter-panel svg { flex:none; width:17px!important; height:17px!important; stroke-width:1.7; }
 #seafix-demo #sf-chat-filter-panel .sf-chat-filter-check { margin-left:auto; visibility:hidden; }
 #seafix-demo #sf-chat-filter-panel [aria-pressed=true] .sf-chat-filter-check { visibility:visible; }
 #seafix-demo #sf-chat-search:is(:focus,:focus-visible) { outline:none!important; box-shadow:none!important; border-color:var(--sf-line); }
 #seafix-demo #sf-chat-search-panel:focus-within { outline:none!important; box-shadow:none!important; }
 #seafix-demo #sf-chat-security-close:is(:focus,:focus-visible) { outline:none!important; box-shadow:none!important; background:transparent!important; }
 #seafix-demo #sf-chat-security-close:focus-visible svg { opacity:.65; }
 #seafix-demo #sf-chat-security-dialog {
  --sf-security-surface:light-dark(#e9eaee,#27292e);
  max-width:calc(100vw - 16px);
  border-radius:20px;
  background:var(--sf-security-surface);
 }
 #seafix-demo #sf-chat-security-dialog .sf-chat-security-heading {
  align-items:flex-start;
  background:var(--sf-security-surface);
 }
 #seafix-demo .sf-chat-security-heading>svg { display:none; }
 #seafix-demo .sf-chat-security-heading h2 {
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip-path:inset(50%);
  white-space:nowrap;
  border:0;
 }
 #seafix-demo .sf-chat-security-flow {
  display:block;
  flex:1;
  min-width:0;
  color:var(--sf-text);
 }
 #seafix-demo .sf-chat-security-flow>svg {
  display:block;
  width:100%;
  max-width:320px;
  height:76px;
  margin-inline:auto;
 }
 #seafix-demo .sf-security-data { color:light-dark(#7d879d,#a2acc2); }
 #seafix-demo .sf-security-stream {
  animation:sf-security-data-flow 3.5s linear infinite;
  animation-play-state:paused;
 }
 #seafix-demo .sf-security-stream--return {
  opacity:.5;
  animation-direction:reverse;
 }
 #seafix-demo #sf-chat-security-dialog[open] .sf-security-stream { animation-play-state:running; }
 #seafix-demo #sf-chat-security-close { background:var(--sf-security-surface); }
 #seafix-demo #sf-chat-security-dialog section {
  margin:0;
  padding:16px;
  border:0;
  border-radius:0;
  background:transparent;
 }
 #seafix-demo #sf-chat-security-dialog section+section {
  border-top:1px solid var(--sf-line);
 }
 #seafix-demo.sf-chat-view #sf-chat-compose { align-items:flex-end; gap:4px; padding:6px; border-radius:24px; background:light-dark(rgb(255 255 255 / .82),rgb(36 38 44 / .82)); box-shadow:0 2px 12px rgb(0 0 0 / .04); }
 @supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {
  #seafix-demo.sf-chat-view #sf-chat-compose { background:rgb(255 255 255 / .72); backdrop-filter:blur(22px) saturate(130%); -webkit-backdrop-filter:blur(22px) saturate(130%); }
 }
 #seafix-demo.sf-chat-view #sf-chat-compose :is(#sf-chat-emoji,.sf-chat-sticker-toggle) { display:grid; place-items:center; flex:0 0 32px; width:32px; height:42px; padding:0; border:0; border-radius:10px; color:var(--sf-muted); background:transparent; }
 #seafix-demo.sf-chat-view #sf-chat-compose :is(#sf-chat-emoji,.sf-chat-sticker-toggle) svg { width:22px!important; height:22px!important; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
 #seafix-demo.sf-chat-view #sf-chat-compose :is(#sf-chat-emoji,.sf-chat-sticker-toggle):is(:hover,[aria-expanded=true]) { background:#edf0f4; color:#17191d; }
 #seafix-demo.sf-chat-view #sf-chat-compose .sf-chat-send { flex:0 0 38px; width:38px; min-width:38px; height:38px; margin:2px 0; padding:0; border-radius:50%; background:#23262c; color:#fff; }
 #seafix-demo.sf-chat-view #sf-chat-compose .sf-chat-send svg { width:19px!important; height:19px!important; stroke-width:2; }
  #seafix-demo.sf-chat-view .sf-account-menu { display:block; position:static; flex:none; }
  #seafix-demo.sf-chat-view .sf-account-menu-toggle {
    display:grid; place-items:center; width:44px; height:44px; min-width:44px; margin:0; padding:0;
    border:0; border-radius:12px;
    background:transparent; color:var(--sf-heading); font:inherit;
    box-shadow:none; cursor:pointer;
    transition:background .15s,border-color .15s,box-shadow .15s;
  }
  #seafix-demo.sf-chat-view .sf-account-menu-toggle > svg { width:23px!important; height:23px!important; stroke-width:1.7; }
  #seafix-demo.sf-chat-view .sf-account-menu-toggle[aria-expanded="true"] { background:var(--sf-settings-selection); }
  #seafix-demo.sf-chat-view .sf-account-menu-panel {
    position:fixed; inset:var(--sf-viewport-top,0px) 0 auto auto; margin:0;
    display:flex; flex-direction:column; box-sizing:border-box;
    width:min(224px,calc(100vw - 24px)); max-width:none;
    height:var(--sf-viewport-height,100dvh); max-height:none;
    padding:max(10px,env(safe-area-inset-top,0px)) 10px max(12px,env(safe-area-inset-bottom,0px));
    overflow-y:auto; overflow-x:hidden; overscroll-behavior:contain; touch-action:pan-y;
    border:0; border-left:1px solid var(--sf-settings-line); border-radius:0; background:var(--sf-canvas,var(--sf-page)); color:var(--sf-settings-ink);
    box-shadow:-14px 0 45px rgb(0 0 0 / .12); transform:translateX(0);
  }
  #seafix-demo.sf-chat-view .sf-account-menu-panel::backdrop { background:rgb(0 0 0 / .2); }
  #seafix-demo.sf-chat-view .sf-account-menu-heading { display:flex; flex:none; align-items:center; justify-content:space-between; gap:6px; padding-left:7px; }
  #seafix-demo.sf-chat-view .sf-account-menu-heading > span { color:var(--sf-settings-muted); font-size:12px; font-weight:500; }
  #seafix-demo.sf-chat-view #sf-account-menu-close { display:grid; place-items:center; flex:none; width:44px; height:44px; margin:0; padding:0; border:0; border-radius:12px; background:var(--sf-surface-raised); color:var(--sf-heading); cursor:pointer; }
  #seafix-demo.sf-chat-view #sf-account-menu-close svg { width:20px!important; height:20px!important; }
  #seafix-demo.sf-chat-view .sf-account-menu-person { display:block; flex:none; margin:0 0 12px; padding:14px 7px 18px; border-bottom:1px solid var(--sf-settings-line); }
  #seafix-demo.sf-chat-view .sf-account-menu-person > div { min-width:0; }
  #seafix-demo.sf-chat-view .sf-account-menu-person strong { display:block; margin:0; color:var(--sf-settings-ink); font-size:14px; font-weight:600; line-height:1.4; overflow-wrap:anywhere; }
  #seafix-demo.sf-chat-view .sf-account-menu-person small { display:block; margin-top:3px; color:var(--sf-settings-muted); font-size:11px; line-height:1.45; overflow-wrap:anywhere; }
  #seafix-demo.sf-chat-view .sf-account-menu-person small span { font-size:inherit; }
  #seafix-demo.sf-chat-view .sf-account-menu-nav { display:grid; flex:none; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; padding-bottom:16px; }
  #seafix-demo.sf-chat-view .sf-account-menu-panel [data-go],
  #seafix-demo.sf-chat-view .sf-account-menu-footer #sf-logout {
    display:flex; align-items:center; justify-content:flex-start; gap:11px; width:100%; min-width:0; min-height:44px;
    margin:0; padding:10px 7px; border:0; border-radius:9px;
    background:transparent; color:var(--sf-settings-ink); font:inherit; font-size:13px; font-weight:450; line-height:1.4; text-align:left; white-space:normal; cursor:pointer;
  }
  #seafix-demo.sf-chat-view .sf-account-menu-nav :is([data-go],[data-side-action]) {
    display:flex; flex-direction:column; align-items:center; justify-content:center; gap:7px;
    min-width:0; min-height:75px; padding:7px 4px; border:1px solid var(--sf-line);
    border-radius:14px; background:var(--sf-surface); color:var(--sf-settings-ink);
    font:inherit; font-size:11px; font-weight:550; line-height:1.2; text-align:center;
    white-space:normal; overflow-wrap:anywhere; cursor:pointer;
  }
  #seafix-demo.sf-chat-view .sf-account-menu-nav :is([data-go],[data-side-action]) > span { position:static; width:auto; height:auto; margin:0; padding:0; font-size:inherit; line-height:inherit; clip-path:none; overflow:visible; }
  #seafix-demo.sf-chat-view .sf-account-menu-nav :is([data-go],[data-side-action]) > svg { flex:none; width:18px!important; height:18px!important; color:var(--sf-settings-muted); }
  #seafix-demo.sf-chat-view .sf-account-menu-panel [data-go] > span,
  #seafix-demo.sf-chat-view .sf-account-menu-footer #sf-logout > span { position:static; width:auto; height:auto; margin:0; padding:0; overflow:visible; clip-path:none; font-size:inherit; line-height:inherit; }
  #seafix-demo.sf-chat-view .sf-account-menu-panel [data-go] > svg,
  #seafix-demo.sf-chat-view .sf-account-menu-footer #sf-logout > svg { flex:none; width:18px!important; height:18px!important; color:var(--sf-settings-muted); stroke-width:1.7; }
  #seafix-demo.sf-chat-view .sf-account-menu-panel [data-go][aria-current="page"] { background:var(--sf-settings-selection); color:var(--sf-settings-ink); font-weight:600; }
  #seafix-demo.sf-chat-view .sf-account-menu-panel [data-go][aria-current="page"] > svg { color:inherit; }
  #seafix-demo.sf-chat-view .sf-account-menu-nav :is([data-go],[data-side-action])[aria-current="page"] {
    background:var(--sf-heading); color:var(--sf-canvas); border-color:var(--sf-heading);
  }
  #seafix-demo.sf-chat-view .sf-account-menu-footer { flex:none; margin:auto 0 0; padding-top:10px; border-top:1px solid var(--sf-settings-line); }
  #seafix-demo.sf-chat-view .sf-account-menu-footer #sf-logout,
  #seafix-demo.sf-chat-view .sf-account-menu-footer #sf-logout > svg { color:var(--sf-danger); }
  #seafix-demo.sf-chat-view .sf-account-menu-footer #sf-logout:disabled { opacity:.6; cursor:wait; }
  #seafix-demo.sf-chat-view .sf-account-menu-footer #sf-logout-message { position:static; margin:4px 0 0; max-width:none; padding:10px 12px; border:0; border-radius:10px; background:color-mix(in srgb,var(--sf-danger) 7%,transparent); font-size:12px; line-height:1.5; }
  #seafix-demo.sf-chat-view .sf-account-menu :is(button,[data-go]):focus-visible { outline:2px solid var(--sf-heading); outline-offset:2px; }
  @media(hover:hover) {
    #seafix-demo.sf-chat-view .sf-account-menu-panel [data-go]:hover:not([aria-current="page"]) { background:light-dark(#e9e9ee,#303036); }
    #seafix-demo.sf-chat-view .sf-account-menu-footer #sf-logout:hover { background:color-mix(in srgb,var(--sf-danger) 7%,transparent); color:var(--sf-danger); }
  }

  #seafix-demo.sf-chat-view .sf-account-menu-nav :is([data-go],[data-side-action]) { min-height:75px; font-size:11px; }
  #seafix-demo.sf-chat-view .sf-account-menu-nav [data-side-action]:hover { background:var(--sf-settings-selection); }
  #seafix-demo.sf-chat-view .sf-account-menu-nav .sf-side-menu-spacer { display:block; }
  #seafix-demo.sf-chat-view .sf-account-menu-nav [hidden] { display:none!important; }

  #seafix-demo.sf-chat-view .sf-account-menu-nav :is([data-go],[data-side-action]) { min-height:75px; font-size:11px; }
  #seafix-demo.sf-chat-view .sf-account-menu-nav [data-side-action]:hover { background:var(--sf-settings-selection); }
  #seafix-demo.sf-chat-view .sf-account-menu-nav .sf-side-menu-spacer { display:block; }
  #seafix-demo.sf-chat-view .sf-account-menu-nav [hidden] { display:none!important; }


  #seafix-demo.sf-chat-view .sf-account-menu-panel { width:min(320px,calc(100vw - 24px)); padding-inline:16px; }
  #seafix-demo.sf-chat-view .sf-account-menu-nav { display:flex; flex:1 0 auto; flex-direction:column; gap:3px; padding-bottom:12px; }
  #seafix-demo.sf-chat-view .sf-account-menu-nav :is([data-go],[data-side-action]) { flex-direction:row; justify-content:flex-start; gap:16px; min-height:52px; padding:11px 15px; border:0; border-radius:14px; background:transparent; font-size:16px; font-weight:450; text-align:left; overflow-wrap:normal; }
  #seafix-demo.sf-chat-view .sf-account-menu-nav :is([data-go],[data-side-action]) > svg { width:22px!important; height:22px!important; }
  #seafix-demo.sf-chat-view .sf-account-menu-nav :is([data-go],[data-side-action])[aria-current="page"] { background:var(--sf-settings-selection); color:var(--sf-settings-ink); font-weight:650; }
  #seafix-demo.sf-chat-view .sf-account-menu-nav [data-go="settings"] { margin-top:auto; }
  #seafix-demo.sf-chat-view .sf-account-menu-person { margin:4px 0 12px; padding:16px; border:1px solid var(--sf-settings-line); border-radius:16px; background:var(--sf-settings-paper); }
  #seafix-demo.sf-chat-view .sf-account-menu-person strong { font-size:17px; }
  #seafix-demo.sf-chat-view .sf-account-menu-person small { font-size:13px; }
  #seafix-demo.sf-chat-view #sf-account-menu-close { border:1px solid var(--sf-settings-line); border-radius:14px; background:var(--sf-settings-paper); }


  #seafix-demo.sf-chat-view .sf-account-menu-panel { width:min(224px,calc(100vw - 24px)); padding-inline:9px; }
  #seafix-demo.sf-chat-view .sf-account-menu-nav :is([data-go],[data-side-action]) { gap:10px; min-height:48px; padding:9px 10px; font-size:13px; }
  #seafix-demo.sf-chat-view .sf-account-menu-nav :is([data-go],[data-side-action]) > svg { width:19px!important; height:19px!important; }
  #seafix-demo.sf-chat-view .sf-account-menu-person { padding:10px; }
  #seafix-demo.sf-chat-view .sf-account-menu-person strong { font-size:14px; }
  #seafix-demo.sf-chat-view .sf-account-menu-person small { font-size:11px; }
  #seafix-demo.sf-chat-view #sf-account-menu-close { width:38px; height:38px; border:0; border-radius:12px; background:var(--sf-settings-selection); color:var(--sf-settings-ink); }


  #seafix-demo.sf-chat-view .sf-account-menu-panel { width:min(var(--sf-side-panel-width,224px),calc(100vw - 24px)); }
  #seafix-demo.sf-chat-view .sf-account-menu-nav :is([data-go],[data-side-action]) { font-size:14px; white-space:nowrap; }
  #seafix-demo.sf-chat-view .sf-account-menu-nav :is([data-go],[data-side-action]) > span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  #seafix-demo.sf-chat-view .sf-account-menu-person { margin:0 0 9px; padding:8px 10px 13px; border:0; border-bottom:1px solid var(--sf-settings-line); border-radius:0; background:transparent; }
  #seafix-demo.sf-chat-view .sf-account-menu-person strong { font-size:14px; }
  #seafix-demo.sf-chat-view .sf-account-menu-person small { font-size:11px; }


 #seafix-demo.sf-chat-view .sf-account-menu-person{position:relative;min-height:113px;overflow:hidden;padding:14px 10px 16px;isolation:isolate;}
 #seafix-demo.sf-chat-view .sf-account-menu-person>div{position:relative;z-index:1;max-width:100%;}
 #seafix-demo.sf-chat-view #sf-menu-name span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
 #seafix-demo.sf-chat-view .sf-menu-department-icon{position:absolute;right:8px;top:7px;width:98px;height:98px;display:block;opacity:.16;transform:rotate(-11deg);pointer-events:none;}
 #seafix-demo.sf-chat-view .sf-menu-department-icon[data-department="hotel"]{transform:none;}
 #seafix-demo.sf-chat-view .sf-menu-department-icon svg{display:block;width:100%;height:100%;}
 #seafix-demo.sf-chat-view .sf-side-menu-row{display:flex;justify-content:space-between;gap:7px;}
 #seafix-demo.sf-chat-view .sf-side-menu-choice{display:flex;align-items:center;gap:9px;min-width:0;flex:1;cursor:pointer;}
 #seafix-demo.sf-chat-view .sf-side-menu-choice span{min-width:0;overflow-wrap:anywhere;}
 #seafix-demo.sf-chat-view .sf-side-menu-order{display:flex;flex:none;gap:3px;}
 #seafix-demo.sf-chat-view .sf-side-menu-order button{width:38px;min-height:38px;border:1px solid var(--sf-settings-line);border-radius:9px;background:var(--sf-settings-paper);color:var(--sf-settings-ink);font:inherit;cursor:pointer;}
 #seafix-demo.sf-chat-view .sf-side-menu-order button:disabled{opacity:.35;cursor:default;}


 #seafix-demo.sf-chat-view .sf-account-menu-panel .sf-account-menu-person { min-height:164px; padding-top:16px; border-bottom:0; overflow:visible; }
 #seafix-demo.sf-chat-view .sf-account-menu-panel .sf-account-menu-person::after { content:""; position:absolute; left:0; right:0; bottom:0; height:1px; background:linear-gradient(to right,var(--sf-settings-line) 0 36%,transparent 36% 88%,var(--sf-settings-line) 88%); }
 #seafix-demo.sf-chat-view .sf-account-menu-panel .sf-menu-department-icon { z-index:0; right:-15px; top:-6px; width:176px; height:176px; opacity:.55; transform:none; }
 #seafix-demo.sf-chat-view .sf-account-menu-panel .sf-menu-department-icon[data-department="hotel"] { top:-12px; width:184px; height:184px; transform:none; }
 #seafix-demo.sf-chat-view .sf-account-menu-panel .sf-menu-department-icon img { display:block; width:100%; height:100%; }
 #seafix-demo.sf-chat-view .sf-account-menu-nav { position:relative; z-index:1; }

 #seafix-demo.sf-chat-view .sf-phone { display:grid; grid-template-rows:auto minmax(0,1fr); min-height:0; width:100%; max-width:var(--sf-shell-width); height:100%; overflow:hidden; }
 #seafix-demo.sf-chat-view .sf-dock-frame { display:none; }
 #seafix-demo.sf-chat-view .sf-topbar { background:var(--sf-canvas); padding-top:calc(16px + env(safe-area-inset-top,0px)); padding-bottom:16px; }
 #seafix-demo.sf-chat-view .sf-topbar::after { content:none; }
 #seafix-demo.sf-chat-view #sf-settings-back { display:none!important; }
 #seafix-demo.sf-chat-view .sf-mobile-work-links { display:none!important; }
 #seafix-demo.sf-chat-view .sf-top-actions { display:flex; margin-left:auto; gap:8px; }
 #seafix-demo.sf-chat-view .sf-main { margin:0; height:100%; padding:0 var(--sf-page-gutter); }
 #seafix-demo .sf-chat-layout { display:grid; grid-template-columns:minmax(300px,32%) minmax(0,1fr); gap:24px; width:100%; margin:0; }
 #seafix-demo .sf-chat-sections { display:none!important; }
 #seafix-demo #sf-chat-roster-scroll { display:flex; flex-direction:column; min-height:0; height:100%; padding:6px 0 0; border-radius:24px 24px 0 0; background:light-dark(#e9eaee,#202126); overflow:hidden; }
 #seafix-demo .sf-chat-roster { flex:1; min-height:0; padding:0; }
 #seafix-demo #sf-chat-people { overflow-y:auto; flex:1; min-height:0; padding:0 0 16px; }
 #seafix-demo .sf-chat-mobile-toolbar { flex:none; margin-inline:12px; }
 #seafix-demo .sf-chat-mobile-toolbar>button { font-family:inherit; font-size:16px; font-weight:400; padding-inline:8px; }
 #seafix-demo .sf-chat-mobile-toolbar>[data-chat-view][aria-pressed=true] { font-weight:600; }
 #seafix-demo .sf-chat-mobile-toolbar>[data-chat-view][aria-pressed=true]::after { left:8px; right:8px; }
 #seafix-demo .sf-chat-mobile-toolbar>:is(#sf-chat-search-toggle,#sf-chat-more-toggle) { width:36px; padding:0; }
 #seafix-demo .sf-chat-mobile-filter-select { flex:none; padding:4px 12px; }
 #seafix-demo #sf-chat-filter-toggle { min-height:32px; padding:6px 6px; font-family:inherit; font-size:14px; line-height:20px; font-weight:500; }
 #seafix-demo #sf-chat-search-panel { flex:none; margin:8px 12px 0; }
 #seafix-demo .sf-chat-page #sf-chat-search { font-size:14px; }
 #seafix-demo .sf-chat-mobile-contact.is-selected { background:light-dark(#dce0e6,#30333b); border-radius:0; }
 #seafix-demo .sf-chat-mobile-contact .sf-chat-person { gap:10px; padding:6px 14px; min-height:72px; border-radius:0; }
 #seafix-demo .sf-chat-mobile-contact.is-directory .sf-chat-person { min-height:56px; }
 #seafix-demo .sf-chat-mobile-contact:has(:focus-visible) { outline-offset:-2px; }
 #seafix-demo .sf-chat-mobile-contact .sf-chat-person:hover { background:transparent; }

 #seafix-demo .sf-chat-contact-title strong { font-size:13px; }
 #seafix-demo .sf-chat-mobile-contact .sf-chat-favorite { position:static; width:26px; height:28px; margin:0; clip-path:none; }
 #seafix-demo .sf-chat-mobile-contact.is-directory .sf-chat-contact-actions { width:40px; padding-right:14px; }
 #seafix-demo .sf-chat-mobile-contact .sf-chat-contact-actions { width:40px; padding-right:14px; }
 #seafix-demo .sf-chat-conversation { padding:0 0 20px; border-radius:0; background:var(--sf-canvas); }
 #seafix-demo .sf-chat-thread-copy { display:grid; grid-template-columns:minmax(0,max-content) minmax(0,1fr); grid-template-rows:auto auto; gap:4px 8px; align-content:center; height:auto; }
 #seafix-demo .sf-chat-thread-copy strong { grid-column:1 / -1; font-size:16px; line-height:20px; }
 #seafix-demo .sf-chat-thread-position { max-width:180px; font-size:13px; line-height:18px; }
 #seafix-demo .sf-chat-thread-state { gap:8px; height:auto; min-width:0; font-size:13px; line-height:18px; }
 #seafix-demo .sf-chat-thread-state::before { content:"·"; flex:none; }
 #seafix-demo .sf-chat-thread-header .sf-chat-duty { height:auto; padding:0; border:0; border-radius:0; background:transparent; font-size:13px; line-height:18px; font-style:normal; }
 #seafix-demo .sf-chat-thread-header .sf-chat-duty::before { content:"·"; margin-right:8px; }
 #seafix-demo .sf-chat-thread-header { min-height:64px; padding:0 0 14px; align-items:flex-start; border:0; border-radius:0; background:var(--sf-canvas); }
 #seafix-demo #sf-chat-messages { padding:16px 16px 16px 2px; background:var(--sf-canvas); }
 #seafix-demo .sf-chat-bubble:not(.is-mine):not(.is-sticker) { background:var(--sf-chat-paper); }
 #seafix-demo .sf-chat-bubble { max-width:85%; }
 #seafix-demo #sf-chat-person>.sf-chat-favorite svg { width:20px!important; height:20px!important; }
 #seafix-demo .sf-chat-thread-header .sf-collab-icon svg { width:18px!important; height:18px!important; }
 #seafix-demo.sf-chat-view .sf-chat-page #sf-chat-body { color:var(--sf-heading); }
 #seafix-demo #sf-chat-compose .sf-chat-send>span { display:none; }
 #seafix-demo #sf-chat-encryption-notice { justify-content:center; gap:8px; padding:8px 32px; border:0; border-radius:0; background:transparent; color:var(--sf-muted); font-size:12px; box-shadow:none; }
 #seafix-demo #sf-chat-encryption-notice p { flex:0 1 auto; text-align:center; }
 #seafix-demo #sf-chat-encryption-notice p>span { display:block; color:var(--sf-text); }
 #seafix-demo #sf-chat-encryption-notice p>a { display:block; margin-top:2px; font-weight:400; }
 #seafix-demo .sf-chat-encryption-icon { background:transparent; color:var(--sf-text); }
 #seafix-demo #sf-chat-encryption-dismiss { top:4px; right:0; width:28px; height:28px; }
 #seafix-demo #sf-chat-encryption-dismiss:hover { background:var(--sf-chat-field); }
 #seafix-demo .sf-chat-day { display:flex; align-items:center; flex:none; gap:16px; margin:10px 0 6px; color:var(--sf-muted); font-size:11px; line-height:18px; }
 #seafix-demo .sf-chat-day::before, #seafix-demo .sf-chat-day::after { content:""; flex:1; height:1px; background:var(--sf-line); }
 #seafix-demo #sf-chat-security-dialog { width:min(620px,calc(100vw - 40px)); }
 #seafix-demo #sf-chat-security-dialog .sf-chat-security-heading { display:block; padding-block:24px; }
 #seafix-demo #sf-chat-security-close { position:absolute; right:0; top:8px; width:32px; height:32px; padding:0; border:0; border-radius:0; background:transparent; }
 #seafix-demo #sf-chat-security-close svg { width:14px!important; height:14px!important; }
 #seafix-demo #sf-chat-security-close:is(:focus,:focus-visible) { outline:none!important; box-shadow:none!important; background:transparent!important; }
 #seafix-demo #sf-chat-security-close:focus-visible svg { opacity:.65; }
}
@media(min-width:760px) and (max-width:999px) {
 #seafix-demo.sf-chat-view .sf-topbar .sf-brand-area { gap:6px; }
 #seafix-demo .sf-chat-layout { grid-template-columns:290px minmax(0,1fr); gap:16px; }
 #seafix-demo #sf-chat-roster-scroll { padding-inline:0; }
 #seafix-demo .sf-chat-thread-header { position:relative; }
 #seafix-demo #sf-chat-person>.sf-chat-favorite { display:none; }
 #seafix-demo .sf-chat-thread-copy strong { margin-right:122px; }
 #seafix-demo .sf-chat-thread-header>:is(.sf-chat-tool,.sf-chat-minimize) { position:absolute; top:0; height:28px; }
 #seafix-demo #sf-chat-find-open { right:76px; }
 #seafix-demo #sf-chat-conversation-archive { right:38px; }
 #seafix-demo #sf-chat-minimize { right:0; }
}
@media(min-width:760px) and (prefers-reduced-motion:reduce) {
 #seafix-demo #sf-chat-security-dialog .sf-security-stream { animation:none; }
 #seafix-demo #sf-chat-search-panel { animation:none; }
}

@media(min-width:760px) {
 #seafix-demo .sf-chat-mobile-contact:hover:not(.is-selected) { background:light-dark(#dfe2e8,#2a2c33); border-color:var(--sf-line); border-radius:0; }
}

@media(min-width:760px) {
 #seafix-demo.sf-wide-header-glass.sf-chat-view { --sf-wide-glass-overlap:12px; --sf-wide-glass-ramp:24px; --sf-wide-glass-tint-fade:20px; --sf-wide-glass-tint-mid:10px; }
 #seafix-demo.sf-chat-view #sf-chat-compose { border-radius:16px; padding:7px 9px; gap:8px; }
 #seafix-demo.sf-chat-view #sf-chat-body { order:0; padding-left:12px; }
 #seafix-demo.sf-chat-view #sf-chat-emoji { order:1; }
 #seafix-demo.sf-chat-view .sf-chat-sticker-toggle { order:2; }
 #seafix-demo.sf-chat-view #sf-chat-compose .sf-chat-send { order:3; }
 #seafix-demo.sf-chat-view #sf-chat-compose :is(#sf-chat-emoji,.sf-chat-sticker-toggle):is(:hover,[aria-expanded=true]) { background:var(--sf-chat-field); color:var(--sf-heading); }
}
@media(min-width:1000px) {
 /* The roster and brand share a center; the conversation takes the recovered room. */
 #seafix-demo.sf-chat-view { --sf-chat-roster-width:370px; }
 #seafix-demo.sf-chat-view .sf-topbar .sf-brand-area {
  flex:0 0 var(--sf-chat-roster-width); width:var(--sf-chat-roster-width);
  justify-content:center;
 }
 #seafix-demo.sf-chat-view .sf-chat-layout {
  grid-template-columns:var(--sf-chat-roster-width) minmax(0,1fr); gap:14px;
 }
 #seafix-demo #sf-account-menu-toggle:disabled { opacity:1; cursor:default; }
}

@media(min-width:760px) {
 #seafix-demo #sf-chat-person>.sf-chat-favorite { align-self:flex-start; }
 #seafix-demo .sf-chat-mobile-contact.is-conversation .sf-chat-contact-title { height:18px; align-items:center; }
 #seafix-demo .sf-chat-mobile-contact.is-conversation .sf-chat-contact-title time { line-height:18px; }
 #seafix-demo .sf-chat-mobile-contact.is-conversation .sf-chat-contact-actions { height:57px; align-self:center; gap:22px; }
 #seafix-demo .sf-chat-mobile-contact.is-conversation .sf-chat-favorite { height:18px; }
}

@media(min-width:760px) {
 #seafix-demo .sf-chat-mobile-toolbar:is([data-fleet-chat="true"],:has([data-chat-view="office"]:not([hidden]))) { gap:0; }
 #seafix-demo .sf-chat-mobile-toolbar:is([data-fleet-chat="true"],:has([data-chat-view="office"]:not([hidden])))>[data-chat-view] { flex:0 1 auto; min-width:0; padding:8px 6px; font-size:13px; line-height:1.25; }
 #seafix-demo .sf-chat-mobile-toolbar>[data-chat-view="office"] span { max-width:112px; }
}