:root{--bg: #f4f6f8;--panel: #ffffff;--border: #e4e8ec;--text: #1f2933;--muted: #7b8794;--accent: #2f6fed;--accent-soft: #eaf1fe;--unread: #eef4ff;--danger: #d64545}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:var(--text);background:var(--bg);font-size:14px}button{font-family:inherit;cursor:pointer}.app{display:grid;grid-template-columns:232px 340px 1fr;height:100%}.center-state{display:flex;flex-direction:column;gap:14px;align-items:center;justify-content:center;height:100%;color:var(--muted)}.spin-lg{width:34px;height:34px;border-radius:50%;border:3px solid #d7dee5;border-top-color:var(--accent);animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.sidebar{background:var(--panel);border-right:1px solid var(--border);display:flex;flex-direction:column;min-height:0}.brand{padding:16px;font-weight:700;font-size:16px;display:flex;align-items:center;gap:8px;border-bottom:1px solid var(--border)}.compose-btn{margin:12px;padding:10px;border:none;border-radius:8px;background:var(--accent);color:#fff;font-weight:600}.compose-btn:hover{background:#2a63d6}.account-select{margin:0 12px 8px}.account-select select{width:100%;padding:8px;border:1px solid var(--border);border-radius:8px;background:#fff}.sendrecv-btn{display:flex;align-items:center;gap:8px;margin:0 12px 12px;padding:8px 10px;border:1px solid var(--border);border-radius:8px;background:#fff;color:var(--text);font-weight:500}.sendrecv-btn:hover:not(:disabled){background:var(--bg);border-color:var(--accent);color:var(--accent)}.sendrecv-btn:disabled{color:var(--muted);cursor:default}.sendrecv-btn.active{border-color:var(--accent);color:var(--accent);background:var(--bg)}.sr-icon{font-size:15px;line-height:1;display:inline-block}.sr-icon.spinning{animation:spin .8s linear infinite}.settings-nav{display:flex;flex-direction:column}.settings-menu{list-style:none;margin:0;padding:6px 0}.settings-menu li{padding:10px 16px;cursor:pointer;color:var(--text);border-left:3px solid transparent}.settings-menu li:hover{background:var(--bg)}.settings-menu li.active{background:var(--bg);border-left-color:var(--accent);color:var(--accent);font-weight:600}.panel-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.panel-head h2{margin:0}.mailbox-list{margin-bottom:20px}.mailbox-row{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-bottom:1px solid var(--border)}.mailbox-email{font-weight:600}.folders-head{display:flex;justify-content:space-between;align-items:center;padding:8px 16px 4px;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.04em}.folder-add{border:none;background:transparent;color:var(--muted);font-size:18px;line-height:1;cursor:pointer;padding:0 4px}.folder-add:hover{color:var(--accent)}.folders{list-style:none;margin:0;padding:0 8px 8px;overflow-y:auto}.folders li{padding:8px 10px;border-radius:8px;display:flex;justify-content:space-between;align-items:center;gap:6px;color:var(--text);text-transform:capitalize}.folders li:hover{background:var(--bg)}.folders li.active{background:var(--accent-soft);color:var(--accent);font-weight:600}.folder-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.folders .count{color:var(--muted);font-size:12px}.folders .count.badge{background:var(--accent);color:#fff;border-radius:10px;padding:1px 7px;font-size:11px;font-weight:600;min-width:18px;text-align:center}.folder-actions{display:none;gap:2px}.folders li:hover .folder-actions{display:flex}.folder-actions button{border:none;background:transparent;color:var(--muted);cursor:pointer;font-size:12px;padding:2px 4px;border-radius:4px}.folder-actions button:hover{background:#fff;color:var(--text)}.list-search{display:flex;gap:6px;padding:10px 12px;border-bottom:1px solid var(--border)}.list-search input{flex:1;padding:7px 10px;border:1px solid var(--border);border-radius:8px;font-size:13px}.list-search button{border:1px solid var(--border);background:#fff;border-radius:8px;padding:0 12px;color:var(--muted);font-size:13px}.list-search button:hover{background:var(--bg);color:var(--text)}.sidebar-foot{margin-top:auto;padding:12px;border-top:1px solid var(--border);color:var(--muted);font-size:12px}.list{background:var(--panel);border-right:1px solid var(--border);display:flex;flex-direction:column;min-height:0}.list-head{padding:12px 16px;border-bottom:1px solid var(--border);font-weight:600;text-transform:capitalize;display:flex;justify-content:space-between;align-items:center}.filter-toggle{display:flex;gap:2px;background:var(--bg);border-radius:8px;padding:2px}.filter-toggle button{border:none;background:transparent;padding:5px 12px;border-radius:6px;color:var(--muted);font-weight:600;font-size:12px;text-transform:none}.filter-toggle button.active{background:#fff;color:var(--accent);box-shadow:0 1px 2px #00000014}.messages{overflow-y:auto;flex:1}.msg-row{display:flex;align-items:flex-start;gap:10px;padding:12px 16px;border-bottom:1px solid var(--border)}.msg-row:hover{background:var(--bg)}.msg-row.active{background:var(--accent-soft)}.msg-row.unread{background:var(--unread)}.msg-row.selected{background:var(--accent-soft)}.msg-check{margin-top:3px;flex-shrink:0;cursor:pointer}.msg-body{flex:1;min-width:0;cursor:pointer}.select-all{display:flex;align-items:center;gap:8px;cursor:pointer;text-transform:capitalize;font-weight:600}.select-all input{cursor:pointer}.bulk-bar{display:flex;justify-content:space-between;align-items:center;padding:8px 16px;background:var(--accent-soft);border-bottom:1px solid #d3e2fb}.bulk-count{color:var(--accent);font-weight:600;font-size:13px}.bulk-actions{display:flex;gap:6px;align-items:center}.bulk-actions>button,.bulk-actions .move-menu>button{border:1px solid var(--border);background:#fff;border-radius:6px;padding:4px 10px;font-size:12px}.bulk-actions>button:hover,.bulk-actions .move-menu>button:hover{background:var(--bg)}.bulk-actions .bulk-delete{color:var(--danger);border-color:#f0caca}.msg-row .top{display:flex;justify-content:space-between;gap:8px}.msg-row .from{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.msg-row.unread .from:before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--accent);margin-right:6px;vertical-align:middle}.msg-row .date{color:var(--muted);font-size:12px;white-space:nowrap}.msg-row .subject{margin:2px 0}.msg-row .snippet{color:var(--muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.load-more{margin:12px;padding:8px;border:1px solid var(--border);border-radius:8px;background:#fff}.list-note{padding:24px;color:var(--muted)}.list-note.error{color:var(--danger)}.reader{display:flex;flex-direction:column;min-height:0;background:var(--panel)}.reader-head{padding:18px 22px;border-bottom:1px solid var(--border)}.reader-head h2{margin:0 0 8px;font-size:18px}.reader-meta{color:var(--muted);font-size:13px;line-height:1.6}.reader-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.reader-actions button{padding:7px 14px;border:1px solid var(--border);background:#fff;border-radius:8px}.reader-actions button:hover{background:var(--bg)}.reader-actions button:disabled{opacity:.5;cursor:default}.move-menu{position:relative;display:inline-block}.move-dropdown{position:absolute;top:100%;left:0;z-index:20;margin-top:4px;min-width:160px;background:#fff;border:1px solid var(--border);border-radius:8px;box-shadow:0 6px 18px #0000001f;overflow:hidden;max-height:260px;overflow-y:auto}.move-dropdown button{display:block;width:100%;text-align:left;border:none;border-radius:0;background:#fff;padding:8px 12px;text-transform:capitalize}.move-dropdown button:hover{background:var(--accent-soft);color:var(--accent)}.reader-body{flex:1;min-height:0}.reader-body iframe{width:100%;height:100%;border:none;background:#fff}.images-bar{background:#fff8e1;border-bottom:1px solid #f0e0a8;padding:8px 16px;font-size:13px;display:flex;justify-content:space-between;align-items:center}.images-bar button{border:1px solid #e0cf80;background:#fff;border-radius:6px;padding:4px 10px}.attachments{padding:10px 22px;border-top:1px solid var(--border);display:flex;flex-wrap:wrap;gap:8px}.attachments a{padding:6px 10px;border:1px solid var(--border);border-radius:8px;text-decoration:none;color:var(--text);font-size:12px;background:var(--bg)}.composer,.connect{padding:22px;overflow-y:auto;height:100%;background:var(--panel)}.composer h2,.connect h2{margin-top:0}.field{margin-bottom:12px;display:flex;flex-direction:column;gap:4px}.field label{font-size:12px;color:var(--muted)}.field input,.field textarea{padding:9px 11px;border:1px solid var(--border);border-radius:8px;font-size:14px;font-family:inherit}.field textarea{min-height:240px;resize:vertical}.row-actions{display:flex;gap:8px}.btn-primary{padding:9px 18px;border:none;border-radius:8px;background:var(--accent);color:#fff;font-weight:600}.btn-secondary{padding:9px 18px;border:1px solid var(--border);border-radius:8px;background:#fff}.error{color:var(--danger);margin:8px 0}.sig-preview{margin-bottom:12px;border:1px dashed var(--border);border-radius:8px;padding:8px 11px;background:var(--bg)}.sig-label{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}.sig-body{margin:4px 0 0;font-family:inherit;font-size:13px;color:var(--text);word-break:break-word}.sig-body p{margin:0 0 4px}.sig-editor .rsw-editor,.msg-editor .rsw-editor{border:1px solid var(--border);border-radius:8px;overflow:hidden;background:#fff}.sig-editor .rsw-toolbar,.msg-editor .rsw-toolbar{background:var(--bg);border-bottom:1px solid var(--border)}.sig-editor .rsw-btn,.msg-editor .rsw-btn{color:var(--text)}.sig-editor .rsw-btn[data-active=true],.msg-editor .rsw-btn[data-active=true]{background:var(--accent-soft);color:var(--accent)}.sig-editor .rsw-ce,.msg-editor .rsw-ce{padding:10px 12px;font-size:14px}.sig-editor .rsw-ce:focus,.msg-editor .rsw-ce:focus{outline:none}.sig-editor .rsw-ce{min-height:130px}.msg-editor .rsw-ce{min-height:260px}.file-btn{display:inline-block;align-self:flex-start;padding:7px 14px;border:1px solid var(--border);border-radius:8px;background:#fff;font-size:13px;cursor:pointer}.file-btn:hover{background:var(--bg)}.file-btn input[type=file]{display:none}.attach-list{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:8px}.attach-chip{display:inline-flex;align-items:center;gap:6px;font-size:12px;padding:4px 8px;border:1px solid var(--border);border-radius:8px;background:var(--bg)}.attach-chip button{border:none;background:transparent;color:var(--muted);cursor:pointer;font-size:12px;padding:0;line-height:1}.attach-chip button:hover{color:var(--danger)}.attach-total{font-size:11px;color:var(--muted)}.attach-chip.media{background:var(--accent-soft);border-color:#d3e2fb}.attach-buttons{display:flex;gap:8px}.attach-buttons .file-btn{align-self:auto}.media-picker{margin-top:8px;border:1px solid var(--border);border-radius:8px;background:#fff;overflow:hidden}.media-picker-head{display:flex;gap:6px;padding:8px;border-bottom:1px solid var(--border);background:var(--bg)}.media-picker-head input{flex:1;padding:6px 9px;border:1px solid var(--border);border-radius:6px;font-size:13px}.media-picker-head button{border:1px solid var(--border);background:#fff;border-radius:6px;padding:0 10px;font-size:12px;color:var(--muted)}.media-picker-head button:hover{background:var(--bg);color:var(--text)}.media-picker .hint{padding:12px;margin:0}.media-breadcrumb{padding:6px 12px;border-bottom:1px solid var(--border);font-size:12px;color:var(--muted)}.media-breadcrumb button{border:none;background:transparent;color:var(--accent);cursor:pointer;font-size:12px;padding:0}.media-breadcrumb button:hover{text-decoration:underline}.media-row.folder{cursor:pointer}.media-row.folder:hover{background:var(--accent-soft)}.media-row.folder .media-name{font-weight:600}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#1f293373;display:grid;place-items:center;z-index:100;padding:20px}.modal{background:var(--panel);border-radius:12px;box-shadow:0 20px 60px #0000004d;display:flex;flex-direction:column;max-height:100%}.media-modal{width:760px;max-width:100%;height:560px}.modal-head{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;border-bottom:1px solid var(--border)}.modal-head h3{margin:0;font-size:16px}.modal-close{border:none;background:transparent;font-size:16px;color:var(--muted);cursor:pointer}.modal-close:hover{color:var(--text)}.modal-foot{display:flex;justify-content:space-between;align-items:center;padding:12px 20px;border-top:1px solid var(--border)}.modal-foot .row-actions{display:flex;gap:8px}.media-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 20px;border-bottom:1px solid var(--border)}.media-toolbar .media-breadcrumb{border:none;padding:0}.media-search{display:flex;gap:6px}.media-search input{padding:6px 10px;border:1px solid var(--border);border-radius:8px;font-size:13px}.media-search button{border:1px solid var(--border);background:#fff;border-radius:8px;padding:0 12px;font-size:12px;color:var(--muted)}.media-search button:hover{background:var(--bg);color:var(--text)}.media-grid-wrap{flex:1;overflow-y:auto;padding:16px 20px}.media-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:12px}.media-tile{border:1px solid var(--border);border-radius:10px;background:#fff;padding:8px;cursor:pointer;text-align:center;display:flex;flex-direction:column;gap:6px}.media-tile:hover{border-color:var(--accent)}.media-tile.selected{border-color:var(--accent);background:var(--accent-soft);box-shadow:0 0 0 2px var(--accent) inset}.media-tile .tile-thumb{position:relative;height:84px;display:grid;place-items:center;background:var(--bg);border-radius:8px;overflow:hidden}.media-tile .tile-thumb img{width:100%;height:100%;object-fit:cover}.media-tile .tile-fileicon{font-size:34px}.media-tile .tile-check{position:absolute;top:4px;right:4px;background:var(--accent);color:#fff;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;font-size:12px}.media-tile .tile-name{font-size:12px;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.media-tile.folder .tile-thumb{background:#fff7e6}.media-list{max-height:240px;overflow-y:auto}.media-row{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:8px 12px;border-bottom:1px solid var(--border)}.media-row:last-child{border-bottom:none}.media-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}.media-row-actions{display:flex;gap:6px;flex-shrink:0}.media-row-actions button{border:1px solid var(--border);background:#fff;border-radius:6px;padding:3px 10px;font-size:12px;color:var(--accent)}.media-row-actions button:hover{background:var(--accent-soft)}.saved-note{align-self:center;color:var(--accent);font-size:13px;font-weight:600}.recipient-field{position:relative}.suggestions{position:absolute;top:100%;left:0;right:0;z-index:20;background:#fff;border:1px solid var(--border);border-radius:8px;box-shadow:0 6px 18px #0000001f;max-height:220px;overflow-y:auto;margin-top:2px}.suggestion{display:flex;flex-direction:column;padding:8px 12px;cursor:pointer}.suggestion:hover{background:var(--accent-soft)}.suggestion b{font-size:13px}.suggestion span{font-size:12px;color:var(--muted)}.crm-bar{background:var(--accent-soft);border-bottom:1px solid #d3e2fb;padding:8px 22px;font-size:13px;display:flex;justify-content:space-between;align-items:center}.crm-bar button{border:1px solid var(--accent);background:#fff;color:var(--accent);border-radius:6px;padding:4px 12px;font-weight:600}.hint{color:var(--muted);font-size:13px;line-height:1.6}.connect-options{display:flex;gap:12px;margin-bottom:20px}.connect-card{flex:1;border:1px solid var(--border);border-radius:10px;padding:16px}