/* One widget, one renderer. Native dialog supplies focus containment and Escape. */
#mh-ai-root, #mh-ai-root * { box-sizing:border-box; }
#mh-ai-root { position:fixed; right:max(18px,env(safe-area-inset-right)); bottom:max(18px,env(safe-area-inset-bottom)); z-index:1100; font-family:inherit; color:#171717; line-height:1.5; }
#mh-ai-root button, #mh-ai-root textarea, #mh-ai-root a { font-family:inherit; }
#mh-ai-root button { cursor:pointer; }
#mh-ai-root button:disabled { cursor:wait; opacity:.5; }
#mh-ai-root :focus-visible { outline:2px solid #77542b; outline-offset:3px; }
#mh-ai-root .mh-ai-launcher { display:flex; align-items:center; gap:10px; padding:10px 18px 10px 10px; border:1px solid #ddd9d2; border-radius:20px; background:#fff; color:#171717; box-shadow:0 8px 32px #0002; }
#mh-ai-root .mh-ai-badge { display:grid; place-items:center; width:40px; height:40px; border-radius:13px; background:#171717; color:#fff; font-size:16px; letter-spacing:.04em; }
#mh-ai-root .mh-ai-launcher-copy { display:flex; flex-direction:column; text-align:left; }
#mh-ai-root .mh-ai-launcher-copy strong { font-size:14px; }
#mh-ai-root .mh-ai-launcher-copy small { font-size:11px; color:#68625b; }
#mh-ai-root .mh-ai-panel { position:fixed; inset:auto max(18px,env(safe-area-inset-right)) 18px auto; margin:0; padding:0; width:min(420px,calc(100vw - 36px)); height:min(700px,calc(var(--mh-ai-height,100dvh) - 110px)); max-width:none; max-height:none; border:1px solid #dedbd5; border-radius:24px; background:#fff; color:#171717; overflow:hidden; box-shadow:0 20px 65px #0003; }
#mh-ai-root .mh-ai-panel[open] { display:flex; flex-direction:column; }
#mh-ai-root .mh-ai-panel::backdrop { background:#0003; }
#mh-ai-root .mh-ai-header { display:flex; align-items:center; justify-content:space-between; gap:10px; flex-shrink:0; padding:18px; border-bottom:1px solid #e8e5e0; }
#mh-ai-root .mh-ai-brand { min-width:0; display:flex; align-items:center; gap:12px; }
#mh-ai-root .mh-ai-logo { display:block; width:62px; height:38px; object-fit:contain; flex-shrink:0; }
#mh-ai-root .mh-ai-title { display:block; font-size:16px; }
#mh-ai-root .mh-ai-subtitle { display:block; color:#76716b; font-size:11px; overflow-wrap:anywhere; }
#mh-ai-root .mh-ai-actions { display:flex; flex-shrink:0; gap:4px; }
#mh-ai-root .mh-ai-icon-button { border:0; border-radius:50%; background:#f5f4f1; color:#222; font-size:23px; width:44px; height:44px; }
#mh-ai-root .mh-ai-status { flex-shrink:0; margin:0; padding:8px 20px; color:#706a62; background:#f8f7f4; font-size:11px; }
#mh-ai-root .mh-ai-messages { flex:1 1 0; min-height:0; padding:18px 16px; overflow:auto; overscroll-behavior:contain; scrollbar-width:thin; }
#mh-ai-root .mh-ai-message { display:flex; flex-direction:column; align-items:flex-start; gap:8px; margin-bottom:14px; }
#mh-ai-root .mh-ai-bubble { max-width:94%; padding:12px 14px; border-radius:16px 16px 16px 4px; background:#f5f4f1; color:#222; font-size:14px; line-height:1.65; overflow-wrap:anywhere; }
#mh-ai-root .mh-ai-message-user { align-items:flex-end; }
#mh-ai-root .mh-ai-message-user .mh-ai-bubble { white-space:pre-wrap; border-radius:16px 16px 4px 16px; background:#242321; color:#fff; }
#mh-ai-root .mh-ai-typing { color:#777; }
#mh-ai-root .mh-ai-rich-paragraph { margin:0 0 10px; line-height:inherit; }
#mh-ai-root .mh-ai-rich-paragraph:last-child { margin-bottom:0; }
#mh-ai-root .mh-ai-rich-section { margin:12px 0 6px; font-weight:700; }
#mh-ai-root .mh-ai-rich-list { list-style:disc; padding-left:18px; margin:6px 0; }
#mh-ai-root .mh-ai-rich-item { margin-bottom:7px; }
#mh-ai-root .mh-ai-rich-item-title { font-weight:700; }
#mh-ai-root .mh-ai-rich-sublist { list-style:circle; padding-left:18px; margin:5px 0; }
#mh-ai-root .mh-ai-sources { display:flex; flex-wrap:wrap; gap:6px; max-width:100%; }
#mh-ai-root .mh-ai-link { display:inline; color:#594125; text-decoration:underline; text-underline-offset:3px; overflow-wrap:anywhere; }
#mh-ai-root .mh-ai-sources .mh-ai-link { display:inline-flex; align-items:center; min-height:36px; max-width:100%; border:1px solid #e1dcd4; border-radius:10px; padding:7px 10px; font-size:12px; text-decoration:none; }
#mh-ai-root .mh-ai-quick { display:flex; gap:7px; flex-shrink:0; overflow-x:auto; padding:10px 14px; border-top:1px solid #ece9e4; scrollbar-width:thin; }
#mh-ai-root .mh-ai-quick-button { flex:0 0 auto; min-height:40px; padding:8px 12px; border:1px solid #e0dbd3; border-radius:20px; background:#fff; color:#34302c; font-size:12px; }
#mh-ai-root .mh-ai-footer { flex-shrink:0; margin:0; padding:10px 14px max(14px,env(safe-area-inset-bottom)); border-top:1px solid #ece9e4; }
#mh-ai-root .mh-ai-input-wrap { display:flex; align-items:flex-end; gap:8px; padding:5px 5px 5px 12px; border:1px solid #39352f; border-radius:16px; }
#mh-ai-root .mh-ai-input { width:100%; min-width:0; min-height:44px; max-height:104px; padding:10px 0; border:0; background:transparent; color:#222; font-size:16px; line-height:1.4; resize:none; }
#mh-ai-root .mh-ai-send { flex:0 0 44px; width:44px; height:44px; border:0; border-radius:12px; background:#242321; color:#fff; font-size:24px; }
body.ai-open { overflow:hidden; }
@media(max-width:767px),(max-height:500px) {
 #mh-ai-root { right:max(10px,env(safe-area-inset-right)); bottom:max(10px,env(safe-area-inset-bottom)); }
 #mh-ai-root .mh-ai-launcher { padding:7px 13px 7px 7px; border-radius:17px; }
 #mh-ai-root .mh-ai-panel { top:calc(var(--mh-ai-top,0px) + 8px); right:8px; bottom:auto; width:calc(100vw - 16px); height:calc(var(--mh-ai-height,100dvh) - 16px); border-radius:20px; }
 #mh-ai-root .mh-ai-header { padding:10px 12px; }
 #mh-ai-root .mh-ai-logo { width:48px; height:30px; }
 #mh-ai-root .mh-ai-brand { gap:8px; }
}
@media(max-height:500px) {
 #mh-ai-root .mh-ai-status, #mh-ai-root .mh-ai-subtitle { display:none; }
 #mh-ai-root .mh-ai-header { padding:5px 12px; }
 #mh-ai-root .mh-ai-quick { padding:4px 12px; }
 #mh-ai-root .mh-ai-footer { padding-top:4px; padding-bottom:6px; }
}

/* MATEHILL_AI_LOGO_FOCUS_RESTORE_V1 */

/*
 * Restore the previous MateHill AI visual identity.
 * Keep keyboard focus indicators on buttons and links.
 */
#mh-ai-root .mh-ai-launcher-logo {
  display: block;
  flex: 0 0 40px;
  width: 40px;
  height: 40px;
  object-fit: cover;
  border-radius: 13px;
  background: #171717;
}

#mh-ai-root .mh-ai-logo {
  width: 48px !important;
  height: 48px !important;
  object-fit: cover;
  border-radius: 14px;
  background: #171717;
}

/*
 * The input wrapper already provides the visible border.
 * Do not draw a second focus ring inside it.
 */
#mh-ai-root .mh-ai-input:focus,
#mh-ai-root .mh-ai-input:focus-visible {
  border: 0 !important;
  outline: none !important;
  box-shadow: none !important;
}

#mh-ai-root .mh-ai-input-wrap:focus,
#mh-ai-root .mh-ai-input-wrap:focus-within {
  outline: none !important;
  box-shadow: none !important;
}