.readable .website-chat-section{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:65px;align-items:center}
.website-chat-copy,.website-chat-demo{min-width:0}
.website-chat-copy h2{margin:22px 0 28px;overflow-wrap:anywhere}
.website-chat-benefits{list-style:none;padding:0;margin:32px 0;display:grid;gap:24px}
.website-chat-benefits>li{display:flex;gap:16px;align-items:flex-start}
.website-chat-benefits>li>.icon{flex-shrink:0;width:25px;height:25px;color:var(--orange);margin-top:5px}
.website-chat-benefits strong{font-size:24px;line-height:1.4}
.website-chat-benefits p{font-size:21px;line-height:1.6;color:var(--muted);margin-top:7px}
.website-chat-invitation{font-size:22.5px;line-height:1.6;margin-bottom:20px;color:var(--text)}
.website-chat-caption{font-size:18px;line-height:1.6;margin-top:20px;color:var(--muted)}
.website-chat-panel{height:650px;display:flex;flex-direction:column;border:1px solid #424b58;border-radius:18px;overflow:hidden;background:#131820;box-shadow:0 28px 65px #0005;isolation:isolate}
.chat-header{display:flex;align-items:center;gap:13px;padding:22px;border-bottom:1px solid #343d49;flex-shrink:0;background:#19212a}
.chat-avatar{width:50px;height:50px;flex-shrink:0}
.chat-header-info{flex:1;min-width:0}
.chat-header-name{font-size:24px;font-weight:600;line-height:1.4}
.chat-header-status{font-size:16px;line-height:1.5;color:#8de1ad}
.chat-badge{font-size:14px;letter-spacing:.7px;font-weight:600;padding:6px 9px;border-radius:5px;color:var(--orange);background:#ff8a4c18;white-space:nowrap}
.chat-messages{flex:1;min-height:0;overflow-y:auto;padding:24px;display:flex;flex-direction:column;gap:18px;scrollbar-width:thin;scrollbar-color:#525c6b transparent}
.chat-bubble{flex-shrink:0;max-width:90%;padding:17px 19px;border-radius:16px;font-size:21px;line-height:1.6;overflow-wrap:anywhere;white-space:pre-wrap}
.chat-bubble.agent{align-self:flex-start;background:#232c37;border-bottom-left-radius:4px}
.chat-bubble.user{align-self:flex-end;background:#9e431c;color:#fff;border-bottom-right-radius:4px}
.chat-bubble.system{align-self:center;background:#2b211b;border:1px solid #6f4b39;font-size:18px;text-align:center}
.chat-bubble.system a{display:inline-flex;margin-top:10px;color:var(--orange);text-decoration:underline;text-underline-offset:3px;font-weight:600}
.chat-typing{align-self:flex-start;display:flex;align-items:center;padding:16px 19px;background:#232c37;border-radius:16px}
.thinking-orbit circle{filter:drop-shadow(0 0 3px currentColor)}
.tool-activity{align-self:flex-start;flex-shrink:0}
.tool-chip{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border:1px solid #52d7ff40;background:#52d7ff12;border-radius:20px;font-size:16px;line-height:1.4;color:#7de3ff}
.tool-chip.done{border-color:#4ade804d;background:#4ade8019;color:#8de1ad}
.tool-chip-spin{width:12px;height:12px;border:2px solid currentColor;border-top-color:transparent;border-radius:50%;flex-shrink:0;animation:chat-chip-spin .7s linear infinite}
.tool-chip.done .tool-chip-spin{display:none}
.tool-chip-check{display:none;width:14px;height:14px;flex-shrink:0}
.tool-chip.done .tool-chip-check{display:block}
@keyframes chat-chip-spin{to{transform:rotate(360deg)}}
.type-cursor{display:inline-block;width:2px;height:1em;margin-left:1px;background:currentColor;vertical-align:text-bottom;animation:chat-cursor-blink .9s step-end infinite}
@keyframes chat-cursor-blink{50%{opacity:0}}
.chat-input-wrap{display:flex;align-items:center;gap:10px;padding:18px;border-top:1px solid #343d49;flex-shrink:0}
.chat-input{flex:1;min-width:0;width:100%;padding:13px 15px;background:#1b222c;border:1px solid #535e6e;border-radius:28px;color:var(--text);font:400 20px/1.5 var(--sans)}
.chat-input::placeholder{color:#b4bac5}
.chat-input:focus-visible{outline:2px solid var(--orange);outline-offset:3px}
.chat-input:disabled{cursor:not-allowed}
.chat-send{width:48px;height:48px;flex-shrink:0;display:grid;place-items:center;border:1px solid transparent;border-radius:50%;background:var(--orange);color:#15100d;cursor:pointer}
.chat-send:disabled{opacity:.45;cursor:default}
.chat-send svg{width:23px;height:23px}
.chat-counter{font-size:16px;line-height:1.5;color:#b4bac5;text-align:center;padding:0 18px 16px;flex-shrink:0}
.chat-counter:empty{padding:0}
.chat-noscript{padding:16px;font-size:18px}
@media(max-width:1100px){.readable .website-chat-section{grid-template-columns:1fr;gap:40px}.website-chat-demo{max-width:720px;width:100%;justify-self:center}}
@media(max-width:700px){.website-chat-benefits strong{font-size:22.5px}.website-chat-panel{height:640px}.chat-header{padding:18px 14px;gap:10px}.chat-header-name{font-size:21px}.chat-avatar{width:42px;height:42px}.chat-header-status{font-size:14px}.chat-badge{display:none}.chat-messages{padding:16px}.chat-bubble{max-width:96%;padding:14px;font-size:21px}.chat-input-wrap{padding:14px 10px;gap:8px}.chat-input{font-size:18px;padding:12px}.chat-send{width:44px;height:44px}.chat-counter{font-size:14px}.website-chat-caption{font-size:18px}}
@media(prefers-reduced-motion:reduce){.tool-chip-spin,.type-cursor{animation:none}.type-cursor{display:none}}