:root {
    --pa-yellow: #f8c400;
    --pa-yellow-bright: #ffd325;
    --pa-ink: #171714;
    --pa-muted: #6c6b64;
    --pa-line: #e9e7dd;
    --pa-soft: #f7f6f1;
    --pa-white: #fff;
    --safe-bottom: env(safe-area-inset-bottom, 0px);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    color: var(--pa-ink);
}

* { box-sizing: border-box; }
html, body { width: 100%; height: 100%; margin: 0; background: transparent; }
button, textarea, a { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

.assistant { --widget-right: max(var(--pa-edge-right, 20px), env(safe-area-inset-right, 0px)); --widget-bottom: max(var(--pa-edge-bottom, 20px), var(--safe-bottom)); position: fixed; inset: var(--chat-viewport-top, 0px) 0 auto; height: var(--chat-viewport-height, 100%); pointer-events: none; }
.launcher {
    position: absolute; right: var(--widget-right); bottom: var(--widget-bottom); display: inline-flex; align-items: center; justify-content: center; gap: 10px; width: max-content; max-width: min(240px, calc(100% - 2 * var(--widget-right))); min-height: 56px;
    padding: 12px 18px; border: 0; border-radius: 999px; color: var(--pa-ink); background: linear-gradient(145deg, var(--pa-yellow-bright), var(--pa-yellow));
    box-shadow: 0 3px 8px -2px rgba(30, 26, 0, .12), inset 0 1px rgba(255,255,255,.6); cursor: pointer; pointer-events: auto;
    transition: transform .2s ease, box-shadow .2s ease, opacity .15s ease;
}
.launcher:hover { transform: translateY(-2px); box-shadow: 0 4px 10px -3px rgba(30,26,0,.16), inset 0 1px rgba(255,255,255,.6); }
.launcher:focus-visible, button:focus-visible, a:focus-visible, textarea:focus-visible { outline: 3px solid #2d63d4; outline-offset: 2px; }
.launcher--icon { width: 64px; height: 64px; padding: 12px; border-radius: 50%; }
.launcher__icon { display: grid; place-items: center; flex: 0 0 30px; width: 30px; height: 30px; font-size: 27px; line-height: 1; }
.launcher--icon .launcher__icon { flex-basis: 40px; width: 40px; height: 40px; }
.launcher__icon img { display: block; width: 100%; height: 100%; min-width: 0; min-height: 0; padding: 2px; border-radius: 50%; object-fit: contain; object-position: center; background: #fff; }
.launcher__label { min-width: 0; font-size: 13px; font-weight: 800; line-height: 1.25; text-align: center; overflow-wrap: anywhere; }
.is-open .launcher { opacity: 0; pointer-events: none; transform: scale(.75); }

.chat-panel {
    position: absolute; right: var(--widget-right); bottom: var(--widget-bottom); display: grid; grid-template-rows: auto minmax(0, 1fr) auto auto auto;
    width: min(400px, calc(100% - 2 * var(--widget-right))); height: min(620px, calc(100% - 2 * var(--widget-bottom))); overflow: hidden; border: 1px solid rgba(23,23,20,.08); border-radius: 26px;
    background: var(--pa-white); box-shadow: 0 24px 70px rgba(21,20,14,.22); pointer-events: auto;
    opacity: 0; visibility: hidden; transform: translateY(18px) scale(.97); transform-origin: bottom right;
    transition: opacity .2s ease, transform .22s ease, visibility .2s;
}
.is-open .chat-panel { opacity: 1; visibility: visible; transform: none; }
.chat-header { display: flex; align-items: center; min-height: 76px; padding: 14px 15px; background: var(--pa-yellow); }
.brand-mark, .message__avatar {
    position: relative; display: grid; place-items: center; flex: 0 0 auto; overflow: hidden; border-radius: 50%; color: var(--pa-ink); background: var(--pa-yellow); font-weight: 900;
}
.avatar__fallback, .avatar__image { grid-area: 1 / 1; }
.avatar__fallback { display: grid; place-items: center; width: 100%; height: 100%; }
.avatar__image { position: absolute; inset: 0; display: block; width: 100%; height: 100%; min-width: 0; min-height: 0; padding: 2px; border-radius: inherit; object-fit: contain; object-position: center; background: #fff; opacity: 0; }
.avatar--image-loaded .avatar__image { opacity: 1; }
.avatar--image-loaded .avatar__fallback { opacity: 0; }
.brand-mark { width: 46px; height: 46px; font-size: 21px; box-shadow: inset 0 0 0 2px rgba(255,255,255,.15); }
.chat-header__copy { display: flex; flex: 1; flex-direction: column; gap: 3px; margin-left: 11px; }
.chat-header__copy strong { font-size: 16px; letter-spacing: -.01em; }
.chat-header__copy span { display: flex; align-items: center; gap: 6px; font-size: 12px; color: rgba(23,23,20,.7); }
.status-dot { width: 7px; height: 7px; border-radius: 50%; background: #178a49; box-shadow: 0 0 0 3px rgba(23,138,73,.14); }
.icon-button { width: 40px; height: 40px; border: 0; border-radius: 50%; color: var(--pa-ink); background: rgba(255,255,255,.32); font-size: 27px; line-height: 1; cursor: pointer; }
.icon-button:hover { background: rgba(255,255,255,.55); }
.chat-header__actions { display: flex; gap: 5px; }
.icon-button--restart { font-size: 20px; }

.chat-body { overflow-x: hidden; overflow-y: auto; padding: 20px 16px 14px; background: linear-gradient(180deg, #fbfaf6 0%, #fff 24%); scroll-behavior: smooth; }
.message { display: flex; align-items: flex-start; gap: 8px; margin-bottom: 16px; animation: messageIn .22s ease both; }
.message--user { justify-content: flex-end; }
.message__avatar { width: 32px; height: 32px; margin-top: 1px; font-size: 12px; }
.message__avatar .avatar__image { padding: 1px; }
.message__content { display: flex; flex-direction: column; align-items: flex-start; max-width: 82%; }
.message--user .message__content { align-items: flex-end; }
.bubble { padding: 11px 13px; border-radius: 5px 17px 17px 17px; color: #292821; background: var(--pa-soft); font-size: 14px; line-height: 1.48; white-space: pre-line; overflow-wrap: anywhere; }
.message--user .bubble { border-radius: 17px 5px 17px 17px; background: var(--pa-yellow); }
.message time { margin: 5px 4px 0; color: #9b9990; font-size: 10px; }
.message__meta { display: flex; align-items: center; gap: 7px; min-height: 25px; margin: 3px 3px 0; }
.message__meta time { margin: 0; }
.message__listen { display: inline-grid; place-items: center; width: 26px; height: 26px; padding: 0; border: 0; border-radius: 50%; color: #77746b; background: transparent; cursor: pointer; transition: color .16s ease, background .16s ease, transform .16s ease; }
.message__listen:hover { color: var(--pa-ink); background: #efede5; }
.message__listen:active { transform: scale(.92); }
.message__listen svg { width: 16px; height: 16px; overflow: visible; fill: currentColor; }
.message__listen svg .sound-wave { fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; }
.message__listen.is-loading { color: #806600; background: #fff7cf; cursor: wait; }
.listen-loader { width: 14px; height: 14px; border: 2px solid rgba(128,102,0,.25); border-top-color: currentColor; border-radius: 50%; animation: listenSpin .75s linear infinite; }
.message__listen.is-speaking { color: #594600; background: var(--pa-yellow); box-shadow: 0 0 0 3px rgba(248,196,0,.18); animation: listenPulse 1.7s ease-in-out infinite; }
.message--user .message__meta { justify-content: flex-end; }

.quick-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 2px 0 20px 40px; }
.quick-actions button, .quick-actions a { display: flex; align-items: center; gap: 7px; min-width: 0; min-height: 38px; padding: 8px 10px; border: 1px solid var(--pa-line); border-radius: 11px; color: #3b3931; background: #fff; font-size: 12px; font-weight: 650; text-align: left; text-decoration: none; overflow-wrap: anywhere; cursor: pointer; }
.quick-actions > :first-child { grid-column: 1 / -1; color: var(--pa-ink); border-color: #e3b300; background: #fff9dc; }
.quick-actions button:hover, .quick-actions a:hover { border-color: var(--pa-yellow); background: #fffbed; }
.quick-actions span { display: inline-grid; place-items: center; width: 20px; height: 20px; color: #6b5600; }

.reply-actions { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 8px; }
.reply-button { display: inline-flex; align-items: center; justify-content: center; min-height: 35px; padding: 7px 11px; border: 1px solid #d9d6c9; border-radius: 10px; color: var(--pa-ink); background: #fff; font-size: 12px; font-weight: 750; text-decoration: none; cursor: pointer; }
.reply-button:hover { border-color: var(--pa-yellow); background: #fffbed; }
.reply-button--primary { border-color: var(--pa-yellow); background: var(--pa-yellow); }
.reply-button--primary:hover { background: var(--pa-yellow-bright); }
.source-link { display: inline-flex; padding: 2px 1px; color: #756000; font-size: 11px; font-weight: 700; line-height: 1.35; text-decoration: none; }
.source-link:hover { color: var(--pa-ink); text-decoration: underline; text-underline-offset: 2px; }

.typing { display: flex; align-items: flex-start; gap: 8px; min-height: 49px; padding: 7px 18px; border-top: 1px solid #f2f0e8; color: var(--pa-muted); background: #fff; font-size: 11px; }
.typing[hidden] { display: none; }
.typing__bubble { display: flex; align-items: center; gap: 4px; min-height: 34px; padding: 8px 12px; border-radius: 5px 15px 15px 15px; background: var(--pa-soft); }
.typing__bubble i { width: 5px; height: 5px; border-radius: 50%; background: #9b9990; animation: typingDot 1.1s ease-in-out infinite; }
.typing__bubble i:nth-child(2) { animation-delay: .15s; }.typing__bubble i:nth-child(3) { animation-delay: .3s; }
.composer { display: flex; align-items: flex-end; gap: 8px; padding: 10px 12px 9px; border-top: 1px solid var(--pa-line); background: #fff; }
.composer textarea { flex: 1; min-height: 42px; max-height: 96px; resize: none; padding: 10px 12px; border: 1px solid var(--pa-line); border-radius: 14px; color: var(--pa-ink); background: #faf9f5; font-size: 14px; line-height: 1.4; }
.composer textarea::placeholder { color: #99978d; }
.composer textarea:focus { border-color: #d3aa00; background: #fff; outline: 2px solid rgba(248,196,0,.18); }
.composer button { display: grid; place-items: center; flex: 0 0 42px; width: 42px; height: 42px; border: 0; border-radius: 13px; color: var(--pa-ink); background: var(--pa-yellow); font-size: 18px; cursor: pointer; }
.composer button:hover { background: var(--pa-yellow-bright); }
.composer button:disabled, .composer textarea:disabled { opacity: .55; cursor: wait; }
.toast { position: absolute; right: calc(var(--widget-right) + 12px); bottom: calc(var(--widget-bottom) + 12px); max-width: min(290px, calc(100% - 2 * var(--widget-right) - 24px)); padding: 10px 13px; border-radius: 10px; color: #fff; background: #292821; box-shadow: 0 8px 25px rgba(0,0,0,.2); font-size: 12px; pointer-events: auto; }

@keyframes messageIn { from { opacity: 0; transform: translateY(5px); } }
@keyframes fly { 0%,100% { transform: translateX(-1px) rotate(-10deg); } 50% { transform: translateX(6px) translateY(-2px) rotate(-10deg); } }
@keyframes typingDot { 0%,60%,100% { opacity: .35; transform: translateY(0); } 30% { opacity: 1; transform: translateY(-2px); } }
@keyframes listenPulse { 0%,100% { box-shadow: 0 0 0 3px rgba(248,196,0,.15); } 50% { box-shadow: 0 0 0 6px rgba(248,196,0,.05); } }
@keyframes listenSpin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; } }

@media (max-width: 520px) {
    .assistant { --widget-right: max(min(var(--pa-edge-right, 20px), 16px), env(safe-area-inset-right, 0px)); --widget-bottom: max(min(var(--pa-edge-bottom, 20px), 16px), var(--safe-bottom)); }
    .chat-panel { border-radius: 22px; }
    .chat-header { min-height: 70px; }
    .chat-body { padding-inline: 13px; }
    .quick-actions { margin-left: 40px; }
}

/* Keep text entry readable and avoid automatic input zoom on mobile browsers. */
@media (max-width: 760px), (pointer: coarse) {
    .composer textarea { min-width: 0; font-size: 16px; overflow-y: auto; scrollbar-width: none; }
    .composer textarea::-webkit-scrollbar { display: none; width: 0; height: 0; }
}

.widget-page--embedded .assistant { --widget-right: 8px; --widget-bottom: 8px; }

@media (max-width: 340px) {
    .quick-actions { grid-template-columns: 1fr; }
    .quick-actions > :first-child { grid-column: auto; }
}
/* Service status is system UI; it is never added to the conversation transcript. */
.assistant-availability { padding: 14px 18px; font-size: 14px; line-height: 1.5; background: #f6f5f1; color: #49473e; border-top: 1px solid #e8e4d9; }
.assistant-availability[hidden] { display: none; }
.assistant-is-unavailable .quick-actions, .assistant-is-unavailable .message__actions, .assistant-is-unavailable [data-action], .assistant-is-unavailable .message__listen { pointer-events: none; opacity: .55; }
.assistant-is-unavailable .reply-actions button { pointer-events: none; opacity: .55; }
.assistant-is-unavailable .status-dot { background: #8b897e; }