/* Messages after Raven (oscar-soirey/Raven, the glass example and its glass looks), on a citizen's
   full-screen page (body.jm-immersive). The canvas is Raven's: a flat dark grey in the dark look, a
   soft pastel wallpaper in the light one. Everything that floats is glass in Raven's three materials:
   the sidebar frosted (a rounded panel with a rim of light), the bar of icons a tinted toolbar (a
   dark capsule, the pressed item a solid blue pill), the composer a clear player bar that messages
   scroll under. The accent is Raven's blue; switches are its green; cards are vivid gradients with a
   glass chip. The palette is Raven's own (src/widget/style.c, the glass looks). A host's workspace,
   which keeps the site around it, is untouched. Loaded after message-mobile.css so a phone
   conversation keeps its fixed, keyboard-aware pane and only its surfaces change. */
body.jm-immersive{
  --rv-window:#ffffff;--rv-text:#1c1c1e;--rv-muted:rgba(60,60,67,.62);--rv-placeholder:rgba(60,60,67,.5);
  --rv-panel:color-mix(in srgb,var(--rv-accent) 5%,rgba(255,255,255,.41));--rv-panel-2:color-mix(in srgb,var(--rv-accent) 4%,rgba(255,255,255,.62));--rv-border:rgba(60,60,67,.16);--rv-rim:rgba(255,255,255,.9);
  --rv-control:rgba(255,255,255,.47);--rv-control-hover:rgba(255,255,255,.65);--rv-control-border:rgba(60,60,67,.18);
  --rv-input:rgba(255,255,255,.43);--rv-row-hover:rgba(60,60,67,.06);--rv-tab-active:rgba(255,255,255,.84);
  --rv-popup:rgba(250,250,250,.78);--rv-bar:rgba(28,30,40,.78);--rv-bar-text:#f5f5f7;
  --rv-accent:var(--accent-glass,#007aff);--rv-accent-hover:color-mix(in srgb,var(--rv-accent) 82%,white);--rv-accent-pressed:color-mix(in srgb,var(--rv-accent) 84%,black);--rv-accent-text:#fff;--rv-selection:color-mix(in srgb,var(--rv-accent) 18%,transparent);
  --rv-switch:#34c759;--rv-danger:#d70015;--rv-link:#0066cc;
  --rv-shadow:0 14px 34px rgba(0,0,0,.14);--rv-shadow-sm:0 6px 16px rgba(0,0,0,.1);
  /* The wallpaper is one hue, the chosen accent (as in workspace-glass.css): a faintly tinted canvas and two soft lights of that hue. */
  --rv-window:color-mix(in srgb,var(--rv-accent) 6%,#f4f6f9);--rv-wall-a:color-mix(in srgb,var(--rv-accent) 24%,#ffffff);--rv-wall-b:color-mix(in srgb,var(--rv-accent) 10%,#ffffff);
  --rv-spring:cubic-bezier(.34,1.56,.64,1);--rv-settle:cubic-bezier(.2,.8,.2,1);
  --jm-glow:color-mix(in srgb,var(--rv-accent) 22%,transparent)
}
:root[data-theme=dark] body.jm-immersive{
  --rv-window:#2a2a2e;--rv-text:#f5f5f7;--rv-muted:rgba(235,235,245,.6);--rv-placeholder:rgba(235,235,245,.47);
  --rv-panel:color-mix(in srgb,var(--rv-accent) 8%,rgba(58,58,63,.43));--rv-panel-2:color-mix(in srgb,var(--rv-accent) 6%,rgba(70,70,76,.6));--rv-border:rgba(255,255,255,.13);--rv-rim:rgba(255,255,255,.22);
  --rv-control:rgba(255,255,255,.11);--rv-control-hover:rgba(255,255,255,.18);--rv-control-border:rgba(255,255,255,.24);
  --rv-input:rgba(26,26,29,.35);--rv-row-hover:rgba(255,255,255,.08);--rv-tab-active:rgba(255,255,255,.2);
  --rv-popup:rgba(51,51,55,.75);--rv-bar:rgba(22,22,26,.74);--rv-bar-text:#f5f5f7;
  --rv-accent:var(--accent-glass,#0a84ff);--rv-selection:color-mix(in srgb,var(--rv-accent) 45%,transparent);
  --rv-switch:#30d158;--rv-danger:#ff453a;--rv-link:#6cb6ff;
  --rv-shadow:0 18px 44px rgba(0,0,0,.43);--rv-shadow-sm:0 8px 20px rgba(0,0,0,.35);
  --rv-wall-a:color-mix(in srgb,var(--rv-accent) 34%,#1d1d22);--rv-wall-b:color-mix(in srgb,var(--rv-accent) 14%,#222227);
  --jm-glow:color-mix(in srgb,var(--rv-accent) 30%,transparent)
}
@supports not (backdrop-filter:blur(1px)){
  body.jm-immersive{--rv-panel:rgba(255,255,255,.9);--rv-panel-2:rgba(255,255,255,.96);--rv-bar:rgba(28,30,40,.96);--rv-popup:rgba(250,250,250,.97)}
  :root[data-theme=dark] body.jm-immersive{--rv-panel:rgba(58,58,63,.95);--rv-panel-2:rgba(70,70,76,.97);--rv-popup:rgba(51,51,55,.97)}
}
/* ---- The canvas: Raven's window colour under two soft lights of the accent's hue (gradients, never an image) ---- */
body.jm-immersive .jm-workbench{position:relative;isolation:isolate;z-index:0;gap:12px;color:var(--rv-text)}
body.jm-immersive .jm-workbench::before{content:"";position:absolute;inset:0;z-index:-1;background:
  radial-gradient(85% 70% at 0% 0%,var(--rv-wall-a),transparent 70%),
  radial-gradient(70% 55% at 100% 100%,var(--rv-wall-b),transparent 70%),var(--rv-window)}
body.jm-immersive .jm-workbench *:focus-visible{outline:2px solid var(--rv-accent);outline-offset:2px}
/* The welcome stays at the centre as it was: the illustration, the headline, Start a conversation and the quick start, on glass. */
body.jm-immersive .jm-empty-pane{background:none}
body.jm-immersive .jm-empty-pane>h2{color:var(--rv-text)}
body.jm-immersive .jm-empty-pane>p:not(.jm-empty-safety){color:var(--rv-muted)}
body.jm-immersive .jm-quick-label{color:var(--rv-muted)}
body.jm-immersive .jm-quick-label::before,body.jm-immersive .jm-quick-label::after{background:var(--rv-border)}
body.jm-immersive .jm-chip{border:1px solid var(--rv-border);background:var(--rv-control);color:var(--rv-text);box-shadow:inset 0 1px 0 var(--rv-rim);backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3)}
body.jm-immersive .jm-chip:hover{background:var(--rv-control-hover)}
body.jm-immersive .jm-hello-bubble{box-shadow:inset 0 1px 0 var(--rv-rim),var(--rv-shadow-sm)}
body.jm-immersive .jm-hello-a{background:var(--rv-accent)}
body.jm-immersive .jm-hello-b{background:color-mix(in srgb,var(--rv-accent) 32%,white)}
body.jm-immersive .jm-hello-b b{background:color-mix(in srgb,var(--rv-accent) 70%,black)}

body.jm-immersive .jm-workbench .jm-icon,body.jm-immersive .jm-workbench .jm-text-button{color:var(--rv-muted)}
body.jm-immersive .jm-workbench .jm-icon:hover,body.jm-immersive .jm-workbench .jm-text-button:hover{background:var(--rv-control-hover);color:var(--rv-text)}
/* ---- Materials ---- (a blurred element is the containing block of its fixed descendants, such as the "+" menu
   and the gesture overlays, so the studio and the composers carry their blur on ::before) */
body.jm-immersive :is(.jm-topbar,.jm-chat-menu>div,.jx-plus-menu,.jm-quick-reply,.jm-alert-card){backdrop-filter:blur(18px) saturate(1.4);-webkit-backdrop-filter:blur(18px) saturate(1.4)}
body.jm-immersive .jm-workspace{position:relative;border:0;border-radius:0;background:transparent;box-shadow:none;overflow:visible;isolation:auto;backdrop-filter:none;-webkit-backdrop-filter:none;gap:12px}
body.jm-immersive .jm-workspace::before{display:none}
body.jm-immersive .jm-workspace>*{position:relative;z-index:1}
/* The frosted sidebar: Raven's rounded panel, a rim of light at its top edge. */
body.jm-immersive .jm-sidebar{position:relative;border:1px solid var(--rv-border);border-right-color:var(--rv-border);border-radius:18px;background:var(--rv-panel);box-shadow:inset 0 1px 0 var(--rv-rim),var(--rv-shadow);padding:18px 14px 12px}
body.jm-immersive .jm-sidebar::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;backdrop-filter:blur(18px) saturate(1.4);-webkit-backdrop-filter:blur(18px) saturate(1.4)}
body.jm-immersive .jm-stage{background:transparent;border-radius:18px}
body.jm-immersive .jm-list-label{border-top-color:var(--rv-border);color:var(--rv-muted)}
/* ---- The toolbar at the top: a dark tinted capsule in both looks; an item under the pointer lifts, the pressed one is a solid blue pill ---- */
body.jm-immersive .jm-topbar{position:relative;z-index:30;width:max-content;max-width:100%;margin:0 auto;padding:5px;gap:2px;border:1px solid rgba(255,255,255,.14);border-radius:999px;background:var(--rv-bar);color:var(--rv-bar-text);box-shadow:inset 0 1px 0 rgba(255,255,255,.18),var(--rv-shadow);will-change:transform}
body.jm-immersive .jm-topbar>*{position:relative;z-index:1}
body.jm-immersive .jm-workbench .jm-topbar :is(a,button){width:42px;height:42px;min-width:42px;min-height:42px;border-radius:999px;color:var(--rv-bar-text);background:transparent;transition:background .18s,color .18s,transform .35s var(--rv-spring)}
body.jm-immersive .jm-workbench .jm-topbar :is(a,button):hover{background:rgba(255,255,255,.14);color:#fff}
body.jm-immersive .jm-workbench .jm-topbar :is(a,button):active,body.jm-immersive .jm-workbench .jm-topbar :is(a,button)[aria-current=page]{background:var(--rv-accent);color:#fff;transform:none}
body.jm-immersive .jm-workbench .jm-topbar :is(a,button):active{transform:scale(.92)}
body.jm-immersive .jm-topbar a svg,body.jm-immersive .jm-topbar button svg{width:21px;height:21px}
body.jm-immersive .jm-topbar a span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
body.jm-immersive .jm-topbar a{position:relative}
body.jm-immersive .jm-topbar a>.notification-badge{position:absolute;top:1px;right:1px;margin:0;min-width:1.05rem;height:1.05rem;font-size:.6rem;background:var(--rv-danger)}
/* The chevron: back to where you were; held for a second, home to the dashboard (a ring fills while it is held). */
body.jm-immersive .jm-workbench .jm-topbar .jm-top-back{margin-right:4px;border:0;background:rgba(255,255,255,.1);-webkit-touch-callout:none;user-select:none;-webkit-user-select:none;overflow:visible}
body.jm-immersive .jm-workbench .jm-topbar .jm-top-back::after{content:"";position:absolute;inset:-3px;border-radius:50%;border:2px solid transparent;border-top-color:var(--rv-accent);opacity:0;pointer-events:none;transform:rotate(0deg)}
body.jm-immersive .jm-workbench .jm-topbar .jm-top-back.is-holding{background:rgba(255,255,255,.2)}
body.jm-immersive .jm-workbench .jm-topbar .jm-top-back.is-holding::after{opacity:1;animation:jg-hold 1s linear forwards}
@keyframes jg-hold{from{transform:rotate(0deg);border-color:var(--rv-accent) transparent transparent transparent}to{transform:rotate(360deg);border-color:var(--rv-accent)}}
body.jm-immersive .jm-topbar .jm-live-state{font-size:0;width:9px;height:9px;min-width:9px;margin:0 8px 0 auto;border-radius:50%;background:var(--rv-switch);box-shadow:0 0 0 3px rgba(48,209,88,.2)}
body.jm-immersive .jm-topbar .jm-live-state[data-state=retry]{background:var(--rv-danger);box-shadow:0 0 0 3px rgba(255,69,58,.25)}
/* ---- Inside the sidebar: a pill search, segmented tabs, plain rows (the open one selected in blue) ---- */
body.jm-immersive .jm-filter-search{background:var(--rv-input);border:1px solid var(--rv-control-border);border-radius:999px;padding:0 14px;box-shadow:inset 0 1px 0 rgba(255,255,255,.25);color:var(--rv-muted)}
body.jm-immersive .jm-filter-search:focus-within{border-color:var(--rv-accent);box-shadow:0 0 0 3px var(--jm-glow)}
body.jm-immersive #main-content .jm-workbench .jm-filter-search input{color:var(--rv-text)}
body.jm-immersive #main-content .jm-workbench .jm-filter-search input::placeholder{color:var(--rv-placeholder)}
body.jm-immersive .jm-filters{background:var(--rv-control);border:1px solid var(--rv-control-border);border-radius:999px;padding:3px}
body.jm-immersive .jm-filters button{border-radius:999px;min-height:28px;padding:3px 13px;color:var(--rv-muted)}
body.jm-immersive .jm-filters button:hover{color:var(--rv-text)}
body.jm-immersive .jm-filters button[aria-pressed=true]{background:var(--rv-tab-active);color:var(--rv-text);box-shadow:0 1px 3px rgba(0,0,0,.12)}
body.jm-immersive .jm-workbench .jm-compose-button{border-radius:999px;border:1px solid var(--rv-control-border);background:var(--rv-control);color:var(--rv-text);box-shadow:inset 0 1px 0 rgba(255,255,255,.25)}
body.jm-immersive .jm-workbench .jm-compose-button:hover{background:var(--rv-control-hover);border-color:var(--rv-accent);color:var(--rv-accent);box-shadow:none;transform:none}
body.jm-immersive .jm-workbench .jm-row{margin:2px 0;padding:10px 10px;border-radius:12px;color:var(--rv-text);transition:background .15s,transform .3s var(--rv-spring)}
body.jm-immersive .jm-workbench .jm-row::before{display:none}
body.jm-immersive .jm-workbench .jm-row:hover{background:var(--rv-row-hover);transform:none}
body.jm-immersive .jm-workbench .jm-row:hover strong{color:var(--rv-text)}
body.jm-immersive .jm-workbench .jm-row[aria-current=page]{background:var(--rv-selection)}
body.jm-immersive .jm-workbench .jm-row[aria-current=page] strong{color:var(--rv-text)}
body.jm-immersive .jm-row-copy small,body.jm-immersive .jm-row-when{color:var(--rv-muted)}
body.jm-immersive .jm-studio.is-fresh .jm-row{animation:jg-drop .5s var(--rv-spring) both;animation-delay:calc(var(--i,0)*40ms)}
@keyframes jg-drop{from{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:none}}
body.jm-immersive .jm-count{background:var(--rv-accent);color:#fff;box-shadow:0 0 0 2px var(--rv-panel-2)}
body.jm-immersive .jm-avatar{background:var(--rv-control-hover);color:var(--rv-text);box-shadow:inset 0 1px 0 rgba(255,255,255,.3)}
body.jm-immersive .jm-list-empty,body.jm-immersive .jm-loaded-note{color:var(--rv-muted)}
/* ---- The welcome: a greeting in a light display weight, then colour cards with glass chips (Raven's library) ---- */
body.jm-immersive .jm-workbench .jm-empty-safety{margin:22px 0 0;color:var(--rv-muted)}
body.jm-immersive .jm-workbench .jm-empty-safety:hover{color:var(--rv-link)}
/* ---- A conversation: a plain heading row, grey and blue bubbles, the composer a clear player bar floating over them ---- */
body.jm-immersive .jm-chat-heading{position:relative;z-index:6;margin:0;padding:12px 16px;background:transparent;border-bottom:1px solid var(--rv-border);color:var(--rv-text)}
body.jm-immersive .jm-chat-person p{color:var(--rv-muted)}
body.jm-immersive .jm-chat-heading .jm-icon:hover,body.jm-immersive .jm-chat-menu>summary:hover{background:var(--rv-control-hover)}
body.jm-immersive .jm-chat-menu>summary{color:var(--rv-muted)}
body.jm-immersive .jm-chat-menu>div{border:1px solid var(--rv-border);border-radius:14px;background:var(--rv-popup);box-shadow:var(--rv-shadow);color:var(--rv-text)}
body.jm-immersive .jm-chat-menu :is(a,button){color:var(--rv-text)}
body.jm-immersive .jm-chat-menu :is(a,button):hover{background:var(--rv-control)}
body.jm-immersive .jm-chat-menu [data-delete-chat]{color:var(--rv-danger)}
body.jm-immersive .jm-request-notice{margin:10px 16px 0;border-radius:14px;background:var(--rv-control);border:1px solid var(--rv-border);color:var(--rv-text)}
body.jm-immersive .jm-workbench .jm-history{padding-bottom:92px}
body.jm-immersive .jm-day{padding:3px 10px;border-radius:999px;background:var(--rv-control);color:var(--rv-muted)}
body.jm-immersive .jm-workbench .jm-bubble{background:var(--rv-control-hover);color:var(--rv-text);border:0;border-radius:16px 16px 16px 5px;box-shadow:none}
body.jm-immersive .jm-workbench .jm-bubble.mine{background:var(--rv-accent);color:#fff;border-radius:16px 16px 5px 16px}
body.jm-immersive .jm-workbench .jm-bubble.mine :is(.jm-message-meta,time,.jm-lock,small){color:rgba(255,255,255,.82)}
body.jm-immersive .jm-workbench .jm-bubble.mine .jm-reaction-chip{background:rgba(255,255,255,.22)}
body.jm-immersive .jm-workbench .jm-message-meta,body.jm-immersive .jm-workbench .jm-bubble time{color:var(--rv-muted)}
body.jm-immersive .jm-workbench .jm-compose{position:relative;z-index:5;margin:-72px 16px 14px}
body.jm-immersive .jm-compose-box,body.jm-immersive .jc-embedded .jc-compose-box{position:relative;border:1px solid var(--rv-border);border-radius:999px;background:var(--rv-panel-2);box-shadow:inset 0 1px 0 var(--rv-rim),var(--rv-shadow);padding:5px 6px 5px 10px;backdrop-filter:none;-webkit-backdrop-filter:none}
body.jm-immersive .jm-compose-box::before,body.jm-immersive .jc-embedded .jc-compose-box::before{content:"";position:absolute;inset:0;z-index:0;border-radius:inherit;pointer-events:none;backdrop-filter:blur(22px) saturate(1.4);-webkit-backdrop-filter:blur(22px) saturate(1.4)}
body.jm-immersive .jm-compose-box>*,body.jm-immersive .jc-embedded .jc-compose-box>*{position:relative;z-index:1}
body.jm-immersive .jm-compose-box:focus-within,body.jm-immersive .jc-embedded .jc-compose-box:focus-within{border-color:var(--rv-accent);box-shadow:inset 0 1px 0 var(--rv-rim),0 0 0 3px var(--jm-glow),var(--rv-shadow)}
body.jm-immersive #main-content .jm-workbench .jm-compose-box textarea,body.jm-immersive #main-content .jm-workbench .jc-compose-box textarea{color:var(--rv-text)}
body.jm-immersive #main-content .jm-workbench :is(.jm-compose-box,.jc-compose-box) textarea::placeholder{color:var(--rv-placeholder)}
body.jm-immersive #main-content .jm-workbench :is(.jm-compose-box,.jc-compose-box) .jt-tools select{color:var(--rv-text)}
body.jm-immersive .jm-compose-box:has(.jx-location-bar,.jm-reply-bar,.jm-edit-bar,.jt-keyboard),body.jm-immersive .jc-embedded .jc-compose-box:has(.jx-location-bar,.jt-keyboard,.jc-poll-form){border-radius:22px}
body.jm-immersive .jx-location-bar{background:var(--rv-control);border:1px solid var(--rv-border);border-radius:14px;color:var(--rv-text)}
body.jm-immersive .jx-plus-menu{border:1px solid var(--rv-border);border-radius:14px;background:var(--rv-popup);box-shadow:var(--rv-shadow);color:var(--rv-text)}
body.jm-immersive .jx-plus-item{color:var(--rv-text)}body.jm-immersive .jx-plus-item:hover{background:var(--rv-control)}
/* Buttons: the primary ones solid blue pills that squash on press; the quiet ones translucent controls. */
body.jm-immersive .jm-workbench :is(.button,.jm-send-button,.jm-new-button,.jm-start){border-radius:999px;background:var(--rv-accent);color:var(--rv-accent-text);box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 6px 16px color-mix(in srgb,var(--rv-accent) 30%,transparent);transition:background .15s,transform .35s var(--rv-spring),box-shadow .2s}
body.jm-immersive .jm-workbench :is(.button,.jm-send-button,.jm-new-button,.jm-start):hover{background:var(--rv-accent-hover);transform:none;box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 8px 20px color-mix(in srgb,var(--rv-accent) 35%,transparent)}
body.jm-immersive .jm-workbench :is(.button,.jm-send-button,.jm-new-button,.jm-start):active{background:var(--rv-accent-pressed);transform:scale(.95)}
body.jm-immersive .jm-workbench .button.button-ghost{background:var(--rv-control);color:var(--rv-text);box-shadow:none}
body.jm-immersive #main-content .jm-workbench .jm-compose-box .jm-compose-actions .jm-send-button{box-shadow:inset 0 1px 0 rgba(255,255,255,.3)}
/* The alert deck (unread, at the top of the stage) and its quick reply. */
body.jm-immersive .jm-alert-card{border:1px solid var(--rv-border);border-radius:14px;background:var(--rv-panel-2);color:var(--rv-text)}
body.jm-immersive .jm-alert-more{background:transparent;color:var(--rv-muted)}
body.jm-immersive .jm-workbench .jm-stack-toggle,body.jm-immersive .jm-workbench .jm-alert-open{color:var(--rv-text)}
body.jm-immersive .jm-quick-reply{border:1px solid var(--rv-border);border-radius:14px;background:var(--rv-popup);color:var(--rv-text)}
/* Saathi Circle chats embedded in the stage: the same bubbles, the same floating bar. */
body.jm-immersive .jc-embedded .jc-panel,body.jm-immersive .jm-community-pane{background:transparent;color:var(--rv-text)}
body.jm-immersive .jc-embedded .jc-message{background:var(--rv-control-hover);color:var(--rv-text);border:0;border-radius:16px 16px 16px 5px}
body.jm-immersive .jc-embedded .jc-message.mine{background:var(--rv-accent);color:#fff;border-radius:16px 16px 5px 16px}
body.jm-immersive .jc-embedded .jc-message.mine :is(time,.jc-stamp,small){color:rgba(255,255,255,.82)}
body.jm-immersive .jc-embedded .jc-log{padding-bottom:92px}
body.jm-immersive .jc-embedded .jc-composer{position:relative;z-index:5;margin-top:-72px}
/* With a poll or draft form open in the panel above, the composer stops floating, so the form's Cancel and Post stay reachable. */
body.jm-immersive .jc-embedded.jc-panel-form .jc-composer{margin-top:0}
body.jm-immersive .jc-embedded.jc-panel-form .jc-log{padding-bottom:16px}
body.jm-immersive .jc-embedded .jm-chat-heading{margin:0}
/* ---- The panes (a new message, preferences): forms on glass, switches in Raven's green ---- */
body.jm-immersive .jm-form-pane{background:transparent;color:var(--rv-text)}
body.jm-immersive .jm-pane-heading h2{font-weight:400;letter-spacing:-.02em}
body.jm-immersive .jm-pane-heading .eyebrow{color:var(--rv-accent)}
body.jm-immersive .jm-form-pane :is(small,.jm-help,p){color:var(--rv-muted)}
body.jm-immersive #main-content .jm-workbench .jm-form-pane :is(input:not([type=checkbox]),select,textarea){background:var(--rv-input);border:1px solid var(--rv-control-border);border-radius:12px;color:var(--rv-text);box-shadow:inset 0 1px 0 rgba(255,255,255,.2)}
body.jm-immersive #main-content .jm-workbench .jm-form-pane :is(input:not([type=checkbox]),select,textarea):focus{border-color:var(--rv-accent);box-shadow:0 0 0 3px var(--jm-glow)}
body.jm-immersive .jm-form-pane :is(.jm-safety-copy,.jm-push-settings,.jm-e2e-panel,.jm-person-result,.jm-selected-person){background:var(--rv-panel);border:1px solid var(--rv-border);border-radius:16px;box-shadow:inset 0 1px 0 var(--rv-rim);color:var(--rv-text)}
body.jm-immersive .jm-form-pane .jm-safety-copy,body.jm-immersive .jm-form-pane .jm-push-settings{padding:14px 18px}
body.jm-immersive .jm-form-pane .jm-safety-copy{margin-top:14px}
body.jm-immersive .jm-form-pane .jm-safety-copy a,body.jm-immersive .jm-form-pane a{color:var(--rv-link)}
body.jm-immersive .jm-person-result:hover{background:var(--rv-panel-2)}
body.jm-immersive .jm-workbench .jm-receipt-setting>input[type=checkbox]{appearance:none;-webkit-appearance:none;width:46px;height:28px;min-width:46px;margin:0 2px 0 0;border:0;border-radius:999px;background:var(--rv-control-hover);box-shadow:inset 0 1px 2px rgba(0,0,0,.18);position:relative;cursor:pointer;transition:background .2s;flex:none}
body.jm-immersive .jm-workbench .jm-receipt-setting>input[type=checkbox]::before{content:"";position:absolute;top:2px;left:2px;width:24px;height:24px;border-radius:50%;background:#fff;box-shadow:0 2px 5px rgba(0,0,0,.25);transition:transform .3s var(--rv-spring)}
body.jm-immersive .jm-workbench .jm-receipt-setting>input[type=checkbox]:checked{background:var(--rv-switch)}
body.jm-immersive .jm-workbench .jm-receipt-setting>input[type=checkbox]:checked::before{transform:translateX(18px)}
body.jm-immersive .jm-workbench .jm-receipt-setting{align-items:center}
/* ---- Phones: the toolbar spans the top; the inbox panel runs to the bottom; a conversation keeps its fixed frame ---- */
@media(max-width:900px){
  body.jm-immersive .jm-workbench{gap:10px}
  body.jm-immersive .jm-topbar{width:100%;justify-content:space-between}
  body.jm-immersive .jm-sidebar{border-radius:18px}
  body.jm-immersive .jm-workbench[data-pane=detail] .jm-workspace{background:var(--rv-window)}
  body.jm-immersive .jm-chat-heading{padding:6px 8px}
  body.jm-immersive .jm-workbench .jm-compose{margin:-72px 8px 8px}
  body.jm-immersive .jm-request-notice{margin:8px 8px 0}
  body.jm-immersive .jm-empty-pane{padding:12px 16px 24px}
}
@media(prefers-reduced-motion:reduce){
  body.jm-immersive .jm-workbench :is(.jm-row,.button,.jm-send-button,.jm-topbar a,.jm-topbar button,.jm-compose-button){transition:none!important;animation:none!important;transform:none!important}
  body.jm-immersive .jm-workbench .jm-topbar .jm-top-back.is-holding::after{animation:none;opacity:1}
}
/* The site's dark theme paints these surfaces with :root[data-theme=dark] rules, which outrank the ones above; the same weight here. */
:root[data-theme=dark] body.jm-immersive .jm-workspace{background:transparent;box-shadow:none}
:root[data-theme=dark] body.jm-immersive .jm-sidebar{background:var(--rv-panel)}
:root[data-theme=dark] body.jm-immersive .jm-stage{background:transparent}
:root[data-theme=dark] body.jm-immersive .jm-filter-search{background:var(--rv-input)}
:root[data-theme=dark] body.jm-immersive .jm-filters{background:var(--rv-control)}
:root[data-theme=dark] body.jm-immersive .jm-workbench .jm-compose-button{background:var(--rv-control)}
:root[data-theme=dark] body.jm-immersive .jm-workbench .jm-compose-button:hover{background:var(--rv-control-hover)}
:root[data-theme=dark] body.jm-immersive .jm-workbench .jm-row:hover{background:var(--rv-row-hover)}
:root[data-theme=dark] body.jm-immersive .jm-studio{--jm-glow:color-mix(in srgb,var(--rv-accent) 30%,transparent)}
:root[data-theme=dark] body.jm-immersive .jm-hello-avatar{box-shadow:none}
body.jm-immersive .jm-avatar{border:1px solid var(--rv-border)}
body.jm-immersive .jm-form-pane .accent-picker{margin:0 0 14px;padding:12px 8px 6px;border:1px solid var(--rv-border);border-top-width:1px;border-radius:16px;background:var(--rv-panel);box-shadow:inset 0 1px 0 var(--rv-rim)}
body.jm-immersive .jm-form-pane .accent-picker>[data-accent-title]{color:var(--rv-text)}
body.jm-immersive .accent-swatch{box-shadow:inset 0 0 0 2px rgba(255,255,255,.6)}
body.jm-immersive .accent-swatch[aria-pressed=true]{border-color:var(--rv-text)}