:root{--font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";--font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;--bg: #f4f5f7;--surface: #ffffff;--surface-2: #f8fafc;--surface-3: #eef1f6;--border: #e2e8f0;--border-strong: #cbd5e1;--text: #0f172a;--text-2: #475569;--text-3: #94a3b8;--brand: #6366f1;--brand-weak: #eef2ff;--brand-text: #4338ca;--danger: #e11d48;--danger-weak: #fff1f3;--success: #16a34a;--warning: #d97706;--star: #f59e0b;--shadow-sm: 0 1px 2px rgba(15, 23, 42, .06);--shadow-md: 0 4px 14px rgba(15, 23, 42, .1);--shadow-lg: 0 18px 48px rgba(15, 23, 42, .18);--radius: 10px;--radius-sm: 7px;--radius-lg: 16px;--sidebar-w: 248px;--topbar-h: 60px;--list-w: 380px;--ease: cubic-bezier(.16, 1, .3, 1)}[data-theme=dark]{--bg: #0b1120;--surface: #111827;--surface-2: #0f172a;--surface-3: #1e293b;--border: #1f2937;--border-strong: #334155;--text: #e5e7eb;--text-2: #94a3b8;--text-3: #64748b;--brand: #818cf8;--brand-weak: #1e1b4b;--brand-text: #c7d2fe;--danger: #fb7185;--danger-weak: #3b141c;--success: #4ade80;--warning: #fbbf24;--star: #fbbf24;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .4);--shadow-md: 0 6px 18px rgba(0, 0, 0, .45);--shadow-lg: 0 22px 60px rgba(0, 0, 0, .6)}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:var(--font);background:var(--bg);color:var(--text);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}button{font-family:inherit;cursor:pointer}a{color:inherit;text-decoration:none}input,textarea,select{font-family:inherit;color:var(--text)}:focus-visible{outline:2px solid var(--brand);outline-offset:2px;border-radius:6px}::selection{background:var(--brand);color:#fff}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:8px;border:2px solid transparent;background-clip:content-box}::-webkit-scrollbar-thumb:hover{background:var(--text-3);background-clip:content-box}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media (prefers-reduced-motion: reduce){*{animation-duration:.001ms!important;transition-duration:.001ms!important}}.app{display:grid;grid-template-columns:var(--sidebar-w) 1fr;grid-template-rows:100%;height:100vh;overflow:hidden}.app.main-open{grid-template-columns:var(--sidebar-w) var(--list-w) 1fr}.sidebar{background:var(--surface-2);border-right:1px solid var(--border);display:flex;flex-direction:column;min-height:0;overflow:hidden}.sidebar-head{display:flex;align-items:center;gap:10px;padding:16px 16px 12px}.brand-mark{width:34px;height:34px;border-radius:9px;background:linear-gradient(135deg,var(--brand),#a855f7);color:#fff;display:grid;place-items:center;font-weight:800;box-shadow:var(--shadow-sm)}.brand-name{font-weight:700;font-size:15px;letter-spacing:.2px}.brand-sub{font-size:11px;color:var(--text-3)}.compose-btn{margin:4px 12px 12px;padding:11px 14px;border:none;border-radius:var(--radius);background:var(--brand);color:#fff;font-weight:600;display:flex;align-items:center;justify-content:center;gap:8px;box-shadow:var(--shadow-sm);transition:transform .15s var(--ease),filter .15s var(--ease)}.compose-btn:hover{filter:brightness(1.06)}.compose-btn:active{transform:translateY(1px)}.folder-list{flex:1;overflow-y:auto;padding:4px 8px}.folder-item{display:flex;align-items:center;gap:11px;padding:9px 11px;border-radius:var(--radius-sm);color:var(--text-2);font-weight:500;border:none;background:transparent;width:100%;text-align:left;transition:background .12s,color .12s}.folder-item:hover{background:var(--surface-3);color:var(--text)}.folder-item.active{background:var(--brand-weak);color:var(--brand-text)}.folder-item .fi-label{flex:1}.folder-item .fi-count{font-size:11px;font-weight:700;background:var(--surface-3);color:var(--text-2);padding:1px 8px;border-radius:999px}.folder-item.active .fi-count{background:var(--brand);color:#fff}.sidebar-foot{border-top:1px solid var(--border);padding:10px 12px}.account-chip{display:flex;align-items:center;gap:10px;padding:8px;border-radius:var(--radius-sm);width:100%;background:transparent;border:none;text-align:left;transition:background .12s}.account-chip:hover{background:var(--surface-3)}.main{display:flex;flex-direction:column;min-width:0;background:var(--bg);min-height:0}.topbar{height:var(--topbar-h);min-height:var(--topbar-h);display:flex;align-items:center;gap:12px;padding:0 16px;border-bottom:1px solid var(--border);background:var(--surface)}.search{flex:1;max-width:520px;position:relative;display:flex;align-items:center}.search svg{position:absolute;left:12px;color:var(--text-3);pointer-events:none}.search input{width:100%;padding:9px 12px 9px 36px;border:1px solid var(--border);background:var(--surface-2);border-radius:999px;font-size:13.5px;transition:border .12s,box-shadow .12s}.search input:focus{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-weak);outline:none}.icon-btn{width:38px;height:38px;display:grid;place-items:center;border-radius:10px;border:1px solid transparent;background:transparent;color:var(--text-2);transition:background .12s,color .12s}.icon-btn:hover{background:var(--surface-3);color:var(--text)}.icon-btn.danger:hover{background:var(--danger-weak);color:var(--danger)}.spacer{flex:1}.content{flex:1;min-height:0;display:flex;overflow:hidden}.menu-toggle{display:none}@media (max-width: 1024px){.app,.app.main-open{grid-template-columns:1fr}.sidebar{position:fixed;z-index:40;width:var(--sidebar-w);height:100%;transform:translate(-100%);transition:transform .25s var(--ease);box-shadow:var(--shadow-lg)}.sidebar.open{transform:translate(0)}.menu-toggle{display:grid}.scrim{position:fixed;top:0;right:0;bottom:0;left:0;background:#02061780;z-index:35}.app.main-open{grid-template-columns:var(--list-w) 1fr}.app.show-list.main-open{grid-template-columns:1fr}}@media (max-width: 720px){.app.main-open{grid-template-columns:1fr}.list-pane{border-right:none!important}.content.has-active .list-pane{display:none}.content:not(.has-active) .reader,.content:not(.has-active) .reader-wrap{display:none}.content.has-active .reader,.content.has-active .reader-wrap{display:flex}}.reader-wrap{flex:1;min-width:0;min-height:0;display:flex;flex-direction:column}.mobile-back{display:none;align-items:center;gap:6px;padding:10px 14px;border:none;border-bottom:1px solid var(--border);background:var(--surface);color:var(--text-2);font-weight:600;font-size:13px;text-align:left;cursor:pointer}.mobile-back:hover{background:var(--surface-2);color:var(--text)}@media (max-width: 720px){.mobile-back{display:inline-flex}}.list-pane{width:var(--list-w);min-width:var(--list-w);border-right:1px solid var(--border);background:var(--surface);display:flex;flex-direction:column;min-height:0}.list-head{display:flex;align-items:center;gap:8px;padding:12px 14px;border-bottom:1px solid var(--border);min-height:52px}.list-head .lh-title{font-weight:700;font-size:15px}.list-head .lh-sub{font-size:12px;color:var(--text-3)}.bulk-bar{display:flex;align-items:center;gap:6px;padding:8px 12px;border-bottom:1px solid var(--border);background:var(--brand-weak);flex-wrap:wrap}.bulk-bar .bb-count{font-weight:600;font-size:13px;color:var(--brand-text);margin-right:auto}.mini-btn{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:8px;border:1px solid var(--border);background:var(--surface);color:var(--text-2);font-size:12.5px;font-weight:500;transition:background .12s,color .12s}.mini-btn:hover{background:var(--surface-3);color:var(--text)}.mini-btn.danger:hover{background:var(--danger-weak);color:var(--danger);border-color:var(--danger)}.list{flex:1;overflow-y:auto;min-height:0}.msg-row{display:grid;grid-template-columns:34px 1fr 16px;gap:10px;align-items:start;padding:12px 14px}.mr-avatar{position:relative;display:grid;place-items:center}.mr-avatar .checkbox{position:absolute;z-index:2;opacity:0;cursor:pointer;transition:opacity .12s}.mr-avatar:hover .checkbox,.msg-row.active .checkbox{opacity:1}.mr-avatar:hover .avatar{opacity:.2}.msg-row{border-bottom:1px solid var(--border);cursor:pointer;position:relative;transition:background .1s}.msg-row:hover{background:var(--surface-2)}.msg-row.active{background:var(--brand-weak);box-shadow:inset 3px 0 0 var(--brand)}.msg-row.unread .mr-subject{font-weight:700}.avatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:700;font-size:13px;flex-shrink:0}.mr-body{min-width:0}.mr-top{display:flex;align-items:baseline;gap:8px}.mr-from{font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1}.mr-unread-dot{width:8px;height:8px;border-radius:50%;background:var(--brand);flex-shrink:0;align-self:center}.mr-date{font-size:11.5px;color:var(--text-3);white-space:nowrap}.mr-subject{color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px;font-size:13.5px}.mr-preview{color:var(--text-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12.5px;margin-top:1px}.mr-flags{display:flex;align-items:center;gap:6px;margin-top:5px}.chip{font-size:10.5px;font-weight:600;padding:1px 7px;border-radius:999px;background:var(--surface-3);color:var(--text-2);text-transform:lowercase}.chip.work{background:#e0e7ff;color:#4338ca}.chip.personal{background:#dcfce7;color:#15803d}.chip.design{background:#fce7f3;color:#be185d}.chip.finance{background:#fef3c7;color:#b45309}[data-theme=dark] .chip.work{background:#312e81;color:#c7d2fe}[data-theme=dark] .chip.personal{background:#14532d;color:#bbf7d0}[data-theme=dark] .chip.design{background:#831843;color:#fbcfe8}[data-theme=dark] .chip.finance{background:#78350f;color:#fde68a}.mr-right{display:flex;align-items:center;justify-content:center}.star-btn{border:none;background:transparent;color:var(--text-3);padding:2px;border-radius:6px;line-height:0;opacity:0;transition:opacity .12s,color .12s,transform .1s}.msg-row:hover .star-btn{opacity:1}.star-btn.on{opacity:1;color:var(--star)}.star-btn:hover{color:var(--star);transform:scale(1.15)}.checkbox{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:18px;height:18px;border:2px solid var(--border-strong);border-radius:5px;background:var(--surface);display:grid;place-items:center;transition:background .12s,border-color .12s}.checkbox:checked{background:var(--brand);border-color:var(--brand)}.checkbox:checked:after{content:"";width:5px;height:9px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg) translate(-1px,-1px)}.reader{flex:1;min-width:0;display:flex;flex-direction:column;background:var(--surface);min-height:0}.reader-toolbar{display:flex;align-items:center;gap:6px;padding:10px 16px;border-bottom:1px solid var(--border);min-height:52px;flex-wrap:wrap}.reader-scroll{flex:1;overflow-y:auto;min-height:0;padding:26px clamp(18px,4vw,48px);max-width:920px;width:100%;margin:0 auto}.reader-subject{font-size:22px;font-weight:700;margin:0 0 16px;letter-spacing:-.2px}.reader-meta{display:flex;align-items:center;gap:12px;padding-bottom:18px;border-bottom:1px solid var(--border);margin-bottom:22px;flex-wrap:wrap}.reader-meta .rm-who{min-width:0}.reader-meta .rm-from{font-weight:600}.reader-meta .rm-to{color:var(--text-2);font-size:12.5px}.reader-meta .rm-date{color:var(--text-3);font-size:12.5px;margin-left:auto}.reader-body{font-size:15px;line-height:1.7;color:var(--text);word-break:break-word}.reader-body p{margin:0 0 14px}.reader-body blockquote{border-left:3px solid var(--border-strong);margin:14px 0;padding:4px 16px;color:var(--text-2)}.reader-body a{color:var(--brand)}.reader-body img{max-width:100%;border-radius:8px}.attachments{margin-top:24px;border-top:1px solid var(--border);padding-top:18px}.attachments h4{margin:0 0 12px;font-size:12px;text-transform:uppercase;letter-spacing:.6px;color:var(--text-3)}.att-grid{display:flex;flex-wrap:wrap;gap:10px}.att-card{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface-2);min-width:200px;transition:border .12s,background .12s}.att-card:hover{border-color:var(--brand);background:var(--surface-3)}.att-ic{width:36px;height:36px;border-radius:8px;display:grid;place-items:center;background:var(--brand-weak);color:var(--brand-text);flex-shrink:0}.att-ic.image{background:#fce7f3;color:#be185d}[data-theme=dark] .att-ic.image{background:#831843;color:#fbcfe8}.att-info{min-width:0}.att-name{font-weight:600;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.att-size{font-size:11.5px;color:var(--text-3)}.empty-state{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:var(--text-3);padding:40px;gap:14px}.empty-state .es-ic{width:72px;height:72px;border-radius:50%;background:var(--surface-3);display:grid;place-items:center;color:var(--text-2)}.empty-state h3{margin:0;color:var(--text-2);font-size:16px}.empty-state p{margin:0;max-width:320px;font-size:13px}.skeleton-row{height:78px;border-bottom:1px solid var(--border);padding:12px 14px;display:flex;gap:12px;align-items:center}.skeleton{background:linear-gradient(90deg,var(--surface-3) 25%,var(--surface-2) 37%,var(--surface-3) 63%);background-size:400% 100%;animation:shimmer 1.3s ease-in-out infinite;border-radius:6px}@keyframes shimmer{0%{background-position:100% 0}to{background-position:0 0}}.error-banner{margin:16px;padding:12px 16px;border-radius:var(--radius);background:var(--danger-weak);color:var(--danger);border:1px solid var(--danger);display:flex;gap:10px;align-items:center}.spin{animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.modal-scrim{position:fixed;top:0;right:0;bottom:0;left:0;background:#0206178c;z-index:60;display:flex;align-items:flex-end;justify-content:center;animation:fade .15s var(--ease)}@keyframes fade{0%{opacity:0}to{opacity:1}}.compose{width:min(680px,96vw);background:var(--surface);border-radius:var(--radius-lg) var(--radius-lg) 0 0;box-shadow:var(--shadow-lg);margin-bottom:0;display:flex;flex-direction:column;max-height:92vh;animation:slideUp .22s var(--ease)}@keyframes slideUp{0%{transform:translateY(40px);opacity:0}to{transform:translateY(0);opacity:1}}.compose-head{display:flex;align-items:center;padding:12px 16px;background:var(--surface-3);border-radius:var(--radius-lg) var(--radius-lg) 0 0;font-weight:600}.compose-fields{padding:6px 16px}.compose-field{display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--border);padding:9px 0}.compose-field label{color:var(--text-3);width:46px;font-size:13px}.compose-field input{flex:1;border:none;background:transparent;font-size:14px;padding:4px 0}.compose-field input:focus{outline:none}.compose-body{border:none;resize:none;padding:14px 16px;font-size:14.5px;line-height:1.6;min-height:220px;flex:1;background:var(--surface)}.compose-body:focus{outline:none}.compose-foot{display:flex;align-items:center;gap:10px;padding:12px 16px;border-top:1px solid var(--border)}.send-btn{background:var(--brand);color:#fff;border:none;border-radius:999px;padding:9px 20px;font-weight:600;display:inline-flex;align-items:center;gap:8px;transition:filter .12s}.send-btn:hover{filter:brightness(1.07)}.compose-tool{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border-radius:8px;border:1px solid var(--border);background:var(--surface);color:var(--text-2);font-size:13px}.compose-tool:hover{background:var(--surface-3);color:var(--text)}.att-chip-list{list-style:none;margin:0;padding:8px 16px;display:flex;flex-wrap:wrap;gap:8px;border-top:1px solid var(--border)}.att-chip{display:inline-flex;align-items:center;gap:7px;padding:5px 8px 5px 10px;background:var(--surface-3);border:1px solid var(--border);border-radius:999px;font-size:12px;max-width:260px}.att-chip .att-ic{display:inline-flex;color:var(--brand)}.att-chip-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:140px}.att-chip-size{color:var(--text-3)}.att-chip-x{border:none;background:transparent;color:var(--text-3);display:inline-flex;cursor:pointer;padding:2px;border-radius:50%}.att-chip-x:hover{color:var(--danger);background:#e5484d1f}.page{flex:1;overflow-y:auto;min-height:0;background:var(--bg)}.page-inner{max-width:760px;margin:0 auto;padding:clamp(20px,4vw,44px)}.page h1{font-size:24px;margin:0 0 4px}.page .page-sub{color:var(--text-3);margin:0 0 28px}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:22px 24px;margin-bottom:18px;box-shadow:var(--shadow-sm)}.card h2{font-size:15px;margin:0 0 16px;display:flex;align-items:center;gap:8px}.card p.hint{color:var(--text-2);font-size:13px;margin:-8px 0 16px}.field{margin-bottom:16px}.field label{display:block;font-size:12.5px;font-weight:600;color:var(--text-2);margin-bottom:6px}.field input,.field textarea,.field select{width:100%;padding:10px 12px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface-2);font-size:14px;transition:border .12s,box-shadow .12s}.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-weak);outline:none}.field textarea{min-height:90px;resize:vertical;line-height:1.6}.row{display:flex;gap:16px;flex-wrap:wrap}.row .field{flex:1;min-width:200px}.seg{display:inline-flex;border:1px solid var(--border);border-radius:999px;overflow:hidden;background:var(--surface-2)}.seg button{border:none;background:transparent;padding:8px 16px;color:var(--text-2);font-size:13px;font-weight:500}.seg button.active{background:var(--brand);color:#fff}.toggle{display:flex;align-items:center;gap:12px}.toggle input{width:18px;height:18px}.save-note{font-size:12.5px;color:var(--success);font-weight:600}.account-hero{display:flex;align-items:center;gap:14px;margin-bottom:18px}.account-hero .avatar{width:52px;height:52px;font-size:18px}.toast{position:fixed;bottom:22px;left:50%;transform:translate(-50%);background:var(--text);color:var(--surface);padding:11px 18px;border-radius:999px;font-size:13px;font-weight:500;box-shadow:var(--shadow-lg);z-index:80;display:flex;align-items:center;gap:8px;animation:slideUp .2s var(--ease)}kbd{font-family:var(--font-mono);font-size:11px;background:var(--surface-3);border:1px solid var(--border);border-bottom-width:2px;border-radius:5px;padding:1px 6px;color:var(--text-2)}.kbd-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px 22px}.kbd-item{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:13px;color:var(--text-2)}.connected-banner{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:var(--radius-sm);background:var(--brand-weak);color:var(--brand-text);font-size:13.5px;font-weight:500;border:1px solid var(--brand)}.svc-group{border:1px solid var(--border);border-radius:var(--radius);padding:14px 16px;margin-bottom:14px;background:var(--surface-2)}.svc-title{display:flex;align-items:center;gap:8px;margin:0 0 12px;font-size:13px;text-transform:uppercase;letter-spacing:.5px;color:var(--text-2)}.svc-group .field:last-child{margin-bottom:0}.check-row{display:flex;align-items:center;gap:8px;margin-top:10px;font-size:12.5px;color:var(--text-2);cursor:pointer}.check-row input{width:auto;margin:0}.build-stamp{margin-top:18px;color:var(--text-3);font-size:12px;text-align:center}