*{box-sizing:border-box}body{margin:0;background:#f3f4f6}.chat-scroll{flex:1;overflow-y:auto;padding:20px 24px;display:flex;flex-direction:column;gap:14px;background:#f8fafc}.bubble-row{display:flex;flex-direction:column;max-width:72%}.bubble-row.from-player{align-self:flex-start;align-items:flex-start}.bubble-row.from-agent{align-self:flex-end;align-items:flex-end}.bubble{padding:10px 14px;border-radius:14px;font-size:14px;line-height:1.6;white-space:pre-wrap;word-break:break-word;box-shadow:0 1px 2px #0f172a0f}.from-player .bubble{background:#fff;border:1px solid #e5e7eb;border-top-left-radius:4px;color:#111827}.from-agent .bubble{background:var(--portal-theme, #4f46e5);color:#fff;border-top-right-radius:4px}.bubble-meta{font-size:11px;color:#94a3b8;margin-top:4px;padding:0 4px}.attachment-thumb{max-width:220px;max-height:160px;border-radius:10px;border:1px solid #e5e7eb;cursor:zoom-in;display:block;background:#fff}.from-agent .attachment-thumb{border-color:#6366f1}.login-bg{min-height:100vh;display:flex;align-items:center;justify-content:center;background:radial-gradient(1000px 500px at 20% 0%,rgba(99,102,241,.22),transparent 60%),radial-gradient(900px 500px at 90% 100%,rgba(56,189,248,.18),transparent 55%),#0f172a}.portal-shell{--p-accent: var(--portal-theme, #059669);--p-accent-deep: color-mix(in srgb, var(--p-accent) 78%, #000000);--p-bg-0: #fafbfc;--p-bg-1: #f4f6f8;--p-bg-2: #eceff2;--p-bg-3: #dfe4ea;--p-border: #dfe4ea;--p-text-1: #12161c;--p-text-2: #2d353f;--p-text-3: #5d6773;--p-text-4: #8a94a0;max-width:640px;margin:0 auto;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;background:var(--p-bg-0);box-shadow:0 0 40px #0f172a14;color:var(--p-text-1)}.portal-shell input,.portal-shell textarea{font-size:16px!important}.portal-shell button{touch-action:manipulation}.portal-brand{padding:22px 20px 16px;background:linear-gradient(135deg,color-mix(in srgb,var(--p-accent) 14%,#ffffff),color-mix(in srgb,var(--p-accent) 4%,#ffffff));border-bottom:1px solid var(--p-border)}.portal-brand-name{font-size:19px;font-weight:700;color:var(--p-text-1);letter-spacing:.2px}.portal-brand-sub{margin-top:5px;font-size:12.5px;color:var(--p-text-3);display:flex;align-items:center;gap:6px}.online-dot{width:8px;height:8px;border-radius:50%;background:#16a34a;box-shadow:0 0 0 3px #16a34a2e;animation:online-pulse 2.4s ease-in-out infinite}@keyframes online-pulse{0%,to{box-shadow:0 0 0 3px #16a34a2e}50%{box-shadow:0 0 0 5px #16a34a14}}.portal-header{display:flex;align-items:center;gap:10px;padding:10px 12px;border-bottom:1px solid var(--p-border);background:var(--p-bg-0);position:sticky;top:0;z-index:10}.portal-nav-btn{width:32px;height:32px;flex:none;display:inline-flex;align-items:center;justify-content:center;border:none;border-radius:50%;background:transparent;color:var(--p-text-2);font-size:15px;cursor:pointer}.portal-nav-btn:active{background:var(--p-bg-2)}.portal-title{flex:1;text-align:center;font-size:14px;font-weight:600;color:var(--p-text-1);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.portal-header-side{flex:none;min-width:32px;display:flex;justify-content:flex-end}.portal-body{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:14px 14px 16px;display:flex;flex-direction:column;gap:10px}.portal-form{background:var(--p-bg-0);padding:18px 16px 24px;gap:16px}.portal-footer{padding:10px 14px calc(10px + env(safe-area-inset-bottom));border-top:1px solid var(--p-border);background:var(--p-bg-0)}.portal-tabs{display:flex;gap:18px;padding:2px 4px 0}.portal-tabs button{position:relative;border:none;background:none;padding:4px 2px 8px;font-size:13px;font-weight:600;color:var(--p-text-4);cursor:pointer}.portal-tabs button.active{color:var(--p-text-1)}.portal-tabs button.active:after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;border-radius:2px;background:var(--p-accent)}.portal-card{position:relative;display:block;width:100%;text-align:left;background:#fff;border:1px solid var(--p-border);border-radius:8px;padding:13px 14px 12px 17px;cursor:pointer;font:inherit;overflow:hidden;transition:transform .15s ease,border-color .15s ease}.portal-card:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--p-text-4)}.portal-card.is-open:before{background:#16a34a}.portal-card.is-answered:before{background:var(--p-accent)}.portal-card:active{transform:translateY(1px);border-color:color-mix(in srgb,var(--p-accent) 30%,var(--p-border) 70%)}.portal-card-top{display:flex;align-items:center;gap:8px}.portal-card-subject{flex:1;font-size:14px;font-weight:600;color:var(--p-text-1);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.portal-card-time{flex:none;font-size:11px;color:var(--p-text-4)}.portal-card-preview{margin-top:5px;font-size:12px;line-height:1.5;color:var(--p-text-3);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;word-break:break-word}.portal-preview-tag{color:var(--p-accent-deep);font-weight:600}.portal-preview-tag.self{color:var(--p-text-4)}.portal-card-bot{margin-top:7px;display:flex;align-items:center;gap:8px;font-size:11px;color:var(--p-text-4)}.portal-card-no{margin-left:auto;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.portal-card-arrow{font-size:14px;color:var(--p-text-4);line-height:1}.portal-pill{display:inline-flex;align-items:center;gap:5px;padding:2px 9px;border-radius:999px;font-size:10.5px;font-weight:600}.portal-pill i{width:5px;height:5px;border-radius:50%;background:currentColor}.portal-pill.is-open{color:#15803d;background:color-mix(in srgb,#dcfce7 70%,#ffffff 30%)}.portal-pill.is-answered{color:var(--p-accent-deep);background:color-mix(in srgb,var(--p-accent) 14%,#ffffff)}.portal-pill.is-closed{color:var(--p-text-3);background:var(--p-bg-2)}.portal-empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:40px 24px}.portal-empty-icon{font-size:38px;opacity:.6}.portal-empty-title{margin-top:12px;font-size:14px;font-weight:600;color:var(--p-text-2)}.portal-empty-tip{margin-top:4px;font-size:12px;color:var(--p-text-4)}.portal-chat{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:16px 14px 12px;display:flex;flex-direction:column;gap:10px;background:radial-gradient(circle at 20% 0%,color-mix(in srgb,var(--p-accent) 4%,transparent),transparent 50%),var(--p-bg-1)}.portal-date-pill{align-self:center;padding:3px 10px;border-radius:999px;background:var(--p-bg-2);color:var(--p-text-4);font-size:10.5px;font-weight:600;text-transform:uppercase;letter-spacing:.06em}.pmsg{display:flex;gap:8px;max-width:100%}.pmsg.mine{justify-content:flex-end}.pmsg.merged{margin-top:-4px}.pmsg-avatar,.pmsg-avatar-spacer{width:28px;height:28px;flex:none}.pmsg-avatar{display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background:linear-gradient(135deg,var(--p-accent),#7c3aed);color:#fff;font-size:13px}.pmsg-col{display:flex;flex-direction:column;align-items:flex-start;max-width:78%}.pmsg.mine .pmsg-col{align-items:flex-end}.pmsg-bubble{padding:9px 13px;border-radius:14px;font-size:13px;line-height:1.55;white-space:pre-wrap;word-break:break-word}.pmsg.theirs .pmsg-bubble{background:var(--p-bg-3);border:1px solid var(--p-border);border-bottom-left-radius:4px;color:var(--p-text-1)}.pmsg.mine .pmsg-bubble{background:linear-gradient(135deg,var(--p-accent),var(--p-accent-deep));color:#fff;border-bottom-right-radius:4px;box-shadow:0 2px 8px color-mix(in srgb,var(--p-accent-deep) 30%,transparent)}.pmsg-meta{margin-top:4px;font-size:10.5px;color:var(--p-text-4);padding:0 2px}.pmsg-tag{color:var(--p-accent-deep);font-weight:600}.portal-composer{padding:10px 12px calc(14px + env(safe-area-inset-bottom));border-top:1px solid var(--p-border);background:var(--p-bg-0)}.portal-status-row{display:flex;align-items:center;justify-content:center;gap:6px;margin-bottom:8px;font-size:12px;color:var(--p-text-3)}.portal-status-dot{width:6px;height:6px;border-radius:50%;background:var(--p-text-4)}.portal-status-dot.is-open{background:#16a34a}.portal-status-dot.is-answered{background:var(--p-accent)}.portal-row-sep{color:var(--p-text-4)}.portal-text-link{border:none;background:none;padding:0;font-size:12px;font-weight:600;color:var(--p-accent-deep);cursor:pointer}.portal-text-link.danger{color:#dc2626}.portal-text-link:active{text-decoration:underline}.portal-newmsg-pill{position:absolute;top:-40px;left:50%;transform:translate(-50%);padding:5px 12px;border:none;border-radius:999px;background:var(--p-accent);color:#fff;font-size:12px;font-weight:600;cursor:pointer;box-shadow:0 3px 10px color-mix(in srgb,var(--p-accent-deep) 35%,transparent)}.portal-closed-banner{display:flex;align-items:center;justify-content:center;gap:8px;padding:14px 12px calc(16px + env(safe-area-inset-bottom));border-top:1px solid var(--p-border);background:var(--p-bg-0);font-size:12.5px;color:var(--p-text-3)}.portal-input-row{display:flex;gap:8px;align-items:flex-end}.portal-input-row .ant-input{border-radius:12px;background:var(--p-bg-1)}.portal-input-row .ant-input:focus{background:#fff;box-shadow:0 0 0 3px color-mix(in srgb,var(--p-accent-deep) 15%,transparent)}.portal-icon-btn,.portal-send-btn{width:36px;height:36px;flex:none;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;border:1px solid var(--p-border);background:#fff;color:var(--p-text-3);font-size:15px;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease}.portal-send-btn{border:none;background:var(--p-accent);color:#fff}.portal-send-btn:not(:disabled):active{transform:scale(1.06)}.portal-send-btn:disabled{background:var(--p-bg-3);color:var(--p-text-4);cursor:not-allowed}.portal-label{font-size:12px;font-weight:600;color:var(--p-text-3)}.portal-cat-row{display:flex;flex-wrap:wrap;gap:8px}.portal-chip{flex:1 1 28%;display:inline-flex;align-items:center;justify-content:center;gap:5px;padding:10px 6px;border-radius:8px;border:1px solid var(--p-border);background:var(--p-bg-1);font-size:13px;font-weight:600;color:var(--p-text-2);cursor:pointer;white-space:nowrap}.portal-chip.active{border-color:var(--p-accent);background:linear-gradient(135deg,color-mix(in srgb,var(--p-accent) 18%,#ffffff),color-mix(in srgb,var(--p-accent-deep) 8%,#ffffff));color:var(--p-accent-deep);font-weight:700;box-shadow:0 0 0 3px color-mix(in srgb,var(--p-accent-deep) 10%,transparent)}.portal-chip-check{font-size:11px;line-height:1}.portal-cat-skel{flex:1;height:40px;border-radius:8px;background:linear-gradient(90deg,var(--p-bg-2) 25%,var(--p-bg-3) 50%,var(--p-bg-2) 75%);background-size:200% 100%;animation:skel-shimmer 1.2s ease-in-out infinite}@keyframes skel-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.portal-textarea-wrap{position:relative}.portal-textarea-wrap .ant-input{padding-bottom:22px;background:var(--p-bg-1)}.portal-counter{position:absolute;right:12px;bottom:8px;font-size:11px;color:var(--p-text-4);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;pointer-events:none}.portal-counter-max{opacity:.7}.portal-att-row{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:8px}.portal-att-btn{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;border:1px dashed var(--p-border);background:none;color:var(--p-text-3);font-size:12px;font-weight:500;cursor:pointer}.portal-att-btn:active{color:var(--p-accent-deep);border-color:var(--p-accent)}.portal-att-chip{display:inline-flex;align-items:center;gap:6px;padding:4px 6px;background:var(--p-bg-2);border:1px solid var(--p-border);border-radius:6px;font-size:12px;color:var(--p-text-2);max-width:100%}.portal-att-thumb{width:22px;height:22px;border-radius:4px;object-fit:cover;display:block;flex:none}.portal-att-name{max-width:130px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.portal-att-x{flex:none;width:16px;height:16px;display:inline-flex;align-items:center;justify-content:center;border:none;border-radius:50%;background:none;color:var(--p-text-4);font-size:12px;line-height:1;cursor:pointer}.portal-att-x:active{background:var(--p-bg-3);color:#dc2626}.portal-contact-line{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--p-text-3)}.portal-contact-text{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.portal-contact-text strong{color:var(--p-text-2);font-weight:600}.portal-contact-fields{display:flex;flex-direction:column;gap:8px}.portal-error-banner{display:flex;align-items:center;gap:8px;padding:10px 12px;background:#ef444414;border:1px solid rgba(239,68,68,.3);border-radius:6px;font-size:12px;color:#dc2626;margin-bottom:8px}.portal-reply-note{margin-top:-6px;text-align:center;font-size:12px;color:var(--p-text-4)}.portal-meta-chip{align-self:center;display:flex;align-items:center;gap:5px;padding:3px 12px;border-radius:999px;background:var(--p-bg-2);color:var(--p-text-4);font-size:10.5px;margin-bottom:4px}.portal-meta-dot{opacity:.6}.unread-dot{display:inline-block;flex:none;width:7px;height:7px;border-radius:50%;background:#ef4444;box-shadow:0 0 0 3px #ef444426}