*{box-sizing:border-box;margin:0}body{color:#1c1e21;background:#f4f5f7;font-family:-apple-system,Sukhumvit Set,Noto Sans Thai,sans-serif}a{color:#2563eb;cursor:pointer;font-size:.85rem}button{color:#fff;cursor:pointer;background:#2563eb;border:0;border-radius:8px;padding:.5rem 1rem}button:disabled{opacity:.5}button.social{color:#1c1e21;background:#fff;border:1px solid #d1d5db}input{font:inherit;border:1px solid #d1d5db;border-radius:8px;padding:.5rem .75rem}.error{color:#dc2626;font-size:.85rem}.empty{color:#6b7280;padding:1rem;font-size:.85rem}.login-page{place-items:center;min-height:100vh;display:grid}.login-card{text-align:center;background:#fff;border-radius:12px;flex-direction:column;gap:.75rem;width:320px;padding:2rem;display:flex;box-shadow:0 4px 16px #00000014}.login-card h1{font-size:1.3rem}.inbox{grid-template-columns:300px 1fr 280px;height:100vh;display:grid}.conv-list{background:#fff;border-right:1px solid #e5e7eb;overflow-y:auto}.conv-list header{border-bottom:1px solid #e5e7eb;justify-content:space-between;align-items:center;padding:1rem;display:flex}.filter-tabs{border-bottom:1px solid #e5e7eb;gap:.25rem;padding:.5rem .75rem;display:flex}.filter-tabs a{color:#6b7280;border-radius:999px;padding:.25rem .6rem;font-size:.8rem}.filter-tabs a.active{color:#2563eb;background:#eff6ff;font-weight:600}.conv-item{cursor:pointer;align-items:center;gap:.75rem;padding:.75rem 1rem;display:flex}.conv-item:hover{background:#f3f4f6}.conv-item.active{background:#eff6ff}.avatar{background:#d1d5db;border-radius:50%;flex-shrink:0;place-items:center;width:40px;height:40px;display:grid;overflow:hidden}.avatar img{object-fit:cover;width:100%;height:100%}.conv-meta{flex:1;min-width:0}.badge{background:#ef4444;border-radius:50%;flex-shrink:0;width:10px;height:10px}.filter-tabs .count{color:#fff;background:#ef4444;border-radius:999px;margin-left:.3rem;padding:0 .4rem;font-size:.7rem}.conv-meta small{color:#6b7280;white-space:nowrap;text-overflow:ellipsis;max-width:200px;display:block;overflow:hidden}.chat-pane{flex-direction:column;display:flex}.chat-pane header{background:#fff;border-bottom:1px solid #e5e7eb;padding:1rem;font-weight:600}.messages{flex-direction:column;flex:1;gap:.5rem;padding:1rem;display:flex;overflow-y:auto}.bubble{border-radius:16px;max-width:60%;padding:.5rem .9rem;line-height:1.4}.bubble.in{background:#fff;border:1px solid #e5e7eb;align-self:flex-start}.bubble.out{color:#fff;background:#2563eb;align-self:flex-end}.send-box{background:#fff;border-top:1px solid #e5e7eb;gap:.5rem;padding:.75rem 1rem;display:flex}.send-box input{flex:1}.empty-pane{color:#9ca3af;place-items:center;height:100%;display:grid}.fitup-sidebar{background:#fff;border-left:1px solid #e5e7eb;padding:1rem;overflow-y:auto}.fitup-sidebar h3{margin-bottom:.75rem}.fitup-sidebar form{gap:.4rem;margin-bottom:.75rem;display:flex}.fitup-sidebar input{width:100%}.member-result{cursor:pointer;border:1px solid #e5e7eb;border-radius:8px;margin-bottom:.4rem;padding:.5rem}.member-result:hover{background:#eff6ff}.summary{background:#f3f4f6;border-radius:8px;margin:.5rem 0;padding:.5rem;font-size:.75rem;overflow-x:auto}code{margin-top:.5rem;font-size:.75rem;display:block}.modal-backdrop{z-index:10;background:#0006;place-items:center;display:grid;position:fixed;inset:0}.modal{background:#fff;border-radius:12px;flex-direction:column;gap:.75rem;width:360px;padding:1.5rem;display:flex}.modal form{flex-direction:column;gap:.6rem;display:flex}.modal h2{font-size:1.1rem}.modal .scopes{color:#6b7280;font-size:.8rem}button.danger{background:#dc2626}.modal.wide{width:440px;max-height:80vh;overflow-y:auto}.tabs{border-bottom:1px solid #e5e7eb;gap:1rem;padding-bottom:.5rem;display:flex}.tabs a.active{color:#1c1e21;font-weight:700}.channel-item{border:1px solid #e5e7eb;border-radius:8px;margin-bottom:.4rem;padding:.5rem}.channel-head{justify-content:space-between;align-items:center;display:flex}.webhook-url{color:#6b7280;word-break:break-all}.ws-switcher{background:0 0;border:0;max-width:200px;font-size:1rem;font-weight:700}select{font:inherit;background:#fff;border:1px solid #d1d5db;border-radius:8px;padding:.5rem}.modal h4{margin-top:.75rem}
