:root{--bg:#0b1418;--bg-soft:#0f1d23;--bg-panel:#122229;--bg-hover:#16292f;--bg-active:#0e3a3d;--teal:#1fc8c4;--teal-deep:#0b9a9c;--text:#e8f1f2;--text-dim:#9db4b6;--text-faint:#6b8486;--border:#1d3238;--danger:#ef6b61;--star:#f2c14e;--radius:10px;--font:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--text);font-family:var(--font);margin:0;padding:0;font-size:15px;overflow:hidden}#app{height:100vh;display:flex}.app{width:100%;height:100vh;display:flex}.sidebar{background:var(--bg-soft);border-right:1px solid var(--border);flex-direction:column;flex:none;gap:8px;width:220px;padding:14px 10px;display:flex}.brand{align-items:center;gap:10px;padding:4px 8px 14px;display:flex}.brand-logo{width:28px;height:28px}.brand-name{letter-spacing:.2px;font-size:15px;font-weight:700}.compose-btn{background:linear-gradient(135deg, var(--teal), var(--teal-deep));color:#04292b;border-radius:var(--radius);cursor:pointer;border:none;margin-bottom:10px;padding:10px 14px;font-size:14px;font-weight:700}.compose-btn:hover{filter:brightness(1.08)}nav{flex-direction:column;gap:2px;display:flex}.nav-item{color:var(--text-dim);cursor:pointer;text-align:left;background:0 0;border:none;border-radius:8px;justify-content:space-between;align-items:center;padding:8px 10px;font-size:14px;display:flex}.nav-item:hover{background:var(--bg-hover);color:var(--text)}.nav-item.active{background:var(--bg-active);color:var(--text);font-weight:600}.nav-badge{background:var(--teal-deep);color:#fff;border-radius:10px;padding:1px 7px;font-size:11px;font-weight:700}.accounts{border-top:1px solid var(--border);flex-direction:column;gap:2px;margin-top:auto;padding-top:10px;display:flex}.account-item{color:var(--text-dim);cursor:pointer;text-align:left;background:0 0;border:none;border-radius:8px;align-items:center;gap:8px;padding:6px 8px;font-size:12px;display:flex}.account-item:hover{background:var(--bg-hover)}.account-item.active{color:var(--text)}.account-dot{border-radius:50%;flex:none;width:8px;height:8px}.account-email{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.sidebar-footer{align-items:center;gap:6px;padding:8px;display:flex}.online-dot{background:var(--teal);border-radius:50%;width:8px;height:8px}.online-dot.off{background:var(--danger)}.main{flex-direction:column;flex:1;min-width:0;display:flex}.topbar{border-bottom:1px solid var(--border);background:var(--bg-soft);flex:none;align-items:center;gap:12px;padding:10px 16px;display:flex}.topbar h1{margin:0;font-size:16px;font-weight:700}.search-input{background:var(--bg);border:1px solid var(--border);max-width:480px;color:var(--text);border-radius:8px;outline:none;flex:1;padding:8px 12px;font-size:14px}.search-input:focus{border-color:var(--teal-deep)}.icon-btn{border:1px solid var(--border);color:var(--text-dim);cursor:pointer;background:0 0;border-radius:8px;width:32px;height:32px;font-size:13px}.icon-btn:hover{color:var(--text);border-color:var(--teal-deep)}.content-split{flex:1;min-height:0;display:flex}.message-list{border-right:1px solid var(--border);background:var(--bg);flex:none;width:380px;overflow-y:auto}.date-divider{color:var(--text-faint);text-transform:uppercase;letter-spacing:1px;padding:12px 14px 6px;font-size:11px}.message-row{cursor:pointer;border-bottom:1px solid #1d323880;align-items:flex-start;gap:10px;padding:10px 14px;display:flex}.message-row:hover{background:var(--bg-hover)}.message-row.selected{background:var(--bg-active)}.message-row.unread .msg-from{font-weight:700}.message-row.unread .msg-subject{color:var(--text);font-weight:600}.avatar{color:#04292b;border-radius:50%;flex:none;justify-content:center;align-items:center;width:36px;height:36px;font-size:13px;font-weight:700;display:flex}.avatar.lg{width:44px;height:44px;font-size:15px}.msg-main{flex:1;min-width:0}.msg-top{justify-content:space-between;gap:8px;display:flex}.msg-from{color:var(--text);font-size:13px}.msg-time{color:var(--text-faint);flex:none;font-size:12px}.msg-subject{color:var(--text-dim);text-overflow:ellipsis;white-space:nowrap;margin-top:2px;font-size:13px;overflow:hidden}.msg-snippet{color:var(--text-faint);text-overflow:ellipsis;margin-top:2px;font-size:12px;overflow:hidden}.msg-side{flex-direction:column;align-items:flex-end;gap:6px;display:flex}.attachment-icon{font-size:12px}.star-btn{cursor:pointer;color:var(--text-faint);background:0 0;border:none;padding:0;font-size:15px;line-height:1}.star-btn.starred{color:var(--star)}.empty-state{text-align:center;color:var(--text-faint);padding:40px 20px}.thread-view{background:var(--bg-panel);flex:1;padding:24px 32px;overflow-y:auto}.thread-view.empty{flex-direction:column;justify-content:center;align-items:center;gap:8px;display:flex}.empty-logo{font-size:42px}.thread-header{border-bottom:1px solid var(--border);margin-bottom:20px;padding-bottom:16px}.thread-subject-row{justify-content:space-between;align-items:flex-start;gap:16px;display:flex}.thread-subject{margin:0 0 8px;font-size:20px}.thread-actions{flex-wrap:wrap;flex:none;gap:6px;display:flex}.thread-actions button{background:var(--bg);border:1px solid var(--border);color:var(--text-dim);cursor:pointer;border-radius:8px;padding:6px 10px;font-size:12px}.thread-actions button:hover{color:var(--text);border-color:var(--teal-deep)}.thread-meta{align-items:flex-start;gap:12px;margin-top:12px;display:flex}.thread-meta-text{font-size:13px}.thread-from b{color:var(--text)}.muted{color:var(--text-dim)}.small{font-size:12px}.thread-body{color:var(--text);font-size:15px;line-height:1.6}.thread-text{white-space:pre-wrap}.composer-overlay{z-index:100;background:#040c0e99;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.composer{background:var(--bg-panel);border:1px solid var(--border);border-radius:14px;flex-direction:column;width:min(640px,100vw - 32px);max-height:84vh;display:flex;overflow:hidden}.composer-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:12px 16px;font-size:14px;font-weight:700;display:flex}.composer-fields{flex-direction:column;gap:8px;padding:12px 16px;display:flex;overflow-y:auto}.composer-row{align-items:center;gap:10px;display:flex}.composer-row label{width:56px;color:var(--text-dim);flex:none;font-size:13px}.composer-row input,.composer-row textarea{background:var(--bg);border:1px solid var(--border);color:var(--text);resize:vertical;border-radius:8px;outline:none;flex:1;padding:8px 10px;font-family:inherit;font-size:14px}.composer-row input:focus,.composer-row textarea:focus{border-color:var(--teal-deep)}.body-row{align-items:flex-start}.body-row textarea{min-height:180px}.link-btn{color:var(--teal);cursor:pointer;background:0 0;border:none;align-self:flex-start;padding:0;font-size:12px}.snippet-bar{flex-wrap:wrap;gap:6px;display:flex}.snippet-bar button{background:var(--bg);border:1px solid var(--border);color:var(--text-dim);cursor:pointer;border-radius:6px;padding:3px 8px;font-size:12px}.snippet-bar button:hover{color:var(--text);border-color:var(--teal-deep)}.composer-error{color:var(--danger);padding:0 16px 8px;font-size:13px}.composer-footer{border-top:1px solid var(--border);align-items:center;gap:12px;padding:12px 16px;display:flex}.send-btn{background:linear-gradient(135deg, var(--teal), var(--teal-deep));color:#04292b;cursor:pointer;border:none;border-radius:8px;padding:9px 22px;font-size:14px;font-weight:700}.send-btn:disabled{opacity:.6;cursor:default}.palette-overlay{z-index:110;background:#040c0e99;justify-content:center;align-items:flex-start;padding-top:14vh;display:flex;position:fixed;inset:0}.palette{background:var(--bg-panel);border:1px solid var(--border);border-radius:14px;width:min(520px,100vw - 32px);overflow:hidden}.palette input{width:100%;color:var(--text);border:none;border-bottom:1px solid var(--border);background:0 0;outline:none;padding:14px 16px;font-size:15px}.palette-list{max-height:320px;padding:6px;overflow-y:auto}.palette-item{cursor:pointer;border-radius:8px;justify-content:space-between;align-items:center;padding:9px 12px;font-size:14px;display:flex}.palette-item.active{background:var(--bg-active)}.palette-item kbd{background:var(--bg);border:1px solid var(--border);color:var(--text-dim);border-radius:4px;padding:1px 6px;font-size:11px}.palette-empty{color:var(--text-faint);text-align:center;padding:16px;font-size:13px}.palette.shortcuts{padding:20px}.palette.shortcuts h3{margin:0 0 14px}.shortcut-grid{grid-template-columns:1fr 1fr;gap:6px 24px;display:grid}.shortcut-row{align-items:center;gap:10px;padding:4px 0;font-size:13px;display:flex}.shortcut-row kbd{background:var(--bg);border:1px solid var(--border);color:var(--text-dim);text-align:center;border-radius:4px;min-width:64px;padding:1px 6px;font-size:11px}.palette.shortcuts .send-btn{margin-top:16px}.toasts{z-index:120;flex-direction:column;gap:8px;display:flex;position:fixed;bottom:20px;left:50%;transform:translate(-50%)}.toast{border:1px solid var(--border);background:#16323a;border-radius:10px;align-items:center;gap:12px;padding:10px 14px;font-size:14px;display:flex;box-shadow:0 10px 30px #0006}.toast-undo{color:var(--teal);cursor:pointer;background:0 0;border:none;font-size:13px;font-weight:700}.toast-x{color:var(--text-faint);cursor:pointer;background:0 0;border:none}@media (width<=768px){.app{flex-direction:column}.sidebar{border-right:none;border-bottom:1px solid var(--border);flex-direction:row;align-items:center;gap:6px;width:100%;padding:8px 10px;overflow-x:auto}.brand{padding:0 6px 0 0}.brand-name{display:none}.compose-btn{flex:none;margin-bottom:0;padding:8px 12px;font-size:13px}nav{flex-direction:row;gap:4px}.nav-item{flex:none;padding:6px 8px;font-size:12px}.nav-badge{margin-left:4px}.accounts,.sidebar-footer{display:none}.topbar{flex-wrap:wrap;gap:8px;padding:8px 10px}.topbar h1{font-size:14px}.search-input{min-width:0;max-width:none;padding:6px 10px;font-size:13px}.content-split{flex-direction:column;position:relative}.message-list{border-right:none;flex:1;width:100%}.thread-view{z-index:50;padding:16px;display:none;position:absolute;inset:0}.thread-view.has-message{display:block}.thread-actions{gap:4px}.thread-actions button{padding:5px 8px;font-size:11px}.thread-subject{font-size:17px}.shortcut-grid{grid-template-columns:1fr}.palette-overlay{padding-top:6vh}.composer{border-radius:0;width:100vw;height:100vh;max-height:100vh}.composer-overlay{padding:0}.message-row{padding:10px 12px}.msg-snippet{white-space:normal;-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box}.msg-subject{white-space:normal;-webkit-line-clamp:1;-webkit-box-orient:vertical;display:-webkit-box}}.mobile-back{display:none}@media (width<=768px){.mobile-back{background:var(--bg);border:1px solid var(--border);color:var(--teal);cursor:pointer;border-radius:8px;align-items:center;gap:4px;margin-bottom:8px;padding:5px 10px;font-size:12px;display:inline-flex}}.thread-reply-bar{border-top:1px solid var(--border);gap:8px;margin-top:24px;padding-top:16px;display:flex}.thread-reply-bar button{background:var(--bg);border:1px solid var(--border);color:var(--text-dim);cursor:pointer;border-radius:8px;padding:8px 14px;font-size:13px}.thread-reply-bar button:hover{color:var(--text);border-color:var(--teal-deep)}.palette.settings{width:min(560px,100vw - 32px);max-height:84vh;padding:0;overflow-y:auto}.settings-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:14px 16px;display:flex}.settings-header h3{margin:0}.settings-tabs{gap:4px;padding:10px 16px 0;display:flex}.settings-tabs button{border:1px solid var(--border);color:var(--text-dim);cursor:pointer;background:0 0;border-bottom:none;border-radius:8px 8px 0 0;padding:7px 14px;font-size:13px}.settings-tabs button.active{background:var(--bg-active);color:var(--text);font-weight:600}.settings-body{border-top:1px solid var(--border);flex-direction:column;gap:10px;padding:14px 16px 18px;display:flex}.preset-row{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.snippet-list{flex-direction:column;gap:6px;margin-top:6px;display:flex}.snippet-row{background:var(--bg);border:1px solid var(--border);border-radius:8px;align-items:center;gap:10px;padding:7px 10px;display:flex}.snippet-row kbd{background:var(--bg-panel);border:1px solid var(--border);color:var(--teal);border-radius:4px;flex:none;padding:1px 6px;font-size:11px}.snippet-body{color:var(--text-dim);text-overflow:ellipsis;white-space:nowrap;flex:1;font-size:13px;overflow:hidden}.icon-btn.gear{font-size:15px}@media (width<=768px){.thread-subject-row{flex-wrap:wrap}.thread-subject{overflow-wrap:anywhere;flex:100%;min-width:0}.thread-actions{flex-wrap:wrap;flex:100%;margin-top:6px}}:root[data-theme=light]{--bg:#f4f7f7;--bg-soft:#e9f0ef;--bg-panel:#fff;--bg-active:#e2f1f0;--bg-hover:#dcebe9;--border:#d8e2e2;--text:#13262a;--text-dim:#5d6e70;--text-faint:#8a9a9c;--teal:#0b9a9c;--teal-deep:#087f81;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}:root[data-theme=light] .message-row:hover{background:#eef5f4}:root[data-theme=light] .message-row.selected{background:#dcefeb}.theme-row{align-items:center;gap:10px;display:flex}.theme-row .muted{flex:1}