:root{--ink:#14202b;--ink-soft:#3d4f63;--paper:#f4f7fa;--surface:#fff;--line:#d5dee8;--accent:#0d7a6f;--accent-deep:#095a52;--danger:#b42318;--aura-a:#9ec9c2;--aura-b:#c5d6e8;--shadow:0 18px 50px #14202b1f;--radius:18px;--field-bg:#fff;--frame-bg:#fff;--body-grad-top:#eaf1f5;--body-grad-bottom:#e7eef3;color:var(--ink);background:var(--paper);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;font-family:Outfit,system-ui,sans-serif;line-height:1.45}html[data-theme=dark]{--ink:#e6eef6;--ink-soft:#9aadc0;--paper:#0f161d;--surface:#18222c;--line:#2c3a48;--accent:#3cb9ab;--accent-deep:#7ad4c9;--danger:#ff7b72;--aura-a:#1a3d3a;--aura-b:#1c2b3d;--shadow:0 18px 50px #00000059;--field-bg:#121a22;--frame-bg:#101820;--body-grad-top:#121920;--body-grad-bottom:#0d1319;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*,:before,:after{box-sizing:border-box}html,body,#app{min-height:100%;margin:0}body{background:radial-gradient(1200px 600px at 10% -10%, color-mix(in srgb, var(--aura-a) 55%, transparent), transparent 60%), radial-gradient(900px 500px at 100% 0%, color-mix(in srgb, var(--aura-b) 70%, transparent), transparent 55%), linear-gradient(180deg, var(--body-grad-top) 0%, var(--paper) 45%, var(--body-grad-bottom) 100%);min-height:100vh;transition:background .25s,color .25s}button,input{font:inherit}.brand,.brand-mark{letter-spacing:-.03em;font-family:Syne,sans-serif;font-weight:800}.login-shell{place-items:center;min-height:100vh;padding:24px;display:grid;position:relative;overflow:hidden}.login-shell>.btn-theme{z-index:2;position:absolute;top:18px;right:18px}.btn-theme{border:1px solid var(--line);background:color-mix(in srgb, var(--surface) 88%, transparent);width:40px;height:40px;color:var(--ink);cursor:pointer;border-radius:12px;flex-shrink:0;place-items:center;padding:0;transition:border-color .15s,background .15s,color .15s;display:inline-grid}.btn-theme:hover{border-color:color-mix(in srgb, var(--accent) 45%, var(--line));color:var(--accent-deep)}.login-aura{background:radial-gradient(circle, color-mix(in srgb, var(--accent) 28%, transparent), transparent 70%);filter:blur(8px);pointer-events:none;border-radius:50%;width:420px;height:420px;animation:10s ease-in-out infinite alternate drift;position:absolute;inset:auto}@keyframes drift{0%{transform:translate(-30%,-20%)scale(1)}to{transform:translate(40%,30%)scale(1.15)}}.login-card{background:color-mix(in srgb, var(--surface) 92%, transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid color-mix(in srgb, var(--surface) 40%, var(--line));border-radius:calc(var(--radius) + 4px);width:min(420px,100%);box-shadow:var(--shadow);gap:14px;padding:36px 32px 32px;animation:.45s ease-out rise;display:grid;position:relative}@keyframes rise{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}.brand{color:var(--accent-deep);margin:0;font-size:1.65rem}.login-title{margin:4px 0 0;font-size:1.35rem;font-weight:600}.login-sub{color:var(--ink-soft);margin:0 0 8px;font-size:.95rem}.field{gap:6px;display:grid}.field span{color:var(--ink-soft);font-size:.82rem;font-weight:500}.field input{border:1px solid var(--line);background:var(--field-bg);width:100%;color:var(--ink);border-radius:12px;outline:none;padding:12px 14px;transition:border-color .15s,box-shadow .15s}.field input:focus{border-color:color-mix(in srgb, var(--accent) 55%, var(--line));box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 18%, transparent)}.form-error{color:var(--danger);margin:0;font-size:.9rem}.btn-primary{background:var(--accent);color:#fff;cursor:pointer;border:0;border-radius:12px;margin-top:6px;padding:12px 16px;font-weight:600;transition:background .15s,transform .15s}.btn-primary:hover:not(:disabled){background:var(--accent-deep)}.btn-primary:active:not(:disabled){transform:translateY(1px)}.btn-primary:disabled{opacity:.65;cursor:wait}.btn-ghost{border:1px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer;border-radius:10px;padding:8px 12px;font-size:.9rem;font-weight:500}.btn-ghost:hover:not(:disabled){border-color:color-mix(in srgb, var(--accent) 40%, var(--line));color:var(--accent-deep)}.btn-ghost:disabled{opacity:.55;cursor:wait}.mail-shell{grid-template-rows:auto 1fr;gap:12px;min-height:100vh;padding:16px;display:grid}.mail-top{background:color-mix(in srgb, var(--surface) 88%, transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid color-mix(in srgb, var(--surface) 35%, var(--line));border-radius:var(--radius);justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;display:flex;box-shadow:0 8px 24px #14202b0f}.mail-top-brand{flex-direction:column;gap:2px;min-width:0;display:flex}.brand-mark{color:var(--accent-deep);font-size:1.15rem}.mail-email{color:var(--ink-soft);text-overflow:ellipsis;white-space:nowrap;font-size:.85rem;overflow:hidden}.mail-top-actions{flex-shrink:0;gap:8px;display:flex}.mail-layout{grid-template-columns:200px minmax(260px,1fr) minmax(320px,1.3fr);gap:12px;height:calc(100vh - 100px);min-height:0;display:grid}.mail-folders,.mail-list-pane,.mail-read-pane{background:color-mix(in srgb, var(--surface) 94%, transparent);border:1px solid color-mix(in srgb, var(--surface) 35%, var(--line));border-radius:var(--radius);padding:14px;animation:.35s ease-out rise;overflow:auto;box-shadow:0 10px 28px #14202b0d}.pane-label{letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft);margin:0 0 10px;font-size:.75rem;font-weight:600}.pane-muted,.pane-error{color:var(--ink-soft);margin:12px 0}.pane-error{color:var(--danger)}.folder-list,.msg-list{gap:4px;margin:0;padding:0;list-style:none;display:grid}.folder-btn,.msg-row{text-align:left;cursor:pointer;width:100%;color:inherit;background:0 0;border:0;border-radius:10px}.folder-btn{padding:10px 12px;font-weight:500}.folder-btn:hover,.msg-row:hover{background:color-mix(in srgb, var(--accent) 12%, var(--surface))}.folder-btn.is-active,.msg-row.is-active{background:color-mix(in srgb, var(--accent) 18%, var(--surface));color:var(--accent-deep);font-weight:600}.msg-row{grid-template-columns:1fr auto;gap:2px 10px;padding:12px;display:grid}.msg-from{text-overflow:ellipsis;white-space:nowrap;font-size:.92rem;font-weight:500;overflow:hidden}.msg-date{color:var(--ink-soft);font-size:.78rem}.msg-subject{color:var(--ink-soft);text-overflow:ellipsis;white-space:nowrap;grid-column:1/-1;font-size:.88rem;overflow:hidden}.msg-row.is-unread .msg-from,.msg-row.is-unread .msg-subject{color:var(--ink);font-weight:600}.read-empty{align-content:start;height:100%;display:grid}.read-article{gap:14px;min-height:100%;display:grid}.read-subject{letter-spacing:-.02em;margin:0;font-size:1.35rem;line-height:1.25}.read-meta{color:var(--ink);border-bottom:1px solid var(--line);gap:6px;padding-bottom:12px;font-size:.9rem;display:grid}.read-meta span{min-width:42px;color:var(--ink-soft);font-size:.8rem;display:inline-block}.attach-line{color:var(--ink-soft);margin:0;font-size:.85rem}.read-body{min-height:240px}.html-frame{background:var(--frame-bg);border:0;border-radius:12px;width:100%;min-height:420px}.text-body{white-space:pre-wrap;word-break:break-word;margin:0;font-family:inherit;font-size:.95rem}@media (width<=960px){.mail-layout{grid-template-columns:1fr;height:auto}.mail-folders{max-height:140px}.mail-list-pane{max-height:360px}.mail-read-pane{min-height:420px}}@media (width<=560px){.mail-shell{padding:10px}.login-card{padding:28px 20px 22px}.mail-top{flex-wrap:wrap}}