button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #a78bfa;outline-offset:2px}
.auth-screen{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 20% 10%,#ede9fe 0,transparent 35%),#f7f8fb}
.auth-card{width:min(430px,100%);display:grid;gap:17px;padding:34px;background:#fff;border:1px solid #e5eaf1;border-radius:18px;box-shadow:0 24px 70px #1e293b1c}
.auth-brand{padding:0 0 12px}.auth-card h1{margin:0}.auth-card .muted{color:#64748b;margin:-9px 0 3px}.auth-submit{width:100%;padding:12px!important}.form-error{min-height:20px;margin:0;color:#b91c1c;font-size:13px}
.logout{margin-left:auto;border:1px solid #475569;background:transparent;color:#fff;border-radius:7px;padding:6px 8px;cursor:pointer}.account{flex-wrap:wrap}.account>div{min-width:0;flex:1}.account strong{display:block;overflow:hidden;text-overflow:ellipsis}
#notice.error{background:#991b1b}.agent-layout{display:grid;grid-template-columns:minmax(260px,340px) minmax(0,1fr);gap:16px}.queue-panel{padding:0;overflow:hidden}.queue-list{display:grid;max-height:calc(100vh - 215px);overflow:auto}
.queue-list button{display:grid;gap:6px;border:0;border-bottom:1px solid #edf0f5;background:#fff;padding:16px;text-align:left;color:#182230;cursor:pointer}.queue-list button:hover,.queue-list button.active{background:#f5f3ff}.queue-list button.active{box-shadow:inset 4px 0 #6d43dd}.queue-list button>span{font-size:12px;color:#64748b}.queue-list small{color:#64748b}
.presence-dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px;background:#94a3b8}.presence-dot.online{background:#16a34a}.state-tag{display:inline-block;border-radius:99px;padding:3px 7px;background:#fff7ed;color:#9a3412;text-transform:capitalize}.state-tag.human_handled{background:#eef2ff;color:#4338ca}
.agent-conversation{padding:0;min-height:580px;display:flex;flex-direction:column;overflow:hidden}.agent-conversation>.empty{padding:40px}.agent-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:20px;border-bottom:1px solid #edf0f5}.agent-head h2{margin-bottom:4px}.agent-head p:last-child{margin:0;color:#64748b;font-size:13px;text-transform:capitalize}.conversation-controls{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px}.conversation-controls button,#refresh-queue{border:1px solid #d7dde5;background:#fff;border-radius:8px;padding:9px 12px;cursor:pointer}.conversation-controls .danger{color:#b91c1c;border-color:#fecaca}
.agent-messages{flex:1;min-height:280px;max-height:52vh;overflow:auto;padding:18px;background:#fafbfc}.agent-messages .visitor{margin-right:auto}.agent-messages .assistant{margin-left:auto;background:#ede9fe}.draft-preview{margin:0 18px;padding:10px 13px;border-radius:9px;background:#fffbeb;color:#92400e;font-size:13px}.draft-preview strong{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.05em}.draft-preview span{display:block;margin-top:3px;font-style:italic;overflow-wrap:anywhere}
.agent-reply{display:grid;grid-template-columns:1fr auto;gap:8px;padding:18px;border-top:1px solid #edf0f5}.agent-reply textarea{grid-column:1/-1;min-height:80px}.agent-reply small{align-self:center;color:#64748b}.handoff-note{margin:0;padding:18px;color:#64748b;border-top:1px solid #edf0f5}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:850px){.agent-layout{grid-template-columns:1fr}.queue-list{max-height:260px}.agent-conversation{min-height:520px}.agent-head{flex-direction:column}.conversation-controls{justify-content:flex-start}.account{display:flex!important}.logout{margin-left:0;width:100%}}
@media(max-width:520px){.auth-screen{padding:0}.auth-card{min-height:100vh;border:0;border-radius:0;align-content:center;padding:26px}.agent-reply{grid-template-columns:1fr}.agent-reply button{width:100%}.conversation-controls{width:100%}.conversation-controls button{flex:1}.agent-messages{max-height:none}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}