@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap";:root{--primary-brand:#2563eb;--primary-brand-hover:#1d4ed8;--primary-brand-ring:#2563eb33;--primary-brand-bg:#2563eb14;--logo-color:#2563eb;--background:#fafafa;--foreground:#09090b;--surface:#fff;--card:#fff;--card-foreground:#09090b;--popover:#fff;--popover-foreground:#09090b;--primary:#18181b;--primary-foreground:#fafafa;--secondary:#f4f4f5;--secondary-foreground:#18181b;--muted:#f4f4f5;--muted-foreground:#71717a;--accent:#f4f4f5;--accent-foreground:#18181b;--destructive:#ef4444;--destructive-foreground:#fafafa;--border:#e4e4e7;--input:#e4e4e7;--ring:#18181b;--border-light:#f4f4f5;--hover-bg:#f4f4f5;--unread-bg:#f8fafc;--selected-bg:#eff6ff;--rounded-sm:4px;--rounded-md:6px;--rounded-lg:8px;--rounded-xl:12px;--rounded-2xl:16px;--rounded-full:9999px;--font-family:"Inter", system-ui, -apple-system, sans-serif;--shadow-sm:0 1px 2px 0 #0000000d;--shadow-md:0 4px 6px -1px #0000000d, 0 2px 4px -1px #00000005;--shadow-lg:0 10px 15px -3px #0000000a, 0 4px 6px -2px #00000005;--rail-width:68px;--sidebar-width:260px}body.dark-mode{--background:#09090b;--foreground:#fafafa;--surface:#09090b;--card:#09090b;--card-foreground:#fafafa;--popover:#09090b;--popover-foreground:#fafafa;--primary:#fafafa;--primary-foreground:#18181b;--secondary:#18181b;--secondary-foreground:#fafafa;--muted:#18181b;--muted-foreground:#a1a1aa;--accent:#18181b;--accent-foreground:#fafafa;--destructive:#7f1d1d;--destructive-foreground:#fafafa;--border:#27272a;--input:#27272a;--ring:#d4d4d8;--border-light:#18181b;--hover-bg:#18181b;--unread-bg:#0f172a;--selected-bg:#1e293b}body.theme-bkl{--primary-brand:#dc2626;--primary-brand-hover:#b91c1c;--primary-brand-ring:#dc262633;--primary-brand-bg:#dc262614;--logo-color:#dc2626;--selected-bg:#fef2f2}body.dark-mode.theme-bkl{--selected-bg:#450a0a}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-family);background-color:var(--background);color:var(--foreground);-webkit-font-smoothing:antialiased;width:100vw;height:100vh;overflow:hidden}input,button,select,textarea{font-family:inherit;font-size:inherit;outline:none}button{cursor:pointer;background:0 0;border:none;transition:all .15s}button:disabled{cursor:not-allowed;opacity:.5}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--border);border-radius:var(--rounded-full)}::-webkit-scrollbar-thumb:hover{background:var(--muted-foreground)}.display-lg{letter-spacing:-.03em;font-size:1.875rem;font-weight:800;line-height:2.25rem}.headline-md{letter-spacing:-.02em;font-size:1.25rem;font-weight:700;line-height:1.75rem}.title-sm{font-size:1rem;font-weight:600;line-height:1.5rem}.caption{color:var(--muted-foreground);font-size:.75rem;font-weight:400}.label-caps{text-transform:uppercase;letter-spacing:.08em;color:var(--muted-foreground);font-size:.7rem;font-weight:700}.app-container{background-color:var(--background);width:100vw;height:100vh;display:flex;overflow:hidden}.nav-rail{width:var(--rail-width);background-color:var(--background);height:100%;color:var(--foreground);border-right:1px solid var(--border);z-index:10;flex-direction:column;flex-shrink:0;justify-content:space-between;align-items:center;padding:16px 0;display:flex}.logo-container{justify-content:center;align-items:center;margin-bottom:20px;display:flex}.v-logo{border-radius:var(--rounded-lg);background-color:var(--primary-brand-bg);justify-content:center;align-items:center;width:34px;height:34px;display:flex}.v-logo:before{content:"V";color:var(--primary-brand);font-size:18px;font-weight:900}.rail-actions{flex-direction:column;flex-grow:1;align-items:center;gap:10px;display:flex}.rail-btn{border-radius:var(--rounded-lg);width:44px;height:44px;color:var(--muted-foreground);justify-content:center;align-items:center;display:flex}.rail-btn:hover{background-color:var(--secondary);color:var(--foreground)}.rail-btn.active{background-color:var(--primary-brand-bg);color:var(--primary-brand);border:1px solid var(--primary-brand-ring)}.rail-footer{flex-direction:column;align-items:center;gap:12px;display:flex}.user-avatar{border-radius:var(--rounded-full);background-color:var(--secondary);width:34px;height:34px;color:var(--secondary-foreground);border:1px solid var(--border);justify-content:center;align-items:center;font-size:12px;font-weight:700;display:flex}.context-sidebar{width:var(--sidebar-width);background-color:var(--surface);border-right:1px solid var(--border);z-index:5;flex-direction:column;flex-shrink:0;height:100%;padding:16px;display:flex}.compose-container{margin-bottom:16px}.btn-compose{background-color:var(--primary-brand);color:#fff;border-radius:var(--rounded-lg);justify-content:center;align-items:center;gap:8px;width:100%;padding:10px 14px;font-size:.875rem;font-weight:600;display:flex;box-shadow:0 2px 4px #0000000d}.btn-compose:hover{background-color:var(--primary-brand-hover);box-shadow:0 4px 12px var(--primary-brand-ring)}.sidebar-menu{flex-direction:column;flex-grow:1;gap:4px;display:flex;overflow-y:auto}.sidebar-section-title{margin:14px 0 6px 8px}.sidebar-item{border-radius:var(--rounded-lg);color:var(--muted-foreground);text-align:left;justify-content:space-between;align-items:center;width:100%;padding:8px 12px;font-size:.875rem;font-weight:500;display:flex}.sidebar-item:hover{background-color:var(--hover-bg);color:var(--foreground)}.sidebar-item.active{background-color:var(--primary-brand-bg);color:var(--primary-brand);font-weight:600}.sidebar-item-left{align-items:center;gap:10px;display:flex}.badge-unread{background-color:var(--primary-brand);color:#fff;border-radius:var(--rounded-full);text-align:center;min-width:18px;padding:2px 7px;font-size:.725rem;font-weight:700}.sidebar-mobile-footer{display:none}main{flex:1;min-width:0;height:100%;display:flex;position:relative;overflow:hidden}.fluid-content{flex:1;width:100%;min-width:0;height:100%;display:flex;overflow:hidden}.message-list-pane{border-right:1px solid var(--border);background-color:var(--background);flex-direction:column;flex-shrink:0;width:340px;min-width:340px;max-width:340px;height:100%;display:flex}.pane-header{border-bottom:1px solid var(--border);background-color:var(--surface);flex-direction:column;gap:10px;padding:14px 16px;display:flex}.search-container{align-items:center;display:flex;position:relative}.search-icon{color:var(--muted-foreground);position:absolute;left:10px}.search-input{border-radius:var(--rounded-lg);border:1px solid var(--border);background-color:var(--background);width:100%;color:var(--foreground);padding:8px 12px 8px 34px;font-size:.85rem;transition:all .15s}.search-input:focus{border-color:var(--primary-brand);background-color:var(--surface);box-shadow:0 0 0 2px var(--primary-brand-ring)}.messages-scroll{background-color:var(--surface);flex-grow:1;overflow-y:auto}.message-row{border-bottom:1px solid var(--border);cursor:pointer;background-color:var(--surface);padding:12px 14px;transition:all .15s;position:relative}.message-row:hover{background-color:var(--hover-bg)}.message-row.unread{background-color:var(--unread-bg)}.message-row.selected{background-color:var(--selected-bg);border-left:3px solid var(--primary-brand)}.message-row-top{justify-content:space-between;align-items:center;margin-bottom:2px;display:flex}.sender-name{color:var(--foreground);text-overflow:ellipsis;white-space:nowrap;font-size:.85rem;font-weight:600;overflow:hidden}.message-date{color:var(--muted-foreground);flex-shrink:0;font-size:.725rem}.message-row-mid{align-items:center;gap:6px;margin-bottom:2px;display:flex}.unread-dot{border-radius:var(--rounded-full);background-color:var(--primary-brand);flex-shrink:0;width:6px;height:6px}.mail-subject{color:var(--foreground);text-overflow:ellipsis;white-space:nowrap;font-size:.825rem;font-weight:500;overflow:hidden}.message-row.unread .mail-subject{font-weight:700}.mail-snippet{color:var(--muted-foreground);text-overflow:ellipsis;white-space:nowrap;font-size:.725rem;overflow:hidden}.row-quick-actions{background:var(--surface);border-radius:var(--rounded-md);border:1px solid var(--border);box-shadow:var(--shadow-sm);z-index:2;gap:4px;padding:2px 4px;display:none;position:absolute;bottom:8px;right:10px}body.dark-mode .row-quick-actions{background:#09090b}.message-row:hover .row-quick-actions{display:flex}.quick-action-btn{border-radius:var(--rounded-md);color:var(--muted-foreground);justify-content:center;align-items:center;padding:5px;display:flex}.quick-action-btn:hover{background-color:var(--secondary);color:var(--foreground)}.quick-action-btn.delete:hover{color:#ef4444;background-color:#fee2e2}body.dark-mode .quick-action-btn.delete:hover{color:#f87171;background-color:#450a0a}.reading-pane,.message-reader-pane{background-color:var(--surface);flex-direction:column;flex:1;width:100%;min-width:0;height:100%;display:flex;overflow:hidden}.reading-pane-empty{color:var(--muted-foreground);background-color:var(--surface);flex-direction:column;flex:1;justify-content:center;align-items:center;gap:12px;display:flex}.mobile-back-btn{color:var(--primary-brand);border-radius:var(--rounded-lg);border:1px solid var(--border);background-color:var(--secondary);align-items:center;gap:6px;width:fit-content;margin-bottom:12px;padding:6px 12px;font-size:.85rem;font-weight:600;display:none}.reader-header{border-bottom:1px solid var(--border);background-color:var(--surface);flex-direction:column;gap:12px;padding:16px 24px;display:flex}.reader-subject-row{justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.reader-subject{letter-spacing:-.02em;color:var(--foreground);font-size:1.2rem;font-weight:700;line-height:1.35}.reader-tags{flex-shrink:0;gap:6px;display:flex}.badge-tag.internal{border-radius:var(--rounded-md);background-color:var(--primary-brand-bg);color:var(--primary-brand);border:1px solid var(--primary-brand-ring);text-transform:uppercase;padding:2px 8px;font-size:.7rem;font-weight:700}.reader-meta-row{justify-content:space-between;align-items:center;gap:16px;display:flex}.meta-sender-details{align-items:center;gap:12px;min-width:0;display:flex}.sender-avatar{border-radius:var(--rounded-full);background-color:var(--primary-brand-bg);width:36px;height:36px;color:var(--primary-brand);border:1px solid var(--primary-brand-ring);flex-shrink:0;justify-content:center;align-items:center;font-size:13px;font-weight:700;display:flex}.sender-info-text{flex-direction:column;min-width:0;display:flex}.sender-email-line{color:var(--foreground);text-overflow:ellipsis;white-space:nowrap;font-size:.875rem;font-weight:600;overflow:hidden}.recipient-line{color:var(--muted-foreground);text-overflow:ellipsis;white-space:nowrap;font-size:.75rem;overflow:hidden}.meta-actions-right{flex-shrink:0;align-items:center;gap:6px;display:flex}.btn-icon{border-radius:var(--rounded-md);color:var(--muted-foreground);border:1px solid var(--border);justify-content:center;align-items:center;padding:7px;display:flex}.btn-icon:hover{background-color:var(--secondary);color:var(--foreground)}.btn-icon.delete:hover{color:#ef4444;background-color:#fee2e2;border-color:#fecaca}body.dark-mode .btn-icon.delete:hover{color:#f87171;background-color:#450a0a;border-color:#7f1d1d}.mail-body-container{background-color:var(--surface);flex-direction:column;flex:1;width:100%;min-height:0;padding:20px;display:flex;overflow:hidden}.mail-iframe{border-radius:var(--rounded-lg);background-color:#fff;border:none;flex:1;width:100%;height:100%;min-height:350px}.attachments-panel{border-top:1px solid var(--border);background-color:var(--background);flex-shrink:0;padding:16px 20px}.attachments-title{text-transform:uppercase;letter-spacing:.05em;color:var(--muted-foreground);align-items:center;margin-bottom:10px;font-size:.725rem;font-weight:700;display:flex}.attachments-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px;display:grid}.attachment-card{border:1px solid var(--border);border-radius:var(--rounded-lg);background-color:var(--surface);color:var(--foreground);justify-content:space-between;align-items:center;padding:8px 12px;text-decoration:none;transition:all .15s;display:flex}.attachment-card:hover{border-color:var(--primary-brand);box-shadow:var(--shadow-sm)}.attachment-info{flex:1;align-items:center;gap:10px;min-width:0;display:flex}.attachment-details{flex-direction:column;flex:1;min-width:0;display:flex;overflow:hidden}.attachment-name{text-overflow:ellipsis;white-space:nowrap;color:var(--foreground);font-size:.8rem;font-weight:600;overflow:hidden}.attachment-size{color:var(--muted-foreground);font-size:.7rem}.attachment-dl-btn{border-radius:var(--rounded-md);color:var(--muted-foreground);flex-shrink:0;justify-content:center;align-items:center;padding:6px;display:flex}.attachment-dl-btn:hover{background-color:var(--primary-brand-bg);color:var(--primary-brand)}.compose-backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1000;background-color:#09090b66;justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;position:fixed;top:0;left:0}.compose-window{background-color:var(--surface);border:1px solid var(--border);border-radius:var(--rounded-xl);box-shadow:var(--shadow-lg);flex-direction:column;width:680px;max-width:94vw;height:80vh;max-height:750px;animation:.18s cubic-bezier(.16,1,.3,1) modalScaleIn;display:flex;overflow:hidden}.compose-header{border-bottom:1px solid var(--border);background-color:var(--surface);flex-shrink:0;justify-content:space-between;align-items:center;padding:14px 20px;display:flex}.compose-header-title{color:var(--foreground);font-size:.95rem;font-weight:700}.btn-close{border-radius:var(--rounded-md);color:var(--muted-foreground);justify-content:center;align-items:center;padding:6px;display:flex}.btn-close:hover{background-color:var(--secondary);color:var(--foreground)}.compose-fields{background-color:var(--surface);border-bottom:1px solid var(--border);flex-direction:column;flex-shrink:0;gap:8px;padding:12px 20px;display:flex}.compose-field-row{align-items:center;gap:12px;display:flex}.compose-label{width:65px;color:var(--muted-foreground);text-transform:uppercase;letter-spacing:.05em;flex-shrink:0;font-size:.725rem;font-weight:700}.compose-input{color:var(--foreground);background:0 0;border:none;flex-grow:1;padding:6px 0;font-size:.875rem}.compose-input::placeholder{color:var(--muted-foreground)}.compose-cc-toggle{color:var(--primary-brand);cursor:pointer;flex-shrink:0;font-size:.75rem;font-weight:600}.compose-cc-toggle:hover{text-decoration:underline}.editor-toolbar{border-bottom:1px solid var(--border);background-color:var(--background);flex-wrap:wrap;flex-shrink:0;justify-content:space-between;align-items:center;gap:8px;padding:8px 16px;display:flex}.toolbar-btn{border-radius:var(--rounded-md);border:1px solid var(--border);color:var(--muted-foreground);background-color:var(--surface);align-items:center;gap:6px;padding:6px 10px;font-size:.8rem;font-weight:600;transition:all .15s;display:flex}.toolbar-btn:hover{background-color:var(--hover-bg);color:var(--foreground)}.toolbar-btn.active{background-color:var(--primary-brand-bg);color:var(--primary-brand);border-color:var(--primary-brand-ring)}.toolbar-divider{background-color:var(--border);width:1px;height:20px;margin:0 4px}.template-picker{border-radius:var(--rounded-md);border:1px solid var(--border);background-color:var(--surface);color:var(--foreground);cursor:pointer;padding:6px 12px;font-size:.8rem;font-weight:500}.template-picker:focus{border-color:var(--primary-brand)}.compose-body-area{background-color:var(--surface);flex-direction:column;flex:1;min-height:200px;display:flex;position:relative;overflow:hidden}.editor-textarea{width:100%;height:100%;min-height:200px;color:var(--foreground);background-color:var(--surface);border:none;outline:none;flex:1;padding:16px 20px;font-size:.9rem;line-height:1.6;overflow-y:auto}.compose-attachments-bar{border-top:1px solid var(--border);background-color:var(--background);flex-wrap:wrap;flex-shrink:0;gap:8px;padding:10px 16px;display:flex}.compose-attachment-chip{border-radius:var(--rounded-full);border:1px solid var(--border);background-color:var(--surface);color:var(--foreground);align-items:center;gap:6px;padding:4px 10px;font-size:.75rem;display:flex}.remove-attach-btn{color:var(--muted-foreground);justify-content:center;align-items:center;display:flex}.remove-attach-btn:hover{color:var(--destructive)}.compose-footer{border-top:1px solid var(--border);background-color:var(--surface);flex-shrink:0;justify-content:space-between;align-items:center;padding:14px 20px;display:flex}.footer-actions-left{align-items:center;gap:12px;display:flex}.btn-send{background-color:var(--primary-brand);color:#fff;border-radius:var(--rounded-lg);border:none;align-items:center;gap:8px;padding:9px 20px;font-size:.875rem;font-weight:600;display:flex;box-shadow:0 2px 4px #0000000d}.btn-send:hover{background-color:var(--primary-brand-hover);box-shadow:0 4px 12px var(--primary-brand-ring)}.btn-attach{border-radius:var(--rounded-lg);border:1px solid var(--border);background-color:var(--surface);color:var(--muted-foreground);align-items:center;gap:6px;padding:8px 14px;font-size:.85rem;font-weight:600;transition:all .15s;display:flex}.btn-attach:hover{background-color:var(--hover-bg);color:var(--foreground)}.custom-context-menu{background-color:var(--surface);border:1px solid var(--border);border-radius:var(--rounded-lg);box-shadow:var(--shadow-lg);z-index:10000;flex-direction:column;min-width:180px;padding:4px;animation:.12s ease-out contextFadeIn;display:flex;position:fixed}.context-menu-item{color:var(--foreground);border-radius:var(--rounded-md);text-align:left;cursor:pointer;align-items:center;gap:10px;padding:8px 12px;font-size:.8rem;font-weight:500;display:flex;position:relative}.context-menu-item:hover{background-color:var(--hover-bg)}.context-menu-item.delete:hover{color:#ef4444;background-color:#fee2e2}body.dark-mode .context-menu-item.delete:hover{color:#f87171;background-color:#450a0a}.context-menu-divider{background-color:var(--border);height:1px;margin:4px 0}.context-submenu{background-color:var(--surface);border:1px solid var(--border);border-radius:var(--rounded-lg);box-shadow:var(--shadow-lg);min-width:140px;padding:4px;position:absolute;top:0;left:100%}.context-submenu-item{border-radius:var(--rounded-md);color:var(--foreground);padding:6px 10px;font-size:.8rem}.context-submenu-item:hover{background-color:var(--hover-bg)}.settings-view{background-color:var(--background);flex-grow:1;height:100%;padding:32px;overflow-y:auto}.settings-card{background-color:var(--surface);border:1px solid var(--border);border-radius:var(--rounded-xl);box-shadow:var(--shadow-sm);margin-bottom:24px;padding:24px}.settings-row{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:14px 0;display:flex}.settings-row:last-child{border-bottom:none}.settings-info{flex-direction:column;gap:2px;display:flex}.settings-title{color:var(--foreground);font-size:.875rem;font-weight:600}.settings-desc{color:var(--muted-foreground);font-size:.75rem}.login-container{background-color:var(--background);justify-content:center;align-items:center;width:100vw;height:100vh;display:flex}.login-card{background-color:var(--surface);border:1px solid var(--border);border-radius:var(--rounded-2xl);width:380px;box-shadow:var(--shadow-lg);flex-direction:column;padding:36px;display:flex}.login-logo-section{text-align:center;margin-bottom:24px}.login-brand{color:var(--foreground);letter-spacing:-.03em;font-size:1.35rem;font-weight:800}.login-subtitle{color:var(--muted-foreground);margin-top:4px;font-size:.75rem}.login-form{flex-direction:column;gap:16px;display:flex}.form-group{flex-direction:column;gap:6px;display:flex}.form-label{text-transform:uppercase;letter-spacing:.05em;color:var(--muted-foreground);font-size:.725rem;font-weight:600}.form-input{border-radius:var(--rounded-lg);border:1px solid var(--border);background-color:var(--surface);width:100%;color:var(--foreground);padding:10px 12px;font-size:.875rem;transition:all .15s}.form-input:focus{border-color:var(--primary-brand);box-shadow:0 0 0 2px var(--primary-brand-ring)}.btn-login{background-color:var(--primary-brand);color:#fff;border-radius:var(--rounded-lg);justify-content:center;align-items:center;gap:8px;width:100%;margin-top:8px;padding:11px;font-size:.875rem;font-weight:600;display:flex;box-shadow:0 2px 4px #0000000d}.btn-login:hover{background-color:var(--primary-brand-hover);box-shadow:0 4px 12px var(--primary-brand-ring)}.spinner{border-radius:var(--rounded-full);border:2px solid #fff3;border-top-color:#fff;width:18px;height:18px;animation:.8s linear infinite spin;display:inline-block}.spinner-dark{border-color:var(--border);border-top-color:var(--primary-brand)}@keyframes spin{to{transform:rotate(360deg)}}@keyframes modalScaleIn{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}@keyframes contextFadeIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}@media (width<=768px){.app-container{flex-direction:column}.nav-rail{border-right:none;border-bottom:1px solid var(--border);flex-direction:row;justify-content:space-between;width:100vw;height:52px;padding:0 16px}.rail-actions{flex-direction:row;flex-grow:0;gap:6px}.rail-btn{width:36px;height:36px}.rail-footer{flex-direction:row;gap:8px}.context-sidebar{z-index:1000;width:280px;height:100vh;box-shadow:var(--shadow-lg);transition:left .25s cubic-bezier(.16,1,.3,1);position:fixed;top:0;left:-300px}.context-sidebar.open{left:0}.sidebar-overlay{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:999;background:#09090b80;position:fixed;inset:0}.sidebar-mobile-footer{border-top:1px solid var(--border);justify-content:space-between;align-items:center;margin-top:auto;padding-top:14px;display:flex}.message-list-pane{border-right:none;width:100vw;min-width:100vw;max-width:100vw}.reading-pane,.message-reader-pane{width:100vw;min-width:100vw;max-width:100vw}.mobile-back-btn{display:inline-flex!important}.reader-header{padding:12px 16px}.mail-body-container{padding:12px}.compose-backdrop{padding:0}.compose-window{border:none;border-radius:0;width:100vw;max-width:100vw;height:100vh;max-height:100vh}.compose-fields{padding:10px 14px}.editor-toolbar{padding:6px 10px}.compose-footer{padding:10px 14px}}