.chatsim{--cs-bg:#0b141a;--cs-bar:#202c33;--cs-bot:#202c33;--cs-user:color-mix(in srgb, var(--cs-accent) 36%, #0d1216);--cs-ink:#e9edef;--cs-meta:#8696a0}.chatsim .cs-phone{background:var(--cs-bg);height:min(600px,100svh - 150px);min-height:480px;color:var(--cs-ink);box-shadow:0 0 0 1px #ffffff14, 0 40px 80px -36px color-mix(in srgb, var(--cs-accent) 60%, transparent), 0 18px 40px -20px #000000b3;border-radius:28px;flex-direction:column;display:flex;position:relative;overflow:hidden}@media (min-width:1024px){.chatsim .cs-phone{height:640px}}.chatsim .cs-head{background:var(--cs-bar);align-items:center;gap:12px;padding:12px 10px 12px 14px;display:flex}.chatsim .cs-avatar{background:color-mix(in srgb, var(--cs-accent) 26%, #111b21);border-radius:999px;flex-shrink:0;place-items:center;width:40px;height:40px;display:grid;overflow:hidden}.chatsim .cs-avatar img{object-fit:contain;width:76%;height:76%}.chatsim .cs-icon-btn{width:40px;height:40px;color:var(--cs-meta);border-radius:999px;place-items:center;transition:background-color .2s;display:grid}.chatsim .cs-icon-btn:hover,.chatsim .cs-icon-btn:focus-visible{color:var(--cs-ink);background:#ffffff12}.chatsim .cs-body{overscroll-behavior:contain;background-color:var(--cs-bg);scrollbar-width:thin;scrollbar-color:#ffffff26 transparent;background-image:radial-gradient(#ffffff09 1px,#0000 1.2px);background-size:18px 18px;flex-direction:column;flex:1;gap:6px;min-height:0;padding:12px 12px 14px;display:flex;overflow-y:auto}.chatsim .cs-day{color:var(--cs-meta);background:#182229;border-radius:8px;align-self:center;margin:2px 0 6px;padding:5px 12px;font-size:.74rem}.chatsim .cs-system{color:#ffd279;text-align:center;background:#182229;border-radius:8px;align-self:center;max-width:88%;margin:6px 0;padding:6px 12px;font-size:.76rem;line-height:1.35;animation:.28s ease-out both cs-in}.chatsim .cs-bubble{white-space:pre-line;overflow-wrap:anywhere;border-radius:10px;max-width:84%;padding:7px 10px 20px;font-size:.93rem;line-height:1.38;animation:.26s ease-out both cs-in;position:relative;box-shadow:0 1px .5px #00000021}.chatsim .cs-bot{background:var(--cs-bot);border-top-left-radius:3px;align-self:flex-start}.chatsim .cs-user{background:var(--cs-user);border-top-right-radius:3px;align-self:flex-end}.chatsim .cs-time{color:#e9edef8c;align-items:center;gap:3px;font-size:.66rem;line-height:1;display:inline-flex;position:absolute;bottom:4px;right:8px}.chatsim .cs-bubble strong{font-weight:650}.chatsim .cs-media{width:248px;padding:3px 3px 22px}.chatsim .cs-product-img{object-fit:cover;background:#fff;border-radius:8px;width:100%;height:196px;display:block}.chatsim .cs-price{color:color-mix(in srgb, var(--cs-accent) 70%, #fff);font-weight:700}.chatsim .cs-cta{inset-inline:0;background:var(--cs-bot);color:#53bdeb;border-radius:10px;place-items:center;height:34px;font-size:.86rem;font-weight:600;display:grid;position:absolute;bottom:-38px}.chatsim .cs-media:has(.cs-cta){margin-bottom:40px}.chatsim .cs-card{border-left:3px solid var(--cs-accent);width:262px;padding:9px 11px 22px}.chatsim .cs-card dl{font-size:.84rem}.chatsim .cs-card-title{align-items:center;gap:7px;font-weight:650;display:flex}.chatsim .cs-card.cs-tone-ok{border-left-color:#25d366}.chatsim .cs-card.cs-tone-warn{border-left-color:#ffb648}.chatsim .cs-card.cs-tone-alert{border-left-color:#ff5a5f}.chatsim .cs-card.cs-tone-alert .cs-card-title{color:#ff8d90}.chatsim .cs-link{background:#00000038;border-left:3px solid #53bdeb;border-radius:6px;margin:-2px -5px 0;padding:8px 10px;font-size:.82rem;line-height:1.3}.chatsim .cs-url{color:#53bdeb;margin-top:4px;font-size:.86rem}.chatsim .cs-typing{gap:4px;padding:12px 14px;display:flex}.chatsim .cs-typing i{background:var(--cs-meta);border-radius:999px;width:7px;height:7px;animation:1.1s ease-in-out infinite cs-dot}.chatsim .cs-typing i:nth-child(2){animation-delay:.15s}.chatsim .cs-typing i:nth-child(3){animation-delay:.3s}.chatsim .cs-chips{scrollbar-width:none;background:var(--cs-bg);gap:8px;padding:8px 10px 4px;display:flex;overflow-x:auto;-webkit-mask-image:linear-gradient(90deg,#000 88%,#0000);mask-image:linear-gradient(90deg,#000 88%,#0000)}.chatsim .cs-chips::-webkit-scrollbar{display:none}.chatsim .cs-chips button{min-height:40px;box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--cs-accent) 70%, transparent);color:color-mix(in srgb, var(--cs-accent) 55%, #fff);white-space:nowrap;background:#ffffff0a;border-radius:999px;flex-shrink:0;padding:0 14px;font-size:.86rem;transition:background-color .2s;animation:.3s ease-out both cs-in}.chatsim .cs-chips button:hover,.chatsim .cs-chips button:focus-visible{background:color-mix(in srgb, var(--cs-accent) 18%, transparent)}.chatsim .cs-input{background:var(--cs-bg);align-items:center;gap:8px;padding:8px 10px 10px;display:flex}.chatsim .cs-input input{background:var(--cs-bar);min-width:0;height:44px;color:var(--cs-ink);border-radius:999px;outline:none;flex:1;padding:0 16px;font-size:16px}.chatsim .cs-input input::placeholder{color:var(--cs-meta)}.chatsim .cs-input input:focus-visible{box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--cs-accent) 60%, transparent)}.chatsim .cs-input button{background:var(--cs-accent);color:#111b21;border-radius:999px;flex-shrink:0;place-items:center;width:44px;height:44px;transition:opacity .2s,transform .15s;display:grid}.chatsim .cs-input button:disabled{opacity:.45}.chatsim .cs-input button:not(:disabled):active{transform:scale(.94)}.chatsim .cs-panel{background:#ffffff0a;border-radius:26px;flex-direction:column;padding:20px;display:flex;box-shadow:inset 0 0 0 1px #ffffff14}@media (min-width:1024px){.chatsim .cs-panel{height:640px;padding:28px}}.chatsim .cs-status{color:#ffffffd9;white-space:nowrap;background:#ffffff0f;border-radius:999px;align-items:center;gap:7px;height:30px;padding:0 12px;font-size:.78rem;display:inline-flex}.chatsim .cs-status i{background:#8696a0;border-radius:999px;width:8px;height:8px}.chatsim .cs-status.cs-tone-ok i{background:#25d366;box-shadow:0 0 10px #25d366}.chatsim .cs-status.cs-tone-warn i{background:#ffb648;box-shadow:0 0 10px #ffb648}.chatsim .cs-status.cs-tone-alert i{background:#ff5a5f;box-shadow:0 0 10px #ff5a5f}.chatsim .cs-status.cs-tone-info i{background:#53bdeb}.chatsim .cs-log{overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#ffffff26 transparent;flex-direction:column;gap:8px;max-height:300px;margin-top:16px;display:flex;overflow-y:auto}@media (min-width:1024px){.chatsim .cs-log{flex:1;min-height:0;max-height:none}}.chatsim .cs-log-empty{color:#fff6;padding:14px 0;font-size:.9rem}.chatsim .cs-log-item{background:#ffffff09;border-radius:16px;gap:5px;padding:11px 14px;font-size:.9rem;line-height:1.4;animation:.35s ease-out both cs-in;display:grid;box-shadow:inset 3px 0 #53bdeb}.chatsim .cs-log-item.cs-tone-ok{box-shadow:inset 3px 0 #25d366}.chatsim .cs-log-item.cs-tone-warn{box-shadow:inset 3px 0 #ffb648}.chatsim .cs-log-item.cs-tone-alert{background:#ff5a5f12;box-shadow:inset 3px 0 #ff5a5f}.chatsim .cs-tag{font-family:var(--font-mono,ui-monospace, monospace);letter-spacing:.12em;text-transform:uppercase;color:#ffffff73;font-size:.66rem}@keyframes cs-in{0%{opacity:0;transform:translateY(6px)}}@keyframes cs-dot{0%,80%,to{opacity:.35;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}@media (prefers-reduced-motion:reduce){.chatsim .cs-bubble,.chatsim .cs-system,.chatsim .cs-chips button,.chatsim .cs-log-item{animation:none}}
