:root{font-family:Inter,PingFang SC,Microsoft YaHei,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#172036;background:#eef2f7;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}html,body,#root{min-width:320px;min-height:100%;margin:0}body{min-height:100vh}button,input,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:not-allowed}svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8}.page-loading,.invalid-session,.public-home,.admin-login{display:grid;place-items:center;align-content:center;min-height:100vh}.page-loading{gap:14px;color:#63708a;font-size:.95rem;background:linear-gradient(135deg,#f9fbfd,#e8eef7)}.loading-orb{display:inline-block;width:25px;height:25px;border:3px solid #d6deec;border-top-color:#4667d8;border-radius:50%;animation:spin .75s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.brand-mark{display:grid;place-items:center;width:37px;height:37px;color:#fff;font-weight:750;font-size:1.05rem;letter-spacing:-.06em;background:linear-gradient(145deg,#5678e8,#324fc1);border-radius:12px;box-shadow:0 5px 16px #3c54bc40}.brand-mark--large{width:54px;height:54px;border-radius:17px;font-size:1.55rem}.connection-indicator{display:inline-flex;align-items:center;gap:5px;color:#8b97ab;font-size:.76rem;font-weight:500}.connection-indicator i{width:6px;height:6px;border-radius:50%;background:#a9b3c2}.connection-indicator.is-connected{color:#508468}.connection-indicator.is-connected i{background:#4eba78;box-shadow:0 0 0 3px #4eba7821}.customer-app{display:grid;grid-template-rows:auto minmax(0,1fr) auto auto;width:min(100%,980px);height:100vh;min-height:540px;margin:0 auto;overflow:hidden;background:#f6f8fc;box-shadow:0 0 40px #24335517}.customer-header{display:flex;align-items:center;gap:11px;min-height:70px;padding:12px 24px;color:#fbfcff;background:#202a42;border-bottom:1px solid rgb(255 255 255 / 8%)}.customer-header .brand-mark{width:35px;height:35px;font-size:.95rem;background:linear-gradient(145deg,#6789f8,#4567d2);box-shadow:none}.customer-header h1{margin:0 0 2px;font-size:1rem;font-weight:650;letter-spacing:.01em}.customer-header .connection-indicator{color:#b0bdd8}.customer-header .connection-indicator i{background:#7890b8}.customer-header .connection-indicator.is-connected{color:#a5d9b6}.customer-header .connection-indicator.is-connected i{background:#6bd38e}.customer-header__identity{margin-left:auto;color:#9aa8c4;font-size:.78rem;max-width:35%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.customer-conversation,.admin-message-area{min-height:0;overflow:auto}.customer-conversation{padding:24px clamp(17px,5vw,44px);background:radial-gradient(circle at 90% 10%,#eef2ff 0,transparent 24%),#f6f8fc}.message-list{display:flex;flex-direction:column;gap:20px;max-width:760px;min-height:100%;margin:0 auto}.load-older-button{align-self:center;min-height:28px;padding:4px 11px;color:#71809a;font-size:.73rem;font-weight:600;background:#ffffffb8;border:1px solid #e2e7f0;border-radius:99px;box-shadow:0 1px 4px #2a38580a}.load-older-button:hover:not(:disabled){color:#4866c7;background:#fff;border-color:#cad7f5}.load-older-button:disabled{color:#a6afbd}.message-row{display:flex;align-items:flex-end;gap:9px;max-width:86%}.message-row--mine{align-self:flex-end;flex-direction:row-reverse}.message-avatar{display:grid;flex:0 0 auto;place-items:center;width:30px;height:30px;color:#69748c;font-size:.7rem;font-weight:700;background:#e2e7f1;border-radius:10px}.message-row--mine .message-avatar{color:#4661b4;background:#dce5ff}.message-stack{display:flex;flex-direction:column;align-items:flex-start;min-width:0;gap:4px}.message-row--mine .message-stack{align-items:flex-end}.message-bubble{min-width:44px;padding:10px 13px;overflow-wrap:anywhere;color:#1f2a43;font-size:.94rem;line-height:1.55;background:#fff;border:1px solid #e5e9f1;border-radius:5px 15px 15px;box-shadow:0 2px 8px #3141640d}.message-row--mine .message-bubble{color:#15213d;background:#dce7ff;border-color:#d4dfff;border-radius:15px 5px 15px 15px;box-shadow:none}.message-bubble p{margin:0;white-space:pre-wrap}.message-bubble--image{padding:3px;overflow:hidden;background:#fff}.message-bubble--file{padding:0;background:transparent;border:0;box-shadow:none}.message-stack time{color:#98a3b6;font-size:.7rem;line-height:1}.image-attachment{display:block;max-width:min(340px,58vw);padding:0;overflow:hidden;background:#e9edf6;border:0;border-radius:12px}.image-attachment img{display:block;width:100%;max-height:300px;object-fit:contain}.file-attachment{display:flex;align-items:center;gap:10px;width:min(310px,65vw);min-height:66px;padding:10px 12px;color:#263451;text-decoration:none;background:#fff;border:1px solid #e1e6ef;border-radius:11px;transition:transform .14s ease,box-shadow .14s ease}.file-attachment:hover{transform:translateY(-1px);box-shadow:0 5px 13px #2635581a}.file-attachment__icon{display:grid;flex:0 0 auto;place-items:center;width:32px;height:38px;color:#5372d8;font-size:1.65rem;font-weight:700;background:#ebf0ff;border-radius:8px}.file-attachment__meta{display:flex;min-width:0;flex:1;flex-direction:column;gap:3px}.file-attachment__meta strong{overflow:hidden;color:#2b3854;font-size:.83rem;font-weight:600;text-overflow:ellipsis;white-space:nowrap}.file-attachment__meta small{color:#8995aa;font-size:.72rem}.file-attachment svg{width:18px;height:18px;color:#75839e}.compose-bar{display:flex;align-items:flex-end;gap:7px;min-height:72px;padding:12px clamp(14px,3vw,24px);background:#fff;border-top:1px solid #e6eaf1}.compose-bar textarea{flex:1;min-width:0;max-height:130px;padding:9px 10px;resize:none;color:#1d2a44;line-height:1.35;background:#f4f6fa;border:1px solid transparent;border-radius:10px;outline:none;transition:border-color .14s ease,background .14s ease}.compose-bar textarea:focus{background:#fff;border-color:#8fa7ef}.compose-bar textarea::placeholder{color:#a0aabb}.compose-tool,.icon-button{display:grid;flex:0 0 auto;place-items:center;width:35px;height:35px;padding:0;color:#71809a;background:transparent;border:0;border-radius:9px}.compose-tool:hover:not(:disabled),.icon-button:hover{color:#4f6ed6;background:#edf1ff}.compose-tool svg{width:20px;height:20px}.send-button,.primary-button,.secondary-button,.danger-button,.subtle-button{min-height:35px;padding:0 14px;border-radius:9px;font-size:.84rem;font-weight:650;border:1px solid transparent;transition:filter .14s ease,background .14s ease,border-color .14s ease}.send-button,.primary-button{color:#fff;background:#4667d8;box-shadow:0 3px 9px #415fcc2e}.send-button:hover:not(:disabled),.primary-button:hover:not(:disabled){filter:brightness(1.07)}.send-button:disabled,.primary-button:disabled{color:#aab5d1;background:#e7ebf5;box-shadow:none}.compose-tool:disabled,.compose-bar textarea:disabled{opacity:.53}.chat-notice{max-width:700px;margin:0 auto 8px;padding:7px 11px;color:#9f4c31;font-size:.78rem;background:#fff7ed;border:1px solid #fde1c0;border-radius:8px}.empty-conversation{display:grid;place-content:center;justify-items:center;min-height:100%;gap:10px;padding:34px;color:#929eb2;text-align:center;font-size:.88rem;line-height:1.55}.empty-conversation strong{color:#59677f;font-size:1rem}.empty-conversation span{max-width:270px}.empty-conversation__symbol{display:grid;place-items:center;width:48px;height:48px;color:#8496bb;font-size:1.85rem;background:#e8edf7;border-radius:16px}.image-preview{position:fixed;z-index:100;inset:0;display:grid;place-items:center;padding:38px;background:#0d1423d6}.image-preview img{max-width:100%;max-height:100%;object-fit:contain;border-radius:7px;box-shadow:0 18px 60px #00000059}.image-preview__close{position:absolute;top:16px;right:20px;width:38px;height:38px;color:#fff;font-size:2rem;line-height:1;background:#ffffff1f;border:0;border-radius:50%}.invalid-session{padding:30px;background:linear-gradient(130deg,#f9fbff,#ecf1f9);text-align:center}.invalid-session__mark{display:grid;place-items:center;width:52px;height:52px;margin-bottom:17px;color:#cf6d45;font-size:1.5rem;font-weight:700;background:#fff1eb;border-radius:18px}.invalid-session h1{margin:0;color:#35415a;font-size:1.14rem}.invalid-session p{margin:10px 0 0;color:#8490a4;font-size:.88rem}.public-home{padding:30px;color:#36425b;background:radial-gradient(circle at 50% 10%,#e2eaff,transparent 34%),#f6f8fc;text-align:center}.public-home h1{margin:17px 0 7px;font-size:1.4rem}.public-home p{margin:0;color:#7c899e;font-size:.9rem}.public-home a{margin-top:26px;color:#526ed0;font-size:.82rem;text-decoration:none}.admin-login{padding:26px;background:radial-gradient(circle at 20% 20%,#e5ebff 0,transparent 28%),radial-gradient(circle at 80% 78%,#dfeafa 0,transparent 28%),#f6f8fc}.login-card{display:flex;width:min(100%,365px);flex-direction:column;align-items:stretch;padding:37px;background:#ffffffe5;border:1px solid rgb(255 255 255 / 95%);border-radius:23px;box-shadow:0 18px 55px #32426621}.login-card .brand-mark{align-self:center;margin-bottom:17px}.login-card h1{margin:0;color:#273550;font-size:1.35rem;text-align:center}.login-card>p{margin:9px 0 28px;color:#8a96aa;font-size:.87rem;text-align:center}label{display:flex;flex-direction:column;gap:7px;color:#53617a;font-size:.8rem;font-weight:600}input{min-width:0;height:41px;padding:0 11px;color:#283651;background:#f7f9fc;border:1px solid #e2e7ef;border-radius:9px;outline:none}input:focus{background:#fff;border-color:#8ca4ef;box-shadow:0 0 0 3px #6889e71f}.login-card .primary-button{width:100%;height:41px;margin-top:22px}.form-error,.form-success{margin-top:12px;padding:8px 10px;font-size:.78rem;border-radius:7px}.form-error{color:#a94944;background:#fff1f0}.form-success{color:#377d59;background:#edfaf1}.admin-app{display:grid;grid-template-columns:306px minmax(0,1fr);height:100vh;min-height:560px;overflow:hidden;background:#f7f9fc}.admin-sidebar{display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;min-width:0;color:#eff3fc;background:#202a42;border-right:1px solid #1d263c}.admin-sidebar__header{display:flex;align-items:center;justify-content:space-between;padding:23px 19px 16px}.eyebrow{display:block;margin-bottom:3px;color:#91a1c1;font-size:.67rem;font-weight:650;letter-spacing:.13em;text-transform:uppercase}.admin-sidebar h1{margin:0;color:#f6f8fe;font-size:1.14rem;letter-spacing:.01em}.admin-sidebar .icon-button{width:32px;height:32px;color:#c9d4ee;font-size:1.4rem;font-weight:350;background:#ffffff12}.admin-sidebar .icon-button:hover{color:#fff;background:#4d6ed7}.admin-sidebar__tools{padding:0 14px 12px}.sound-button{display:flex;align-items:center;width:100%;gap:7px;padding:8px 9px;color:#aab8d4;font-size:.75rem;text-align:left;background:#ffffff0a;border:1px solid rgb(255 255 255 / 6%);border-radius:8px}.sound-button:hover,.sound-button.is-enabled{color:#c3d6fc;background:#5b7cdd2b;border-color:#6d91ee33}.sound-button span{font-size:1rem}.client-list{min-height:0;overflow-y:auto;padding:0 8px 10px}.client-item{display:flex;width:100%;align-items:center;gap:10px;padding:11px 10px;color:#d8e0f1;text-align:left;background:transparent;border:0;border-radius:10px}.client-item:hover{background:#ffffff0f}.client-item.is-selected{background:#344669;box-shadow:inset 2px 0 #7193ff}.client-avatar{display:grid;flex:0 0 auto;place-items:center;width:35px;height:35px;overflow:hidden;color:#ccdaf9;font-size:.81rem;font-weight:700;background:#3c5077;border-radius:11px}.client-item.is-selected .client-avatar{color:#536bd0;background:#e2e9ff}.client-item__copy{display:flex;min-width:0;flex:1;flex-direction:column;gap:4px}.client-item__topline,.client-item__bottomline{display:flex;min-width:0;align-items:center;gap:6px}.client-item__topline strong{min-width:0;flex:1;overflow:hidden;color:#f0f3fa;font-size:.83rem;font-weight:600;text-overflow:ellipsis;white-space:nowrap}.client-item__topline time{color:#8190ad;font-size:.66rem;white-space:nowrap}.client-item__bottomline>span{min-width:0;flex:1;overflow:hidden;color:#a1aec5;font-size:.71rem;text-overflow:ellipsis;white-space:nowrap}.client-item__bottomline b{display:grid;flex:0 0 auto;place-items:center;min-width:18px;height:18px;padding:0 5px;color:#fff;font-size:.61rem;line-height:1;background:#e95b62;border-radius:10px}.empty-client-list{padding:45px 17px;color:#8391ad;font-size:.78rem;line-height:1.75;text-align:center}.admin-sidebar__footer{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-top:1px solid rgb(255 255 255 / 7%)}.text-button{padding:5px 3px;color:#9dabc6;font-size:.72rem;background:transparent;border:0}.text-button:hover:not(:disabled){color:#e6edfb}.text-button--danger:hover:not(:disabled){color:#f4a4a4}.admin-conversation{display:grid;grid-template-rows:auto minmax(0,1fr) auto auto;min-width:0}.conversation-header{display:flex;align-items:center;justify-content:space-between;min-height:73px;padding:13px 24px;background:#fff;border-bottom:1px solid #e7ebf2}.conversation-header h2{margin:0 0 3px;color:#25334f;font-size:1rem;font-weight:650}.conversation-header__actions{display:flex;align-items:center;gap:8px}.subtle-button{color:#6a7891;background:#f6f8fb;border-color:#e4e8f0}.subtle-button:hover{color:#425fbd;background:#edf2ff;border-color:#dce5ff}.subtle-button--danger:hover{color:#b44d4d;background:#fff3f2;border-color:#f5d8d5}.admin-message-area{padding:26px clamp(19px,4vw,52px);background:radial-gradient(circle at 5% 5%,#f1f4ff 0,transparent 22%),#f7f9fc}.admin-message-area .message-list{max-width:840px}.message-area-loading{display:grid;place-content:center;justify-items:center;height:100%;gap:12px;color:#8995a9;font-size:.86rem}.admin-conversation>.compose-bar{padding-right:clamp(14px,3vw,24px);padding-left:clamp(14px,3vw,24px)}.modal-backdrop{position:fixed;z-index:50;inset:0;display:grid;place-items:center;padding:20px;background:#0e16277a;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.modal-card{position:relative;width:min(100%,440px);padding:28px;color:#3a4861;background:#fff;border-radius:17px;box-shadow:0 20px 60px #141d323d}.modal-card h2{margin:0 0 9px;color:#26344e;font-size:1.12rem}.modal-card p{margin:0 0 22px;color:#768399;font-size:.84rem;line-height:1.55}.modal-card label{font-size:.8rem}.modal-card label input{width:100%}.modal-close{position:absolute;top:11px;right:14px;width:31px;height:31px;padding:0;color:#8f9bb0;font-size:1.55rem;line-height:1;background:transparent;border:0;border-radius:8px}.modal-close:hover{color:#43516a;background:#f1f4f8}.modal-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:23px}.secondary-button{color:#5a6880;background:#f4f6f9;border-color:#e4e8ef}.secondary-button:hover:not(:disabled){background:#eaf0fa}.danger-note{color:#bb6159!important;font-size:.76rem!important}.danger-button{color:#fff;background:#d75e5d;box-shadow:0 3px 9px #b746452e}.danger-button:hover:not(:disabled){background:#c94d4e}.client-link{max-height:96px;padding:10px;overflow:auto;overflow-wrap:anywhere;color:#4662bc;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.77rem;line-height:1.55;background:#f4f7ff;border:1px solid #e1e8fe;border-radius:8px}@media(max-width:760px){.customer-app{width:100%;box-shadow:none}.customer-header{min-height:62px;padding:10px 15px}.customer-conversation{padding:18px 13px}.message-list{gap:16px}.message-row{max-width:92%}.message-avatar{width:27px;height:27px;border-radius:9px}.message-bubble{font-size:.9rem}.image-attachment{max-width:68vw}.file-attachment{width:min(290px,71vw)}.compose-bar{min-height:64px;gap:3px;padding:9px}.compose-tool{width:32px;height:34px}.send-button{padding:0 10px}.admin-app{grid-template-columns:1fr;grid-template-rows:42vh minmax(0,1fr);min-height:660px}.admin-sidebar{grid-template-rows:auto auto minmax(0,1fr);border-right:0}.admin-sidebar__header{padding:13px 14px 9px}.admin-sidebar h1{font-size:1rem}.admin-sidebar__tools{padding:0 9px 7px}.sound-button{padding:6px 8px}.client-list{display:flex;gap:7px;overflow-x:auto;overflow-y:hidden;padding:0 8px 11px}.client-item{flex:0 0 180px;min-width:0;padding:9px;background:#ffffff08}.client-item__bottomline>span{font-size:.67rem}.empty-client-list{min-width:235px;padding:19px;text-align:left}.admin-sidebar__footer{display:none}.conversation-header{min-height:57px;padding:8px 13px}.conversation-header h2{font-size:.91rem}.conversation-header__actions{gap:5px}.subtle-button{min-height:29px;padding:0 7px;font-size:.72rem}.admin-message-area{padding:17px 13px}.admin-conversation>.compose-bar{padding:9px}}@media(max-width:390px){.customer-header__identity{display:none}.conversation-header__actions .subtle-button{max-width:70px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.modal-card{padding:23px 20px}}