:root{--fact: #0b6bcb;--ai: #7c3aed;--line: #e2e8f0;--muted: #64748b;--bg: #f8fafc;font-family:system-ui,Segoe UI,Noto Sans Thai,sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:#0f172a}.app{max-width:720px;margin:0 auto;padding:16px}.topbar{display:flex;align-items:baseline;gap:12px;padding:8px 0}.muted{color:var(--muted);font-size:14px}.tokenbar{background:#fff;border:1px solid var(--line);border-radius:10px;padding:12px;margin-bottom:16px}.tokenbar label{display:block;font-size:12px;color:var(--muted);margin-bottom:6px}.tokenbar-row{display:flex;flex-wrap:wrap;gap:8px}.tokenbar-row input{flex:1 1 140px;min-width:0;padding:8px;border:1px solid var(--line);border-radius:6px;font-family:monospace}button{padding:8px 12px;border:1px solid var(--line);background:#fff;border-radius:6px;cursor:pointer}button:disabled{opacity:.5;cursor:default}.notice{background:#fff;border:1px dashed var(--line);border-radius:10px;padding:16px;color:var(--muted)}.notice-error{border-color:#fca5a5;color:#b91c1c}.card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:20px}.card-title{margin:0 0 16px;font-size:20px}.block{border-radius:10px;padding:16px;margin-bottom:16px}.block-fact{background:#f0f7ff;border:1px solid #cfe3fb}.block-ai{background:#f7f3ff;border:1px solid #e3d7fb}.block-head{display:flex;align-items:center;gap:10px;margin-bottom:12px;flex-wrap:wrap}.block-caption{font-size:12px;color:var(--muted)}.tag{font-size:12px;font-weight:700;padding:3px 10px;border-radius:999px;color:#fff}.tag-fact{background:var(--fact)}.tag-ai{background:var(--ai)}.facts-grid{display:flex;gap:24px;margin-bottom:8px}.stat-num{font-size:32px;font-weight:700;color:var(--fact);line-height:1}.stat-label{font-size:13px;color:var(--muted);margin-top:4px}.kv{margin:8px 0 0}.kv dt{font-size:12px;color:var(--muted);margin-top:8px}.kv dd{margin:2px 0 0;font-weight:600}.ai-by{font-size:12px;color:var(--ai);font-weight:600}.ai-badge{display:inline-block;font-size:12px;font-weight:700;color:#92400e;background:#fef3c7;border-radius:6px;padding:2px 8px}.ai-caption{font-size:12px;color:var(--muted);margin:6px 0 10px}.ai-field{margin-top:10px}.ai-field-label{font-size:12px;color:var(--ai);font-weight:700}.ai-text{margin:4px 0 0}.pending{display:flex;align-items:center;gap:12px;padding:8px 0}.pending-title{font-weight:600}.pending-hint{font-size:13px;color:var(--muted)}.spinner{width:18px;height:18px;border:3px solid #ddd;border-top-color:var(--ai);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.btn-link{margin-top:14px;border:none;background:none;color:var(--fact);font-weight:600;padding:0}.tabs{display:flex;gap:8px;margin:12px 0 8px}.tab{font-size:13px;padding:6px 12px}.tab-on{border-color:var(--fact);color:var(--fact);font-weight:700}.mail-body{margin:0;white-space:pre-wrap;line-height:1.6}.section-h{font-size:14px;margin:20px 0 8px;color:var(--muted)}.timeline{list-style:none;padding:0;margin:0;border-left:2px solid var(--line)}.timeline li{padding:6px 0 6px 14px;position:relative;display:flex;gap:10px;align-items:baseline;flex-wrap:wrap}.timeline li:before{content:"";position:absolute;left:-6px;top:12px;width:10px;height:10px;border-radius:50%;background:var(--ai)}.tl-action{font-size:13px;font-weight:600}.tl-actor{font-size:12px;color:var(--ai)}.tl-time{font-size:12px;color:var(--muted)}.draft{margin-top:20px;display:flex;gap:10px;align-items:center;flex-wrap:wrap}.reply{margin-top:20px;display:flex;flex-direction:column;gap:8px}.reply-input{width:100%;padding:6px 8px;border:1px solid var(--line);border-radius:6px}.reply-body{width:100%;padding:10px;border:1px solid var(--ai);border-radius:8px;font:inherit;line-height:1.6;resize:vertical}.reply-actions{display:flex;gap:12px;align-items:center;margin-top:8px}.reply-actions button:first-child{background:var(--ai);color:#fff;border-color:var(--ai);font-weight:700}.sent-ok{border:1px solid #86efac;background:#f0fdf4;color:#166534}.mainnav{display:flex;gap:6px;margin-bottom:16px}.navlink{padding:6px 14px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--muted);text-decoration:none;font-size:14px;font-weight:600}.navlink-on{border-color:var(--fact);color:var(--fact);background:#f0f7ff}.btn-primary{background:var(--fact);color:#fff;border-color:var(--fact);font-weight:700}.inbox-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;gap:12px;flex-wrap:wrap}.inbox-actions{display:flex;gap:8px}.maillist{list-style:none;padding:0;margin:8px 0 0}.mailrow{padding:12px 8px;border-bottom:1px solid var(--line);cursor:pointer}.mailrow:hover{background:#f0f7ff}.mailrow-unseen .mailrow-from,.mailrow-unseen .mailrow-subject{font-weight:700;color:#0f172a}.mailrow-unseen{border-left:3px solid var(--fact)}.mailrow-top{display:flex;justify-content:space-between;gap:12px;align-items:baseline}.mailrow-from{font-size:14px}.mailrow-date{font-size:12px;color:var(--muted);white-space:nowrap}.mailrow-subject{font-size:14px;color:#334155;margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mail-html{display:block;width:100%;height:100px;min-height:100px;max-height:70vh;border:none;background:#fff;border-radius:8px}.attach-list{list-style:none;padding:0;margin:8px 0 0;display:flex;flex-direction:column;gap:6px}.attach-btn{text-align:left;width:100%;border:1px solid var(--line);border-radius:8px;padding:10px 12px;background:#fff}.attach-btn:hover{background:#f0f7ff;border-color:var(--fact)}.attach-size{color:var(--muted);font-size:12px}