:host{all:initial}*{box-sizing:border-box;font-family:inherit}.panel{--accent: var(--vatio-inbox-accent, #293858);--accent-soft: color-mix(in srgb, var(--accent) 10%, #fff);--accent-softer: color-mix(in srgb, var(--accent) 5%, #fff);--on-accent: color-mix(in srgb, #f2f1d3 38%, #ffffff);--gold: #f7bc13;--gold-soft: color-mix(in srgb, #f7bc13 16%, #fff);--gold-line: color-mix(in srgb, #f7bc13 55%, #fff);--gold-ink: #7a5c05;--ink: #17203a;--ink-muted: #4f5d7a;--ink-faint: #667392;--surface: #ffffff;--surface-sunken: #f5f7fc;--surface-raised: #fafbfe;--border: #e4e9f2;--border-strong: #ccd5e6;--r-xs: 6px;--r-sm: 8px;--r-md: 12px;--r-lg: 16px;--r-bubble: 18px;--r-pill: 999px;--shadow-xs: 0 1px 2px rgba(23, 32, 58, .06);--shadow-sm: 0 1px 3px rgba(23, 32, 58, .08), 0 1px 2px rgba(23, 32, 58, .04);--shadow-md: 0 6px 20px -6px rgba(23, 32, 58, .18), 0 2px 6px rgba(23, 32, 58, .05);--shadow-lg: 0 28px 64px -24px rgba(12, 18, 36, .45), 0 2px 8px rgba(12, 18, 36, .08);--avatar: 36px;--avatar-gap: 10px;--focus: 0 0 0 3px color-mix(in srgb, var(--gold) 45%, transparent);display:flex;height:100%;width:100%;font-family:Lexend,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased;color:var(--ink);background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-lg)}.panel--narrow{border:0;border-radius:0;box-shadow:none}.panel ::selection{background:color-mix(in srgb,var(--gold) 35%,transparent)}.panel :focus-visible{outline:none;box-shadow:var(--focus);border-radius:var(--r-sm)}.panel__error{flex:1;display:flex;align-items:center;justify-content:center;color:var(--ink-muted);padding:24px;text-align:center}.sidebar__list,.thread{scrollbar-width:thin;scrollbar-color:transparent transparent}.sidebar__list:hover,.thread:hover{scrollbar-color:var(--border-strong) transparent}.sidebar__list::-webkit-scrollbar,.thread::-webkit-scrollbar{width:10px;height:10px}.sidebar__list::-webkit-scrollbar-thumb,.thread::-webkit-scrollbar-thumb{border:3px solid transparent;border-radius:var(--r-pill);background-clip:content-box;background-color:transparent}.sidebar__list:hover::-webkit-scrollbar-thumb,.thread:hover::-webkit-scrollbar-thumb{background-color:var(--border-strong)}.avatar{flex:none;width:var(--avatar);height:var(--avatar);border-radius:var(--r-pill);display:flex;align-items:center;justify-content:center;font-size:12.5px;font-weight:600;letter-spacing:.01em;user-select:none;background:var(--surface-sunken);color:var(--ink-muted)}.avatar__glyph{width:58%;height:58%}.avatar--t0{background:#e3e9f5;color:#34496f}.avatar--t1{background:#fcefcf;color:#8a6708}.avatar--t2{background:#ece6f4;color:#66497f}.avatar--t3{background:#dcefe9;color:#1f6b5a}.avatar--t4{background:#e2ecf6;color:#2f5f83}.avatar--t5{background:#f7e5e9;color:#8b3b52}.avatar--agent{background:var(--accent);color:var(--on-accent)}.avatar--human{background:var(--gold);color:#3c2d02}.sidebar{width:340px;flex:none;border-right:1px solid var(--border);display:flex;flex-direction:column;background:var(--surface);min-height:0}.panel--narrow .sidebar{width:100%;border-right:0}.sidebar__list{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain}.thread__older{display:flex;justify-content:center;padding:10px 0 4px}.thread__older-spinner{width:16px;height:16px;border:2px solid var(--border);border-top-color:var(--ink-faint);border-radius:50%;animation:thread-older-spin .8s linear infinite}@keyframes thread-older-spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.thread__older-spinner{animation:none}}.blank{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;height:100%;padding:40px 28px;text-align:center}.blank__mark{width:44px;height:44px;margin-bottom:10px;border-radius:var(--r-pill);display:flex;align-items:center;justify-content:center;background:var(--accent-soft);color:color-mix(in srgb,var(--accent) 70%,#fff)}.blank__mark svg{width:22px;height:22px}.blank__title{font-size:14px;font-weight:600;color:var(--ink)}.blank__hint{font-size:12.5px;line-height:1.5;color:var(--ink-faint);max-width:30ch}.row{position:relative;display:flex;align-items:flex-start;gap:var(--avatar-gap);width:100%;padding:12px 14px 12px 16px;border:0;background:transparent;text-align:left;cursor:pointer;font:inherit;color:inherit;transition:background .12s ease}.row+.row:before,.row+.row--skeleton:before{content:"";position:absolute;top:0;left:calc(16px + var(--avatar) + var(--avatar-gap));right:0;border-top:1px solid var(--border)}.row:hover{background:var(--surface-sunken)}.row--active,.row--active:hover{background:var(--accent-softer)}.row--active:after{content:"";position:absolute;top:6px;bottom:6px;left:0;width:3px;border-radius:0 3px 3px 0;background:var(--gold)}.row--active+.row:before{border-top-color:transparent}.row__body{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}.row__title-line{display:flex;align-items:center;gap:6px;min-width:0}.row__title{flex:1;min-width:0;font-weight:600;font-size:13.5px;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.row--active .row__title{color:var(--accent)}.row__flag{font-size:11px;flex:none;line-height:1}.row__time{flex:none;font-size:11px;font-variant-numeric:tabular-nums;color:var(--ink-faint)}.row__meta{display:flex;align-items:center;gap:6px;min-width:0}.row__preview{flex:1;min-width:0;color:var(--ink-muted);font-size:12.5px;line-height:1.45;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.skeleton{--skeleton-base: color-mix(in srgb, var(--ink-faint) 22%, var(--surface));--skeleton-sheen: color-mix(in srgb, var(--ink-faint) 40%, var(--surface));flex:none;border-radius:var(--r-sm);background:linear-gradient(90deg,var(--skeleton-base) 25%,var(--skeleton-sheen) 50%,var(--skeleton-base) 75%);background-size:200% 100%;animation:shimmer 1.4s infinite}.skeleton--bubble{flex:1;height:40px;border-radius:var(--r-bubble)}.skeleton--visitor{border-bottom-left-radius:5px}.skeleton--agent{--skeleton-base: color-mix(in srgb, var(--accent) 20%, var(--surface));--skeleton-sheen: color-mix(in srgb, var(--accent) 34%, var(--surface));border-bottom-right-radius:5px}.skeleton--line{height:13px;max-width:100%}.skeleton--line-sm{height:10px;margin-top:6px}.skeleton--avatar{width:var(--avatar);height:var(--avatar);border-radius:var(--r-pill)}.row--skeleton{position:relative;height:64px;cursor:default;background:linear-gradient(90deg,color-mix(in srgb,var(--ink-faint) 11%,var(--surface)) 25%,color-mix(in srgb,var(--ink-faint) 22%,var(--surface)),color-mix(in srgb,var(--ink-faint) 11%,var(--surface)) 75%);background-size:200% 100%;animation:shimmer 1.4s infinite}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.main{position:relative;flex:1;display:flex;flex-direction:column;min-width:0;min-height:0;background:var(--surface-sunken)}.main--placeholder{align-items:center;justify-content:center}.banner{display:flex;align-items:center;gap:7px;padding:8px 18px;background:var(--gold-soft);border-bottom:1px solid var(--gold-line);color:var(--gold-ink);font-size:12px;font-weight:600}.banner:before{content:"";flex:none;width:6px;height:6px;border-radius:var(--r-pill);background:var(--gold);box-shadow:0 0 0 3px color-mix(in srgb,var(--gold) 28%,transparent)}.thread{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:18px 20px 22px;background:radial-gradient(circle at 1px 1px,color-mix(in srgb,var(--ink-faint) 11%,transparent) 1px,transparent 0) 0 0 / 24px 24px}.thread__col{display:flex;flex-direction:column;gap:8px;width:100%;max-width:880px;margin:0 auto;min-height:100%;justify-content:flex-end}.msg{display:flex;align-items:flex-end;gap:var(--avatar-gap);max-width:78%}.msg--visitor{align-self:flex-start}.msg--agent{align-self:flex-end;flex-direction:row-reverse}.msg__spacer{flex:none;width:var(--avatar)}.msg .avatar{--avatar: 28px;margin-bottom:2px}.msg__spacer{width:28px}.msg--grouped{margin-bottom:-5px}.bubble{min-width:0;max-width:100%;padding:9px 14px;border-radius:var(--r-bubble);line-height:1.5;word-break:break-word;transition:outline-color .12s ease,box-shadow .2s ease}.bubble__text{white-space:pre-wrap}.bubble__foot{display:flex;align-items:center;justify-content:flex-end;gap:5px;margin-top:3px;font-size:10.5px;line-height:1;font-variant-numeric:tabular-nums;opacity:.6}.bubble--visitor .bubble__foot{justify-content:flex-start}.bubble__ticks--read{color:#38bdf8;opacity:1}.bubble__ticks--failed{color:#fca5a5;font-weight:700;opacity:1}.bubble--visitor .bubble__ticks--read{color:#0284c7}.bubble--visitor{background:var(--surface);color:var(--ink);border:1px solid var(--border);box-shadow:var(--shadow-xs);border-bottom-left-radius:5px}.bubble--agent{background:var(--accent);color:var(--on-accent);box-shadow:var(--shadow-sm);border-bottom-right-radius:5px}.bubble--agent.bubble--human{background:var(--gold-soft);color:#4a3703;border:1px solid var(--gold-line);box-shadow:var(--shadow-xs)}.bubble--target{box-shadow:0 0 0 3px var(--gold),var(--shadow-md)}.msg--grouped .bubble--agent{border-bottom-right-radius:var(--r-bubble)}.msg--grouped .bubble--visitor{border-bottom-left-radius:var(--r-bubble)}.bubble--related{outline:2px solid color-mix(in srgb,var(--accent) 40%,#fff);outline-offset:2px}.bubble__unseen{margin-top:7px;padding-top:6px;border-top:1px solid color-mix(in srgb,#b45309 22%,transparent);font-size:11px;line-height:1.35;color:#b45309}.bubble--agent .bubble__unseen{border-top-color:#ffffff47;color:#fcd34d}.bubble--human .bubble__unseen{border-top-color:color-mix(in srgb,#b45309 28%,transparent);color:#92400e}.bubble__quote{display:flex;flex-direction:column;gap:1px;margin-bottom:6px;padding:5px 9px;border-left:3px solid color-mix(in srgb,var(--accent) 35%,#fff);border-radius:var(--r-xs);background:var(--accent-soft);font-size:12px;line-height:1.4}.bubble--agent .bubble__quote{border-left-color:#ffffff80;background:#ffffff21}.bubble--human .bubble__quote{border-left-color:var(--gold);background:#ffffff8c}.bubble__quote-label{font-size:10.5px;font-weight:600;opacity:.7}.bubble__quote-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;opacity:.85}.attachments{display:flex;flex-direction:column;gap:6px;margin-bottom:5px}.attachment--image{display:block;line-height:0}.attachment--image img{display:block;max-width:100%;max-height:320px;border-radius:var(--r-md)}.attachment--audio{display:block;width:240px;max-width:100%;height:36px}.attachment--video{display:block;max-width:100%;max-height:320px;border-radius:var(--r-md);background:#000}.attachment--file{display:flex;align-items:baseline;gap:7px;padding:8px 11px;border-radius:var(--r-sm);background:#7f7f7f21;color:inherit;text-decoration:none;font-size:13px}.attachment--file:hover{text-decoration:underline}.attachment__name{word-break:break-all}.attachment__size{font-size:11px;opacity:.7;white-space:nowrap}.attachment--missing{font-size:12.5px;font-style:italic;opacity:.75}.day{display:flex;align-items:center;gap:12px;margin:10px 0 2px;font-size:11px;font-weight:600;letter-spacing:.02em;color:var(--ink-faint)}.day:before,.day:after{content:"";flex:1;border-top:1px solid var(--border)}.day span{flex:none;padding:3px 11px;border-radius:var(--r-pill);border:1px solid var(--border);background:var(--surface)}.header{flex:none;display:flex;align-items:center;gap:10px;padding:10px 18px;border-bottom:1px solid var(--border);background:var(--surface)}.iconbtn{flex:none;display:flex;align-items:center;justify-content:center;width:34px;height:34px;padding:0;border:0;border-radius:var(--r-sm);background:transparent;color:var(--ink-muted);font-size:15px;line-height:1;cursor:pointer;transition:background .12s ease,color .12s ease,opacity .12s ease}.iconbtn:hover{background:var(--surface-sunken);color:var(--ink)}.iconbtn svg{width:18px;height:18px}.header__back{margin-left:-6px}.header__identity{flex:1;min-width:0}.header__line{display:flex;align-items:center;flex-wrap:wrap;gap:6px}.header__name{font-weight:600;font-size:15px;letter-spacing:-.005em;color:var(--ink);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.header__meta{display:flex;flex-wrap:wrap;gap:2px 10px;margin-top:1px;font-size:11.5px;color:var(--ink-faint)}.header__fact+.header__fact:before{content:"·";margin-right:10px}.header__actions{flex:none;display:flex;align-items:center;gap:2px}.rate{font-size:14px;opacity:.45}.rate:hover{opacity:.9}.rate--on,.rate--on:hover{opacity:1;background:var(--gold-soft)}.chip{flex:none;padding:1px 7px;border-radius:var(--r-xs);border:1px solid var(--border);background:var(--surface-sunken);color:var(--ink-muted);font-size:9.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;line-height:1.7;white-space:nowrap}.chip--whatsapp{border-color:#a7ebc2;background:#e8faee;color:#15803d}.chip--instagram{border-color:#f5c3da;background:#fdeaf3;color:#be185d}.chip--web{border-color:#c7dcfb;background:#eff5ff;color:#1d4ed8}.chip--email,.chip--cli,.chip--api{border-color:var(--border);background:var(--surface-sunken);color:var(--ink-muted)}.chip--preview{border-color:#ded6fd;background:#f6f3ff;color:#6d28d9}.chip--ok{border-color:#a7f3d0;background:#ecfdf5;color:#047857}.chip--warn{border-color:#fcd34d;background:#fffbeb;color:#b45309}.chip--id{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;text-transform:none;letter-spacing:0;cursor:pointer}.chip--id:hover{border-color:var(--ink-faint);color:var(--ink)}.composer{flex:none;display:flex;flex-direction:column;align-items:center;gap:8px;padding:12px 18px 14px;border-top:1px solid var(--border);background:var(--surface)}.composer__field,.composer__row{width:100%;max-width:880px}.composer__field{display:flex;align-items:flex-end;gap:8px;padding:6px 6px 6px 12px;border:1px solid var(--border-strong);border-radius:var(--r-md);background:var(--surface);box-shadow:var(--shadow-xs);transition:border-color .12s ease,box-shadow .12s ease}.composer__field:focus-within{border-color:var(--gold);box-shadow:var(--focus)}.composer__input{flex:1;min-width:0;resize:none;border:0;outline:none;background:transparent;padding:7px 0;font-size:14px;line-height:1.5;max-height:120px;color:var(--ink);font-family:inherit}.composer__input::placeholder{color:var(--ink-faint)}.composer__send{flex:none;display:flex;align-items:center;gap:6px;border:0;border-radius:var(--r-sm);padding:8px 12px;font:inherit;font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap;background:var(--gold);color:#3c2d02;transition:filter .12s ease,opacity .12s ease}.composer__send:hover:not(:disabled){filter:brightness(1.06)}.composer__send:disabled{opacity:.55;cursor:default}.composer__send svg{width:15px;height:15px}.composer__row{display:flex;align-items:center;gap:10px}.composer__release{border:1px solid var(--border);border-radius:var(--r-sm);background:var(--surface);color:var(--ink-muted);padding:5px 10px;font:inherit;font-size:12px;font-weight:600;cursor:pointer;transition:background .12s ease,color .12s ease,border-color .12s ease}.composer__release:hover{background:var(--surface-sunken);border-color:var(--border-strong);color:var(--ink)}.composer__hint{margin-left:auto;font-size:11px;color:var(--ink-faint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.panel--narrow .header{padding:8px 12px;gap:6px}.panel--narrow .header__name{font-size:15px}.panel--narrow .header__line{flex-wrap:nowrap;overflow:hidden}.panel--narrow .header .chip--state,.panel--narrow .header .chip--id,.panel--narrow .header__fact--when{display:none}.panel--narrow .header__meta{flex-wrap:nowrap;overflow:hidden;white-space:nowrap}.panel--narrow .thread{padding:14px 12px 18px}.panel--narrow .msg{max-width:88%}.panel--narrow .bubble{padding:8px 12px}.panel--narrow .row{padding:12px 14px}.panel--narrow .row+.row:before{left:calc(14px + var(--avatar) + var(--avatar-gap))}.panel--narrow .banner{padding:8px 12px}.panel--narrow .composer{padding:10px 12px;padding-bottom:max(10px,env(safe-area-inset-bottom))}.panel--narrow .composer__input{font-size:16px}.panel--narrow .composer__send{width:40px;height:40px;padding:0;justify-content:center;border-radius:var(--r-sm)}.panel--narrow .composer__send-label,.panel--narrow .composer__hint{display:none}.panel--narrow .iconbtn{width:40px;height:40px}@media(prefers-reduced-motion:reduce){.skeleton,.row--skeleton{animation:none}.panel *{transition:none!important}}:root{--shell-navy: #293858;--shell-gold: #f7bc13;--shell-cream: #f2f1d3;--shell-ink: #17203a;--shell-ink-muted: #4f5d7a;--shell-surface: #ffffff;--shell-sunken: #f5f7fc;--shell-line: #e3e8f2;--shell-danger: #b3261e}html,body{height:100%;margin:0;background:var(--shell-sunken);color:var(--shell-ink);font:16px/1.5 -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;-webkit-font-smoothing:antialiased}#root{height:100%}.shell{display:flex;flex-direction:column;height:100%;min-height:0}.shell--inbox{background:var(--shell-surface)}.shell__panel{flex:1;min-height:0}.shell__center{display:flex;flex:1;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:24px 16px;text-align:center}.shell__note{color:var(--shell-ink-muted);font-size:14px;max-width:34ch}.shell__note--strong{color:var(--shell-ink);font-size:18px;font-weight:600}.shell__spinner{width:22px;height:22px;border:2px solid var(--shell-line);border-top-color:var(--shell-navy);border-radius:50%;animation:shell-spin .8s linear infinite}@keyframes shell-spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.shell__spinner{animation:none;border-top-color:var(--shell-line)}}.shell__link{background:none;border:0;color:var(--shell-navy);cursor:pointer;font:inherit;font-size:14px;padding:6px;text-decoration:underline}.topbar{align-items:center;background:var(--shell-navy);color:var(--shell-cream);display:flex;flex:none;gap:12px;padding:0 16px;height:48px}.topbar__name{font-size:15px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.topbar__deploy{flex:none;padding:2px 8px;border-radius:999px;background:color-mix(in srgb,var(--shell-gold) 22%,transparent);color:var(--shell-cream);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11.5px;max-width:40%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.topbar__spacer{flex:1}.topbar__who{color:color-mix(in srgb,var(--shell-cream) 72%,transparent);font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media(max-width:520px){.topbar__who{display:none}}.topbar__signout{background:none;border:1px solid color-mix(in srgb,var(--shell-cream) 34%,transparent);border-radius:999px;color:var(--shell-cream);cursor:pointer;font:inherit;font-size:13px;padding:4px 12px}.topbar__signout:hover{border-color:var(--shell-gold);color:var(--shell-gold)}.picker{display:flex;flex-direction:column;gap:8px;list-style:none;margin:12px 0 0;padding:0;width:min(420px,100%)}.picker__row{background:var(--shell-surface);border:1px solid var(--shell-line);border-radius:12px;cursor:pointer;display:flex;flex-direction:column;font:inherit;gap:2px;padding:14px 16px;text-align:left;width:100%}.picker__row:hover{border-color:var(--shell-navy)}.picker__name{color:var(--shell-ink);font-weight:600}.picker__title{color:var(--shell-ink-muted);font-size:13px}.signin{align-items:center;display:flex;justify-content:center;min-height:100%;padding:24px 16px}.signin__card{background:var(--shell-surface);border:1px solid var(--shell-line);border-radius:16px;display:flex;flex-direction:column;gap:4px;padding:28px 24px;width:min(380px,100%)}.signin__mark{align-items:center;background:var(--shell-navy);border-radius:12px;color:var(--shell-cream);display:flex;height:40px;justify-content:center;margin-bottom:12px;width:40px}.signin__mark svg{height:22px;width:22px}.signin__title{font-size:21px;font-weight:650;margin:0}.signin__lead{color:var(--shell-ink-muted);font-size:14px;margin:0 0 12px}.signin__notice{background:var(--shell-sunken);border-radius:8px;color:var(--shell-ink-muted);font-size:13px;margin:0 0 12px;padding:8px 10px}.signin__field{display:flex;flex-direction:column;gap:6px}.signin__label{color:var(--shell-ink-muted);font-size:13px}.signin__input{border:1px solid var(--shell-line);border-radius:10px;color:var(--shell-ink);font:inherit;font-size:16px;padding:10px 12px;width:100%}.signin__input:focus{border-color:var(--shell-gold);outline:2px solid color-mix(in srgb,var(--shell-gold) 40%,transparent);outline-offset:1px}.signin__input--code{font-size:22px;letter-spacing:.24em;text-align:center}.signin__error{color:var(--shell-danger);font-size:13px;margin:8px 0 0}.signin__submit{background:var(--shell-navy);border:0;border-radius:10px;color:var(--shell-cream);cursor:pointer;font:inherit;font-size:15px;font-weight:600;margin-top:16px;padding:11px 16px}.signin__submit:disabled{cursor:default;opacity:.6}.signin__alt{display:flex;gap:16px;justify-content:center;margin-top:12px}.signin__link{background:none;border:0;color:var(--shell-ink-muted);cursor:pointer;font:inherit;font-size:13px;padding:4px;text-decoration:underline}.signin__link:hover{color:var(--shell-navy)}.signin__link:disabled{cursor:default;opacity:.6}