*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--bg-app:#161b22;--bg-sidebar:#0d1117;--bg-list:#161b22;--bg-view:#0d1117;--bg-topbar:#161b22;--bg-hover:#1c2128;--bg-active:#1f2937;--bg-selected:#1a2332;--bg-card:#1c2128;--bg-input:#21262d;--accent:#7c5cfc;--accent-2:#4f9cf9;--accent-hover:#6a4de8;--accent-light:#7c5cfc1f;--accent-glow:#7c5cfc38;--gradient:linear-gradient(135deg,#7c5cfc 0%,#4f9cf9 100%);--text-1:#e6edf3;--text-2:#8b949e;--text-3:#484f58;--text-4:#30363d;--border:#30363d;--border-2:#21262d;--unread-bg:#161d27;--starred:#f5c518;--danger:#f85149;--danger-bg:#f8514914;--success:#3fb950;--shadow-sm:0 1px 4px #0006;--shadow-md:0 4px 16px #00000080;--shadow-lg:0 12px 40px #0009;--shadow-glow:0 0 32px #7c5cfc2e;--radius-sm:6px;--radius:8px;--radius-lg:12px;--radius-xl:18px;--sidebar-w:250px}html,body{height:100%}body{background:var(--bg-app);color:var(--text-1);-webkit-font-smoothing:antialiased;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;overflow:hidden}a{color:inherit;text-decoration:none}button{cursor:pointer;color:inherit;background:0 0;border:none;font-family:inherit}input,textarea,select{font-family:inherit}input[type=checkbox]{appearance:none;background-color:var(--bg-input);font:inherit;color:var(--accent);border:1px solid var(--border);cursor:pointer;border-radius:4px;place-content:center;width:16px;height:16px;margin:0;transition:all .15s ease-in-out;display:grid}input[type=checkbox]:before{content:"";background-color:var(--accent);transform-origin:50%;clip-path:polygon(14% 44%,0 65%,50% 100%,100% 16%,80% 0%,43% 62%);width:9px;height:9px;transition:transform .12s ease-in-out;transform:scale(0)}input[type=checkbox]:checked{border-color:var(--accent);background-color:var(--accent-light)}input[type=checkbox]:checked:before{transform:scale(1)}input[type=checkbox]:focus{border-color:var(--accent);outline:none}::-webkit-scrollbar{width:5px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--border);border-radius:4px}.app-shell{grid-template-rows:60px 1fr;grid-template-columns:var(--sidebar-w) 1fr;height:100vh;display:grid;overflow:hidden}.topbar{background:var(--bg-topbar);border-bottom:1px solid var(--border);z-index:20;grid-column:1/-1;align-items:center;gap:12px;height:60px;padding:0 16px;display:flex}.topbar-logo{align-items:center;gap:10px;min-width:200px;text-decoration:none;display:flex}.topbar-logo-icon{background:var(--gradient);width:36px;height:36px;box-shadow:0 2px 12px var(--accent-glow);border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;font-size:16px;display:flex}.topbar-logo-text{background:var(--gradient);-webkit-text-fill-color:transparent;letter-spacing:-.4px;white-space:nowrap;-webkit-background-clip:text;font-size:18px;font-weight:800}.topbar-search{flex:1;max-width:700px;margin:0 auto}.search-wrap{background:var(--bg-input);border:1px solid var(--border);border-radius:24px;align-items:center;gap:10px;padding:10px 18px;transition:all .18s;display:flex}.search-wrap:focus-within{background:var(--bg-card);border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-light)}.search-wrap input{color:var(--text-1);background:0 0;border:none;outline:none;flex:1;font-size:14px}.search-wrap input::placeholder{color:var(--text-3)}.search-icon{color:var(--text-3);flex-shrink:0;font-size:15px}.topbar-actions{align-items:center;gap:6px;margin-left:auto;display:flex}.tb-icon-btn{width:38px;height:38px;color:var(--text-2);border-radius:50%;justify-content:center;align-items:center;font-size:17px;transition:all .15s;display:flex}.tb-icon-btn:hover{background:var(--bg-hover);color:var(--text-1)}.acct-switcher-btn{border:1px solid var(--border);background:var(--bg-card);cursor:pointer;border-radius:24px;align-items:center;gap:9px;margin-left:4px;padding:5px 10px 5px 5px;transition:all .15s;display:flex;position:relative}.acct-switcher-btn:hover{background:var(--bg-hover);border-color:var(--accent)}.acct-avatar{background:var(--gradient);color:#fff;width:32px;height:32px;box-shadow:0 2px 10px var(--accent-glow);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:13px;font-weight:700;display:flex}.acct-switcher-label{flex-direction:column;align-items:flex-start;gap:1px;max-width:140px;display:flex}.acct-switcher-name{color:var(--text-1);white-space:nowrap;text-overflow:ellipsis;max-width:130px;font-size:13px;font-weight:600;overflow:hidden}.acct-switcher-email{color:var(--text-3);white-space:nowrap;text-overflow:ellipsis;max-width:130px;font-size:11px;overflow:hidden}.acct-chevron{color:var(--text-3);flex-shrink:0;font-size:12px;transition:transform .2s}.acct-chevron.open{transform:rotate(180deg)}.acct-dropdown{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);width:320px;box-shadow:var(--shadow-lg), var(--shadow-glow);z-index:1000;animation:.18s cubic-bezier(.16,1,.3,1) dropDown;position:absolute;top:calc(100% + 10px);right:0;overflow:hidden}@keyframes dropDown{0%{opacity:0;transform:translateY(-8px)scale(.97)}to{opacity:1;transform:translateY(0)scale(1)}}.acct-drop-header{border-bottom:1px solid var(--border);padding:12px 16px 10px}.acct-drop-header h3{color:var(--text-2);text-transform:uppercase;letter-spacing:.8px;font-size:12px;font-weight:700}.acct-drop-title{background:var(--gradient);-webkit-text-fill-color:transparent;-webkit-background-clip:text;margin-bottom:4px;font-size:15px;font-weight:800}.acct-drop-list{flex-direction:column;gap:2px;max-height:320px;padding:6px 8px;display:flex;overflow-y:auto}.acct-drop-item{border-radius:var(--radius-sm);cursor:pointer;text-align:left;background:0 0;border:none;align-items:center;gap:12px;width:100%;padding:9px 10px;transition:background .12s;display:flex}.acct-drop-item:hover{background:var(--bg-hover)}.acct-drop-item.selected{background:var(--accent-light)}.acct-drop-avatar{background:var(--gradient);color:#fff;width:38px;height:38px;box-shadow:var(--shadow-sm);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:14px;font-weight:700;display:flex}.acct-drop-info{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex;overflow:hidden}.acct-drop-name{color:var(--text-1);white-space:nowrap;text-overflow:ellipsis;font-size:13.5px;font-weight:600;overflow:hidden}.acct-drop-email{color:var(--text-2);white-space:nowrap;text-overflow:ellipsis;font-size:11.5px;overflow:hidden}.acct-drop-check{color:var(--accent);flex-shrink:0;font-size:16px}.acct-drop-divider{background:var(--border);height:1px;margin:4px 8px}.acct-drop-action{color:var(--text-2);cursor:pointer;text-align:left;background:0 0;border:none;align-items:center;gap:10px;width:100%;padding:9px 18px;font-size:13px;font-weight:500;transition:all .12s;display:flex}.acct-drop-action:hover{background:var(--bg-hover);color:var(--text-1)}.acct-drop-action.danger:hover{background:var(--danger-bg);color:var(--danger)}.sidebar{background:var(--bg-sidebar);border-right:1px solid var(--border);flex-direction:column;padding:12px 0 0;display:flex;overflow:hidden}.compose-btn{background:var(--gradient);color:#fff;border-radius:var(--radius-xl);box-shadow:0 4px 20px var(--accent-glow);cursor:pointer;border:none;flex-shrink:0;align-items:center;gap:10px;margin:0 12px 8px;padding:14px 20px;font-size:14px;font-weight:600;transition:all .2s;display:flex}.compose-btn:hover{transform:translateY(-1px);box-shadow:0 6px 28px #7c5cfc6b}.collapse-btn{background:var(--bg-input);color:var(--text-2);border:1px solid var(--border);border-radius:var(--radius-xl);cursor:pointer;flex-shrink:0;align-items:center;gap:10px;margin:0 12px 12px;padding:14px 20px;font-size:14px;font-weight:600;transition:all .2s;display:flex}.collapse-btn:hover{background:var(--accent-light);color:var(--accent);border-color:var(--accent);transform:translateY(-1px)}.collapse-btn svg{flex-shrink:0}.sidebar-nav{flex-direction:column;flex:1;gap:2px;padding:4px 8px;display:flex;overflow-y:auto}.nav-item{border-radius:var(--radius);color:var(--text-2);text-align:left;cursor:pointer;background:0 0;border:none;align-items:center;gap:14px;width:100%;padding:10px 12px;font-size:14px;font-weight:500;transition:all .12s;display:flex;position:relative}.nav-item:hover{background:var(--bg-hover);color:var(--text-1)}.nav-item.active{background:var(--accent-light);color:var(--accent);font-weight:700}.nav-item.active .nav-icon-wrap{color:var(--accent)}.nav-icon-wrap{width:22px;color:var(--text-2);flex-shrink:0;justify-content:center;align-items:center;font-size:16px;transition:color .12s;display:flex}.nav-item:hover .nav-icon-wrap{color:var(--text-1)}.nav-label{flex:1}.nav-badge{background:var(--accent);color:#fff;text-align:center;border-radius:20px;min-width:20px;padding:2px 7px;font-size:10px;font-weight:700}.sidebar-divider{background:var(--border);flex-shrink:0;height:1px;margin:10px 16px}.sidebar-section-title{text-transform:uppercase;letter-spacing:1.2px;color:var(--text-3);flex-shrink:0;padding:2px 20px 6px;font-size:10px;font-weight:700}.sidebar-bottom{border-top:1px solid var(--border);flex-shrink:0;padding:10px 8px 12px}.main-content{background:var(--bg-app);flex-direction:column;display:flex;overflow:hidden}.toolbar{border-bottom:1px solid var(--border);background:var(--bg-list);flex-shrink:0;align-items:center;gap:10px;height:52px;padding:0 16px;display:flex}.toolbar-label{color:var(--text-1);letter-spacing:-.4px;font-size:18px;font-weight:800}.toolbar-sub{color:var(--text-3);background:var(--bg-input);border-radius:20px;margin-left:4px;padding:2px 10px;font-size:13px}.toolbar-spacer{flex:1}.toolbar-btn{border-radius:var(--radius-sm);width:36px;height:36px;color:var(--text-2);border:1px solid var(--border);background:var(--bg-input);cursor:pointer;justify-content:center;align-items:center;font-size:16px;transition:all .15s;display:flex}.toolbar-btn:hover{background:var(--bg-hover);color:var(--text-1)}.email-panel{flex:1;display:flex;overflow:hidden}.email-list{border-right:1px solid var(--border);background:var(--bg-list);flex-direction:column;width:380px;min-width:320px;display:flex;overflow-y:auto}.email-list-header{border-bottom:1px solid var(--border);background:var(--bg-list);z-index:1;flex-shrink:0;justify-content:space-between;align-items:center;padding:10px 16px;display:flex;position:sticky;top:0}.email-list-header-title{color:var(--text-2);text-transform:uppercase;letter-spacing:.6px;font-size:12px;font-weight:700}.email-list-header-count{color:var(--text-3);background:var(--bg-input);border-radius:12px;padding:2px 8px;font-size:11px}.email-item{border-bottom:1px solid var(--border-2);cursor:pointer;align-items:center;gap:0;min-height:56px;padding:10px 12px;transition:background 80ms;display:flex;position:relative}.email-item:hover{background:var(--bg-hover)}.email-item.selected{background:var(--bg-selected)}.email-item.unread{background:var(--unread-bg)}.email-item.unread:before{content:"";background:var(--gradient);border-radius:0 3px 3px 0;width:3px;position:absolute;top:0;bottom:0;left:0}.email-star{flex-shrink:0;justify-content:center;align-items:center;width:32px;display:flex}.star-btn{color:var(--text-3);cursor:pointer;background:0 0;border:none;padding:0;font-size:14px;line-height:1;transition:color .12s,transform .12s}.star-btn:hover{color:var(--starred);transform:scale(1.2)}.star-btn.starred{color:var(--starred)}.email-avatar{color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;margin-right:10px;font-size:13px;font-weight:700;display:flex}.email-row-content{flex-direction:column;flex:1;gap:3px;min-width:0;display:flex;overflow:hidden}.email-row-top{align-items:center;gap:8px;display:flex}.email-from{color:var(--text-2);white-space:nowrap;text-overflow:ellipsis;flex-shrink:0;max-width:120px;font-size:13.5px;font-weight:500;overflow:hidden}.email-item.unread .email-from{color:var(--text-1);font-weight:700}.email-subject-preview{flex:1;align-items:center;gap:4px;min-width:0;display:flex;overflow:hidden}.email-subject{color:var(--text-2);white-space:nowrap;text-overflow:ellipsis;flex-shrink:0;max-width:50%;font-size:13px;overflow:hidden}.email-item.unread .email-subject{color:var(--text-1);font-weight:600}.email-sep{color:var(--text-3);flex-shrink:0;font-size:12px}.email-preview{color:var(--text-3);white-space:nowrap;text-overflow:ellipsis;flex:1;font-size:12.5px;overflow:hidden}.email-time{color:var(--text-3);white-space:nowrap;flex-shrink:0;margin-left:8px;font-size:11.5px}.email-item.unread .email-time{color:var(--text-2);font-weight:600}.unread-dot{background:var(--accent);width:8px;height:8px;box-shadow:0 0 8px var(--accent);border-radius:50%;flex-shrink:0}.email-view{background:var(--bg-view);flex-direction:column;flex:1;gap:24px;padding:32px 48px 48px;display:flex;overflow-y:auto}.email-view-empty{flex-direction:column;flex:1;justify-content:center;align-items:center;gap:16px;display:flex}.email-view-empty .empty-icon{opacity:.1;font-size:64px}.email-view-empty p{color:var(--text-3);font-size:15px;font-weight:500}.email-view-header{border-bottom:1px solid var(--border);flex-direction:column;gap:20px;padding-bottom:24px;display:flex}.email-view-subject{color:var(--text-1);letter-spacing:-.5px;font-size:24px;font-weight:800;line-height:1.3}.email-view-meta{align-items:center;gap:14px;display:flex}.email-view-avatar{color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:44px;height:44px;font-size:16px;font-weight:700;display:flex}.email-view-from-info{flex-direction:column;flex:1;gap:3px;display:flex}.email-view-from-name{color:var(--text-1);font-size:15px;font-weight:700}.email-view-from-addr{color:var(--text-2);font-size:12px}.email-view-time{color:var(--text-3);white-space:nowrap;font-size:12px}.email-view-actions{flex-wrap:wrap;gap:8px;display:flex}.action-btn{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg-card);color:var(--text-2);cursor:pointer;align-items:center;gap:7px;padding:8px 16px;font-size:13px;font-weight:500;transition:all .15s;display:flex}.action-btn:hover{background:var(--bg-hover);color:var(--text-1);transform:translateY(-1px)}.action-btn.danger{color:var(--danger)}.action-btn.danger:hover{background:var(--danger-bg);border-color:#f851494d}.email-view-body{color:var(--text-1);white-space:pre-wrap;word-break:break-word;max-width:720px;font-size:15px;line-height:1.8}.email-view-body a{color:var(--accent)}.modal-overlay{z-index:1000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#000000a6;justify-content:flex-end;align-items:flex-end;padding:24px;display:flex;position:fixed;inset:0}.centered-overlay{z-index:1000;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#000000a6;justify-content:center;align-items:center;animation:.15s fadeIn;display:flex;position:fixed;inset:0}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.compose-modal{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-xl);width:580px;box-shadow:var(--shadow-lg), 0 0 40px var(--accent-glow);flex-direction:column;animation:.22s cubic-bezier(.16,1,.3,1) slideUp;display:flex;overflow:hidden}@keyframes slideUp{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}.compose-header{background:var(--bg-input);border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:15px 20px;display:flex}.compose-title{color:var(--text-1);font-size:14px;font-weight:700}.compose-close{width:30px;height:30px;color:var(--text-2);border-radius:50%;justify-content:center;align-items:center;font-size:20px;transition:all .15s;display:flex}.compose-close:hover{background:var(--bg-hover);color:var(--text-1)}.compose-field{border-bottom:1px solid var(--border);align-items:flex-start;gap:12px;padding:11px 20px;display:flex}.compose-field label{color:var(--text-3);text-transform:uppercase;letter-spacing:.8px;flex-shrink:0;min-width:46px;margin-top:2px;font-size:11px;font-weight:700}.compose-field input,.compose-field select{color:var(--text-1);background:0 0;border:none;outline:none;flex:1;font-size:13.5px}.compose-field select{color:var(--accent);font-weight:600}.compose-field select option{background:var(--bg-card);color:var(--text-1)}.compose-body{padding:14px 20px}.compose-body textarea{width:100%;min-height:200px;color:var(--text-1);resize:vertical;background:0 0;border:none;outline:none;font-size:14.5px;line-height:1.7}.compose-body textarea::placeholder{color:var(--text-3)}.compose-footer{border-top:1px solid var(--border);background:var(--bg-input);justify-content:space-between;align-items:center;padding:13px 20px;display:flex}.send-btn{background:var(--gradient);color:#fff;border-radius:var(--radius);box-shadow:0 4px 20px var(--accent-glow);cursor:pointer;border:none;align-items:center;gap:8px;padding:10px 24px;font-size:13.5px;font-weight:600;transition:all .2s;display:flex}.send-btn:hover{transform:translateY(-1px);box-shadow:0 6px 28px #7c5cfc73}.send-btn:disabled{opacity:.5;cursor:not-allowed;box-shadow:none;transform:none}.add-account-modal{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-xl);width:460px;box-shadow:var(--shadow-lg), 0 0 40px var(--accent-glow);flex-direction:column;animation:.22s cubic-bezier(.16,1,.3,1) slideUp;display:flex;overflow:hidden}.add-account-error{background:var(--danger-bg);color:var(--danger);border-radius:var(--radius-sm);border:1px solid #f8514940;padding:10px 14px;font-size:12.5px;line-height:1.5}.prefix-row{background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius-sm);align-items:center;gap:6px;padding:9px 12px;transition:all .18s;display:flex}.prefix-row:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-light)}.prefix-row input{color:var(--accent);background:0 0;border:none;outline:none;flex:1;min-width:0;font-size:14px;font-weight:600}.prefix-row input::placeholder{color:var(--text-3);font-weight:400}.prefix-at{color:var(--text-3);flex-shrink:0;font-size:14px;font-weight:600}.prefix-row select{background:var(--bg-sidebar);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-1);cursor:pointer;outline:none;padding:4px 8px;font-size:12.5px}.prefix-preview{color:var(--accent);margin-top:5px;font-size:11.5px;font-weight:500}.login-page{background:var(--bg-app);justify-content:center;align-items:center;min-height:100vh;display:flex;position:relative;overflow:auto}.login-page:before{content:"";pointer-events:none;background:radial-gradient(circle,#7c5cfc12 0%,#0000 70%);width:700px;height:700px;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}.login-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-xl);width:100%;max-width:420px;box-shadow:var(--shadow-lg), 0 0 40px var(--accent-glow);padding:48px 40px;animation:.32s cubic-bezier(.16,1,.3,1) slideUp;position:relative}.login-logo{text-align:center;margin-bottom:40px}.login-logo-icon{background:var(--gradient);width:60px;height:60px;box-shadow:0 8px 28px var(--accent-glow);border-radius:18px;justify-content:center;align-items:center;margin:0 auto 18px;font-size:28px;display:flex}.login-logo h1{background:var(--gradient);-webkit-text-fill-color:transparent;letter-spacing:-.8px;-webkit-background-clip:text;margin-bottom:6px;font-size:28px;font-weight:900}.login-logo p{color:var(--text-3);font-size:13px}.form-group{flex-direction:column;gap:8px;margin-bottom:16px;display:flex}.form-group label{color:var(--text-2);text-transform:uppercase;letter-spacing:.8px;font-size:11px;font-weight:700}.form-group input{background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius);color:var(--text-1);outline:none;padding:12px 16px;font-size:14.5px;transition:all .18s}.form-group input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-light)}.login-btn{background:var(--gradient);color:#fff;border-radius:var(--radius);width:100%;box-shadow:0 4px 20px var(--accent-glow);cursor:pointer;border:none;margin-top:8px;padding:13px;font-size:15px;font-weight:700;transition:all .2s}.login-btn:hover{transform:translateY(-1px);box-shadow:0 8px 28px #7c5cfc80}.login-btn:disabled{opacity:.55;cursor:not-allowed;transform:none}.error-msg{background:var(--danger-bg);color:var(--danger);border-radius:var(--radius-sm);border:1px solid #f8514940;margin-bottom:16px;padding:11px 16px;font-size:13px}.empty-state{text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:14px;padding:48px;display:flex}.empty-state .icon{opacity:.15;font-size:52px}.empty-state h3{color:var(--text-2);font-size:15px;font-weight:700}.empty-state p{color:var(--text-3);max-width:220px;font-size:13px;line-height:1.6}.loading-state{flex:1;justify-content:center;align-items:center;display:flex}.spinner{border:2.5px solid var(--border);border-top-color:var(--accent);border-radius:50%;width:28px;height:28px;animation:.7s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.toast{background:var(--bg-card);border:1px solid var(--border);color:var(--text-1);border-radius:var(--radius);z-index:9999;box-shadow:var(--shadow-lg);white-space:nowrap;padding:12px 24px;font-size:13.5px;font-weight:500;animation:.22s cubic-bezier(.16,1,.3,1) toastIn;position:fixed;bottom:28px;left:50%;transform:translate(-50%)}@keyframes toastIn{0%{opacity:0;transform:translate(-50%)translateY(16px)}to{opacity:1;transform:translate(-50%)translateY(0)}}.toast.success{color:var(--success);border-color:#3fb9504d}.toast.error{color:var(--danger);border-color:#f851494d}.cs-wrap{width:100%;position:relative}.cs-compact{width:auto;min-width:130px}.cs-compact .cs-dropdown{min-width:190px;max-height:220px;left:auto;right:0;overflow-y:auto}.cs-compact .cs-option-label{white-space:nowrap;text-overflow:unset;overflow:visible}.cs-trigger{background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius);width:100%;color:var(--text-1);cursor:pointer;text-align:left;justify-content:space-between;align-items:center;gap:10px;padding:10px 14px;font-size:13.5px;font-weight:500;transition:all .15s;display:flex}.cs-trigger:hover{background:var(--bg-hover);border-color:var(--border-2)}.cs-trigger.open{border-color:var(--accent);background:var(--bg-hover);box-shadow:0 0 0 3px var(--accent-light)}.cs-compact .cs-trigger{padding:7px 10px;font-size:12.5px}.cs-trigger-content{flex:1;align-items:center;gap:8px;min-width:0;display:flex;overflow:hidden}.cs-trigger-label{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.cs-chevron{color:var(--text-3);flex-shrink:0;transition:transform .2s cubic-bezier(.16,1,.3,1),color .15s}.cs-chevron.open{color:var(--accent);transform:rotate(180deg)}.cs-dot{border-radius:50%;flex-shrink:0;width:9px;height:9px;box-shadow:0 0 8px}.cs-icon{flex-shrink:0;font-size:15px;line-height:1}.cs-dropdown{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg), 0 0 24px #7c5cfc1a;z-index:500;scrollbar-width:thin;scrollbar-color:var(--border) transparent;max-height:240px;padding:4px;animation:.18s cubic-bezier(.16,1,.3,1) csDropIn;position:absolute;top:calc(100% + 6px);left:0;right:0;overflow-y:auto}.cs-dropdown::-webkit-scrollbar{width:4px}.cs-dropdown::-webkit-scrollbar-track{background:0 0}.cs-dropdown::-webkit-scrollbar-thumb{background:var(--border);border-radius:4px}.cs-dropdown::-webkit-scrollbar-thumb:hover{background:var(--accent)}@keyframes csDropIn{0%{opacity:0;transform:translateY(-6px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}.cs-option{border-radius:var(--radius-sm);cursor:pointer;text-align:left;width:100%;color:var(--text-1);background:0 0;border:none;justify-content:space-between;align-items:center;gap:10px;padding:9px 12px;transition:background .1s;display:flex}.cs-option:hover{background:var(--bg-hover)}.cs-option.selected{background:var(--accent-light)}.cs-option.selected svg{color:var(--accent)}.cs-option-left{flex:1;align-items:center;gap:10px;min-width:0;display:flex;overflow:hidden}.cs-option-text{flex-direction:column;gap:1px;min-width:0;display:flex;overflow:hidden}.cs-option-label{color:var(--text-1);white-space:nowrap;text-overflow:ellipsis;font-size:13.5px;font-weight:500;overflow:hidden}.cs-option.selected .cs-option-label{color:var(--accent);font-weight:600}.cs-option-sub{color:var(--text-3);white-space:nowrap;text-overflow:ellipsis;font-size:11.5px;overflow:hidden}@media (min-width:768px) and (max-width:1023px){:root{--sidebar-w:68px}.collapse-btn{display:none!important}.sidebar{align-items:center;padding-top:8px}.compose-btn{border-radius:50%;justify-content:center;width:44px;height:44px;margin:0 0 8px;padding:0}.compose-label{display:none}.nav-item{justify-content:center;gap:0;padding:10px}.nav-label{display:none}.nav-badge{min-width:16px;padding:1px 4px;font-size:9px;position:absolute;top:4px;right:4px}.nav-icon-wrap{width:auto}.sidebar-nav{width:100%;padding:4px 0}.email-list{width:300px;min-width:260px}.acct-switcher-label{display:none}.acct-switcher-btn{padding:4px}.compose-modal{width:calc(100vw - 32px);max-width:520px}}@media (max-width:767px){.collapse-btn{display:none!important}.app-shell{grid-template-rows:56px 1fr;grid-template-columns:1fr}.topbar{gap:8px;height:56px;padding:0 12px}.sidebar{display:none}.topbar-logo{min-width:auto}.topbar-logo-text,.acct-switcher-label{display:none}.acct-switcher-btn{background:0 0;border:none;padding:0}.acct-switcher-btn .acct-chevron{display:none}.topbar-search{flex:1;min-width:0;max-width:none}.search-wrap{gap:6px;padding:6px 12px}.search-wrap input{width:100%;min-width:0;font-size:13px}.topbar-actions{gap:4px}.toolbar{height:44px;padding:0 12px}.toolbar-label{font-size:15px}.toolbar-sub{display:none}.toolbar-has-selection .toolbar-label,.toolbar-has-selection .toolbar-sub,.toolbar-btn .btn-text{display:none!important}.toolbar-btn{gap:0!important;padding:0 8px!important}.email-panel{position:relative}.email-list{border-right:none;width:100%;min-width:0;padding-bottom:60px}.email-view{z-index:200;background:var(--bg-view);padding:16px 14px 24px;transition:transform .28s cubic-bezier(.16,1,.3,1);position:fixed;inset:56px 0 60px;overflow-y:auto;transform:translate(100%)}.email-view.mobile-open{transform:translate(0);box-shadow:-4px 0 24px #00000080}.email-view-empty{display:none}.mobile-back-btn{display:flex!important}.email-view-subject{font-size:18px}.modal-overlay{justify-content:stretch;align-items:flex-end;padding:0}.compose-modal{border-radius:var(--radius-xl) var(--radius-xl) 0 0;width:100%;max-width:100%;max-height:90vh}.add-account-modal{width:calc(100vw - 24px)}.acct-dropdown{width:min(320px,100vw - 24px);right:-4px}.action-btn{gap:5px;padding:7px 10px;font-size:12px}.toast{bottom:72px}.empty-state{padding:32px 20px}.main-content{overflow:hidden}}.mobile-bottom-nav{background:var(--bg-sidebar);border-top:1px solid var(--border);z-index:150;justify-content:space-around;align-items:center;height:60px;padding:0 4px;display:none;position:fixed;bottom:0;left:0;right:0}@media (max-width:767px){.mobile-bottom-nav{display:flex}}.mobile-nav-item{height:100%;color:var(--text-3);cursor:pointer;background:0 0;border:none;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:3px;padding:6px 2px 4px;transition:color .15s;display:flex;position:relative}.mobile-nav-item.active{color:var(--accent)}.mobile-nav-item:hover{color:var(--text-2)}.mobile-compose-icon{background:var(--gradient);width:38px;height:38px;box-shadow:0 4px 16px var(--accent-glow);color:#fff;border-radius:50%;justify-content:center;align-items:center;display:flex}.mobile-nav-label{font-size:10px;font-weight:500;line-height:1}.mobile-nav-badge{background:var(--accent);color:#fff;text-align:center;border-radius:10px;min-width:16px;padding:1px 5px;font-size:9px;font-weight:700;position:absolute;top:5px;right:calc(50% - 16px)}.mobile-back-btn{color:var(--accent);cursor:pointer;background:0 0;border:none;align-items:center;gap:6px;margin-bottom:4px;padding:0 0 12px;font-size:13px;font-weight:600;display:none}@keyframes floatIn{0%{opacity:0;transform:scale(.95)translateY(8px)}to{opacity:1;transform:scale(1)translateY(0)}}body.sidebar-collapsed{--sidebar-w:68px}body.sidebar-collapsed .sidebar{align-items:center;padding-top:8px;overflow:visible}body.sidebar-collapsed .compose-btn{border-radius:50%;justify-content:center;width:44px;height:44px;margin:0 0 8px;padding:0}body.sidebar-collapsed .collapse-btn{border-radius:50%;justify-content:center;width:44px;height:44px;margin:0 0 12px;padding:0}body.sidebar-collapsed .nav-item{justify-content:center;gap:0;width:100%;padding:10px}body.sidebar-collapsed .nav-label{display:none}body.sidebar-collapsed .nav-badge{min-width:16px;padding:1px 4px;font-size:9px;position:absolute;top:4px;right:4px}body.sidebar-collapsed .nav-icon-wrap{width:auto}body.sidebar-collapsed .sidebar-nav{width:100%;padding:4px 0}body.sidebar-collapsed .nav-item{position:relative}.app-shell{transition:grid-template-columns .25s cubic-bezier(.16,1,.3,1)}
@keyframes slideInLeft{0%{opacity:0;transform:translate(-16px)}to{opacity:1;transform:translate(0)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.88)}to{opacity:1;transform:scale(1)}}@keyframes starPop{0%{transform:scale(1)rotate(0)}40%{transform:scale(1.55)rotate(-15deg)}70%{transform:scale(.88)rotate(8deg)}to{transform:scale(1)rotate(0)}}@keyframes pulseGlow{0%,to{box-shadow:0 4px 20px #7c5cfc59}50%{box-shadow:0 4px 36px #7c5cfcb3,0 0 60px #4f9cf92e}}@keyframes unreadPing{0%{opacity:1;transform:scale(1)}70%{opacity:0;transform:scale(2.2)}to{opacity:0;transform:scale(1)}}@keyframes iconSpin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes toastSlideUp{0%{opacity:0;transform:translate(-50%)translateY(18px)scale(.95)}to{opacity:1;transform:translate(-50%)translateY(0)scale(1)}}@keyframes floatIn{0%{opacity:0;transform:translateY(22px)scale(.97)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes dotBounce{0%,80%,to{opacity:.4;transform:scale(0)}40%{opacity:1;transform:scale(1)}}@keyframes navBarSlide{0%{transform:scaleY(0)}to{transform:scaleY(1)}}@keyframes shimmer{0%{background-position:-400px 0}to{background-position:400px 0}}.nav-item{animation:.28s cubic-bezier(.16,1,.3,1) both slideInLeft}.nav-item:first-child{animation-delay:40ms}.nav-item:nth-child(2){animation-delay:90ms}.nav-item:nth-child(3){animation-delay:.14s}.nav-item:nth-child(4){animation-delay:.19s}.nav-item:nth-child(5){animation-delay:.24s}.nav-item{position:relative}.nav-item.active:before{content:"";background:var(--gradient);transform-origin:top;border-radius:0 3px 3px 0;width:3px;animation:.2s cubic-bezier(.16,1,.3,1) navBarSlide;position:absolute;top:20%;bottom:20%;left:0}.nav-icon-wrap{justify-content:center;align-items:center;display:flex}.nav-icon-wrap svg{transition:transform .22s cubic-bezier(.34,1.56,.64,1),filter .2s}.nav-item:hover .nav-icon-wrap svg{transform:scale(1.2)}.nav-item.active .nav-icon-wrap svg{filter:drop-shadow(0 0 5px #7c5cfca6);transform:scale(1.12)}.compose-btn{animation:3s ease-in-out infinite pulseGlow}.compose-btn:hover{animation:none;transform:translateY(-2px)scale(1.03)!important;box-shadow:0 8px 32px #7c5cfc99!important}.compose-btn svg{transition:transform .2s cubic-bezier(.34,1.56,.64,1)}.compose-btn:hover svg{transform:rotate(-12deg)scale(1.2)}.spinning svg{animation:.65s cubic-bezier(.4,0,.2,1) iconSpin}.tb-icon-btn svg{transition:transform .2s cubic-bezier(.34,1.56,.64,1),color .15s}.tb-icon-btn:hover svg{color:var(--accent);transform:scale(1.2)}.acct-avatar{transition:transform .2s cubic-bezier(.34,1.56,.64,1),box-shadow .2s}.acct-switcher-btn:hover .acct-avatar{transform:scale(1.12);box-shadow:0 4px 16px #7c5cfc66}.acct-chevron{transition:transform .22s cubic-bezier(.16,1,.3,1),color .15s}.acct-chevron.open{color:var(--accent);transform:rotate(180deg)}.acct-drop-item{transition:background .1s,transform .18s cubic-bezier(.16,1,.3,1)}.acct-drop-item:hover{transform:translate(4px)}.email-item{animation:.22s cubic-bezier(.16,1,.3,1) both fadeInUp}.email-item:first-child{animation-delay:30ms}.email-item:nth-child(2){animation-delay:60ms}.email-item:nth-child(3){animation-delay:90ms}.email-item:nth-child(4){animation-delay:.12s}.email-item:nth-child(5){animation-delay:.15s}.email-item:nth-child(6){animation-delay:.17s}.email-item:nth-child(7){animation-delay:.19s}.email-item:nth-child(n+8){animation-delay:.21s}.star-btn{transition:color .15s,transform .15s}.star-btn:hover svg{transform:scale(1.3)}.star-btn.starred svg{filter:drop-shadow(0 0 6px #f5c518cc)}.star-btn.pop svg{animation:.38s cubic-bezier(.34,1.56,.64,1) starPop}.unread-dot-wrap{display:flex;position:relative}.unread-dot-wrap:after{content:"";background:var(--accent);border-radius:50%;animation:1.8s cubic-bezier(0,0,.2,1) infinite unreadPing;position:absolute;inset:0}.email-view{animation:.2s both fadeInUp}.email-view-subject{animation:.25s cubic-bezier(.16,1,.3,1) 50ms both fadeInUp}.email-view-meta{animation:.25s cubic-bezier(.16,1,.3,1) 90ms both fadeInUp}.email-view-actions{animation:.25s cubic-bezier(.16,1,.3,1) .13s both fadeInUp}.action-btn{align-items:center;gap:7px;display:flex}.action-btn svg{transition:transform .2s cubic-bezier(.34,1.56,.64,1),filter .15s}.action-btn:hover svg{transform:scale(1.2)}.action-btn.danger:hover svg{filter:drop-shadow(0 0 5px #f851498c);transform:scale(1.2)rotate(-8deg)}.send-btn{align-items:center;gap:8px;display:flex}.send-btn svg{transition:transform .25s cubic-bezier(.34,1.56,.64,1)}.send-btn:hover svg{transform:translate(3px)translateY(-3px)rotate(-30deg)}.compose-modal,.add-account-modal{animation:.24s cubic-bezier(.16,1,.3,1) floatIn}.toast{animation:.25s cubic-bezier(.16,1,.3,1) toastSlideUp}.loading-dots{align-items:center;gap:4px;display:inline-flex}.loading-dots span{background:currentColor;border-radius:50%;width:6px;height:6px;animation:1.3s ease-in-out infinite both dotBounce}.loading-dots span:first-child{animation-delay:-.32s}.loading-dots span:nth-child(2){animation-delay:-.16s}.loading-dots span:nth-child(3){animation-delay:0s}.search-wrap svg{transition:transform .2s,color .2s}.search-wrap:focus-within svg{color:var(--accent);transform:scale(1.1)}.centered-overlay>div{animation:.22s cubic-bezier(.16,1,.3,1) floatIn}