@import url("https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@500;600&family=Lora:ital,wght@0,400;0,500;0,600;1,400&display=swap");*{box-sizing:border-box;margin:0;padding:0}:root{--bg:#f4f6fb;--surface:#ffffff;--border:#e3e8f0;--text:#1a2333;--muted:#64748b;--primary:#2563eb;--primary-dark:#1d4ed8;--danger:#dc2626;--warning:#d97706;--success:#16a34a;--sg-bg:#f3f2f2;--sg-surface:#eae9e9;--sg-text:#201f1d;--sg-accent:#b68235;--sg-divider:color-mix(in srgb,#201f1d 16%,transparent);--sg-accent-100:#fff3e4;--sg-accent-200:#ffe3bf;--sg-accent-300:#facb8d;--sg-accent-400:#e1ad66;--sg-accent-500:#c28d41;--sg-accent-600:#a06f24;--sg-accent-700:#7d5411;--sg-accent-800:#5a3b0a;--sg-accent-900:#3a270d;--sg-neutral-100:#f8f4f4;--sg-neutral-200:#eae7e7;--sg-neutral-300:#d7d3d3;--sg-neutral-400:#bab6b6;--sg-neutral-500:#9b9797;--sg-neutral-600:#7d7979;--sg-neutral-700:#605d5d;--sg-neutral-800:#444141;--sg-neutral-900:#2d2b2b;--sg-font-heading:"Cormorant Garamond",Georgia,serif;--sg-font-body:"Lora",Georgia,serif;--sg-space-1:4.6px;--sg-space-2:9.2px;--sg-space-3:13.8px;--sg-space-4:18.4px;--sg-space-5:27.6px;--sg-space-6:36.8px;--sg-radius-sm:2px;--sg-radius-md:4px;--sg-radius-lg:7px}body{font-family:Sarabun,Noto Sans Thai,system-ui,-apple-system,sans-serif;background:var(--bg);color:var(--text);line-height:1.6}a{color:inherit;text-decoration:none}.shell{display:flex;min-height:100vh}.sidebar{width:230px;flex-shrink:0;background:#0f1b33;color:#cbd5e1;padding:24px 14px;display:flex;flex-direction:column;gap:4px}.sidebar .brand{color:#fff;font-size:20px;font-weight:700;padding:0 10px 18px}.sidebar a{padding:10px 12px;border-radius:8px;font-size:15px}.sidebar a:hover{background:rgba(255,255,255,.08);color:#fff}.main,.sidebar .spacer{flex:1 1}.main{padding:32px 40px;max-width:1100px}h1{font-size:26px;margin-bottom:6px}.subtitle{color:var(--muted);margin-bottom:24px}.card{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:20px;margin-bottom:20px}.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));grid-gap:16px;gap:16px;margin-bottom:24px}.stat{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:18px 20px}.stat .label{color:var(--muted);font-size:13px}.stat .value{font-size:30px;font-weight:700}table{width:100%;border-collapse:collapse;font-size:14px}th{text-align:left;color:var(--muted);font-weight:600;padding:8px 10px}td,th{border-bottom:1px solid var(--border)}td{padding:10px;vertical-align:top}tr:last-child td{border-bottom:none}.badge{display:inline-block;padding:2px 10px;border-radius:999px;font-size:12px;font-weight:600;white-space:nowrap}.badge.green{background:#dcfce7;color:#15803d}.badge.red{background:#fee2e2;color:#b91c1c}.badge.amber{background:#fef3c7;color:#b45309}.badge.blue{background:#dbeafe;color:#1d4ed8}.badge.gray{background:#e2e8f0;color:#475569}input,select{padding:9px 12px;border:1px solid var(--border);border-radius:8px;font-size:14px;font-family:inherit;background:#fff;color:var(--text)}input:focus,select:focus{outline:2px solid var(--primary);outline-offset:-1px}button{padding:9px 16px;border:none;border-radius:8px;background:var(--primary);color:#fff;font-size:14px;font-weight:600;font-family:inherit;cursor:pointer}button:hover{background:var(--primary-dark)}button:disabled{opacity:.5;cursor:not-allowed}button.danger{background:var(--danger)}button.danger:hover{background:#b91c1c}button.secondary{background:#e2e8f0;color:var(--text)}button.secondary:hover{background:#cbd5e1}.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.error-text{color:var(--danger);font-size:14px}.muted{color:var(--muted)}.mono{font-family:ui-monospace,monospace}.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center}.login-card{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:36px;width:360px;gap:14px}.chat,.login-card{display:flex;flex-direction:column}.chat{gap:10px;max-height:420px;overflow-y:auto;padding:6px 2px}.bubble{max-width:75%;padding:10px 14px;border-radius:14px;font-size:14px}.bubble.caller{align-self:flex-start;background:#eef2f7;border-bottom-left-radius:4px}.bubble.agent{align-self:flex-end;background:var(--primary);color:#fff;border-bottom-right-radius:4px}.bubble .who{font-size:11px;opacity:.7;margin-bottom:2px}.risk-meter{height:10px;border-radius:999px;background:#e2e8f0;overflow:hidden}.risk-meter>div{height:100%;transition:width .4s ease,background .4s ease}.event-feed{font-size:13px;display:flex;flex-direction:column;gap:6px}.event-feed .ts{color:var(--muted);font-family:ui-monospace,monospace;font-size:11px;margin-right:8px}.m-viewport{min-height:100vh;min-height:100dvh;background:var(--sg-neutral-300);display:flex;align-items:center;justify-content:center}.m-phone{width:100%;max-width:420px;height:100vh;height:100dvh;max-height:900px;background:var(--sg-bg);color:var(--sg-text);font-family:var(--sg-font-body);overflow:hidden;display:flex;position:relative}.m-phone h1,.m-phone h2,.m-phone h3,.m-phone h4{font-family:var(--sg-font-heading);font-weight:600;color:var(--sg-text);margin:0}.m-phone button{font-family:var(--sg-font-body);cursor:pointer;transition:opacity .15s ease,background .15s ease}@media (min-width:480px){.m-phone{border-radius:36px;border:6px solid var(--sg-neutral-800);height:92vh}}.m-screen{flex:1 1;display:flex;flex-direction:column;align-items:center;padding:44px 24px 28px;overflow-y:auto;text-align:center}.m-center{margin:auto}.m-idle h1{font-size:28px}.m-shield{font-size:52px;margin-bottom:8px;filter:drop-shadow(0 0 18px color-mix(in srgb,var(--sg-accent) 35%,transparent))}.m-status{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--sg-accent-700);margin:6px 0 22px}.m-dot{width:7px;height:7px;border-radius:50%;background:var(--sg-accent)}.m-dot.off{background:var(--sg-neutral-500)}.m-card{width:100%;background:var(--sg-surface);border:1px solid var(--sg-divider);border-radius:var(--sg-radius-lg);padding:var(--sg-space-4);margin-bottom:14px;text-align:left}.m-card-label{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--sg-accent-700);font-weight:600;margin-bottom:4px}.m-card-value{font-family:var(--sg-font-heading);font-weight:600;font-size:19px;color:var(--sg-text)}.m-card-sub{font-size:13px;color:var(--sg-neutral-600)}.m-recent{display:flex;justify-content:space-between;gap:10px;font-size:14px;padding:7px 0;border-top:1px solid var(--sg-divider)}.m-recent:first-child{border-top:none}.m-recent-risk{font-size:12px;font-weight:600}.m-hint{font-size:13px;color:var(--sg-neutral-600);margin-top:auto;padding-top:14px}.m-ring-label{font-size:13px;color:var(--sg-text);opacity:.6;letter-spacing:.03em}.m-avatar{width:88px;height:88px;border-radius:50%;background:var(--sg-surface);display:flex;align-items:center;justify-content:center;font-size:36px;margin:24px 0 14px}.m-avatar.ringing{width:104px;height:104px;background:transparent;border:1.5px solid var(--sg-accent);margin:22px 0 16px;animation:sg-pulse 1.5s ease-out infinite}@keyframes sg-pulse{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--sg-accent) 45%,transparent)}to{box-shadow:0 0 0 22px color-mix(in srgb,var(--sg-accent) 0%,transparent)}}.m-caller{font-family:ui-monospace,monospace;font-size:25px;font-weight:600;color:var(--sg-text)}.m-caller-sm{font-size:15px;color:var(--sg-text);opacity:.75}.m-warn{font-size:12.5px;color:var(--sg-accent-700);margin-top:8px}.m-actions{display:flex;gap:18px;margin-top:auto;padding-top:24px}.m-action{width:128px;padding:16px 8px;border-radius:var(--sg-radius-md);display:flex;flex-direction:column;align-items:center;gap:3px;font-size:15px;font-weight:600;line-height:1.3}.m-action small{font-size:11px;font-weight:400;opacity:.7}.m-action-icon{font-size:26px;margin-bottom:4px}.m-action.pickup{background:var(--sg-text);color:var(--sg-bg);border:1px solid var(--sg-text)}.m-action.pickup:hover{opacity:.85}.m-action.bot{background:transparent;color:var(--sg-text);border:1.5px solid var(--sg-divider)}.m-action.bot:hover{background:var(--sg-surface)}.m-countdown{font-size:12.5px;margin-top:16px}.m-countdown,.m-timer{color:var(--sg-neutral-600)}.m-timer{font-family:ui-monospace,monospace;font-size:18px;margin-top:6px}.m-hangup{width:68px;height:68px;border-radius:50%;background:transparent;border:2px solid var(--sg-accent-900);color:var(--sg-accent-900);font-size:26px;margin-top:auto}.m-hangup:hover{background:var(--sg-surface)}.m-bot{text-align:left;align-items:stretch;padding-top:28px}.m-bot-head{text-align:center;margin-bottom:14px}.m-bot-badge{display:inline-block;background:var(--sg-accent-100);border:1px solid var(--sg-accent-300);color:var(--sg-accent-800);border-radius:999px;padding:6px 14px;font-size:12.5px;font-weight:600;margin-bottom:6px}.m-bot-badge.m-alert{background:color-mix(in srgb,var(--sg-accent) 18%,transparent);border:1px solid var(--sg-accent);color:var(--sg-accent-900);animation:sg-alert 1.1s ease-in-out infinite alternate}@keyframes sg-alert{0%{box-shadow:0 0 4px color-mix(in srgb,var(--sg-accent) 40%,transparent)}to{box-shadow:0 0 14px color-mix(in srgb,var(--sg-accent) 75%,transparent)}}.m-family-actions{display:flex;gap:10px;justify-content:center;margin-top:12px}.m-family-actions .m-action{width:auto;flex:1 1;max-width:170px;padding:12px 8px}.m-family-actions .m-action-icon{font-size:22px}.m-action.danger{background:transparent;color:var(--sg-accent-900);border:1.5px solid var(--sg-accent-900)}.m-action.danger:hover{background:var(--sg-accent-100)}.m-risk{background:var(--sg-surface);border:1px solid var(--sg-divider);border-radius:var(--sg-radius-lg);padding:var(--sg-space-4);margin-bottom:12px}.m-risk-row{display:flex;justify-content:space-between;font-size:13px;margin-bottom:6px}.m-risk-reasons{font-size:12px;color:var(--sg-neutral-600);margin-top:6px}.sg-risk-meter{height:6px;border-radius:3px;background:var(--sg-neutral-200);overflow:hidden}.sg-risk-meter>div{height:100%;border-radius:3px;transition:width .4s ease,background .4s ease}.m-conf{background:color-mix(in srgb,var(--sg-accent) 8%,var(--sg-bg));border:1px solid var(--sg-accent);color:var(--sg-accent-900);padding:10px 14px;font-size:13px}.m-conf,.m-pending{border-radius:var(--sg-radius-lg);margin-bottom:12px;text-align:left}.m-pending{padding:var(--sg-space-3) 14px;animation:sg-alert 1.1s ease-in-out infinite alternate}.m-pending.bad{border:1px solid var(--sg-accent-900)}.m-pending.bad,.m-pending.warn{background:var(--sg-accent-100)}.m-pending.warn{border:1px solid var(--sg-accent-600)}.m-pending.good{background:var(--sg-surface);border:1px solid var(--sg-accent-300);animation:none}.m-pending-head{display:flex;gap:10px;align-items:flex-start;font-size:14.5px;color:var(--sg-text)}.m-pending-icon{font-size:22px;line-height:1.1}.m-pending-detail{font-size:12.5px;color:var(--sg-neutral-600);margin-top:2px}.m-pending-count{font-size:13px;color:var(--sg-text);margin:10px 0 8px}.m-pending-count strong{font-size:16px;color:var(--sg-accent-900)}.m-pending-actions{display:flex;gap:8px}.m-pending-cancel,.m-pending-go{flex:1 1;padding:9px 8px;border-radius:var(--sg-radius-md);font-size:13.5px;font-weight:600}.m-pending-go{background:var(--sg-text);color:var(--sg-bg);border:1px solid var(--sg-text)}.m-pending-go:hover{opacity:.85}.m-pending-cancel{background:transparent;color:var(--sg-text);border:1.5px solid var(--sg-divider)}.m-pending-cancel:hover{background:var(--sg-surface)}.m-chat{flex:1 1;min-height:38vh;overflow-y:auto;display:flex;flex-direction:column;gap:10px;padding:2px}.m-bubble{max-width:82%;padding:10px 14px;border-radius:var(--sg-radius-lg);font-size:14px;line-height:1.5}.m-bubble.caller{align-self:flex-start;margin-right:auto;text-align:left;background:var(--sg-surface);border:1px solid var(--sg-divider);border-bottom-left-radius:3px}.m-bubble.agent{align-self:flex-end;margin-left:auto;text-align:left;background:color-mix(in srgb,var(--sg-accent) 12%,var(--sg-bg));border:1px solid var(--sg-accent-300);border-bottom-right-radius:3px}.m-who{font-size:10.5px;opacity:.6;margin-bottom:3px;font-weight:600}.m-listening{opacity:.55;font-style:italic;animation:m-listen 1.4s ease-in-out infinite alternate}@keyframes m-listen{0%{opacity:.35}to{opacity:.7}}.m-scenarios{display:flex;gap:6px;align-items:stretch;margin-top:10px;width:100%}.m-scenarios-label{font-size:12px;color:var(--sg-neutral-600);align-self:center;flex-shrink:0}.m-chip{flex:1 1;display:flex;flex-direction:column;align-items:center;gap:1px;padding:7px 4px;border-radius:999px;font-size:12px;font-weight:600;background:transparent;border:1px solid var(--sg-divider);color:var(--sg-text)}.m-chip small{font-size:10px;font-weight:400;opacity:.7}.m-chip.on{background:var(--sg-accent-100);border-color:var(--sg-accent);color:var(--sg-accent-900)}.m-chip:disabled{opacity:.45}.m-chip.on:disabled{opacity:.8}.m-demo{margin-top:10px;width:100%;padding:11px;border-radius:var(--sg-radius-md);font-size:13.5px;background:transparent;border:1px dashed var(--sg-divider);color:var(--sg-neutral-700)}.m-demo:hover{background:var(--sg-surface)}.m-result h2{font-size:22px;margin-bottom:4px}.m-result-icon{width:96px;height:96px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:44px;margin:30px 0 18px;background:var(--sg-accent-100)}.m-result-icon.bad{border:2px solid var(--sg-accent-900)}.m-result-icon.good{border:2px solid var(--sg-accent-400)}.m-result-icon.warn{border:2px solid var(--sg-accent-600)}.m-result .m-card{margin-top:16px}.m-close{margin-top:auto;width:100%;padding:14px;border-radius:var(--sg-radius-md);font-size:15px;background:var(--sg-text);color:var(--sg-bg);border:1px solid var(--sg-text)}.m-close:hover{opacity:.85}