Jmail Suite - Interactive Archive :root { --gmail-red: #ea4335; --bg-gray: #f6f8fc; --border-color: #eaf1fb; --text-primary: #202124; --text-secondary: #5f6368; --sidebar-active: #d3e3fd; --accent-blue: #0b57d0; } body, html { margin: 0; padding: 0; font-family: 'Roboto', sans-serif; background: #fff; height: 100vh; overflow: hidden; } /* --- LOADING SCREEN --- */ #loader { position: fixed; inset: 0; background: #fff; display: flex; flex-direction: column; justify-content: center; align-items: center; z-index: 9999; } .logo-svg { width: 65px; margin-bottom: 20px; } .progress-bar { width: 200px; height: 4px; background: #eee; border-radius: 2px; overflow: hidden; } #fill { width: 0%; height: 100%; background: var(--gmail-red); transition: width 0.2s; } /* --- HEADER --- */ header { height: 64px; display: flex; align-items: center; padding: 0 16px; border-bottom: 1px solid #e0e0e0; background: var(--bg-gray); } .search-area { flex: 1; max-width: 720px; margin: 0 40px; background: #eaf1fb; border-radius: 28px; padding: 10px 20px; display: flex; align-items: center; } .search-area input { border: none; background: transparent; width: 100%; outline: none; font-size: 16px; } /* --- LAYOUT --- */...