@import"https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;600&display=swap";:root,html[data-theme=light]{--theme-bg: #f8fafc;--text-main: #0f172a;--text-secondary: #334155;--text-muted: #64748b;--text-shadow: none;--cfg-glass-alpha: .78;--cfg-bg-brightness: 1;--cfg-bg-image-url: url(/images/webmail-showcase-bg.jpg);--cfg-bg-mobile-url: url(/images/webmail-showcase-bg.jpg);--glass-alpha: var(--cfg-glass-alpha, .78);--glass-surface: rgba(255, 255, 255, .82);--glass-surface-hover: rgba(255, 255, 255, .92);--glass-surface-active: rgba(255, 255, 255, .98);--glass-surface-secondary: rgba(255, 255, 255, .65);--glass-blur: 24px;--glass-blur-sm: 14px;--glass-shadow: 0 12px 36px 0 rgba(15, 23, 42, .08), 0 2px 8px 0 rgba(15, 23, 42, .04), inset 0 1.5px 2px 0 rgba(255, 255, 255, .95);--glass-shadow-hover: 0 20px 48px 0 rgba(15, 23, 42, .12), inset 0 2px 3px 0 #ffffff;--glass-convex-shadow: 0 4px 14px rgba(15, 23, 42, .07), inset 0 1.5px 2px rgba(255, 255, 255, .95), inset 0 -1.5px 3px rgba(0, 0, 0, .03);--glass-convex-hover: 0 8px 20px rgba(15, 23, 42, .11), inset 0 2px 3px rgba(255, 255, 255, 1);--glass-input-bg: rgba(255, 255, 255, .85);--glass-input-bg-focus: rgba(255, 255, 255, .98);--glass-input-border: rgba(148, 163, 184, .4);--glass-input-color: #0f172a;--glass-input-placeholder: #94a3b8;--glass-input-shadow: inset 0 1px 2px rgba(15, 23, 42, .06);--tabs-bg: rgba(241, 245, 249, .82);--indicator-bg: #ffffff;--indicator-shadow: 0 4px 12px rgba(15, 23, 42, .1), inset 0 1px 1.5px #ffffff;--tab-inactive-color: #64748b;--tab-active-color: #0f172a;--btn-default-color: #1e293b;--btn-default-bg: rgba(255, 255, 255, .85);--btn-default-border: rgba(203, 213, 225, .7);--ambient-bg-1: radial-gradient(circle at 15% 15%, rgba(56, 189, 248, .22) 0%, transparent 55%);--ambient-bg-2: radial-gradient(circle at 85% 80%, rgba(129, 140, 248, .18) 0%, transparent 60%);--ambient-bg-3: radial-gradient(circle at 50% 50%, rgba(255, 255, 255, .65) 0%, transparent 70%);--ambient-feature-bg: rgba(255, 255, 255, .85);--ambient-feature-border: rgba(255, 255, 255, .95);--ambient-feature-shadow: 0 10px 30px rgba(15, 23, 42, .08), inset 0 1px 2px #ffffff;--ambient-feature-color: #1e293b;--brand-cyan: #0284c7;--brand-cyan-glow: rgba(2, 132, 199, .25);--brand-indigo: #6366f1;--brand-purple: #9333ea;--status-danger: #e11d48;--status-success: #059669;--status-warn: #d97706;--radius-xs: 6px;--radius-sm: 10px;--radius-md: 16px;--radius-lg: 24px;--radius-xl: 32px;--radius-full: 9999px;--ease-elastic: cubic-bezier(.16, 1, .3, 1);--ease-liquid: cubic-bezier(.4, 0, .2, 1)}html[data-theme=dark]{--theme-bg: #060810;--text-main: #ffffff;--text-secondary: rgba(255, 255, 255, .75);--text-muted: rgba(255, 255, 255, .5);--text-shadow: 0 1px 3px rgba(0, 0, 0, .65);--cfg-glass-alpha: .16;--cfg-bg-brightness: .65;--cfg-bg-image-url: url(/images/webmail-showcase-bg.jpg);--glass-surface: rgba(255, 255, 255, .16);--glass-surface-hover: rgba(255, 255, 255, .24);--glass-surface-active: rgba(255, 255, 255, .3);--glass-surface-secondary: rgba(255, 255, 255, .08);--glass-shadow: 0 8px 32px 0 rgba(0, 0, 0, .35), inset 0 1px 1.5px 0 rgba(255, 255, 255, .45);--glass-shadow-hover: 0 16px 44px 0 rgba(0, 0, 0, .45), inset 0 1px 2px 0 rgba(255, 255, 255, .65);--glass-convex-shadow: 0 4px 14px rgba(0, 0, 0, .25), inset 0 1px 1.5px rgba(255, 255, 255, .5), inset 0 -1.5px 3px rgba(0, 0, 0, .2);--glass-convex-hover: 0 6px 18px rgba(0, 0, 0, .32), inset 0 1.5px 2.5px rgba(255, 255, 255, .65), inset 0 -1.5px 3px rgba(0, 0, 0, .25);--glass-input-bg: rgba(0, 0, 0, .35);--glass-input-bg-focus: rgba(0, 0, 0, .45);--glass-input-border: rgba(255, 255, 255, .14);--glass-input-color: #ffffff;--glass-input-placeholder: rgba(255, 255, 255, .55);--glass-input-shadow: inset 0 1px 2px rgba(0, 0, 0, .4);--tabs-bg: rgba(0, 0, 0, .28);--indicator-bg: rgba(255, 255, 255, .28);--indicator-shadow: 0 4px 16px rgba(0, 0, 0, .25), inset 0 1px 1.5px rgba(255, 255, 255, .7);--tab-inactive-color: rgba(255, 255, 255, .7);--tab-active-color: #ffffff;--btn-default-color: #ffffff;--btn-default-bg: rgba(255, 255, 255, .16);--btn-default-border: rgba(255, 255, 255, .18);--ambient-bg-1: radial-gradient(circle at 20% 15%, rgba(56, 189, 248, .12) 0%, transparent 50%);--ambient-bg-2: radial-gradient(circle at 85% 75%, rgba(129, 140, 248, .1) 0%, transparent 60%);--ambient-bg-3: transparent;--ambient-feature-bg: rgba(15, 23, 42, .45);--ambient-feature-border: rgba(255, 255, 255, .12);--ambient-feature-shadow: 0 12px 32px rgba(0, 0, 0, .3);--ambient-feature-color: rgba(255, 255, 255, .9);--brand-cyan: #38bdf8;--brand-cyan-glow: rgba(56, 189, 248, .4)}html{scrollbar-gutter:stable both-edges;scroll-behavior:smooth;height:100%}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{width:100%;min-height:100vh;min-height:100dvh;font-family:Plus Jakarta Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;color:var(--text-main);background-color:var(--theme-bg);overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;transition:background-color .3s ease,color .3s ease}.viewport-bg-layer{position:fixed;top:0;right:0;bottom:0;left:0;background-image:var(--cfg-bg-image-url);background-size:cover;background-position:center;background-attachment:fixed;background-repeat:no-repeat;filter:brightness(var(--cfg-bg-brightness, 1));transition:filter .4s ease;z-index:0;pointer-events:none;will-change:filter}.ambient-light-glow{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--ambient-bg-1),var(--ambient-bg-2),var(--ambient-bg-3);z-index:1;pointer-events:none}.liquid-glass{position:relative;background:var(--glass-surface);backdrop-filter:blur(var(--glass-blur)) saturate(180%);-webkit-backdrop-filter:blur(var(--glass-blur)) saturate(180%);border:none!important;box-shadow:var(--glass-shadow);border-radius:var(--radius-lg);transform:translateZ(0);transition:transform .35s var(--ease-elastic),box-shadow .35s var(--ease-elastic),background .3s ease}.liquid-glass.zoomable:hover{transform:translateY(-3px) scale(1.012);box-shadow:var(--glass-shadow-hover);background:var(--glass-surface-hover)}.liquid-glass-secondary{position:relative;background:var(--glass-surface-secondary);backdrop-filter:blur(var(--glass-blur-sm)) saturate(160%);-webkit-backdrop-filter:blur(var(--glass-blur-sm)) saturate(160%);border-radius:var(--radius-md);box-shadow:inset 0 1px 1px #fff6,0 4px 16px #0f172a14}.convex-glass-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:8px 18px;font-size:.9rem;font-weight:700;white-space:nowrap;color:var(--btn-default-color)!important;background:var(--btn-default-bg);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-radius:var(--radius-sm);border:1px solid var(--btn-default-border)!important;box-shadow:var(--glass-convex-shadow)!important;cursor:pointer;outline:none;text-decoration:none;-webkit-user-select:none;user-select:none;position:relative;transition:background .2s ease,box-shadow .2s ease,border-color .2s ease,transform .12s var(--ease-elastic)}.convex-glass-btn:hover{background:var(--glass-surface-hover);box-shadow:var(--glass-convex-hover)!important}.convex-glass-btn:active{transform:translateY(1px)}.convex-glass-btn.primary{color:#fff!important;background:linear-gradient(135deg,#0284c7,#6366f1)!important;border-color:#fff6!important;box-shadow:0 4px 16px var(--brand-cyan-glow),inset 0 1px 1.5px #fff9!important}.convex-glass-btn.primary:hover{background:linear-gradient(135deg,#0369a1,#4f46e5)!important;box-shadow:0 8px 24px var(--brand-cyan-glow),inset 0 1.5px 2px #fffc!important}.convex-glass-btn.danger{color:#fff!important;background:#e11d48d9;box-shadow:0 4px 14px #e11d484d,inset 0 1px 1.5px #fff6!important}.convex-glass-btn.danger:hover{background:#be123cf2}.convex-glass-btn.loading,.btn.loading,button.loading{pointer-events:none!important;cursor:wait!important;color:transparent!important;text-shadow:none!important;opacity:.9!important}.convex-glass-btn.loading *,.btn.loading *,button.loading *{visibility:hidden!important;opacity:0!important}.convex-glass-btn.loading:after,.btn.loading:after,button.loading:after{content:""!important;position:absolute!important;width:16px!important;height:16px!important;top:50%!important;left:50%!important;margin-top:-8px!important;margin-left:-8px!important;border:2px solid rgba(255,255,255,.3)!important;border-top-color:var(--brand-cyan)!important;border-radius:50%!important;animation:spinLoader .65s linear infinite!important;display:block!important}@keyframes spinLoader{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.glass-input{width:100%;padding:12px 18px;border-radius:var(--radius-sm);background:var(--glass-input-bg);border:1px solid var(--glass-input-border)!important;color:var(--glass-input-color)!important;font-size:.92rem;outline:none;box-shadow:var(--glass-input-shadow);transition:border-color .2s ease,box-shadow .2s ease,background .2s ease}.glass-input:focus{background:var(--glass-input-bg-focus);border-color:var(--brand-cyan)!important;box-shadow:var(--glass-input-shadow),0 0 16px var(--brand-cyan-glow)}.glass-input::placeholder{color:var(--glass-input-placeholder)}.code-grid{display:flex;gap:10px;justify-content:center;margin:16px 0}.code-cell{width:48px;height:56px;border-radius:var(--radius-sm);background:var(--glass-input-bg);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);color:var(--glass-input-color);font-size:1.5rem;font-weight:800;text-align:center;border:1px solid var(--glass-input-border)!important;outline:none;box-shadow:var(--glass-input-shadow);transition:border-color .2s ease,box-shadow .2s ease,background .2s ease}.code-cell:focus{background:var(--glass-input-bg-focus);border-color:var(--brand-cyan)!important;box-shadow:0 0 18px var(--brand-cyan-glow)}.liquid-tabs-container{display:flex;position:relative;background:var(--tabs-bg);border-radius:14px;padding:4px;box-shadow:inset 0 1px 2px #0000000f}.liquid-indicator{position:absolute;top:4px;bottom:4px;border-radius:10px;background:var(--indicator-bg);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:var(--indicator-shadow);transition:transform .38s var(--ease-liquid),width .38s var(--ease-liquid);z-index:1;pointer-events:none}.liquid-tab-btn{flex:1;padding:10px 16px;border-radius:10px;font-size:.88rem;font-weight:700;background:transparent;color:var(--tab-inactive-color)!important;border:none!important;cursor:pointer;z-index:2;position:relative;transition:color .2s;display:inline-flex;align-items:center;justify-content:center;gap:8px}.liquid-tab-btn.active{color:var(--tab-active-color)!important}.top-toast-center{position:fixed;top:24px;left:50%;transform:translate(-50%);z-index:99999;pointer-events:none;display:flex;flex-direction:column;align-items:center;gap:8px}.toast-capsule{padding:10px 24px;border-radius:var(--radius-full);background:var(--glass-surface);-webkit-backdrop-filter:blur(24px) saturate(180%);backdrop-filter:blur(24px) saturate(180%);box-shadow:var(--glass-shadow);color:var(--text-main)!important;font-size:.88rem;font-weight:700;display:flex;align-items:center;gap:10px;animation:slideDownFade .28s var(--ease-elastic) forwards;pointer-events:auto;border:1px solid rgba(255,255,255,.6)}@keyframes slideDownFade{0%{opacity:0;transform:translateY(-16px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0f172a73;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);z-index:10000;display:flex;align-items:center;justify-content:center;padding:24px;opacity:0;pointer-events:none;transition:opacity .25s ease}.modal-overlay.active{opacity:1;pointer-events:auto}.modal-glass-box{width:100%;max-width:600px;padding:32px;transform:translateZ(0) scale(.95);transition:transform .28s var(--ease-elastic);will-change:transform,opacity}.modal-overlay.active .modal-glass-box{transform:translateZ(0) scale(1)}.page-view-container{animation:pageFadeIn .25s ease-out forwards;will-change:opacity}@keyframes pageFadeIn{0%{opacity:0}to{opacity:1}}.ambient-feature-node{position:absolute;padding:8px 16px;border-radius:var(--radius-full);background:var(--ambient-feature-bg);backdrop-filter:blur(16px) saturate(180%);-webkit-backdrop-filter:blur(16px) saturate(180%);border:1px solid var(--ambient-feature-border);box-shadow:var(--ambient-feature-shadow);display:inline-flex;align-items:center;gap:8px;font-size:.8rem;font-weight:600;color:var(--ambient-feature-color);pointer-events:none;-webkit-user-select:none;user-select:none;z-index:1;animation:ambientFloat 6s ease-in-out infinite alternate}@keyframes ambientFloat{0%{transform:translateY(0)}to{transform:translateY(-8px)}}.showcase-hero-container{display:grid;grid-template-columns:1.15fr .85fr;gap:36px;max-width:1240px;width:100%;align-items:center;position:relative;z-index:10;margin:0 auto}.showcase-billboard{display:flex;flex-direction:column;gap:20px;text-align:left}.showcase-preview-frame{position:relative;border-radius:var(--radius-xl);overflow:hidden;box-shadow:0 24px 64px -12px #0f172a2e,0 0 0 1px #fffc,inset 0 1px 2px #fff;background:#fff9;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);transform:translateZ(0);transition:transform .4s var(--ease-elastic),box-shadow .4s var(--ease-elastic)}.showcase-preview-frame:hover{transform:translateY(-4px) scale(1.01);box-shadow:0 32px 72px -12px #0f172a38,0 0 0 1px #fff}.showcase-preview-img{width:100%;height:auto;display:block;object-fit:cover;border-radius:var(--radius-xl)}.showcase-feature-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.showcase-feature-card{padding:16px 18px;border-radius:var(--radius-md);background:var(--glass-surface);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.75);box-shadow:0 4px 16px #0f172a0d,inset 0 1px 1.5px #fff;display:flex;flex-direction:column;gap:6px;transition:transform .25s var(--ease-elastic),box-shadow .25s ease}.showcase-feature-card:hover{transform:translateY(-2px);box-shadow:0 8px 24px #0f172a17,inset 0 1px 2px #fff}.showcase-feature-title{font-size:.88rem;font-weight:700;color:var(--text-main);display:flex;align-items:center;gap:8px}.showcase-feature-desc{font-size:.78rem;color:var(--text-secondary);line-height:1.45}@media(max-width:960px){.showcase-hero-container{grid-template-columns:1fr;gap:24px;padding:16px 0}.showcase-feature-grid{grid-template-columns:1fr}}@media(max-width:768px){.viewport-bg-layer{position:fixed!important;top:0!important;left:0!important;width:100vw!important;height:100dvh!important;background-image:var(--cfg-bg-mobile-url)!important;background-attachment:scroll!important;transform:translateZ(0)!important}.ambient-feature-node{display:none!important}.code-cell{width:40px;height:48px;font-size:1.25rem}}.workspace-fullscreen-layout{width:100vw!important;height:100vh!important;height:100dvh!important;max-width:none!important;margin:0!important;padding:12px 16px!important;display:flex!important;flex-direction:column!important;gap:12px!important;box-sizing:border-box!important;overflow:hidden!important;position:relative!important;z-index:2!important}.workspace-header-bar{height:56px!important;min-height:56px!important;padding:0 20px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:16px!important;border-radius:var(--radius-md)!important}.workspace-main-body{flex:1!important;display:flex!important;gap:12px!important;align-items:stretch!important;min-height:0!important;overflow:hidden!important}.workspace-sidebar-pane{width:250px!important;min-width:250px!important;max-width:250px!important;padding:16px 12px!important;display:flex!important;flex-direction:column!important;justify-content:space-between!important;border-radius:var(--radius-lg)!important;overflow:hidden!important}.sidebar-nav-item{height:42px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;padding:0 12px!important;border-radius:var(--radius-sm)!important;text-decoration:none!important;color:var(--text-main)!important;font-weight:600!important;font-size:.9rem!important;position:relative!important;z-index:2!important;cursor:pointer!important;border:none!important;background:transparent!important;transition:color .2s ease,background .2s ease!important}.sidebar-nav-item:hover{color:var(--brand-cyan)!important;background:#0284c70f!important}.sidebar-nav-item.active-folder{color:#0284c7!important;font-weight:800!important}html[data-theme=dark] .sidebar-nav-item.active-folder{color:#38bdf8!important}.sidebar-item-icon-slot{width:26px!important;height:26px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;font-size:17px!important;flex-shrink:0!important}.workspace-mail-list-pane{flex:1!important;display:flex!important;flex-direction:column!important;border-radius:var(--radius-lg)!important;padding:16px 20px!important;min-width:0!important;min-height:0!important;overflow:hidden!important}.mail-stream-card{padding:14px 18px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:16px!important;cursor:pointer!important;border-radius:var(--radius-sm)!important;background:var(--glass-surface-secondary)!important;box-shadow:0 2px 8px #0f172a0a,inset 0 1px 1px #fffc!important;border:1px solid rgba(226,232,240,.6)!important;transition:transform .16s var(--ease-elastic),box-shadow .16s ease,background .16s ease!important}html[data-theme=dark] .mail-stream-card{border:1px solid rgba(255,255,255,.1)!important;box-shadow:0 4px 14px #00000040,inset 0 1px 1px #fff3!important}.mail-stream-card:hover{transform:translateY(-2px)!important;box-shadow:0 8px 24px #0f172a14,inset 0 1px 1.5px #fff!important;border-color:#0284c74d!important}.mail-stream-card.unread{border-left:3px solid var(--brand-cyan)!important;background:#0284c70a!important}.mail-card-sender{color:var(--text-main)!important;font-size:.92rem!important;font-weight:700!important}.mail-card-subject{color:var(--text-secondary)!important;font-size:.88rem!important;font-weight:600!important}.mail-card-snippet{color:var(--text-muted)!important;font-size:.8rem!important}.mail-card-date{color:var(--text-muted)!important;font-size:.78rem!important;font-weight:600!important}.workspace-reader-pane{flex:1.2!important;display:flex!important;flex-direction:column!important;border-radius:var(--radius-lg)!important;padding:20px 24px!important;min-width:0!important;min-height:0!important;overflow:hidden!important}@keyframes ambientDrift{0%{transform:translateZ(0) scale(1);opacity:.85}50%{transform:translate3d(-1.5%,2%,0) scale(1.04);opacity:1}to{transform:translateZ(0) scale(1);opacity:.85}}.ambient-light-glow{animation:ambientDrift 18s ease-in-out infinite alternate;will-change:transform,opacity}@media(max-width:768px){.workspace-fullscreen-layout{padding:8px!important;gap:8px!important;height:100dvh!important}.workspace-header-bar{height:auto!important;min-height:48px!important;padding:8px 12px!important;gap:10px!important;flex-wrap:wrap!important}.workspace-header-bar>div:nth-child(2){order:3!important;width:100%!important;max-width:100%!important;margin-top:4px!important}.workspace-main-body{flex-direction:column!important;gap:8px!important}.workspace-sidebar-pane{width:100%!important;min-width:100%!important;max-width:100%!important;padding:8px!important;flex-direction:row!important;overflow-x:auto!important;flex-shrink:0!important}#folder-nav-group{flex-direction:row!important;gap:6px!important;width:100%!important;overflow-x:auto!important}.sidebar-nav-item{padding:0 10px!important;font-size:.82rem!important;flex-shrink:0!important}.page-view-container{padding:12px!important;gap:12px!important}}