:root { color-scheme: light; --ink:#172438; --muted:#66778b; --line:#e5eaf0; --paper:#fff; --bg:#f5f7fa; --brand:#196a5d; }
* { box-sizing:border-box }
body { margin:0; font:14px/1.5 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; color:var(--ink); background:var(--bg) }
button,input,textarea,select { font:inherit }
button { cursor:pointer }
button:disabled { opacity:.6; cursor:wait }
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible { outline:3px solid #8dcac0; outline-offset:2px }
.hidden { display:none!important }
.muted { color:var(--muted) }
.error { color:#b51e30; min-height:1.5em; margin:7px 0 0 }
.brand { display:flex;align-items:center;gap:10px;font-size:17px;font-weight:750 }
.brand small { color:var(--muted);font-weight:500 }
.brand-icon { background:var(--brand);color:#fff;width:34px;height:34px;border-radius:11px;display:grid;place-items:center;font-weight:800;font-size:20px }
.login-shell { display:grid;min-height:100vh;place-items:center;padding:16px }
.login-card { width:min(420px,100%);padding:35px;background:var(--paper);border-radius:17px;border:1px solid var(--line);box-shadow:0 15px 40px #13243a0b }
.login-card h1 { font-size:25px;margin:27px 0 6px }
.login-card label { display:block;font-weight:650;margin:19px 0 7px }
.login-card input { width:100%;height:44px;border:1px solid #c9d4de;border-radius:9px;padding:0 12px }
.primary { border:0;background:var(--brand);color:#fff;border-radius:9px;padding:12px 18px;font-weight:650 }
.primary:hover { background:#115247 }
.full { width:100%;margin-top:24px }
.ghost { border:1px solid var(--line);background:var(--paper);border-radius:8px;padding:7px 12px;color:#39536a }
.topbar { height:65px;background:var(--paper);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 24px;gap:12px }
.header-right { display:flex;align-items:center;gap:14px }
.tenant-name { padding:4px 10px;background:#e7f3f0;border-radius:50px;color:#175d52;font-weight:650 }
.workspace { display:grid;grid-template-columns:340px minmax(0,1fr);height:calc(100vh - 65px);max-height:calc(100dvh - 65px) }
.sidebar { background:var(--paper);border-right:1px solid var(--line);display:flex;flex-direction:column;min-height:0 }
.sidebar-top { display:flex;align-items:center;justify-content:space-between;padding:17px 18px 8px }
h2 { margin:0;font-size:17px }
.filter-row { display:flex;gap:8px;padding:8px 18px 14px;border-bottom:1px solid var(--line) }
.filter { border:1px solid var(--line);background:#fff;padding:6px 13px;border-radius:20px;color:var(--muted) }
.filter.selected { background:#e5f3ef;border-color:#a6d8cc;color:#165649;font-weight:650 }
.conversation-list { overflow:auto;flex:1 }
.conversation-item { width:100%;text-align:left;background:#fff;border:0;border-bottom:1px solid #edf0f4;padding:15px 18px;display:grid;gap:5px }
.conversation-item:hover,.conversation-item.active { background:#eff8f5 }
.conversation-top { display:flex;align-items:center;justify-content:space-between;gap:8px;font-weight:650 }
.conversation-preview { color:var(--muted);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis }
.pill { font-size:11px;padding:3px 8px;border-radius:15px;background:#e5f0fb;color:#285d87;white-space:nowrap }
.pill.human { background:#fff0d8;color:#986114 }
.pill.paused { background:#eef0f3;color:#666 }
.chat { min-width:0;display:flex;flex-direction:column;min-height:0 }
.empty-state { margin:auto;text-align:center;max-width:350px;padding:24px }
.empty-illustration { display:grid;place-items:center;font-size:32px;width:70px;height:70px;margin:auto auto 14px;border-radius:22px;background:#e4f2ee;color:var(--brand) }
.empty-state p { color:var(--muted) }
.thread { display:flex;flex-direction:column;min-height:0;flex:1 }
.thread-header { background:#fff;padding:17px 22px;display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid var(--line) }
.thread-header p { margin:2px 0 0 }
.control-buttons { display:flex;gap:8px;flex-wrap:wrap }
select { padding:9px;border:1px solid #ccd7df;border-radius:8px;background:#fff }
.message-list { flex:1;overflow:auto;padding:25px;display:flex;flex-direction:column;gap:13px }
.message { border:1px solid #dce3ea;background:#fff;border-radius:14px;padding:12px 14px;max-width:min(80%,620px);align-self:flex-start;white-space:pre-wrap;overflow-wrap:anywhere }
.message.outgoing { align-self:flex-end;background:#e4f4ec;border-color:#cde3d8 }
.message.draft { border-style:dashed;background:#fff8e8;border-color:#e9d69c }
.message-meta { font-size:11px;color:#778491;margin-top:7px }
.composer { background:#fff;padding:12px 20px 17px;border-top:1px solid var(--line) }
.notice { background:#fff8e9;color:#8f6525;padding:9px 12px;border-radius:8px;font-size:12px;margin-bottom:10px }
.compose-row { display:flex;align-items:end;gap:10px }
textarea { flex:1;resize:vertical;min-height:70px;border:1px solid #cbd6df;border-radius:8px;padding:11px }
.compose-row .primary { min-width:104px }
.placeholder { padding:20px;color:var(--muted) }
@media(max-width:780px) {
 .topbar { padding:0 12px }
 .desktop-only { display:none }
 .workspace { grid-template-columns:minmax(130px,35%) minmax(0,1fr) }
 .conversation-item { padding:12px }
 .thread-header { flex-wrap:wrap;padding:10px }
 .message-list { padding:12px }
 .message { max-width:95% }
 .composer { padding:10px }
 .compose-row { flex-direction:column;align-items:stretch }
}

.app-nav {display:flex;gap:5px;flex-wrap:wrap}
.app-nav .filter {white-space:nowrap}
.panel {max-width:1120px;margin:0 auto;padding:28px 22px;min-height:calc(100dvh - 65px)}
.panel h1 {font-size:25px;margin:0 0 4px}
.panel-grid {display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:22px}
.panel-card {background:#fff;border:1px solid var(--line);border-radius:14px;padding:22px;display:flex;flex-direction:column;gap:10px;margin-top:22px;max-width:800px}
.panel-grid .panel-card {margin-top:0}
.panel-card input,.panel-card textarea {width:100%;padding:12px;border:1px solid #cbd6df;border-radius:8px}
.panel-card label {font-weight:650;margin-top:6px}
.panel-card button {align-self:start}
.faq-list {display:flex;flex-direction:column;gap:12px;max-height:65vh;overflow:auto}
.faq-item {padding:14px;border:1px solid var(--line);border-radius:10px}
.faq-item strong {display:block;margin-bottom:6px}
.faq-item p {white-space:pre-wrap;overflow-wrap:anywhere;margin:4px 0 12px;color:#4b5b68}
.faq-actions {display:flex;gap:8px}
.test-result {white-space:pre-wrap;overflow-wrap:anywhere;background:#f0f8f5;padding:18px;border:1px solid #c9ded6;border-radius:9px;line-height:1.65}
@media(max-width:980px) {
 .topbar {height:auto;min-height:65px;flex-wrap:wrap;padding:12px}
 .header-right {flex-wrap:wrap}
 .workspace {height:calc(100dvh - 110px);max-height:none}
 .panel-grid {grid-template-columns:1fr}
 .panel {padding:18px}
}

.lead-item {width:100%;text-align:left;display:grid;gap:5px;border:1px solid var(--line);padding:14px;border-radius:10px;background:white;cursor:pointer}
.lead-item:hover {background:#eff8f5}
.lead-item p {margin:0;overflow-wrap:anywhere}
.lead-item .pill {justify-self:start}
.faq-item button {margin:5px 7px 0 0}
.panel-card .lead-item {align-self:stretch}

.panel-card input[type="checkbox"] {width:auto;vertical-align:middle;margin-right:8px}

.booking-hour-row {display:grid;grid-template-columns:minmax(8rem,1fr) 7rem 7rem;gap:8px;align-items:center;padding:6px 0}
.booking-hour-row input[type="time"]{width:100%}
.reschedule-form{display:grid;gap:8px;border-top:1px solid var(--line);padding:12px 0}
#bookingCalendarList .faq-item,#bookingServiceList .faq-item {margin-bottom:10px}
#bookingNotice:not(:empty){margin:12px 0}
.knowledge-passage-preview {margin:12px 0;padding:12px;border:1px solid var(--line);border-radius:8px;max-height:360px;overflow:auto}
.knowledge-passage-preview p {white-space:pre-wrap;font-size:13px;border-bottom:1px solid var(--line);padding:7px 0}
#sourceFileFields,#sourceUrlFields,#sourceTextFields {display:flex;flex-direction:column;gap:8px}
#sourceFileFields.hidden,#sourceUrlFields.hidden,#sourceTextFields.hidden {display:none}
.onboarding-progress {display:flex;flex-direction:column;gap:8px}
.onboarding-progress progress {width:100%;height:9px;accent-color:#098265}
.onboarding-question {background:#edf8f2;border:1px solid #d4e8de;border-radius:13px;padding:18px}
.onboarding-question h2 {font-size:18px;margin:10px 0 6px}
.onboarding-assistant {font-size:12px;font-weight:700;color:#167e62}
.onboarding-actions {display:flex;flex-wrap:wrap;gap:9px;margin:15px 0}
.onboarding-actions button {margin-right:0}
#onboardingAnswerForm select {width:100%;padding:12px;border:1px solid #cbd6df;border-radius:8px}
.knowledge-review {font:13px/1.55 ui-monospace,Consolas,monospace;white-space:pre-wrap;overflow-wrap:anywhere;max-height:440px;overflow:auto;padding:16px;background:#f5f8fb;border:1px solid var(--line);border-radius:9px}
.onboarding-test-row {display:grid;grid-template-columns:minmax(95px,130px) minmax(0,1fr) auto;gap:12px;align-items:center;padding:12px;border:1px solid var(--line);border-radius:9px}
.onboarding-test-row span {overflow-wrap:anywhere}
@media(max-width:620px){.onboarding-test-row {grid-template-columns:1fr;gap:5px}.onboarding-test-row button{justify-self:start}}