.about-chat-preview {
header .eyebrow{background:none;border:0;border-radius:0;padding:0;box-shadow:none}

*{box-sizing:border-box}&{margin:0;font-family:Pretendard,-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo",sans-serif;background:#fff;color:#192638}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}nav{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 5%;border-bottom:1px solid #edf0f5}nav strong{color:#2164f5;letter-spacing:-.04em}nav small{color:#7c8697}.switch{display:flex;gap:6px;background:#f0f3f8;border-radius:12px;padding:5px}.switch button{border:0;background:transparent;border-radius:8px;padding:10px 16px;font-size:13px;color:#647085}.switch button[aria-pressed=true]{background:#2164f5;color:white;box-shadow:0 3px 9px #2164f528}.chat-stage{padding:54px 20px 60px}header{text-align:center;margin:0 auto 30px}header .eyebrow{font-size:12px;letter-spacing:.12em;font-weight:750;color:#2164f5;margin:0 0 15px}h1{font-size:clamp(26px,3vw,34px);letter-spacing:-.045em;line-height:1.35;margin:0 0 14px;font-weight:750}h1 em{font-style:normal;color:#2164f5}header .lead{font-size:14px;color:#778294;line-height:1.7;margin:0}.chat{max-width:690px;margin:auto;border:1px solid #d9e3ef;border-radius:23px;overflow:hidden;background:#e8f0fa;box-shadow:0 22px 65px #254f8b12}.chrome{display:flex;align-items:center;gap:7px;padding:14px 20px 4px;background:#f7faff}.chrome i{width:9px;height:9px;border-radius:50%;background:#ff7773}.chrome i:nth-child(2){background:#ffc758}.chrome i:nth-child(3){background:#53cfa0}.chrome span{margin-left:auto;font-size:10px;color:#94a2b5;letter-spacing:.1em}.chathead{padding:17px 22px 20px;background:#f7faff;display:flex;align-items:center;gap:12px;border-bottom:1px solid #dae4f0}.avatar{width:42px;height:42px;border-radius:15px;display:grid;place-items:center;background:#2164f5;color:white;font-weight:800;font-size:21px}.person strong{font-size:15px}.person small{display:flex;align-items:center;gap:6px;margin-top:6px;color:#8090a4;font-size:11px}.person small:before{content:"";width:6px;height:6px;background:#1cb991;border-radius:50%}.counter{position:relative;margin-left:auto;background:#daf5ed;border:1px solid #bceadd;color:#08795f;padding:10px 13px;border-radius:30px;font-weight:750;font-size:12px;white-space:nowrap}.plus{position:absolute;right:13px;top:-5px;pointer-events:none;color:#0aaa7f;font-size:16px;opacity:0}.plus.pop{animation:plus .85s ease-out}.counter.bump{animation:bump .35s ease}.messages{padding:22px;min-height:385px;display:flex;flex-direction:column;gap:12px}.row{display:flex;gap:8px;align-items:flex-end;opacity:0;transform:translateY(9px)}.row.visible{opacity:1;transform:none;transition:opacity .4s,transform .4s}.customer{justify-content:flex-end}.bubble{max-width:85%;font-size:14px;line-height:1.65;letter-spacing:-.025em;padding:12px 16px;margin:0;word-break:keep-all}.customer .bubble{background:#2164f5;color:white;border-radius:16px 16px 4px 16px}.reply .bubble{background:white;color:#2d3e54;border-radius:16px 16px 16px 4px;box-shadow:0 2px 4px #254e7e05}.bubble b{color:#087d69;font-weight:650}.stamp{font-size:9px;color:#8b9cb1;white-space:nowrap;padding-bottom:3px}.bottom{padding:14px 20px 18px;text-align:center;border-top:1px solid #dae4f0;background:#f7faff}.bottom p{margin:0 0 10px;font-size:12px;color:#698197}.replay{border:1px solid #d1dce9;background:white;border-radius:20px;color:#637891;padding:8px 16px;font-size:12px}.foot{text-align:center;color:#99a3b2;font-size:11px;margin-top:20px}.dark .chat{background:#162338;border-color:#2a3e5a;box-shadow:0 24px 65px #142a3c24}.dark .chrome,.dark .chathead,.dark .bottom{background:#1b2b43;border-color:#30415a}.dark .person strong{color:#f4f7fc}.dark .person small{color:#99afc8}.dark .reply .bubble{background:#283b54;color:#e0e9f6}.dark .bubble b{color:#8ce2c7}.dark .counter{background:#164e4c;color:#8be7cd;border-color:#236863}.dark .replay{background:#273b54;border-color:#3b4e67;color:#c7d6e8}.dark .bottom p{color:#a2b5cc}.dark .customer .bubble{background:#2164f5}.dark .plus{color:#93edd3}@keyframes plus{0%{opacity:0;transform:translateY(0)}25%{opacity:1}100%{opacity:0;transform:translateY(-28px)}}@keyframes bump{50%{transform:scale(1.09)}}@media(max-width:550px){nav{flex-wrap:wrap;padding:14px 18px}nav small{display:none}.switch button{font-size:11px;padding:9px 11px}.chat-stage{padding:36px 14px}.chathead{padding:14px;gap:8px}.avatar{width:35px;height:35px;font-size:18px}.person strong{font-size:13px}.person small{font-size:10px}.counter{font-size:10px;padding:8px 9px}.messages{padding:18px 13px;min-height:430px}.bubble{font-size:12px;padding:11px 13px;max-width:88%}.stamp{display:none}.chat{border-radius:18px}header .lead{font-size:12px}}@media(prefers-reduced-motion:reduce){.row{transition:none!important}.plus.pop,.counter.bump{animation:none}}
/* Refined messenger direction */
& .chat{background:#b8cddd;border-color:#afc1ce;box-shadow:0 12px 35px #20364712;border-radius:16px}
& .chrome,& .chathead{background:#b8cddd;border-color:#aec3d3}
.chrome span{display:none}
.person small:before{display:none}
.person small{color:#526676;font-size:11px}
.person strong{font-weight:650;color:#172b3c}
.avatar{background:#fff;border-radius:13px;width:42px;height:42px;padding:8px}
.avatar img{width:100%;height:100%;object-fit:contain}
& .customer .bubble{background:#fee500;color:#242321}
& .reply .bubble{color:#222b32;box-shadow:none}
.bubble{font-weight:400;border-radius:12px!important;letter-spacing:-.015em}
.customer .bubble{border-bottom-right-radius:3px!important}
.reply .bubble{border-top-left-radius:3px!important}
.stamp{color:#536977}
& .counter{background:transparent;border:0;border-radius:0;color:#4d6474;padding:8px 0;font-weight:500;font-size:12px}
.counter #count{font-variant-numeric:tabular-nums;color:#2164f5;font-weight:700;margin-left:3px}
.plus{color:#2164f5}
& .bottom{background:#fff;border-color:#d5e0e8}
.bottom p{color:#7a838b}
.replay{border:0;background:#f2f4f6;color:#66717c;border-radius:6px}
.messages{gap:16px;padding-block:24px}
.typing{background:white;width:58px;padding:14px 12px;border-radius:12px;display:flex;gap:5px}.typing[hidden]{display:none}.typing i{width:6px;height:6px;background:#8b9ba9;border-radius:50%;animation:dot 1s infinite}.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}@keyframes dot{50%{transform:translateY(-4px);opacity:.45}}.request-tags{display:flex;gap:7px;flex-wrap:wrap;padding:0 22px 20px;min-height:46px}.request-tags span{opacity:0;transform:translateY(5px);transition:.35s;font-size:11px;background:#ffffffb8;color:#425b70;border:1px solid #a9becf;padding:6px 10px;border-radius:6px}.request-tags span.show{opacity:1;transform:none}.unread{color:#786900;font-size:10px}.summary:not(.visible){display:none}.consult{display:block;width:fit-content;margin:0 auto 12px;background:#2164f5;color:white;padding:12px 20px;border-radius:7px;text-decoration:none;font-size:13px;font-weight:600}.consult[hidden]{display:none}.dark .typing{background:#283b54}.dark .request-tags span{background:#283b54;color:#d1e0ee;border-color:#40536a}@media(prefers-reduced-motion:reduce){.typing i{animation:none}.request-tags span{transition:none}}.chathead .request-tags{margin-left:auto;padding:0;min-height:0;max-width:310px;justify-content:flex-end;gap:5px}.chathead .request-tags span{font-size:10px;padding:5px 7px;background:transparent;border:0;color:#405b70;white-space:nowrap}.chathead .request-tags span:not(.show){display:none}.dark .chathead .request-tags span{color:#c7d9eb;background:transparent}@media(max-width:550px){.chathead .request-tags{max-width:135px;gap:3px;flex-direction:column;align-items:flex-end}.chathead .request-tags span{font-size:10px;padding:2px 0}.chathead{min-height:90px}}.chathead .request-tags span{position:relative;overflow:visible}.chathead .request-tags span::after{content:"+1";position:absolute;right:-5px;top:-14px;color:#2164f5;font-size:14px;font-weight:800;line-height:1;pointer-events:none;opacity:0;text-shadow:0 1px 3px #ffffffa6}.chathead .request-tags span.tag-pop::after{animation:tag-plus-pop 950ms cubic-bezier(.2,.8,.3,1) both}.dark .chathead .request-tags span::after{color:#99c8ff;text-shadow:none}@keyframes tag-plus-pop{0%{opacity:0;transform:translate(0,7px) scale(.25) rotate(-16deg)}22%{opacity:1;transform:translate(2px,-4px) scale(1.45) rotate(8deg)}42%{opacity:1;transform:translate(2px,-2px) scale(1) rotate(-3deg)}65%{opacity:1;transform:translate(3px,-7px) scale(1.08) rotate(0)}100%{opacity:0;transform:translate(5px,-22px) scale(.8)}}@media(prefers-reduced-motion:reduce){.chathead .request-tags span.tag-pop::after{animation:none}}
}