:root{--syselo-bg:#f8fafc;--syselo-navy:#1a243d;--syselo-cyan:#00eaff;--syselo-blue:#1346e4;--syselo-teal:#00b4d8;--syselo-gradient:linear-gradient(135deg,#1346e4,#00b4d8);--wa-bg:#efeae2;--wa-header:#f0f2f5;--wa-out:#dcf8c6;--wa-in:#fff;--wa-green:#00a884;--wa-ink:#111b21;--wa-muted:#667781;--wa-line:#e9edef;--bg:var(--wa-bg);--surface:#fff;--surface-muted:var(--wa-header);--ink:var(--wa-ink);--ink-muted:var(--wa-muted);--line:var(--wa-line);--accent:var(--wa-green);--accent-soft:#e8eefc;--cyan:var(--syselo-cyan);--navy:var(--syselo-navy);--danger:#b42318;--danger-soft:#fef3f2;--warn:#b54708;--warn-soft:#fffaeb;--ok:#027a48;--ok-soft:#ecfdf3;--info:#1346e4;--info-soft:#eff6ff;--pending:#6941c6;--pending-soft:#f4f3ff;--radius:8px;--radius-lg:12px;--font:"Segoe UI","IBM Plex Sans","Source Sans 3",system-ui,sans-serif;--mono:"IBM Plex Mono","Cascadia Mono",Consolas,monospace;--shadow-sm:0 1px 2px rgba(26,36,61,.06);--shadow:0 1px 3px rgba(26,36,61,.08),0 0 0 1px var(--line);--sidebar-w:240px;--sidebar-w-slim:72px}*{box-sizing:border-box}body,html{margin:0;padding:0;height:100%;font-family:var(--font);color:var(--ink);background:var(--bg)}button,input,textarea{font:inherit}a{color:inherit}#__next,body>div{height:100%}.app-shell{display:flex;height:100vh;min-height:100vh;background:var(--bg)}.brand-sidebar{width:var(--sidebar-w);flex-shrink:0;background:var(--navy);color:#e2e8f0;display:flex;flex-direction:column;border-right:1px solid rgba(0,234,255,.15);transition:width .2s ease;z-index:40}.app-shell.sidebar-slim .brand-sidebar{width:var(--sidebar-w-slim)}.brand-sidebar .brand-top{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:16px 14px;border-bottom:1px solid rgba(148,163,184,.2)}.brand-mark{display:flex;align-items:center;gap:10px;min-width:0}.brand-logo{width:40px;height:40px;padding:4px;border-radius:50%;background:#fff;object-fit:contain;flex-shrink:0;box-shadow:0 0 0 4px hsla(0,0%,100%,.08)}.brand-text{min-width:0}.brand-text .name{font-weight:700;font-size:.95rem;color:#fff;line-height:1.2}.brand-text .tag{font-size:.65rem;line-height:1.25;color:var(--cyan);margin-top:2px;max-width:132px}.app-shell.sidebar-slim .brand-text,.app-shell.sidebar-slim .nav-label,.app-shell.sidebar-slim .sidebar-foot-text{display:none}.sidebar-toggle{border:1px solid rgba(148,163,184,.35);background:transparent;color:#cbd5e1;border-radius:var(--radius);width:32px;height:32px;cursor:pointer;flex-shrink:0}.sidebar-toggle:hover{border-color:var(--cyan);color:var(--cyan)}.brand-nav{padding:12px 10px;display:flex;flex-direction:column;gap:4px;flex:1 1}.nav-item{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:var(--radius);border:none;background:transparent;color:#cbd5e1;cursor:default;text-align:left;font-size:.875rem;font-weight:550}.nav-item.active{background:rgba(0,234,255,.12);color:#fff;box-shadow:inset 3px 0 0 var(--cyan)}.nav-icon{width:20px;text-align:center;flex-shrink:0;font-size:.95rem;opacity:.9}.sidebar-foot{padding:12px 14px 16px;border-top:1px solid rgba(148,163,184,.2);font-size:.7rem;color:#94a3b8}.app-main{flex:1 1;min-width:0;display:flex;flex-direction:column;min-height:0}.app-header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 16px;background:var(--wa-header);border-bottom:1px solid var(--line);box-shadow:none}.app-header h1{margin:0;font-size:1.125rem;font-weight:650;letter-spacing:-.02em;color:var(--navy)}.app-header .meta{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;color:var(--ink-muted);font-size:.8125rem}.mobile-menu-btn{display:none;border:1px solid var(--line);background:var(--surface);border-radius:var(--radius);width:40px;height:40px;cursor:pointer;font-size:1.1rem;color:var(--navy)}.token-chip{font-family:var(--mono);font-size:.75rem;background:var(--surface-muted);border:1px solid var(--line);border-radius:999px;padding:4px 10px;color:var(--ink-muted)}.stats-strip{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;padding:6px 16px;background:var(--wa-header);border-bottom:1px solid var(--line);min-height:36px}.stat-chip{display:inline-flex;align-items:baseline;gap:6px;font-size:.75rem;color:var(--ink-muted);text-transform:uppercase;letter-spacing:.03em}.stat-chip strong{font-size:.95rem;color:var(--wa-ink);letter-spacing:0}.stat-chip.danger strong{color:var(--danger)}.inbox-grid{flex:1 1;display:grid;grid-template-columns:minmax(280px,360px) minmax(0,1fr) 40px;min-height:0;padding:0;grid-gap:0;gap:0;background:var(--wa-bg)}.app-shell.details-open .inbox-grid{grid-template-columns:minmax(280px,360px) minmax(0,1fr) minmax(260px,320px)}.details-rail{border:none;border-left:1px solid var(--line);background:var(--wa-header);color:var(--wa-muted);writing-mode:vertical-rl;transform:rotate(180deg);font-size:.75rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;padding:16px 0}.details-rail:hover{background:#e7fce3;color:#027a68}.panel{background:var(--surface);border:none;border-right:1px solid var(--line);border-radius:0;box-shadow:none;display:flex;flex-direction:column;min-height:0;overflow:hidden}.panel-header{padding:12px 14px;border-bottom:1px solid var(--line);background:var(--surface-muted);display:flex;align-items:center;justify-content:space-between;gap:8px}.panel-header h2{margin:0;font-size:.875rem;font-weight:650;color:var(--navy)}.filter-toggle{border:1px solid var(--line);background:var(--surface);color:var(--ink-muted);border-radius:var(--radius);padding:4px 8px;font-size:.7rem;font-weight:600;cursor:pointer}.filter-toggle:hover{border-color:var(--accent);color:var(--accent)}.tabs{display:flex;flex-wrap:wrap;gap:6px;padding:10px 12px;border-bottom:1px solid var(--line)}.tabs.collapsed{display:none}.tab{border:1px solid var(--line);background:var(--surface);color:var(--ink-muted);border-radius:var(--radius);padding:5px 10px;font-size:.75rem;cursor:pointer}.tab:hover{border-color:var(--syselo-teal);color:var(--syselo-blue)}.tab.active{background:var(--wa-green);border-color:var(--wa-green);color:#fff;box-shadow:none}.tab.urgent.active{background:var(--danger);border-color:var(--danger)}.conversation-list{flex:1 1;overflow-y:auto;min-height:0}.conversation-item{width:100%;text-align:left;border:none;border-bottom:1px solid var(--line);background:transparent;padding:10px 14px;cursor:pointer;display:flex;align-items:center;gap:12px}.avatar{width:49px;height:49px;border-radius:50%;color:#fff;display:grid;place-items:center;font-weight:700;font-size:.85rem;flex-shrink:0}.conversation-body{min-width:0;flex:1 1;display:flex;flex-direction:column;gap:4px}.conversation-item:hover{background:var(--surface-muted)}.conversation-item.selected{background:var(--wa-header);box-shadow:none}.conversation-item.red-flag{background:var(--danger-soft);animation:pulse-alert 1.6s ease-in-out infinite}.conversation-item.red-flag.selected{box-shadow:inset 3px 0 0 var(--danger)}@keyframes pulse-alert{0%,to{background:var(--danger-soft)}50%{background:#fde8e6}}.conversation-item .row{display:flex;justify-content:space-between;gap:8px;align-items:center}.conversation-item .phone{font-weight:600;font-size:.875rem;color:var(--navy)}.preview-row{align-items:center}.conversation-item .preview{flex:1 1;min-width:0;font-size:.8125rem;color:var(--ink-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.conversation-item .time{font-size:.7rem;color:var(--ink-muted);flex-shrink:0}.badge{display:inline-flex;align-items:center;border-radius:999px;padding:2px 8px;font-size:.6875rem;font-weight:650;letter-spacing:.02em;text-transform:uppercase}.badge.bot{background:var(--accent-soft);color:var(--accent)}.badge.human{background:var(--info-soft);color:var(--info)}.badge.red_flag{background:var(--danger-soft);color:var(--danger)}.badge.awaiting_consent{background:var(--warn-soft);color:var(--warn)}.badge.pending{background:var(--pending-soft);color:var(--pending)}.badge.resolved{background:var(--ok-soft);color:var(--ok)}.chat-window{display:flex;flex-direction:column;min-height:0;background:var(--wa-bg)}.chat-header{display:flex;align-items:center;gap:10px;padding:8px 16px;background:var(--wa-header);border-bottom:1px solid var(--line);min-height:64px;flex-shrink:0;position:-webkit-sticky;position:sticky;top:0;z-index:2}.chat-header .avatar{width:40px;height:40px}.chat-heading{min-width:0;flex:1 1}.chat-heading h2{margin:0;font-size:1rem;font-weight:600;color:var(--wa-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-status{display:flex;gap:6px;align-items:center;margin-top:2px}.chat-back{display:none;border:none;background:transparent;color:var(--wa-muted);font-size:1.25rem;cursor:pointer;padding:4px 6px}.chat-empty{flex:1 1;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--ink-muted);padding:24px;text-align:center;gap:8px}.chat-empty p{margin:0}.chat-watermark{width:min(440px,72%);height:auto;max-height:180px;object-fit:contain;opacity:.22;margin-bottom:8px;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.handoff-bar{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px;margin-left:auto}.btn{border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:var(--radius);padding:8px 12px;font-size:.8125rem;font-weight:600;cursor:pointer;box-shadow:var(--shadow-sm)}.btn:hover:not(:disabled){border-color:var(--syselo-teal)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn.icon.active{background:#e7fce3;border-color:var(--wa-green);color:#027a68}.btn.primary{background:var(--wa-green);border-color:var(--wa-green);color:#fff}.btn.primary:hover:not(:disabled){filter:brightness(1.05);border-color:transparent}.btn.danger{background:var(--danger-soft);border-color:#fecdca;color:var(--danger)}.messages{flex:1 1;overflow-y:auto;scroll-behavior:smooth;padding:20px 7%;display:flex;flex-direction:column;gap:6px;background-color:var(--wa-bg);background-image:radial-gradient(circle at 20% 20%,hsla(0,0%,100%,.35) 0 1px,transparent 1.5px),radial-gradient(circle at 80% 60%,rgba(17,27,33,.05) 0 1px,transparent 1.6px);background-size:28px 28px,36px 36px}.bubble{max-width:min(68%,640px);padding:6px 8px 4px 10px;border-radius:8px;font-size:.9rem;line-height:1.4;white-space:pre-wrap;word-break:break-word;box-shadow:0 1px .5px rgba(11,20,26,.13)}.bubble.in{align-self:flex-start;background:var(--wa-in);border-top-left-radius:0}.bubble.out{align-self:flex-end;background:var(--wa-out);border-top-right-radius:0}.bubble .meta{margin-top:2px;font-size:.68rem;color:var(--ink-muted);text-align:right}.composer{border-top:none;padding:8px 16px 12px;display:flex;flex-direction:column;gap:8px;flex-shrink:0}.composer,.composer.locked{background:var(--wa-header)}.composer-alert{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:48px;box-sizing:border-box;font-size:.8125rem;color:var(--warn);background:#fff8e6;border:1px solid #fedf89;border-radius:8px;padding:10px 12px}.composer-row{display:flex;gap:8px}.composer input{flex:1 1;border:none;border-radius:8px;padding:14px 16px;min-height:48px;outline:none;background:#fff;font-size:.95rem}.composer input:focus{border-color:var(--syselo-teal);box-shadow:0 0 0 3px rgba(0,180,216,.15)}.patient-panel{padding:14px;overflow-y:auto;display:flex;flex-direction:column;gap:14px}.detail-block h3{margin:0 0 8px;font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-muted)}.detail-block dl{margin:0;display:grid;grid-gap:8px;gap:8px}.detail-block dt{font-size:.7rem;color:var(--ink-muted)}.detail-block dd{margin:2px 0 0;font-size:.875rem;font-weight:550}.alert-box{border-radius:var(--radius);padding:12px;font-size:.8125rem;line-height:1.4}.alert-box.danger{background:var(--danger-soft);border:1px solid #fecdca;color:var(--danger);animation:pulse-alert 1.6s ease-in-out infinite}.alert-box.ok{background:var(--ok-soft);border:1px solid #a6f4c5;color:var(--ok)}.alert-box.warn{background:var(--warn-soft);border:1px solid #fedf89;color:var(--warn)}.error-banner{margin:0 20px 8px;padding:10px 12px;border-radius:var(--radius);background:var(--danger-soft);color:var(--danger);border:1px solid #fecdca;font-size:.8125rem}.empty-list{padding:24px 16px;text-align:center;color:var(--ink-muted);font-size:.875rem}.sidebar-backdrop{display:none}@media (max-width:1100px){.app-shell.details-open .inbox-grid,.inbox-grid{grid-template-columns:minmax(240px,300px) minmax(0,1fr)}.details-rail,.panel.patient{display:none}.app-shell.details-open .panel.patient{display:flex;position:absolute;top:0;right:0;bottom:0;width:min(320px,100%);z-index:25;box-shadow:-8px 0 24px rgba(17,27,33,.12);background:#fff}.app-main{position:relative}.chat-header{flex-wrap:wrap}.handoff-bar .btn{padding:6px 8px;font-size:.75rem}}@media (max-width:900px){.mobile-menu-btn{display:inline-grid;place-items:center}.brand-sidebar{position:fixed;inset:0 auto 0 0;height:100vh;transform:translateX(-105%);transition:transform .22s ease;box-shadow:4px 0 24px rgba(26,36,61,.25)}.app-shell.drawer-open .brand-sidebar{transform:translateX(0)}.app-shell.sidebar-slim .brand-sidebar{width:var(--sidebar-w)}.app-shell.sidebar-slim .brand-text,.app-shell.sidebar-slim .nav-label,.app-shell.sidebar-slim .sidebar-foot-text{display:block}.sidebar-backdrop{display:block;position:fixed;inset:0;background:rgba(26,36,61,.45);z-index:30;border:none;padding:0;cursor:pointer}.sidebar-toggle.desktop-only{display:none}}@media (max-width:720px){.app-shell.details-open .inbox-grid,.inbox-grid{grid-template-columns:1fr;padding:0}.app-shell.has-chat .panel.list,.app-shell:not(.has-chat) .chat-window,.details-rail{display:none}.chat-back{display:inline-flex}.messages{padding:12px}.chat-header .handoff-bar{width:100%;justify-content:flex-start}.stats-row{padding:10px 12px;gap:8px}.app-header{padding:12px}}