.live-chat { position:fixed; right:24px; bottom:calc(24px + env(safe-area-inset-bottom, 0px)); z-index:900; font-family:var(--sans); color:var(--ink); opacity:0; visibility:hidden; pointer-events:none; transform:translateY(14px) scale(.96); transform-origin:bottom right; transition:opacity .42s ease, transform .52s cubic-bezier(.22,1,.36,1) }
.live-chat.is-visible { opacity:1; visibility:visible; pointer-events:auto; transform:none }
body.modal-open .live-chat { visibility:hidden; pointer-events:none }
.live-chat [hidden] { display:none !important }
.live-chat-launcher { position:relative; display:flex; align-items:center; justify-content:center; width:56px; height:56px; padding:0; border:1px solid rgba(140,109,35,.16); border-radius:50%; background:var(--gold); color:var(--ink); font-size:14px; font-weight:700; box-shadow:0 8px 24px #18181a1a, 0 2px 6px #18181a0d; transition:background .2s, transform .2s, box-shadow .2s }
.live-chat-launcher-label { position:absolute; right:calc(100% + 10px); top:50%; padding:10px 14px; font-size:13px; line-height:20px; border:1px solid var(--line); border-radius:12px; background:var(--white); box-shadow:0 5px 22px #18181a14; white-space:nowrap; pointer-events:none; opacity:0; visibility:hidden; transform:translate(8px,-50%); transition:opacity .18s ease, transform .24s cubic-bezier(.22,1,.36,1), visibility .18s }
@media (hover:hover) and (pointer:fine) {
  .live-chat-launcher:hover { background:var(--gold-dark); transform:translateY(-2px) }
  .live-chat-launcher:hover .live-chat-launcher-label { opacity:1; visibility:visible; transform:translate(0,-50%) }
  .live-chat-launcher:focus-visible .live-chat-launcher-label { opacity:1; visibility:visible; transform:translate(0,-50%) }
}
.live-chat svg { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; flex:none }
.live-chat button:focus-visible, .live-chat textarea:focus-visible { outline:2px solid var(--ink); outline-offset:3px }
.live-chat-unread { display:grid; place-items:center; position:absolute; top:-4px; right:-4px; width:22px; height:22px; border-radius:50%; background:var(--ink); color:var(--white); font-size:11px; border:2px solid var(--canvas) }
.live-chat-panel { position:absolute; right:0; bottom:76px; display:grid; grid-template-rows:auto minmax(0,1fr) auto; width:min(384px,calc(100vw - 48px)); height:min(540px,calc(100dvh - 130px)); border:1px solid var(--line); border-radius:24px; overflow:hidden; background:var(--canvas); box-shadow:0 20px 64px #18181a21, 0 4px 12px #18181a0a; transform-origin:bottom right; animation:live-chat-open .28s cubic-bezier(.22,1,.36,1) }
.live-chat-panel:has(.live-chat-intro:not([hidden])) { height:auto; max-height:min(540px,calc(100dvh - 130px)) }
@media(max-width:680px), (max-width:1024px) and (pointer:coarse) {
  .live-chat.is-open .live-chat-panel:has(.live-chat-intro:not([hidden])) { height:auto; max-height:min(640px,calc(var(--chat-visible-height, 100dvh) - 32px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px))) }
}
.live-chat-heading { display:flex; align-items:center; gap:12px; padding:18px 20px; border-bottom:1px solid var(--line); background:var(--white) }
.live-chat-avatar { width:40px; height:40px; border-radius:50%; flex:none; background:var(--surface) url('assets/partner-collaboration.webp') 50% 0% / 220% no-repeat }
.live-chat-heading h2 { margin:0; font-size:15px; line-height:1.4; letter-spacing:-.25px; font-weight:700 }
.live-chat-heading p { margin:3px 0 0; font-size:12px; line-height:1.4; color:var(--muted) }
.live-chat-close { margin-left:auto; display:grid; place-items:center; width:44px; height:44px; padding:0; border:0; border-radius:50%; background:var(--surface-2); color:var(--muted-strong); transition:background .18s ease }
.live-chat-close:hover { background:var(--surface) }
.live-chat-close svg { width:18px; height:18px }
.live-chat-thread { min-height:0; padding:20px 16px; overflow-y:auto; overscroll-behavior:contain; scroll-behavior:auto; scrollbar-gutter:auto; overflow-anchor:none; scrollbar-width:none }
.live-chat-welcome { margin:0 0 20px; padding:0 4px; font-size:14px; line-height:1.65; color:var(--muted-strong) }
.live-chat-messages { display:flex; flex-direction:column; gap:14px }
.live-chat-message { max-width:86%; align-self:flex-start; transform-origin:bottom left; animation:live-chat-message .42s cubic-bezier(.22,.61,.36,1) backwards }
.live-chat-message--visitor { align-self:flex-end; transform-origin:bottom right }
.live-chat-message p { margin:0; padding:11px 14px; background:var(--surface); color:var(--ink); border-radius:17px 17px 17px 5px; white-space:pre-wrap; overflow-wrap:anywhere; font-size:14px; line-height:1.6; text-align:left }
.live-chat-message--visitor p { background:var(--sand); border-radius:17px 17px 5px 17px }
.live-chat-message small { display:grid; margin:5px 3px 0; color:var(--muted); font-size:10px; line-height:1.4; font-variant-numeric:tabular-nums }
.live-chat-message small::before { content:attr(data-reserve); grid-area:1 / 1; visibility:hidden }
.live-chat-message small > span { grid-area:1 / 1 }
.live-chat-message--visitor small { text-align:right }
.live-chat-message--failed p { background:#f7e3b0 }
.live-chat-retry { min-height:44px; padding:8px 0; margin:4px 3px 0; background:none; border:0; color:var(--danger); font-size:12px; text-decoration:underline; text-underline-offset:3px }
.live-chat-composer { padding:12px 16px 14px; border-top:1px solid var(--line); background:var(--white) }

.live-chat-older { display:block; min-height:44px; margin:0 auto 16px; padding:8px 12px; border:1px solid var(--line); border-radius:12px; background:var(--white); color:var(--muted-strong); font:400 12px/1.5 var(--sans) }
.live-chat-older:disabled { opacity:.5; cursor:wait }
.live-chat-compose-row { display:flex; gap:10px; align-items:flex-end; padding:7px 7px 7px 12px; border:1px solid var(--field-border); border-radius:18px; background:var(--canvas); transition:border-color .18s ease }
.live-chat-compose-row:focus-within { border-color:var(--sand-border); box-shadow:none }
.live-chat textarea { resize:none; width:100%; min-width:0; min-height:40px; max-height:100px; padding:8px 0; border:0; background:transparent; color:var(--ink); font-size:16px; line-height:24px; outline:none }
.live-chat textarea:focus-visible { outline:none }
.live-chat textarea::placeholder { color:var(--muted) }
.live-chat-send { display:grid; place-items:center; flex:none; width:44px; height:44px; padding:0; border:0; border-radius:50%; background:var(--gold); color:var(--ink); transition:background .2s, opacity .2s }
.live-chat-send:disabled { opacity:.45; cursor:default }
.live-chat-send:not(:disabled):hover { background:var(--gold-dark) }
.live-chat-send svg { width:20px; height:20px }
.live-chat-status { min-height:17px; margin:7px 3px 0; font-size:11px; line-height:1.5; color:var(--muted) }
.live-chat-status.is-error { color:var(--danger) }
.live-chat-status a { text-decoration:underline; text-underline-offset:2px }
@keyframes live-chat-open { from { opacity:0; transform:translateY(10px) scale(.98) } to { opacity:1; transform:none } }
@keyframes live-chat-message {
  from { opacity:0; transform:translate3d(0,8px,0) scale(.985) }
  to { opacity:1; transform:none }
}
.live-chat-backdrop { display:none }
@media(max-width:680px), (max-width:1024px) and (pointer:coarse) {
  body.chat-mobile-open { overflow:hidden }
  .live-chat { right:16px; bottom:calc(16px + env(safe-area-inset-bottom, 0px)) }
  .live-chat.is-open {
    top:var(--chat-visible-top, 0px); right:0; bottom:auto; left:0;
    height:var(--chat-visible-height, 100dvh);
    display:grid; place-items:center;
    padding:max(16px, env(safe-area-inset-top, 0px)) 16px max(16px, env(safe-area-inset-bottom, 0px));
    transform:none; transition:none;
  }
  .live-chat.is-open .live-chat-backdrop {
    display:block; position:absolute; inset:0;
    background:rgba(16,17,20,.74);
    -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
    animation:live-chat-backdrop-in .24s ease;
  }
  .live-chat.is-open .live-chat-launcher { display:none }
  .live-chat-panel {
    position:relative; z-index:1; right:auto; bottom:auto;
    width:100%; max-width:400px;
    height:min(640px,calc(var(--chat-visible-height, 100dvh) - 32px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)));
    min-height:0; border-radius:24px;
    animation:live-chat-mobile-open .32s cubic-bezier(.22,1,.36,1);
  }
  .live-chat-heading { padding:16px; gap:12px }
  .live-chat-heading > div { min-width:0 }
  .live-chat-heading h2 { font-size:16px }
  .live-chat-close { width:44px; height:44px; flex:none }
  .live-chat-thread { min-height:0; padding:20px 16px }
  .live-chat-message p, .live-chat-welcome { font-size:15px; line-height:1.5 }
  .live-chat-composer { padding:12px 16px 14px }
  .live-chat-status { font-size:12px; line-height:1.5 }
  .live-chat textarea { min-width:0; max-height:clamp(40px,calc(var(--chat-visible-height, 100dvh) * .2),100px) }
  .live-chat-send { width:44px; height:44px }
  .live-chat.is-keyboard-open .live-chat-heading { padding-block:12px }
  .live-chat.is-keyboard-open .live-chat-composer { padding-block:10px }
  .live-chat.is-keyboard-open .live-chat-thread { padding-block:12px }
  .live-chat.is-keyboard-open .live-chat-options { display:none }
  .live-chat.is-open.is-compact-viewport { padding:max(8px, env(safe-area-inset-top, 0px)) 16px max(8px, env(safe-area-inset-bottom, 0px)) }
  .live-chat.is-compact-viewport .live-chat-panel { height:calc(var(--chat-visible-height, 100dvh) - 16px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) }
  .live-chat.is-compact-viewport .live-chat-heading { padding-block:8px }
  .live-chat.is-compact-viewport .live-chat-heading p { display:none }
  .live-chat.is-compact-viewport .live-chat-thread { padding-block:8px }
  .live-chat.is-compact-viewport .live-chat-composer { padding:8px 12px }

  .live-chat.is-compact-viewport .live-chat-compose-row { padding:5px 5px 5px 12px }
  .live-chat.is-compact-viewport textarea { max-height:40px }
  .live-chat.is-compact-viewport .live-chat-status { margin-top:4px }
}
@media(max-width:680px) and (max-height:500px), (max-width:1024px) and (pointer:coarse) and (max-height:500px) {
  .live-chat-heading { padding-block:12px }
  .live-chat-composer { padding-block:10px }
  .live-chat-thread { padding-block:12px }
}
@media(max-width:680px) and (max-height:420px), (max-width:1024px) and (pointer:coarse) and (max-height:420px) {
  .live-chat.is-open .live-chat-options { display:none }
}
@keyframes live-chat-backdrop-in { from { opacity:0 } to { opacity:1 } }
@keyframes live-chat-mobile-open { from { opacity:0; transform:translateY(12px) } to { opacity:1; transform:none } }

/* Messenger controls and first-entry form share the existing canvas/gold scale. */
.live-chat-identity { min-width:0; flex:1 }
.live-chat-heading { gap:10px; padding-inline:16px }
.live-chat-presence::before { content:''; display:inline-block; width:6px; height:6px; margin-right:5px; border-radius:50%; background:var(--muted-light); vertical-align:1px }
.live-chat-presence.is-online::before { background:#23a781 }
.live-chat-presence { text-wrap:balance }
.live-chat-tool { position:relative; display:grid; place-items:center; flex:none; width:44px; height:44px; padding:0; border:0; border-radius:50%; color:var(--muted-strong); background:transparent; transition:background .18s ease }
.live-chat-tool:hover { background:var(--surface-2) }
.live-chat-tool svg { width:18px; height:18px }
.live-chat-sound[aria-pressed=true]::after { content:''; position:absolute; width:21px; height:1.5px; background:currentColor; transform:rotate(-45deg); box-shadow:0 1px 0 var(--white) }
.live-chat-close { margin-left:0; flex:none }
.live-chat-intro { grid-row:2 / -1; align-self:stretch; min-height:0; overflow-y:auto; overscroll-behavior:contain; padding:24px 20px; display:flex; flex-direction:column; align-items:stretch }
.live-chat-intro h3 { margin:0 0 8px; font-size:21px; line-height:1.3; letter-spacing:-.5px }
.live-chat-intro > p:first-of-type { margin:0 0 24px; font-size:14px; line-height:1.55; color:var(--muted-strong) }
.live-chat-intro > label { margin:0 0 6px; font-size:13px; line-height:1.5; font-weight:600 }
.live-chat-intro > input { width:100%; min-height:48px; margin:0 0 16px; padding:11px 12px; border:1px solid var(--field-border); border-radius:12px; background:var(--white); font:400 16px/24px var(--sans); color:var(--ink); outline:none; box-shadow:none; transition:border-color .18s ease }
.live-chat-intro > input:focus { border-color:var(--sand-border); box-shadow:none; outline:none }
.live-chat-intro > input::placeholder { color:var(--muted) }
.live-chat-start { width:100%; min-height:48px; display:flex; align-items:center; justify-content:center; gap:10px; padding:12px; border:0; border-radius:12px; background:var(--gold); color:var(--ink); font:600 14px/22px var(--sans); transition:background .18s ease, opacity .18s ease }
.live-chat-start:disabled { opacity:.5; cursor:default }
.live-chat-start:not(:disabled):hover { background:var(--gold-dark) }
.live-chat-start svg { width:18px; height:18px }
.live-chat-intro-status { margin:10px 0 0; min-height:20px; color:var(--muted); font-size:12px; line-height:1.5; text-align:center }
.live-chat-intro-status.is-error { color:var(--danger) }
.live-chat-intro-status a { display:inline-flex; align-items:center; min-height:44px; text-decoration:underline; text-underline-offset:3px; color:var(--ink) }
.live-chat-intro > small { margin-top:16px; color:var(--muted); font-size:11px; line-height:1.5; text-align:center }
.live-chat-security { align-self:center; margin:0 0 12px; max-width:100% }
.live-chat-security:empty { margin:0 }
.live-chat-honeypot { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap }
.live-chat-options { display:flex; flex-direction:column; align-items:flex-start; margin:0 0 10px }
.live-chat-notify { display:flex; align-items:center; gap:7px; max-width:100%; min-height:44px; padding:0 3px; border:0; border-radius:4px; background:transparent; color:var(--muted-strong); font:500 12px/1.5 var(--sans); text-align:left; transition:color .2s }
.live-chat-notify span { min-width:0; overflow-wrap:anywhere }
.live-chat-notify svg { width:18px; height:18px; color:var(--bronze-dark); stroke-width:1.8 }
.live-chat-notify:not(:disabled):hover, .live-chat-notify[aria-pressed=true] { color:var(--ink) }
.live-chat-notify:disabled { color:var(--muted); cursor:default }
.live-chat-notify:disabled svg { color:var(--muted) }
.live-chat-notify .live-chat-notify-state { flex:none; width:2.1em; font-weight:inherit }
.live-chat-notify-status { position:absolute; width:1px; height:1px; margin:0; padding:0; overflow:hidden; clip-path:inset(50%); white-space:nowrap }
@media(max-width:680px), (max-width:1024px) and (pointer:coarse) {
  .live-chat-tool { width:44px; height:44px }
  .live-chat-heading { gap:8px }
  .live-chat-avatar { width:36px; height:36px }
  .live-chat-heading p { font-size:11px }
  .live-chat-intro { padding:24px 20px }
  .live-chat-intro-status { font-size:12px }
  .live-chat-notify { min-height:44px; font-size:13px }
  .live-chat.is-compact-viewport .live-chat-options { display:none }
  .live-chat.is-compact-viewport .live-chat-notify { min-height:22px; font-size:11px }
  .live-chat.is-compact-viewport .live-chat-intro { padding:16px }
}
@media(max-width:360px) {
  .live-chat-intro { padding:20px 16px }
  .live-chat-heading { padding-inline:12px; gap:6px }
  .live-chat-composer { padding-inline:12px }
}
@media(prefers-reduced-motion:reduce) { .live-chat, .live-chat *, .live-chat-panel { animation:none; transition:none } }
