:root{color:#202127;font-synthesis:none;--coral:#f55249;--coral-soft:#fff0ee;--ink:#202127;--muted:#737884;--line:#e8e9ed;--soft:#f7f8fa;--mint:#27a97b;background:#fff;font-family:Inter,SF Pro Display,PingFang SC,Microsoft YaHei,system-ui,sans-serif}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}button,input,textarea,select{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline-offset:2px;outline:3px solid #f5524933}.brand{color:var(--ink);letter-spacing:-.5px;align-items:center;gap:10px;font-size:22px;font-weight:750;display:inline-flex}.brand-mark{width:34px;height:34px;color:var(--coral);place-items:center;display:grid}.brand-mark svg{width:100%;height:100%}.brand--compact .brand-mark{width:36px;height:36px}.brand--inverse,.brand--inverse .brand-mark{color:#fff}.text-link{color:#4f535d;font-size:14px;font-weight:600;text-decoration:none}.text-link:hover{color:var(--coral)}.visitor-page{background:#fff;min-height:100vh}.visitor-header{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;max-width:1240px;height:82px;margin:0 auto;padding:0 34px;display:flex}.visitor-layout{grid-template-columns:minmax(320px,1fr) 490px;align-items:center;gap:88px;max-width:1240px;min-height:calc(100vh - 82px);margin:0 auto;padding:48px 34px;display:grid}.visitor-intro{max-width:570px;padding-bottom:24px}.visitor-intro h1{letter-spacing:-4px;margin:0;font-size:clamp(48px,6vw,78px);font-weight:760;line-height:1.05}.visitor-intro>p{max-width:530px;color:var(--muted);margin:28px 0 42px;font-size:18px;line-height:1.8}.service-points{gap:18px;display:grid}.service-points>div{color:var(--muted);align-items:center;gap:15px;font-size:14px;display:flex}.service-points svg{width:20px;color:var(--coral)}.service-points span{gap:9px;display:flex}.service-points strong{color:var(--ink);min-width:70px}.chat-shell{background:#fff;border:1px solid #dfe1e6;border-radius:18px;flex-direction:column;min-height:650px;display:flex;overflow:hidden;box-shadow:0 18px 50px #23262e14}.chat-topbar{background:var(--coral);color:#fff;align-items:center;gap:12px;min-height:76px;padding:15px 20px;display:flex}.chat-topbar>div:nth-child(2){gap:4px;display:grid}.chat-topbar strong{font-size:15px}.chat-topbar span{opacity:.9;align-items:center;gap:6px;font-size:12px;display:flex}.chat-topbar span i,.agent-profile i{background:#68d49d;border-radius:50%;width:7px;height:7px;display:inline-block}.chat-reset{color:#fff;background:0 0;border:1px solid #ffffff73;border-radius:8px;margin-left:auto;padding:7px 10px;font-size:12px}.start-form{flex-direction:column;flex:1;padding:34px 36px 20px;display:flex}.welcome-icon{background:var(--coral-soft);width:42px;height:42px;color:var(--coral);border-radius:12px;place-items:center;display:grid}.welcome-icon svg{width:21px}.start-form h2{letter-spacing:-.6px;margin:18px 0 6px;font-size:25px}.start-form>p{color:var(--muted);margin:0 0 24px;font-size:14px}.start-form label,.login-panel label{color:#4d515b;gap:7px;margin-bottom:15px;font-size:13px;font-weight:650;display:grid}.field-hint{color:#858a94;font-size:11px;font-weight:400;line-height:1.55}input,textarea,select{width:100%;color:var(--ink);background:#fff;border:1px solid #dfe1e6;border-radius:10px;transition:border-color .15s,box-shadow .15s}input{height:44px;padding:0 13px}textarea{resize:none;padding:12px 13px;line-height:1.55}input::placeholder,textarea::placeholder{color:#a0a4ad}input:focus,textarea:focus,select:focus{border-color:var(--coral);outline:none;box-shadow:0 0 0 3px #f5524917}.honeypot{width:1px;height:1px;position:absolute;left:-10000px}.primary-button{background:var(--coral);color:#fff;border:0;border-radius:10px;justify-content:center;align-items:center;gap:8px;min-height:46px;font-size:14px;font-weight:700;display:flex}.primary-button:hover:not(:disabled){background:#e9473f}.primary-button:disabled{opacity:.6;cursor:wait}.primary-button svg{width:18px}.form-error{color:#c7352f!important;margin:0 0 12px!important;font-size:13px!important}.chat-footer{color:#a2a5ad;border-top:1px solid var(--line);flex:none;place-items:center;height:40px;font-size:11px;display:grid}.active-chat{flex-direction:column;flex:1;min-height:0;display:flex}.ticket-strip{border-bottom:1px solid var(--line);align-items:center;gap:9px;height:50px;padding:0 18px;font-size:13px;display:flex}.ticket-strip>span:nth-child(2){text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.ticket-strip small{color:var(--muted);margin-left:auto}.status-dot{background:#f1a43c;border-radius:50%;width:8px;height:8px}.status-dot--active{background:#448ee4}.status-dot--resolved{background:var(--mint)}.message-feed{background:#fbfbfc;flex:1;min-height:420px;max-height:500px;padding:22px 18px;overflow-y:auto}.message-row{align-items:flex-start;gap:9px;margin:0 0 18px;display:flex}.message-row--visitor{justify-content:flex-end}.message-avatar{background:var(--coral);color:#fff;border-radius:9px;flex:none;place-items:center;width:29px;height:29px;font-size:12px;font-weight:800;display:grid}.message-row>div{max-width:78%}.message-row .bubble,.admin-message .bubble{border:1px solid var(--line);white-space:pre-wrap;overflow-wrap:anywhere;background:#fff;border-radius:4px 12px 12px;padding:10px 13px;font-size:14px;line-height:1.6}.message-row--visitor .bubble{background:var(--coral-soft);border-color:#ffd8d4;border-radius:12px 4px 12px 12px}.message-row time,.admin-message time{color:#a0a4ad;align-items:center;gap:4px;margin-top:5px;font-size:10px;display:flex}.message-row--visitor time{justify-content:flex-end}.chat-error{padding:6px 16px 0}.chat-composer{border:1px solid #dfe1e6;border-radius:11px;align-items:flex-end;gap:8px;margin:0 14px 14px;padding:9px;display:flex}.chat-composer textarea{box-shadow:none;border:0;min-height:45px;padding:5px 4px}.chat-composer button{background:var(--coral);color:#fff;border:0;border-radius:9px;flex:none;place-items:center;width:39px;height:39px;display:grid}.chat-composer button:disabled{background:#d6d8dd}.chat-composer svg{width:17px}.login-page{background:#f7f8fa;place-items:center;min-height:100vh;padding:30px;display:grid;position:relative}.login-brand{text-decoration:none;position:absolute;top:30px;left:34px}.login-panel{border:1px solid var(--line);background:#fff;border-radius:18px;width:min(430px,100%);padding:42px}.login-icon{width:46px;height:46px;color:var(--coral);background:var(--coral-soft);border-radius:13px;place-items:center;display:grid}.login-panel h1{letter-spacing:-.7px;margin:22px 0 8px;font-size:28px}.login-panel>p{color:var(--muted);margin:0 0 28px;font-size:14px;line-height:1.7}.login-panel small{text-align:center;color:#9a9ea7;margin-top:17px;font-size:11px;display:block}.app-loading{place-content:center;justify-items:center;gap:25px;min-height:100vh;display:grid}.app-loading>span{border:2px solid var(--line);border-top-color:var(--coral);border-radius:50%;width:28px;height:28px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.admin-shell{background:#fff;grid-template-rows:minmax(0,1fr);grid-template-columns:220px 330px minmax(410px,1fr) 280px;min-width:980px;height:100vh;display:grid;overflow:hidden}.admin-nav{border-right:1px solid var(--line);flex-direction:column;padding:24px 17px 16px;display:flex}.nav-brand{padding:0 7px}.admin-nav>p{margin:20px 8px 14px;font-size:17px;font-weight:750}.admin-nav nav{gap:5px;display:grid}.admin-nav nav button{color:#515660;text-align:left;background:0 0;border:0;border-radius:9px;align-items:center;gap:12px;min-height:44px;padding:0 12px;font-size:13px;font-weight:600;display:flex}.admin-nav nav button svg{width:18px}.admin-nav nav button span{background:var(--coral);color:#fff;border-radius:11px;place-items:center;min-width:21px;height:21px;margin-left:auto;padding:0 6px;font-size:11px;display:grid}.admin-nav nav button.active{background:var(--coral-soft);color:var(--coral)}.admin-nav nav button:disabled{cursor:default;opacity:.65}.agent-profile{border-top:1px solid var(--line);align-items:center;gap:10px;margin-top:auto;padding:14px 8px;display:flex}.large-avatar{color:#4d515a;background:#edeef1;border-radius:50%;flex:none;place-items:center;width:39px;height:39px;font-weight:700;display:grid}.agent-profile>div{gap:3px;min-width:0;display:grid}.agent-profile strong{font-size:13px}.agent-profile small{color:var(--muted);align-items:center;gap:5px;font-size:11px;display:flex}.agent-profile>svg{color:#91959d;width:14px;margin-left:auto}.logout-button{color:#8b8f98;background:0 0;border:0;align-items:center;gap:8px;height:38px;padding:0 10px;font-size:12px;display:flex}.logout-button svg{width:15px}.conversation-column{border-right:1px solid var(--line);flex-direction:column;min-width:0;min-height:0;display:flex;overflow:hidden}.column-heading{align-items:center;gap:10px;height:73px;padding:0 18px;display:flex}.column-heading h1{margin:0;font-size:20px}.column-heading>span{min-width:22px;height:22px;color:var(--muted);background:#f0f1f3;border-radius:11px;place-items:center;font-size:11px;display:grid}.search-field{border:1px solid #dfe1e6;border-radius:9px;align-items:center;gap:8px;height:41px;margin:0 14px 13px;padding:0 11px;display:flex}.search-field svg{color:#7f838c;width:17px}.search-field input{height:auto;box-shadow:none;border:0;padding:0;font-size:13px}.filter-row{border-bottom:1px solid var(--line);gap:5px;padding:0 14px 13px;display:flex;overflow-x:auto}.filter-row button{border:1px solid var(--line);color:#6d717b;background:#fff;border-radius:8px;min-width:max-content;padding:7px 9px;font-size:11px}.filter-row button span{opacity:.65;margin-left:4px}.filter-row button.active{background:var(--coral);border-color:var(--coral);color:#fff}.conversation-list{flex:1;overflow-y:auto}.conversation-item{border:0;border-bottom:1px solid var(--line);text-align:left;background:#fff;align-items:flex-start;gap:11px;width:100%;min-height:110px;padding:18px 17px;display:flex;position:relative}.conversation-item:before{content:"";background:0 0;width:3px;position:absolute;inset:0 auto 0 0}.conversation-item:hover{background:#fbfbfc}.conversation-item.selected{background:#fff5f3}.conversation-item.selected:before{background:var(--coral)}.avatar{color:#555963;background:#eff0f2;border-radius:50%;flex:none;place-items:center;width:35px;height:35px;font-size:14px;font-weight:650;display:grid}.conversation-copy{flex:1;gap:7px;min-width:0;display:grid}.conversation-meta{justify-content:space-between;gap:8px;display:flex}.conversation-meta strong{font-size:14px}.conversation-meta time{color:#969aa3;font-size:10px}.conversation-preview{text-overflow:ellipsis;white-space:nowrap;color:#6e737d;font-size:12px;overflow:hidden}.conversation-tags{gap:5px;display:flex}.tag{border-radius:5px;padding:3px 6px;font-size:9px;font-style:normal}.tag--pending{color:#397fc9;background:#e8f3ff}.tag--active{color:#c9781d;background:#fff0df}.tag--resolved{color:#218b65;background:#e6f7ef}.priority--low{color:#268a69;background:#e9f7f2}.priority--normal{color:#cc7a1b;background:#fff3e3}.priority--high{color:#dc453e;background:#ffe9e7}.unread{background:var(--coral);color:#fff;border-radius:10px;place-items:center;min-width:19px;height:19px;padding:0 5px;font-size:9px;display:grid;position:absolute;bottom:17px;right:15px}.empty-list{text-align:center;color:#92969f;padding:80px 20px}.empty-list span{color:#555963;font-size:14px;font-weight:700}.empty-list p{margin:8px 0;font-size:12px}.chat-column{background:#fbfbfc;flex-direction:column;min-width:0;min-height:0;display:flex}.chat-column--empty{color:#9a9ea7;place-content:center;justify-items:center;display:grid}.chat-column--empty>span{width:55px;height:55px;color:var(--coral);background:var(--coral-soft);border-radius:16px;place-items:center;display:grid}.chat-column--empty h2{color:#4b4f58;margin:18px 0 4px;font-size:17px}.chat-column--empty p{margin:0;font-size:12px}.conversation-header{border-bottom:1px solid var(--line);background:#fff;flex:none;justify-content:space-between;align-items:center;height:73px;padding:0 20px;display:flex}.conversation-header h2{margin:0 0 5px;font-size:16px}.conversation-header p{color:#8b8f98;margin:0;font-size:11px}.mobile-back{width:34px;height:34px;color:var(--coral);background:0 0;border:0;border-radius:8px;display:none}.mobile-back svg{width:20px}.live-state{color:#777b84;align-items:center;gap:6px;font-size:11px;display:flex}.live-state i{background:var(--mint);border-radius:50%;width:7px;height:7px}.admin-message-feed{flex:1;min-height:0;padding:24px 21px;overflow:hidden auto}.admin-message{align-items:flex-start;gap:9px;margin-bottom:20px;display:flex}.admin-message>div{min-width:0;max-width:min(70%,560px)}.admin-message .bubble{word-break:break-word;overflow-wrap:anywhere;min-width:0;max-width:100%}.admin-message--agent{justify-content:flex-end}.admin-message--agent .bubble{background:var(--coral-soft);border-color:#ffd6d2;border-radius:12px 4px 12px 12px}.admin-message--agent time{justify-content:flex-end}.admin-message time svg{width:12px;color:var(--mint)}.message-status{color:#9a9ea7;align-items:center;gap:3px;display:inline-flex}.message-status svg{color:currentColor!important}.message-status--read{color:var(--mint)}.agent-composer{background:#fff;border:1px solid #dfe1e6;border-radius:11px;flex:none;margin:0 16px 12px;overflow:hidden}.composer-tabs{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;height:38px;padding:0 12px;display:flex}.composer-tabs button{border:0;border-bottom:2px solid var(--coral);color:var(--ink);background:0 0;align-self:stretch;font-size:11px;font-weight:700}.composer-tabs span{color:#a0a4ac;font-size:9px}.agent-composer textarea{min-height:75px;box-shadow:none;border:0;border-radius:0;font-size:13px}.composer-actions{justify-content:space-between;align-items:center;padding:0 10px 10px;display:flex}.composer-actions>span{color:#a0a4ac;font-size:9px}.composer-actions button{background:var(--coral);color:#fff;border:0;border-radius:8px;align-items:center;gap:7px;height:34px;padding:0 14px;font-size:12px;font-weight:700;display:flex}.composer-actions button:disabled{cursor:default;background:#d7d9dd}.composer-actions svg{width:14px}.quick-replies{border-top:1px solid var(--line);background:#fff;min-height:58px;padding:8px 16px 11px}.quick-replies>strong{margin-bottom:7px;font-size:10px;display:block}.quick-replies>div{gap:7px;display:flex;overflow-x:auto}.quick-replies button{border:1px solid var(--line);text-overflow:ellipsis;white-space:nowrap;color:#626670;background:#fff;border-radius:7px;max-width:220px;padding:7px 10px;font-size:10px;overflow:hidden}.details-column{border-left:1px solid var(--line);background:#fff;min-height:0;position:relative;overflow-y:auto}.details-close{color:#8b8f98;background:0 0;border:0;border-radius:8px;place-items:center;width:34px;height:34px;display:none;position:absolute;top:14px;right:12px}.details-close svg{width:19px}.details-toggle{width:34px;height:34px;color:var(--coral);background:0 0;border:0;border-radius:8px;flex:none;place-items:center;margin-left:12px;display:none}.details-toggle svg{width:20px}.details-backdrop{z-index:6;background:#20212761;border:0;display:none;position:fixed;inset:0}.details-column section{border-bottom:1px solid var(--line);padding:23px 17px}.details-column h2{margin:0 0 18px;font-size:14px}.visitor-card{border:1px solid var(--line);border-radius:11px;align-items:center;gap:11px;margin-bottom:17px;padding:14px;display:flex}.visitor-card>div{gap:4px;display:grid}.visitor-card strong{font-size:13px}.visitor-card small{color:#92969f;font-size:10px}.details-column dl{margin:0;display:grid}.details-column dl>div{border-bottom:1px solid #f0f1f3;padding:11px 1px}.details-column dt{color:#8a8e97;align-items:center;gap:7px;font-size:10px;display:flex}.details-column dt svg{width:13px}.details-column dd{color:#51555e;overflow-wrap:anywhere;margin:5px 0 0 20px;font-size:11px}.ticket-details label{color:#6f737c;grid-template-columns:65px 1fr;align-items:center;gap:8px;margin-bottom:12px;font-size:11px;display:grid}.ticket-details select{height:36px;padding:0 9px;font-size:11px}.ticket-subject{border-top:1px solid var(--line);gap:7px;margin:17px 0;padding-top:15px;display:grid}.ticket-subject span{color:#8d919a;font-size:10px}.ticket-subject strong{font-size:12px;line-height:1.5}.resolve-button,.reopen-button{border:1px solid var(--coral);width:100%;height:39px;color:var(--coral);background:#fff;border-radius:8px;font-size:11px;font-weight:700}.reopen-button{color:#4380bf;border-color:#4380bf}.status-note{color:#9b9fa7;text-align:center;margin:9px 0 0;font-size:9px}.admin-error{z-index:5;color:#fff;background:#292b31;border-radius:10px;align-items:center;gap:16px;padding:10px 12px 10px 16px;font-size:12px;display:flex;position:fixed;bottom:20px;left:50%;transform:translate(-50%)}.admin-error button{color:#ffb5b0;background:0 0;border:0;font-size:11px}@media (width<=1260px){.admin-shell{grid-template-columns:190px 310px minmax(400px,1fr)}.details-column{z-index:7;border-left:1px solid var(--line);width:min(330px,90vw);padding-top:8px;transition:transform .22s;position:fixed;top:0;bottom:0;right:0;transform:translate(105%);box-shadow:-20px 0 46px #23262e29}.details-column--open{transform:translate(0)}.details-close,.details-toggle{display:grid}.details-backdrop{display:block}.visitor-layout{gap:48px}}@media (width<=850px){.visitor-page{height:100dvh;min-height:0;overflow:hidden}.visitor-header{height:66px;padding:0 20px}.visitor-layout{height:calc(100dvh - 66px);min-height:0;padding:24px 18px;display:block}.visitor-intro{display:none}.chat-shell{width:100%;height:100%;min-height:0;box-shadow:none;border-radius:14px}.start-form{min-height:0;padding:28px 22px 16px;overflow-y:auto}.message-feed{overscroll-behavior:contain;min-height:0;max-height:none}.chat-composer{margin-bottom:max(14px, env(safe-area-inset-bottom));flex:none}.login-brand{top:22px;left:22px}.login-panel{padding:32px 24px}}@media (width<=1050px){.admin-shell{grid-template-columns:72px 300px minmax(360px,1fr);min-width:0}.admin-nav{align-items:center;padding:19px 10px 13px}.admin-nav .brand>span:last-child,.admin-nav>p,.admin-nav nav button:not(.active),.agent-profile>div,.agent-profile>svg,.logout-button{display:none}.admin-nav nav button.active{justify-content:center;width:46px;padding:0;font-size:0}.admin-nav nav button.active span{margin:-36px 0 0 33px;position:absolute}.agent-profile{padding:12px 0}}@media (width<=760px){.admin-shell{grid-template-rows:minmax(0,1fr);grid-template-columns:1fr;height:100dvh}.admin-nav{display:none}.conversation-column{grid-area:1/1}.chat-column{z-index:2;grid-area:1/1}.chat-column--empty{display:none}.conversation-column:has(+.chat-column:not(.chat-column--empty)){visibility:hidden}.conversation-header{justify-content:flex-start}.mobile-back{place-items:center;margin-right:5px;display:grid}.live-state{margin-left:auto}.quick-replies{display:none}.agent-composer{margin-bottom:max(12px, env(safe-area-inset-bottom))}.agent-composer textarea{min-height:52px}.details-column{width:min(340px,92vw)}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}