:root{--page: #f6f4ff;--panel: #ffffff;--panel-soft: #fbfaff;--panel-tint: #f1edff;--sidebar: #f2efff;--sidebar-strong: #e7e1ff;--text: #1f1b2d;--text-soft: #57516a;--text-muted: #817a95;--border: #e3def3;--border-strong: #d5cdeb;--brand: #6d4aff;--brand-dark: #5636d3;--brand-soft: #ece7ff;--brand-wash: #f7f4ff;--accent: #14b8a6;--accent-soft: #e6fffb;--danger: #c2412f;--success: #11805a;--warning: #b7791f;--shadow: 0 18px 52px rgba(54, 41, 104, .09);--shadow-soft: 0 10px 28px rgba(54, 41, 104, .06);--radius: 12px;font-family:Aptos,Segoe UI Variable,Segoe UI,Helvetica Neue,Arial,sans-serif;color:var(--text);background:var(--page)}*{box-sizing:border-box}html,body,#root{min-height:100%}body{margin:0;background:radial-gradient(circle at top left,rgba(109,74,255,.13),transparent 31rem),linear-gradient(135deg,#faf9ff,#f4f1ff 42%,#f8fbff)}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button{cursor:pointer}.app-frame{display:grid;grid-template-columns:268px minmax(0,1fr);min-height:100vh}.sidebar{position:sticky;top:0;height:100vh;padding:22px 14px;background:linear-gradient(180deg,#ffffffd1,#f2effff5),var(--sidebar);color:var(--text);display:flex;flex-direction:column;gap:24px;border-right:1px solid var(--border)}.brand-panel{display:flex;align-items:center;gap:12px;padding:8px 10px}.brand-panel h1,.topbar h2,.hero-card h3,.surface-card h3,.auth-card h2,.detail-header h3{margin:0;letter-spacing:-.03em}.brand-panel h1{font-size:1.2rem;line-height:1.08;font-weight:850}.brand-mark{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;font-weight:900;color:#fff;background:radial-gradient(circle at 28% 22%,rgba(255,255,255,.35),transparent 34%),linear-gradient(135deg,#7c5cff,#5140c6 52%,#00a58d);box-shadow:0 12px 24px #6d4aff38}.eyebrow{margin:0 0 6px;text-transform:uppercase;letter-spacing:.16em;font-size:.68rem;color:var(--text-muted)}.nav-stack{display:grid;gap:6px}.nav-link{display:flex;align-items:center;min-height:44px;padding:0 14px;border-radius:12px;color:var(--text-soft);border:1px solid transparent;font-weight:720;transition:background .15s ease,color .15s ease,transform .15s ease}.nav-link:hover{color:var(--brand-dark);background:#ffffffbf}.nav-link.active{color:#fff;background:linear-gradient(135deg,var(--brand),var(--brand-dark));box-shadow:0 10px 22px #6d4aff38}.sidebar-footer{margin-top:auto;display:grid;gap:10px}.identity-card{display:grid;gap:5px;padding:13px;border-radius:14px;background:#ffffffb8;border:1px solid var(--border);box-shadow:var(--shadow-soft)}.identity-card span{color:var(--text-soft);font-size:.86rem;overflow-wrap:anywhere}.content-shell{min-width:0;padding:0 30px 36px}.topbar{position:sticky;top:0;z-index:10;min-height:82px;margin:0 -30px 18px;padding:18px 30px;display:flex;align-items:center;justify-content:space-between;gap:16px;background:#faf9ffd1;border-bottom:1px solid rgba(227,222,243,.86);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.topbar h2{font-size:1.78rem;font-weight:860}.page-content,.dashboard-grid,.detail-grid{display:grid;gap:16px}.hero-card,.surface-card,.auth-card,.metric-card,.user-card,.modal-panel{border-radius:var(--radius);background:#ffffffe0;border:1px solid var(--border);box-shadow:var(--shadow-soft)}.hero-card,.surface-card,.auth-card,.modal-panel{padding:22px}.hero-card{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:20px;background:linear-gradient(135deg,#fffffff0,#f8f5ffeb),var(--panel)}.inbox-summary{border-color:#dbd3ff}.hero-card h3{font-size:1.2rem;font-weight:820}.muted-copy,.mail-snippet,.empty-state p,.notice,.toggle-row p,.metric-card p{color:var(--text-soft)}.muted-copy{margin:8px 0 0;max-width:78ch;line-height:1.55}.primary-button,.secondary-button,.ghost-button,.soft-link{min-height:42px;border-radius:12px;padding:0 15px;border:1px solid transparent;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:760;transition:transform .15s ease,box-shadow .15s ease,background .15s ease,border-color .15s ease}.primary-button{color:#fff;background:linear-gradient(135deg,var(--brand),var(--brand-dark));border-color:#5636d38c;box-shadow:0 12px 22px #6d4aff33}.primary-button:hover{transform:translateY(-1px);box-shadow:0 16px 26px #6d4aff42}.secondary-button{background:var(--brand-soft);color:var(--brand-dark);border-color:#d7ccff}.ghost-button,.soft-link{background:#ffffffc7;color:var(--text);border-color:var(--border)}.ghost-button:hover,.soft-link:hover,.secondary-button:hover{background:#fff;border-color:#cfc5ef}.danger-text{color:var(--danger)}.field{display:grid;gap:7px}.field span{font-size:.84rem;font-weight:760;color:var(--text-soft)}.field input,.field select,.field textarea,.alias-row input{width:100%;min-height:44px;padding:0 13px;border-radius:12px;border:1px solid var(--border-strong);background:#ffffffe6;color:var(--text);outline:none}.field input:focus,.field select:focus,.alias-row input:focus{border-color:var(--brand);box-shadow:0 0 0 4px #6d4aff21}.toolbar-row{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:14px;align-items:end;margin-bottom:14px}.toolbar-row.admin{grid-template-columns:repeat(3,minmax(0,1fr))}.toolbar-row.admin.two-up{grid-template-columns:repeat(2,minmax(0,1fr))}.mail-list,.attachment-list,.extension-grid,.stats-grid,.user-grid{display:grid}.mail-list{overflow:hidden;border-radius:14px;border:1px solid var(--border);background:#fff}.attachment-list,.extension-grid,.stats-grid,.user-grid{gap:10px}.mail-card,.attachment-card,.extension-card,.email-chip{border:1px solid var(--border);background:#fff}.mail-card{position:relative;padding:14px 16px 14px 20px;display:grid;gap:7px;border-width:0 0 1px;border-radius:0;transition:background .14s ease}.mail-card:last-child{border-bottom:0}.mail-card:hover{background:var(--brand-wash)}.mail-card:before{content:"";position:absolute;inset:14px auto 14px 8px;width:4px;border-radius:999px;background:linear-gradient(180deg,var(--brand),var(--accent));opacity:0;transition:opacity .14s ease}.mail-card:hover:before{opacity:1}.mail-card-header,.detail-header,.user-card-head,.action-row,.pagination-row,.tab-row,.toggle-row,.alias-row,.mail-meta-line,.toggle-pair,.hero-metrics{display:flex;gap:12px;justify-content:space-between;align-items:center;flex-wrap:wrap}.mail-card h4,.user-card h4{margin:0 0 4px;font-size:1rem;line-height:1.25;color:var(--text);font-weight:820}.mail-card-header p{margin:0;color:var(--text-soft);font-size:.9rem}.timestamp{font-size:.84rem;color:var(--text-muted);white-space:nowrap}.mail-meta-line{justify-content:flex-start;color:var(--text-muted);font-size:.84rem}.mail-meta-line span{overflow-wrap:anywhere}.mail-snippet{margin:0;line-height:1.45}.tag,.role-pill,.status-pill{display:inline-flex;align-items:center;justify-content:center;min-height:25px;padding:0 9px;border-radius:999px;font-size:.76rem;font-weight:780}.tag,.role-pill.admin,.tab-button.active{background:var(--accent-soft);color:#067467;border-color:#9de7dc}.role-pill.user{background:#fff4d9;color:#83520d}.status-pill.active{background:#e9fbf3;color:var(--success)}.status-pill.inactive{background:#fff1ef;color:var(--danger)}.metric-chip,.metric-card,.info-tile,.extension-card,.attachment-card,.email-chip{padding:12px;border-radius:12px}.metric-chip,.metric-card,.info-tile{display:grid;gap:4px}.metric-chip{min-width:148px;background:#fff;border:1px solid #ded6ff;color:var(--text)}.metric-chip span,.metric-card span,.info-tile span{color:var(--text-muted);font-size:.77rem;font-weight:780}.metric-chip strong,.metric-card strong,.info-tile strong{font-size:1.22rem;line-height:1.2;overflow-wrap:anywhere}.metric-card,.info-tile,.extension-card,.attachment-card,.email-chip{background:var(--panel)}.stats-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.kv-grid,.extension-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.info-tile{background:var(--panel-soft);border:1px solid var(--border)}.message-body{margin:0;padding:18px;border-radius:14px;background:#fff;border:1px solid var(--border);white-space:pre-wrap;word-break:break-word;min-height:360px;line-height:1.65}.email-frame{width:100%;min-height:560px;border:1px solid var(--border);border-radius:14px;background:#fff}.notice{padding:12px 14px;border-radius:12px;border:1px solid var(--border);background:var(--panel-soft)}.notice.success{background:#e9fbf3;color:var(--success);border-color:#a7ead0}.notice.danger{background:#fff1ef;color:var(--danger);border-color:#ffd0ca}.notice.warning{background:#fff8e8;color:var(--warning);border-color:#ffe0a3}.loading-panel,.empty-state,.fullscreen-loader{display:grid;place-items:center;text-align:center}.loading-panel{gap:12px;padding:44px 18px}.loading-dot{width:12px;height:12px;border-radius:999px;background:var(--brand);box-shadow:0 0 0 9px #6d4aff21;animation:pulse 1.15s ease-in-out infinite}@keyframes pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.22);opacity:.72}}.empty-state{padding:38px 18px;border-radius:14px;border:1px dashed var(--border-strong);background:var(--panel-soft)}.pagination-row{margin-top:16px}.tab-row{margin-bottom:0}.tab-button{border:1px solid var(--border);min-height:38px;padding:0 13px;border-radius:12px 12px 0 0;background:#ffffffb3;color:var(--text-soft);font-weight:780}.tab-button.active{color:#067467}.toggle-row{padding:16px 0;border-top:1px solid var(--border)}.toggle-row:first-child{border-top:0}.toggle{position:relative;width:52px;height:30px;border-radius:999px;display:inline-flex;align-items:center;padding:3px;background:#ddd7ed}.toggle input{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0}.toggle.on{background:var(--brand)}.toggle-handle{width:24px;height:24px;border-radius:50%;background:#fff;box-shadow:0 2px 5px #36296833;transform:translate(0);transition:transform .18s ease}.toggle.on .toggle-handle{transform:translate(22px)}.checkbox-row{display:inline-flex;align-items:center;gap:10px;color:var(--text-soft)}.checkbox-row.inline{flex-wrap:nowrap}.auth-layout{min-height:100vh;display:grid;grid-template-columns:minmax(0,1fr) 430px;gap:24px;align-items:stretch;padding:24px}.auth-layout.compact{grid-template-columns:minmax(0,1fr);place-items:center}.auth-hero{display:grid;align-content:center;gap:18px;padding:42px;border-radius:22px;background:radial-gradient(circle at 18% 20%,rgba(255,255,255,.2),transparent 26rem),linear-gradient(135deg,#39228f,#5b3df5 48%,#00a58d);color:#fff;box-shadow:var(--shadow)}.auth-hero .eyebrow,.auth-hero .lede{color:#ffffffc2}.auth-hero h1{font-size:clamp(2rem,4vw,3.35rem);margin:0;line-height:1.02;letter-spacing:-.055em}.lede{font-size:1rem;max-width:58ch;line-height:1.58}.auth-card{max-width:560px;align-self:center;box-shadow:var(--shadow)}.auth-card h2{margin-bottom:18px}.form-grid,.settings-list,.alias-manager{display:grid;gap:14px}.auth-footer-links{margin-top:18px;color:var(--brand-dark);font-weight:760}.detail-grid,.dashboard-grid{animation:rise .18s ease-out}@keyframes rise{0%{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}.user-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.user-card{padding:16px;display:grid;gap:14px}.pill-row,.email-address-stack{display:flex;flex-wrap:wrap;gap:8px}.email-chip{display:inline-flex;align-items:center;gap:8px}.email-chip small{color:var(--brand-dark);font-weight:820}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;padding:24px;background:#1f1b2d7a;display:grid;place-items:center;z-index:30;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.modal-panel{width:min(1080px,100%);max-height:calc(100vh - 48px);overflow:auto}.alias-list{display:grid;gap:10px}.alias-row{padding:12px;border-radius:12px;background:var(--panel-soft);border:1px solid var(--border)}.settings-list{max-width:860px}.extension-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.extension-card.good{border-color:#a7ead0}.extension-card.bad{border-color:#ffd0ca}.fullscreen-loader{min-height:100vh;padding:24px}@media (max-width: 1120px){.app-frame{grid-template-columns:1fr}.sidebar{position:static;height:auto}.stats-grid,.kv-grid,.extension-grid,.user-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.auth-layout{grid-template-columns:1fr}}@media (max-width: 760px){.content-shell,.sidebar,.auth-layout{padding:16px}.content-shell{padding-top:0}.topbar{margin:0 -16px 16px;padding:16px}.hero-card,.surface-card,.auth-card,.modal-panel{padding:16px}.hero-card,.toolbar-row,.toolbar-row.admin,.toolbar-row.admin.two-up,.stats-grid,.kv-grid,.extension-grid,.user-grid{grid-template-columns:1fr}.topbar,.mail-card-header,.detail-header,.action-row,.pagination-row{align-items:start}.hero-metrics{width:100%}.metric-chip{min-width:0;flex:1 1 150px}}
