/* Messenger-scoped tokens: do not recolor the rest of the ELSHWORK website. */
:is(.messages-page, .messenger-contact-picker, .elsh-status-modal) {
  color-scheme: dark;
  --canvas: #0b1119;
  --panel: #121c28;
  --panel2: #1b2939;
  --text: #f3f6fa;
  --muted: #aab6c5;
  --gold: #d8b76a;
  --blue: #70b8ff;
  --line: #354658;
  --focus: #d8b76a;
  --incoming: #17222f;
  --outgoing: #183248;
  --selected: #203348;
  --control-radius: 12px;
  --message-radius: 16px;
  --press-duration: 100ms;
  color: var(--text);
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 1rem;
  line-height: 1.375;
}
html[data-theme="light"] :is(.messages-page, .messenger-contact-picker, .elsh-status-modal) {
  color-scheme: light;
  --canvas: #f4f6fa;
  --panel: #ffffff;
  --panel2: #eaf0f6;
  --text: #182331;
  --muted: #4c5c6f;
  --gold: #785715;
  --blue: #185eaa;
  --line: #b8c5d3;
  --focus: #785715;
  --incoming: #ffffff;
  --outgoing: #dceaf8;
  --selected: #dae7f5;
}
.messages-page :is(button, input, textarea, summary),
.messenger-contact-picker :is(button, input) {
  font-family: inherit;
  min-height: 48px;
  box-sizing: border-box;
}
.messages-page :is(button, summary), .messenger-contact-picker button {
  transition: background-color var(--press-duration), color var(--press-duration);
}
.messages-page :is(button, input, textarea, summary, a):focus-visible,
.messenger-contact-picker :is(button, input, a):focus-visible {
  outline: 2px solid var(--focus);
  outline-offset: -2px;
}
.messages-page .messages-layout.polished > aside > button {
  min-height: 72px;
  grid-template-columns: 52px minmax(0, 1fr) auto;
  padding: 8px 16px;
}
.messages-page .messages-layout.polished > aside > button > .message-avatar {
  width: 52px; height: 52px; min-width: 52px;
  flex-shrink: 0; aspect-ratio: 1; border-radius: 50%;
}
.messages-page .messages-layout.polished aside > button b {
  font-size: 1rem; line-height: 1.3125; font-weight: 500;
}
.messages-page .messages-layout.polished aside > button small {
  font-size: .8125rem; line-height: 1.385;
}
.messages-page .messages-layout.polished aside > button.active { background: var(--selected); }
.messages-page .message-list-tail { flex-shrink: 0; }
.messages-page .message-list-tail time { font-size: .8125rem; }
.messages-page .messenger-page-title { font-size: 1.375rem; line-height: 1.273; font-weight: 600; }
.messages-page .chat-head { min-height: 56px; flex-wrap: wrap; gap: 8px; }
.messages-page :is(.chat-head, .messages-sidebar-head, .messenger-chat-menu > div) {
  background: var(--panel); backdrop-filter: none; box-shadow: none;
}
.messages-page .messenger-chat-menu summary { min-width: 48px; text-align: center; }
.messages-page .messenger-chat-menu > div { max-width: min(320px, 85vw); }
.messages-page .messenger-chat-menu button { white-space: normal; overflow-wrap: anywhere; }
.messages-page .chat-list > div { border-radius: var(--message-radius); }
/* Explicit component surfaces prevent legacy platform styles leaking into chat. */
.messages-page .messages-layout.polished { background:var(--panel)!important; border-radius:0!important; box-shadow:none; }
.messages-page .chat-list { background:var(--canvas); min-height:0; padding:16px; }
.messages-page .chat-list > div { background:var(--incoming); color:var(--text); border:0; padding:10px 12px; width:fit-content; max-width:min(80%,680px); }
.messages-page .chat-list > div.mine { background:var(--outgoing); }
.messages-page .chat-list :is(p,pre) { font:400 1rem/1.4 system-ui,sans-serif; color:var(--text); overflow-wrap:anywhere; white-space:pre-wrap; margin:4px 0; }
.messages-page .chat-list :is(small,time,.message-meta) { font:400 .8125rem/1.385 system-ui,sans-serif; color:var(--muted); }
.messages-page .chat-head > img { width:40px; height:40px; min-width:40px; border-radius:50%; object-fit:cover; }
.messages-page .chat-head > div { min-width:0; }
.messages-page .chat-head :is(b,strong) { font:600 1rem/1.3125 system-ui,sans-serif; }
.messages-page .chat-head small { font:400 .8125rem/1.385 system-ui,sans-serif; color:var(--muted); }
.messages-page .messages-sidebar-head label { display:flex; align-items:center; gap:8px; padding:0 12px; background:var(--panel2); }
.messages-page .messages-sidebar-head input { flex:1; min-width:0; width:100%; margin:0; padding:10px 0; border:0; background:transparent; color:var(--text); font-size:1rem; }
.messages-page input::placeholder { color:var(--muted); opacity:1; }
.messages-page .chat-form { flex-shrink:0; gap:8px; padding:12px; background:var(--panel); border-top:1px solid var(--line); }
.messages-page .chat-form input { min-width:0; flex:1; border:0; border-radius:12px; padding:12px; background:var(--panel2); color:var(--text); font-size:1rem; }
.messages-page .chat-form > button { background:var(--gold); color:var(--canvas); border:0; border-radius:12px; font-size:.875rem; }
html[data-theme="light"] .messages-page .chat-form > button { color:#fff; }
.messages-page .chat-form :is(button,label), .messages-page .chat-head button { min-width:48px; min-height:48px; flex-shrink:0; }
.messages-page .chat-list :is(button,summary) { min-width:48px; }
.messages-page .messenger-new-chat { width:56px; height:56px; background:var(--gold); color:var(--canvas); box-shadow:none; }
html[data-theme="light"] .messages-page .messenger-new-chat { color:#fff; }
@media(max-width:760px) {
 .messages-page { display:flex!important; flex-direction:column; height:100dvh!important; min-height:0!important; background:var(--canvas); }
 .messages-page > .messenger-page-title { flex:none; margin:0; padding:8px 16px; }
 .messages-page .messages-layout.polished { flex:1; height:auto!important; min-height:0!important; }
 .messages-page .messages-layout.polished > section { height:100%; min-height:0; }
 .messages-page .chat-list { padding:12px 8px; }
 .messages-page .chat-list > div { max-width:90%; }
 .messages-page .chat-head { padding:8px; }
 .messages-page .chat-form { padding:8px; flex-wrap:wrap; }
 .messages-page .chat-form input { flex-basis:calc(100% - 128px); }
 .messages-page .chat-form > button { flex:1; }
}
.messages-page .messages-layout.polished .chat-head { background:var(--panel)!important; min-height:56px; }
.messages-page .messages-layout.polished .chat-head img.message-avatar { width:40px!important; height:40px!important; min-width:40px!important; }
.messages-page .messages-layout.polished .chat-head button { background:var(--panel2); box-shadow:none; transform:none; }
.messages-page .messages-layout.polished .chat-form { background:var(--panel)!important; }
.messages-page { background:var(--canvas); }
.messages-page .messenger-page-title { color:var(--text); background:var(--canvas)!important; }
.messages-page .messages-layout.polished input { color:var(--text)!important; background:var(--panel2)!important; box-shadow:none!important; border-color:var(--line)!important; }
.messages-page .messages-layout.polished .messages-sidebar-head input { background:transparent!important; }
.messages-page .messages-layout.polished :is(.chat-head button,.messenger-chat-menu summary,.elsh-status-avatar,.elsh-status-name) { color:var(--text)!important; }
.messages-page .messages-layout.polished .chat-list { background:var(--canvas)!important; background-image:none!important; }
.messages-page .messages-layout.polished .chat-list :is(small,time,.message-meta) { color:var(--muted)!important; }
.messages-page .messages-layout.polished .chat-form > div > button,
.messages-page .messages-layout.polished .chat-form > label { background:var(--panel2); color:var(--text); box-shadow:none; }
body:has(.messages-page) .skip-link:not(:focus) { top:-100vh; }
.messages-page .chat-form button img[src*="elshwork-mark"] { background:#121c28; border-radius:50%; padding:3px; object-fit:contain; }
.messages-page .messages-layout.polished .chat-form > button { background:var(--gold)!important; color:var(--canvas)!important; }
.messages-page .messages-layout.polished .chat-form :is(button,.clip-button) { min-width:48px!important; width:48px; min-height:48px!important; flex:0 0 48px!important; }
.messages-page .messages-layout.polished .chat-form .composer-tools { flex:0 0 auto!important; }
.messages-page .messages-layout.polished .chat-form > input { flex:1 1 0!important; width:0!important; }
.messages-page .chat-form .chat-send > span { display:none!important; }
.messages-page .chat-form .chat-send > svg { display:block!important; width:24px; height:24px; flex:none; }
html[data-theme="light"] .messages-page .messages-layout.polished .chat-form > button { color:#fff!important; }
.overlay:has(> .elsh-status-modal) { backdrop-filter:none!important; background:rgba(5,8,12,.88)!important; }
.elsh-status-modal .modal-top button { min-width:48px; min-height:48px; }
.overlay > .elsh-status-modal { background:var(--panel); color:var(--text); box-shadow:none; border-color:var(--line); font:400 1rem/1.375 system-ui,sans-serif; }
.elsh-status-modal :is(.elsh-status-preview,.elsh-status-actions) { background:var(--canvas); }
.elsh-status-modal :is(.modal-top b,legend) { color:var(--text); }
.elsh-status-modal legend { font-size:1rem; }
.elsh-status-modal .modal-top b { font-size:1.375rem; }
.elsh-status-modal :is(.elsh-status-heading>span,.elsh-status-caption>span,.elsh-status-caption small,.elsh-status-author small,.elsh-status-audience small,.elsh-status-selection>small,.elsh-status-privacy,.elsh-status-discard) { color:var(--muted); font-size:.8125rem; }
.elsh-status-modal :is(.elsh-status-author strong,.elsh-status-audience strong) { font-size:1rem; }
.elsh-status-modal :is(textarea,input:not([type=radio]):not([type=checkbox])) { background:var(--panel2)!important; color:var(--text)!important; border-color:var(--line)!important; min-height:48px; font-size:1rem; }
.elsh-status-modal .elsh-status-selection>label { color:var(--muted); font-size:.8125rem; }
.elsh-status-modal :is(.elsh-status-audience-icon,.elsh-status-author-icon,.modal-top button) { color:var(--text); background:var(--panel2); }
.elsh-status-modal .elsh-status-audience:has(input:checked) { background:var(--selected)!important; border-color:var(--gold)!important; }
.elsh-status-modal input:is([type=radio],[type=checkbox]) { accent-color:var(--gold); }
.elsh-status-modal button { min-height:48px; min-width:48px; font-size:.875rem; }
.elsh-status-modal .elsh-status-publish { background:var(--gold); color:var(--canvas); }
html[data-theme="light"] .elsh-status-modal .elsh-status-publish { color:#fff; }
.elsh-status-modal :is(button,input,textarea):focus-visible { outline:2px solid var(--focus); outline-offset:2px; }
.elsh-status-modal :is(.elsh-status-heading,.elsh-status-actions) { border-color:var(--line); }
.elsh-status-modal .elsh-status-author strong { overflow-wrap:anywhere; }
@media (prefers-reduced-motion: reduce) {
  .messages-page *, .messenger-contact-picker * { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
html[data-motion="reduced"] :is(.messages-page, .messenger-contact-picker) * {
  animation: none !important; transition: none !important; scroll-behavior: auto !important;
}