:root{font-family:"Noto Sans Thai","Segoe UI",sans-serif;color:#211a18;background:#f5f3ef;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-height:100vh}.login-card{width:min(420px,calc(100% - 32px));margin:10vh auto;background:white;padding:32px;border-radius:24px;box-shadow:0 16px 50px #3d20151a}.brand-mark{display:inline-grid;place-items:center;background:#c51b12;color:#fff;font-weight:900;letter-spacing:.08em;border-radius:12px;padding:10px 14px}.brand-mark.compact{padding:6px 9px;border-radius:8px;margin-right:10px}.login-card h1{margin:18px 0 4px}.login-card p{color:#746963;margin-top:0}label{display:block;font-weight:700;margin:24px 0 8px}input,select,button{font:inherit}input,select{width:100%;border:1px solid #d8d0ca;border-radius:12px;padding:12px 14px;background:#fff}button{border:0;border-radius:12px;padding:12px 18px;background:#b42318;color:#fff;font-weight:800;cursor:pointer}button.secondary{background:#fff;color:#7f1d1d;border:1px solid #e7c9c5}.login-card button{width:100%;margin-top:14px}.login-card small{display:block;color:#b42318;margin-top:10px}main{max-width:1120px;margin:auto;padding:24px}header{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px}header div{display:flex;align-items:center}header h1{font-size:1.35rem;margin:0}.summary{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.summary article{background:#fff;border-radius:18px;padding:18px;border:1px solid #ece7e2}.summary strong{display:block;font-size:2rem;color:#a51d14}.summary span{color:#71655f}.toolbar{display:grid;grid-template-columns:2fr 1fr 1fr;gap:12px;margin:20px 0}.conversation-list{display:grid;gap:12px}.conversation{background:#fff;border:1px solid #e7e1dc;border-radius:18px;padding:18px;display:grid;grid-template-columns:1fr auto;gap:14px}.conversation.unread{border-left:5px solid #d12d21}.conversation h2{font-size:1.08rem;margin:0 0 7px}.meta{display:flex;flex-wrap:wrap;gap:8px;color:#776c66;font-size:.9rem}.channel,.status-pill{border-radius:999px;padding:3px 9px;background:#f1eeeb}.channel.line{background:#dff8df;color:#176b28}.channel.facebook{background:#e3edff;color:#1453a5}.channel.instagram{background:#fde5f2;color:#8f1759}.message{margin:14px 0 0;white-space:pre-wrap}.actions{display:flex;gap:8px;align-items:flex-start;flex-wrap:wrap;justify-content:flex-end}.actions button,.actions a{font-size:.9rem;padding:9px 11px;text-decoration:none;border-radius:10px}.actions .working{background:#f0a202}.actions .closed{background:#2c7a4b;color:#fff}.actions a{background:#eee9e5;color:#3e332e;font-weight:700}.assignee{margin-top:12px;display:flex;align-items:center;gap:8px}.assignee input{max-width:220px;padding:8px 10px}.empty{text-align:center;padding:60px 20px;color:#746963}.error-banner{background:#fee4e2;color:#912018;padding:12px;border-radius:12px;margin-bottom:12px}@media(max-width:720px){main{padding:16px}.summary{grid-template-columns:1fr 1fr}.toolbar{grid-template-columns:1fr}.conversation{grid-template-columns:1fr}.actions{justify-content:flex-start}.summary strong{font-size:1.55rem}}
/* Inbox controls and conversation detail */
.header-actions { display: flex; gap: .5rem; flex-wrap: wrap; }
.conversation .actions { align-items: stretch; }
dialog { width: min(680px, calc(100% - 2rem)); max-height: 85vh; border: 0; border-radius: 18px; padding: 1.25rem; box-shadow: 0 20px 60px #0004; }
dialog::backdrop { background: #1118; }
.dialog-close { float: right; border: 0; background: transparent; color: #333; font-size: 2rem; padding: 0 .4rem; }
.message-history { display: grid; gap: .75rem; margin-top: 1rem; overflow: auto; max-height: 60vh; }
.history-message { background: #f3f4f6; border-radius: 14px; padding: .8rem 1rem; }
.history-message p { margin: 0 0 .35rem; white-space: pre-wrap; }
.history-message time { color: #667085; font-size: .8rem; }