/* Independent, nonmodal homepage chat. Sizes cancel the site's desktop scale. */
#portfolio-chat { --chat-unit: calc(1px / var(--site-scale, 1)); --chat-purple: #4f2d7f; font-size: calc(14 * var(--chat-unit)); line-height: 1.5; }
.chat-launcher { position: fixed; z-index: 12; display: grid; place-items: center; padding: 0; color: #fff; background: var(--chat-purple); border: 1px solid #ffffff38; border-radius: 50%; box-shadow: 0 3px 16px #0002; isolation: isolate; }
.chat-launcher::before { content: ''; position: absolute; inset: -5px; border: 1px solid #4f2d7f80; border-radius: inherit; z-index: -1; box-shadow: 0 0 12px #4f2d7f35; }
:root[data-animations="on"] .chat-launcher::before { animation: chat-glow 4s ease-in-out infinite; }
@keyframes chat-glow { 0%,100% { opacity: .5; transform: scale(1); } 50% { opacity: .95; transform: scale(1.08); } }
.chat-launcher:hover { background: #3d2164; }
.chat-launcher-label { position: absolute; right: calc(62 * var(--chat-unit)); width: max-content; max-width: 200px; padding: 5px 10px; border: 1px solid var(--rule); border-radius: 4px; color: var(--ink); background: var(--paper); font-size: calc(12 * var(--chat-unit)); opacity: 0; pointer-events: none; }
.chat-launcher:hover .chat-launcher-label, .chat-launcher:focus-visible .chat-launcher-label { opacity: 1; }
.chat-panel { position: fixed; z-index: 11; display: flex; flex-direction: column; min-width: 0; padding: 0; color: var(--ink); background: var(--paper); border: 1px solid var(--rule); border-radius: calc(14 * var(--chat-unit)); box-shadow: 0 12px 40px #0002; overflow: hidden; }
.chat-heading { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: calc(4 * var(--chat-unit)) calc(10 * var(--chat-unit)); border-bottom: 1px solid var(--rule); flex-shrink: 0; }
.chat-heading h2 { margin: 0; font-size: calc(16 * var(--chat-unit)); letter-spacing: -.02em; line-height: 1.3; }
.chat-tools { display: flex; flex-shrink: 0; }
.chat-tools :is(button,summary) { display: grid; place-items: center; width: calc(44 * var(--chat-unit)); height: calc(44 * var(--chat-unit)); flex-shrink: 0; border-radius: 7px; font-size: calc(24 * var(--chat-unit)); line-height: 1; }
.chat-tools :is(button,summary):hover { background: var(--hover); }
.chat-info summary { list-style: none; cursor: pointer; }
.chat-info summary::-webkit-details-marker { display: none; }
.chat-info-content { position: absolute; z-index: 1; top: calc(52 * var(--chat-unit)); right: calc(8 * var(--chat-unit)); width: calc(340 * var(--chat-unit)); max-width: calc(100% - 16 * var(--chat-unit)); max-height: max(24px, calc(100% - 128 * var(--chat-unit))); overflow: auto; overscroll-behavior: contain; padding: calc(10 * var(--chat-unit)); border: 1px solid var(--rule); border-radius: calc(8 * var(--chat-unit)); background: var(--paper); color: var(--muted); box-shadow: 0 4px 16px #0002; font-size: calc(12 * var(--chat-unit)); line-height: 1.5; }
.chat-info-content p { margin: 0; }
.chat-info-content p + p { margin-top: calc(8 * var(--chat-unit)); }
.chat-body { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; overflow: auto; overscroll-behavior: contain; }
.chat-transcript { flex: 1 1 auto; min-height: calc(48 * var(--chat-unit)); overflow: auto; overscroll-behavior: contain; padding: calc(10 * var(--chat-unit)); scrollbar-gutter: stable; }
.chat-bubble { padding: 0 0 calc(12 * var(--chat-unit)); overflow-wrap: anywhere; }
.chat-speaker { display: block; font-size: calc(10 * var(--chat-unit)); text-transform: uppercase; letter-spacing: .06em; color: var(--muted); margin-bottom: 4px; }
.chat-bubble > p { margin: 0; white-space: pre-wrap; }
.chat-visitor { padding: calc(10 * var(--chat-unit)); margin-bottom: calc(14 * var(--chat-unit)); border-left: 2px solid var(--chat-purple); background: var(--hover); border-radius: 0 6px 6px 0; }
.chat-result { border-top: 1px solid var(--rule); margin-top: calc(12 * var(--chat-unit)); padding-top: calc(10 * var(--chat-unit)); }
.chat-result h3 { margin: 0 0 4px; font-size: inherit; }
.chat-result p { margin: 0 0 4px; }
.chat-qualifier { font-size: calc(11 * var(--chat-unit)); color: var(--muted); }
.chat-source { display: block; text-decoration: underline; text-underline-offset: 3px; margin-top: calc(10 * var(--chat-unit)); min-height: calc(24 * var(--chat-unit)); }
.chat-suggestions { flex-shrink: 0; display: flex; gap: calc(5 * var(--chat-unit)); flex-wrap: wrap; padding: 0 calc(12 * var(--chat-unit)); }
.chat-suggestions button { border: 1px solid var(--rule); border-radius: 6px; padding: calc(5 * var(--chat-unit)) calc(8 * var(--chat-unit)); font-size: calc(12 * var(--chat-unit)); min-height: calc(44 * var(--chat-unit)); }
.chat-suggestions button:hover { background: var(--hover); }
.chat-feedback { flex-shrink: 0; padding: 0 calc(10 * var(--chat-unit)); font-size: calc(11 * var(--chat-unit)); }
.chat-status { margin: 0; color: var(--muted); }
.chat-status:empty { display: none; }
.chat-status:not(.chat-sr-only):not(:empty) { margin: calc(4 * var(--chat-unit)) 0; }
.chat-recovery { display: flex; flex-wrap: wrap; gap: calc(8 * var(--chat-unit)); }
.chat-recovery button { text-decoration: underline; text-underline-offset: 3px; min-height: calc(36 * var(--chat-unit)); }
.chat-form { display: flex; gap: calc(8 * var(--chat-unit)); flex-shrink: 0; padding: 0 calc(10 * var(--chat-unit)) calc(6 * var(--chat-unit)); align-items: flex-end; }
.chat-form textarea { display: block; resize: none; min-width: 0; flex: 1; width: 100%; border: 1px solid var(--rule); border-radius: 7px; color: var(--ink); background: var(--paper); padding: calc(6 * var(--chat-unit)); font: inherit; font-size: calc(16 * var(--chat-unit)); line-height: 1.35; }
.chat-form textarea::placeholder { color: var(--muted); opacity: 1; }
.chat-send { flex-shrink: 0; min-height: calc(44 * var(--chat-unit)); min-width: calc(44 * var(--chat-unit)); border: 1px solid var(--rule); border-radius: 7px; padding: calc(8 * var(--chat-unit)); background: var(--ink); color: var(--paper); }
#portfolio-chat button:disabled { cursor: default; opacity: .55; }
#portfolio-chat :is(button,a,textarea,summary,[tabindex]):focus-visible { outline: 2px solid var(--focus); outline-offset: -3px; }
.chat-sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
/* Original controls are moved, never cloned/rebound; content windows still cover them. */
:root.chat-ready .site-controls { transition: none; }
:root.chat-mobile-open .site-controls { flex-direction: row; }
:root.chat-mobile-open .control-label { display: none; }
:root.chat-keyboard .site-controls { visibility: hidden; }
.chat-panel[data-compact="true"] .chat-suggestions { display: none; }
.chat-panel[data-compact="true"] .chat-heading { padding-block: calc(3 * var(--chat-unit)); }
@media (prefers-reduced-motion: reduce) { .chat-launcher::before { animation: none !important; transform: none !important; } }
@media (max-height: 500px) { .chat-heading { padding-block: calc(3 * var(--chat-unit)); } .chat-suggestions { display: none; } }