.wa-section { display:grid; gap:1.2rem; }
.wa-overview { display:grid; grid-template-columns:minmax(0,1fr) minmax(220px,280px); gap:1rem; }
.wa-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.8rem; }
.wa-metrics .kpi-card { padding:1.05rem; min-height:120px; }
.wa-metrics .kpi-card strong { font-size:1.75rem; }
.wa-metrics .kpi-top { min-height:2.1rem; }
.wa-metrics small,.wa-cost-card small { display:block; color:var(--muted); margin-top:.35rem; }
.wa-cost-card { display:flex; flex-direction:column; align-items:flex-start; gap:.75rem; }
.wa-cost-card strong { font-size:2rem; }
.wa-cost-card p { line-height:1.6; }
.wa-workspace { display:grid; grid-template-columns:minmax(270px,340px) minmax(0,1fr); overflow:hidden; padding:0; align-items:start; }
.wa-inbox { border-right:1px solid var(--border); min-width:0; }
.wa-inbox-heading { padding:1.25rem; }
.wa-inbox-heading h3 { margin:.3rem 0 .75rem; }
.wa-filters { display:grid; gap:.65rem; }
.wa-filters label { display:grid; gap:.3rem; }
.wa-chat-list { max-height:780px; overflow-y:auto; }
.wa-chat-row { display:grid; gap:.6rem; padding:1rem 1.25rem; text-align:left; border:0; border-top:1px solid var(--border-soft); background:transparent; width:100%; cursor:pointer; }
.wa-chat-row:hover { background:var(--surface-2); }
.wa-chat-row.selected { background:var(--green-soft); box-shadow:inset 3px 0 var(--green); }
.wa-chat-head { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:.45rem; }
.wa-chat-head strong { font-size:.9rem; overflow-wrap:anywhere; }
.wa-chat-preview { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; overflow-wrap:anywhere; color:var(--muted); font-size:.85rem; line-height:1.55; }
.wa-chat-meta { font-size:.72rem; color:var(--muted); }
.wa-badge { display:inline-flex; border:1px solid var(--border); padding:.25rem .5rem; border-radius:99px; font-size:.7rem; line-height:1.2; white-space:nowrap; color:var(--muted); }
.wa-bot { color:var(--green); background:var(--green-soft); border-color:transparent; }
.wa-human { color:var(--amber); background:rgba(255,189,89,.09); border-color:transparent; }
.wa-pagination { display:flex; align-items:center; justify-content:space-between; gap:.5rem; padding:1rem; border-top:1px solid var(--border); font-size:.75rem; }
.wa-pagination button { min-height:36px; min-width:36px; }
.wa-conversation { min-width:0; }
.wa-select-prompt { min-height:450px; display:grid; place-content:center; text-align:center; padding:2rem; color:var(--muted); }
.wa-detail-header { display:flex; gap:1rem; justify-content:space-between; align-items:flex-start; padding:1.3rem 1.5rem; border-bottom:1px solid var(--border); }
.wa-detail-header h3 { margin:0 0 .5rem; overflow-wrap:anywhere; }
.wa-detail-header p { margin:0; font-size:.78rem; color:var(--muted); line-height:1.7; }
.wa-messages { display:flex; flex-direction:column; gap:1rem; list-style:none; margin:0; padding:1.5rem; min-height:280px; max-height:560px; overflow-y:auto; scroll-behavior:smooth; background:var(--bg); }
.wa-message { max-width:85%; border:1px solid var(--border); border-radius:14px 14px 14px 3px; background:var(--surface-2); padding:.85rem 1rem; align-self:flex-start; }
.wa-message-out { align-self:flex-end; background:var(--green-soft); border-color:rgba(32,217,147,.17); border-radius:14px 14px 3px 14px; }
.wa-message-system { align-self:center; color:var(--muted); font-size:.8rem; }
.wa-message-info { display:flex; justify-content:space-between; gap:1rem; font-size:.72rem; color:var(--muted); }
.wa-message p { margin:.6rem 0; line-height:1.55; white-space:pre-wrap; overflow-wrap:anywhere; }
.wa-message small { color:var(--muted); font-size:.68rem; }
.wa-action-area { padding:1rem 1.5rem; border-top:1px solid var(--border); }
.wa-controls { display:flex; flex-wrap:wrap; gap:.6rem; }
.wa-controls button { margin:0; padding:.6rem 1rem; }
.wa-reply-form { display:grid; gap:.65rem; margin-top:.85rem; }
.wa-reply-form label { display:grid; gap:.5rem; }
.wa-reply-form textarea { width:100%; resize:vertical; min-height:90px; padding:.8rem; border:1px solid var(--border); border-radius:10px; background:var(--bg); color:var(--text); font:inherit; }
.wa-reply-form button { justify-self:end; padding:.6rem 1.2rem; }
.wa-session-history { border-top:1px solid var(--border); padding:1rem 1.5rem; }
.wa-session-history summary { cursor:pointer; color:var(--muted); font-weight:650; }
.wa-session-history ol { display:grid; gap:.8rem; list-style:none; padding:0; }
.wa-session-history li { display:flex; align-items:center; flex-wrap:wrap; gap:.5rem; padding:.6rem 0; border-bottom:1px solid var(--border-soft); font-size:.8rem; }
.wa-session-history li span:not(.wa-badge) { flex-basis:100%; color:var(--muted); }
.wa-settings-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.wa-settings-grid label { display:grid; align-content:start; gap:.4rem; }
.wa-clear-secret { display:flex; gap:.5rem; align-items:center; color:var(--muted); font-size:.75rem; font-weight:400; }
.wa-clear-secret input { width:16px; min-height:16px; accent-color:var(--green); }
.permission-picker { position:relative; }
.permission-picker summary { cursor:pointer; border:1px solid var(--border); padding:.75rem; border-radius:10px; min-height:44px; font-size:.85rem; }
.permission-options { display:grid; gap:.6rem; padding:.9rem; border:1px solid var(--border); border-radius:10px; background:var(--surface-2); margin-top:.4rem; }
.permission-options label { display:flex; gap:.65rem; align-items:center; font-size:.85rem; }
.permission-options input { width:17px; min-height:17px; margin:0; accent-color:var(--green); }
.wa-section button:focus-visible,.permission-picker summary:focus-visible,.wa-session-history summary:focus-visible { outline:2px solid var(--green); outline-offset:3px; }
.wa-section button:disabled { opacity:.45; cursor:not-allowed; }
[data-theme="light"] .wa-messages { background:#f4f7f5; }
@media(min-width:1500px) { .wa-metrics { grid-template-columns:repeat(5,minmax(0,1fr)); } }
@media(max-width:1150px) { .wa-overview { grid-template-columns:1fr; } .wa-metrics { grid-template-columns:repeat(3,minmax(0,1fr)); } .wa-cost-card { display:block; } .wa-cost-card strong { display:block; margin:.6rem 0; } .wa-workspace { grid-template-columns:minmax(230px,290px) minmax(0,1fr); } }
@media(max-width:800px) { .wa-workspace { grid-template-columns:1fr; } .wa-inbox { border-right:0; border-bottom:1px solid var(--border); } .wa-chat-list { max-height:290px; } .wa-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); } .wa-settings-grid { grid-template-columns:1fr; } .wa-detail-header,.wa-messages,.wa-action-area { padding:1rem; } .wa-message { max-width:94%; } .wa-select-prompt { min-height:170px; } }
