:root{--accent: #0a65f2;--radius: 14px;--radius-sm: 10px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Inter,sans-serif;-webkit-font-smoothing:antialiased}:root[data-theme=light]{--bg: #eef1f6;--surface: #ffffff;--surface-2: #f6f8fb;--surface-hover: #f0f3f8;--text: #1b1f29;--muted: #6b7280;--border: #e4e8ef;--unread-bg: #ffffff;--unread-dot: var(--accent);--sidebar-bg: #f6f8fb;--shadow: 0 1px 2px rgba(20, 30, 60, .06), 0 4px 16px rgba(20, 30, 60, .05);--danger: #dc2626;--on-accent: #ffffff}:root[data-theme=dark]{--bg: #0f1115;--surface: #181b21;--surface-2: #1f232b;--surface-hover: #232831;--text: #e7eaf0;--muted: #9aa3b2;--border: #2a2f3a;--unread-bg: #1d2530;--unread-dot: var(--accent);--sidebar-bg: #14171c;--shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 4px 20px rgba(0, 0, 0, .35);--danger: #f87171;--on-accent: #ffffff}*{box-sizing:border-box}html,body{margin:0;min-height:100dvh;color:var(--text);background:var(--bg)}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit;color:inherit}button{cursor:pointer}#app,.app-shell{min-height:100dvh}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--border);background:var(--surface);color:var(--text);padding:10px 16px;border-radius:var(--radius-sm);font-weight:600;transition:background .15s,border-color .15s,transform .05s}.btn:hover{background:var(--surface-hover)}.btn:active{transform:translateY(1px)}.btn-primary{background:var(--accent);color:var(--on-accent);border:none;padding:10px 16px;border-radius:var(--radius-sm);font-weight:600}.btn-primary:hover{filter:brightness(1.06);background:var(--accent)}.btn-primary:disabled{opacity:.55;cursor:not-allowed}.btn-ghost{background:transparent;border-color:transparent}.btn-ghost:hover{background:var(--surface-hover)}.btn-danger{color:var(--danger);border-color:transparent;background:transparent}.btn-danger:hover{background:color-mix(in srgb,var(--danger) 12%,transparent)}.field{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}.field label{font-size:.82rem;color:var(--muted);font-weight:600}.field input,.field textarea,.field select{border:1px solid var(--border);border-radius:var(--radius-sm);padding:12px;background:var(--surface);outline:none;transition:border-color .15s}.field input:focus,.field textarea:focus{border-color:var(--accent)}.card{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow);border:1px solid var(--border)}.error{color:var(--danger);font-size:.875rem;margin-top:8px}.success{color:#16a34a;font-size:.875rem;margin-top:8px}.empty{text-align:center;padding:64px 16px;color:var(--muted)}.auth-wrap{min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:20px;background:radial-gradient(1200px 600px at 50% -10%,color-mix(in srgb,var(--accent) 18%,var(--bg)),var(--bg))}.auth-card{width:100%;max-width:400px;padding:32px 28px}.auth-logo{text-align:center;margin-bottom:24px}.auth-logo .mark{width:56px;height:56px;border-radius:16px;background:var(--accent);color:var(--on-accent);display:inline-flex;align-items:center;justify-content:center;font-size:1.6rem;margin-bottom:12px}.auth-switch{text-align:center;margin-top:18px;font-size:.875rem;color:var(--muted)}.auth-switch a{color:var(--accent);font-weight:600}.mail-shell{display:grid;grid-template-columns:248px 1fr;grid-template-rows:56px 1fr;height:100dvh}.topbar{grid-column:1 / -1;display:flex;align-items:center;gap:12px;padding:0 16px;background:var(--surface);border-bottom:1px solid var(--border)}.topbar .brand{display:flex;align-items:center;gap:10px;font-weight:700;width:216px}.topbar .brand .mark{width:32px;height:32px;border-radius:9px;background:var(--accent);color:var(--on-accent);display:inline-flex;align-items:center;justify-content:center}.topbar .spacer{flex:1}.topbar .acct{font-size:.85rem;color:var(--muted)}.icon-btn{width:38px;height:38px;border-radius:10px;border:none;background:transparent;display:inline-flex;align-items:center;justify-content:center;font-size:1.1rem}.icon-btn:hover{background:var(--surface-hover)}.sidebar{background:var(--sidebar-bg);border-right:1px solid var(--border);padding:16px 12px;overflow-y:auto}.compose-btn{width:100%;margin-bottom:16px;padding:13px;font-size:1rem;border-radius:12px}.folder-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}.folder-item{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;color:var(--text);font-size:.92rem;position:relative}.folder-item:hover{background:var(--surface-hover)}.folder-item.active{background:color-mix(in srgb,var(--accent) 16%,transparent);color:var(--accent);font-weight:600}.folder-item .ic{width:20px;text-align:center}.folder-item .label{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.folder-item .count{font-size:.75rem;color:var(--muted)}.folder-item.active .count{color:var(--accent)}.folder-del{opacity:0;border:none;background:transparent;color:var(--muted);font-size:.9rem}.folder-item:hover .folder-del{opacity:1}.sidebar-section{margin:18px 6px 8px;font-size:.72rem;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);font-weight:700}.add-folder{display:flex;gap:6px;margin-top:8px}.add-folder input{flex:1;min-width:0;border:1px solid var(--border);border-radius:8px;padding:8px;background:var(--surface)}.content{overflow-y:auto;padding:18px}.list-head{display:flex;align-items:center;gap:12px;margin-bottom:14px}.list-head h2{margin:0;font-size:1.3rem}.mail-list{list-style:none;margin:0;padding:0;overflow:hidden}.mail-row{display:flex;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid var(--border);transition:background .12s}.mail-row:last-child{border-bottom:none}.mail-row:hover{background:var(--surface-hover)}.mail-row.unread{background:var(--unread-bg)}.mail-row.unread .row-from,.mail-row.unread .row-subject{font-weight:700}.avatar{width:40px;height:40px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700}.row-main{flex:1;min-width:0}.row-top{display:flex;justify-content:space-between;gap:10px}.row-from{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.row-date{font-size:.78rem;color:var(--muted);white-space:nowrap}.row-subject{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.row-preview{color:var(--muted);font-size:.85rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.unread-dot{width:8px;height:8px;border-radius:50%;background:var(--accent);flex-shrink:0}.clip{color:var(--muted)}.msg-head{padding:20px;border-bottom:1px solid var(--border)}.msg-head h1{margin:0 0 14px;font-size:1.4rem}.msg-from{display:flex;align-items:center;gap:12px}.msg-from .meta{font-size:.85rem;color:var(--muted)}.msg-from .meta strong{color:var(--text)}.msg-body{padding:20px;line-height:1.6;word-break:break-word}.attachments{padding:0 20px 20px;display:flex;flex-wrap:wrap;gap:8px}.attachment-link{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;background:var(--surface-2);border:1px solid var(--border);border-radius:10px;font-size:.85rem}.toolbar{display:flex;gap:8px;margin-bottom:14px;flex-wrap:wrap}.compose-attachments{display:flex;flex-direction:column;gap:6px;margin:8px 0 14px}.attach-chip{display:flex;align-items:center;gap:8px;padding:8px 12px;background:var(--surface-2);border:1px solid var(--border);border-radius:10px;font-size:.85rem}.attach-chip .name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.attach-chip button{border:none;background:transparent;color:var(--muted)}.dropzone{border:2px dashed var(--border);border-radius:var(--radius-sm);padding:18px;text-align:center;color:var(--muted);transition:border-color .15s,background .15s}.dropzone.drag{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,transparent)}.settings-section{padding:20px}.settings-section h3{margin:0 0 14px;font-size:1.05rem}.theme-modes{display:flex;gap:10px;flex-wrap:wrap}.theme-mode{flex:1;min-width:100px;border:2px solid var(--border);border-radius:var(--radius-sm);padding:14px;text-align:center;background:var(--surface)}.theme-mode.active{border-color:var(--accent);color:var(--accent);font-weight:600}.accent-grid{display:flex;gap:12px;flex-wrap:wrap}.accent-swatch{width:40px;height:40px;border-radius:50%;border:3px solid transparent;cursor:pointer}.accent-swatch.active{border-color:var(--text)}.topbar h1{font-size:1.1rem;margin:0}.page{max-width:900px;width:100%;margin:0 auto;padding:20px 16px}.mail-item{display:block;padding:14px 16px;border-bottom:1px solid var(--border)}.mail-item:last-child{border-bottom:none}.mail-subject{font-size:.95rem}.menu-btn,.backdrop{display:none}@media(max-width:820px){.mail-shell{grid-template-columns:1fr}.sidebar{position:fixed;top:56px;bottom:0;left:0;width:270px;z-index:30;transform:translate(-100%);transition:transform .2s}.sidebar.open{transform:translate(0)}.backdrop.show{display:block;position:fixed;top:56px;right:0;bottom:0;left:0;background:#0006;z-index:25}.menu-btn{display:inline-flex}.topbar .brand{width:auto}.content{padding:12px}}