:root{
  --bg:#f4f6fb; --panel:#fff; --ink:#1f2733; --muted:#6b7686; --line:#e3e8f0;
  --brand:#3b6ef5; --brand-d:#2c54c9; --ok:#1f9d55; --warn:#c9740b; --err:#d23b3b;
  --star:#f5b50a; --shadow:0 1px 3px rgba(20,30,60,.08),0 4px 14px rgba(20,30,60,.05);
}
*{box-sizing:border-box}
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",Roboto,Helvetica,Arial,sans-serif;background:var(--bg);color:var(--ink);font-size:14px;line-height:1.5}
a{color:var(--brand);text-decoration:none}
a:hover{text-decoration:underline}
.topbar{height:54px;background:var(--panel);border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 18px;gap:14px;position:sticky;top:0;z-index:20}
.topbar .logo{font-weight:700;font-size:18px;color:var(--brand);display:flex;align-items:center;gap:8px}
.topbar .logo .dot{width:10px;height:10px;border-radius:50%;background:var(--brand)}
.topbar .spacer{flex:1}
.topbar .who{color:var(--muted)}
.topbar a.btn{padding:6px 12px}
.layout{display:flex;min-height:calc(100vh - 54px)}
.sidebar{width:210px;background:var(--panel);border-right:1px solid var(--line);padding:14px 10px;flex-shrink:0;position:sticky;top:54px;height:calc(100vh - 54px);overflow-y:auto;align-self:flex-start}
.sidebar a{display:flex;align-items:center;justify-content:space-between;padding:9px 12px;border-radius:8px;color:var(--ink);margin-bottom:2px}
.sidebar a:hover{background:#eef2fb;text-decoration:none}
.sidebar a.active{background:#e7eefe;color:var(--brand-d);font-weight:600}
.sidebar .badge{background:var(--brand);color:#fff;border-radius:10px;padding:0 7px;font-size:12px;line-height:18px}
.sidebar .sect{font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin:16px 12px 6px}
.compose-btn{display:block;background:var(--brand);color:#fff;text-align:center;padding:10px;border-radius:8px;font-weight:600;margin-bottom:12px}
.compose-btn:hover{background:var(--brand-d);text-decoration:none}
.main{flex:1;padding:18px 22px;min-width:0}
.card{background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow)}
.card-pad{padding:18px 20px}
h1{font-size:20px;margin:0 0 16px}
h2{font-size:16px;margin:0 0 12px}
.flash{padding:10px 14px;border-radius:8px;margin-bottom:14px}
.flash.ok{background:#e7f7ee;color:var(--ok);border:1px solid #b8e7cb}
.flash.err{background:#fdeaea;color:var(--err);border:1px solid #f4c4c4}
.btn{display:inline-block;background:var(--brand);color:#fff;border:none;border-radius:8px;padding:9px 16px;font-size:14px;cursor:pointer}
.btn:hover{background:var(--brand-d);text-decoration:none}
.btn.sec{background:#eef1f6;color:var(--ink)}
.btn.sec:hover{background:#e2e7ef}
.btn.danger{background:var(--err)}
.btn.sm{padding:5px 10px;font-size:13px}
input,textarea,select{width:100%;padding:9px 11px;border:1px solid var(--line);border-radius:8px;font-size:14px;font-family:inherit;background:#fff;color:var(--ink)}
input:focus,textarea:focus,select:focus{outline:none;border-color:var(--brand)}
label{display:block;margin:12px 0 5px;font-weight:600;font-size:13px}
.row{display:flex;gap:12px}
.row>*{flex:1}
table{width:100%;border-collapse:collapse}
th,td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:middle}
th{color:var(--muted);font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:.03em}
.maillist{list-style:none;margin:0;padding:0}
.maillist li{display:grid;grid-template-columns:22px 24px 180px minmax(0,1fr) 108px;align-items:center;column-gap:10px;padding:12px 14px;border-bottom:1px solid var(--line);cursor:pointer}
.maillist li:hover{background:#f8faff}
.maillist li.unread{background:#fbfdff;font-weight:600}
.maillist .star{color:#cdd4df;font-size:18px;width:20px;text-align:center}
.maillist .star.on{color:var(--star)}
.maillist .from{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.maillist .subj{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ink)}
.maillist .subj .snip{color:var(--muted);font-weight:400}
.maillist .date{text-align:right;color:var(--muted);font-size:12px}
.maillist .clip{color:var(--muted)}
.maillist li .rowchk{margin:0;cursor:pointer;width:16px;height:16px}
.maillist li .inline-form{display:flex;align-items:center;justify-content:center;margin:0}
.empty{padding:50px;text-align:center;color:var(--muted)}
.auth-wrap{max-width:380px;margin:60px auto}
.auth-wrap .card-pad{padding:26px 28px}
.auth-wrap .logo{font-size:22px;font-weight:700;color:var(--brand);text-align:center;margin-bottom:6px}
.auth-wrap .sub{text-align:center;color:var(--muted);margin-bottom:18px}
.muted{color:var(--muted)}
.pill{display:inline-block;padding:2px 9px;border-radius:20px;font-size:12px;font-weight:600}
.pill.green{background:#e7f7ee;color:var(--ok)}
.pill.gray{background:#eef1f6;color:var(--muted)}
.pill.red{background:#fdeaea;color:var(--err)}
.pill.blue{background:#e7eefe;color:var(--brand-d)}
.pill.amber{background:#fdf2e0;color:var(--warn)}
.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px;margin-bottom:18px}
.stat{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px 18px;box-shadow:var(--shadow)}
.stat .n{font-size:26px;font-weight:700}
.stat .l{color:var(--muted);font-size:13px;margin-top:2px}
.mailhead{border-bottom:1px solid var(--line);padding-bottom:14px;margin-bottom:14px}
.mailhead .subj{font-size:20px;font-weight:700;margin-bottom:8px}
.mailbody{white-space:pre-wrap;word-break:break-word;line-height:1.7}
.mailbody-html{line-height:1.7}
.toolbar{display:flex;gap:8px;margin-bottom:14px;flex-wrap:wrap;align-items:center}
.toolbar .spacer{flex:1}
.attach{display:inline-flex;align-items:center;gap:6px;background:#f3f6fc;border:1px solid var(--line);border-radius:8px;padding:6px 12px;margin:4px 6px 0 0}
.code{background:#0f1830;color:#d7e3ff;border-radius:8px;padding:12px 14px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12.5px;overflow-x:auto;white-space:pre;word-break:break-all}
.dns-row td{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12.5px;word-break:break-all}
.note{background:#fff8e8;border:1px solid #f3e2b3;border-radius:8px;padding:12px 14px;color:#7a5a10;margin:10px 0}
.tabs{display:flex;gap:6px;margin-bottom:16px;border-bottom:1px solid var(--line)}
.tabs a{padding:9px 14px;color:var(--muted);border-bottom:2px solid transparent;margin-bottom:-1px}
.tabs a.active{color:var(--brand-d);border-color:var(--brand);font-weight:600}
.tabs a:hover{text-decoration:none;color:var(--ink)}
.pager{display:flex;gap:8px;justify-content:center;margin-top:16px}
.inline-form{display:inline}
@media(max-width:760px){
  .sidebar{display:none}
  .maillist li{grid-template-columns:20px 22px 110px minmax(0,1fr) 64px;column-gap:6px}
}

/* 富文本编辑器 */
.rte{border:1px solid var(--border,#e2e8f0);border-radius:8px;overflow:hidden;background:#fff}
.rte-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:4px;padding:6px 8px;background:#f8fafc;border-bottom:1px solid var(--border,#e2e8f0)}
.rte-toolbar button{border:1px solid transparent;background:transparent;border-radius:6px;padding:4px 8px;cursor:pointer;font-size:14px;line-height:1;color:#334155}
.rte-toolbar button:hover{background:#e2e8f0}
.rte-toolbar select,.rte-toolbar input[type=color]{height:28px;border:1px solid #e2e8f0;border-radius:6px;background:#fff;cursor:pointer}
.rte-toolbar select{font-size:13px;min-width:78px}
.rte-color{display:inline-flex;align-items:center;justify-content:center;width:30px;height:28px;border:1px solid #e2e8f0;border-radius:6px;cursor:pointer;position:relative;font-weight:700;font-size:13px;color:#334155;overflow:hidden}
.rte-color input[type=color]{position:absolute;inset:0;opacity:0;width:100%;height:100%;border:none;cursor:pointer}
.rte-editor img{max-width:100%}
.rte-editor h1{font-size:1.6em}.rte-editor h2{font-size:1.35em}.rte-editor h3{font-size:1.15em}
.rte-editor pre{background:#f1f5f9;padding:10px;border-radius:6px;overflow:auto}
.rte-sep{width:1px;height:20px;background:#e2e8f0;margin:0 4px}
.rte-editor{min-height:280px;max-height:520px;overflow:auto;padding:14px;font-size:14px;line-height:1.7;outline:none}
.rte-editor:empty:before{content:attr(data-ph);color:#94a3b8}
.rte-editor blockquote{border-left:3px solid #cbd5e1;margin:8px 0;padding:4px 12px;color:#475569}

/* 选择/批量操作栏：勾选后才显示操作按钮 */
.selbar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:8px 12px;margin-bottom:12px;background:#f8fafc;border:1px solid var(--border,#e2e8f0);border-radius:10px}
.selbar .chk{display:flex;align-items:center;gap:6px;font-size:13px;color:#475569;cursor:pointer;white-space:nowrap}
.selbar .btn,.batch-actions .btn{white-space:nowrap}
.selbar .bcount{font-size:12px;color:#2563eb;min-width:44px}
.selbar .spacer{flex:1}
.batch-actions{display:none;flex-wrap:wrap;align-items:center;gap:6px}
.batch-actions select.sm{height:28px;min-width:100px;border:1px solid #e2e8f0;border-radius:6px;background:#fff;font-size:13px}

.dropdown{position:relative;display:inline-block}
.dropdown-menu{display:none;position:absolute;right:0;top:calc(100% + 4px);background:#fff;border:1px solid var(--border,#e2e8f0);border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.12);min-width:180px;z-index:50;overflow:hidden}
.dropdown-menu.show{display:block}
.dropdown-menu a,.dropdown-menu button{display:block;width:100%;text-align:left;padding:9px 14px;background:none;border:none;font-size:14px;color:#334155;cursor:pointer;text-decoration:none;box-sizing:border-box}
.dropdown-menu a:hover,.dropdown-menu button:hover{background:#f1f5f9}
.dropdown-menu form{margin:0}
/* 新建文件夹输入 */
.newfolder-btn{display:flex;align-items:center;padding:9px 12px;border-radius:8px;margin:4px 0 2px;color:var(--brand,#2563eb);border:1px dashed #cbd5e1;cursor:pointer;font-size:13px}
.newfolder-btn:hover{background:#eef2fb;border-style:solid;text-decoration:none}
/* 打印时只显示邮件正文 */
@media print{.topbar,.sidebar,.toolbar,.pager,.batchbar{display:none!important}.layout,.main,.card{display:block!important;margin:0!important;box-shadow:none!important;border:none!important}}

/* ============ 邮箱界面主题（不同整体样式，非仅换色）============ */
body.theme-default{}

/* Element / Vue 清爽风：细边框、适中圆角、蓝色主色、轻阴影 */
body.theme-element{--bg:#f5f7fa;--brand:#409eff;--brand-d:#337ecc;--line:#e4e7ed;--ink:#303133;--muted:#909399}
body.theme-element .card{border:1px solid #e4e7ed;box-shadow:0 1px 8px rgba(0,0,0,.04);border-radius:8px}
body.theme-element .btn{border-radius:6px;font-weight:500;box-shadow:none}
body.theme-element .btn.sec{background:#fff;border:1px solid #dcdfe6;color:#606266}
body.theme-element .btn.sec:hover{color:#409eff;border-color:#c6e2ff;background:#ecf5ff}
body.theme-element input,body.theme-element textarea,body.theme-element select{border:1px solid #dcdfe6;border-radius:6px}
body.theme-element input:focus,body.theme-element textarea:focus{border-color:#409eff}
body.theme-element .topbar{box-shadow:0 1px 4px rgba(0,0,0,.06);border-bottom:none}
body.theme-element .sidebar a.active{background:#ecf5ff;color:#409eff}
body.theme-element .srctab.active{background:#409eff;border-color:#409eff}

/* 扁平方正风：无圆角、无阴影、色块分明 */
body.theme-flat{--bg:#eceff1;--brand:#455a64;--brand-d:#37474f;--line:#cfd8dc;--star:#ff9800}
body.theme-flat .card{border-radius:0;box-shadow:none;border:1px solid #cfd8dc}
body.theme-flat .btn{border-radius:0;text-transform:none;box-shadow:none;font-weight:600}
body.theme-flat .btn.sec{border-radius:0}
body.theme-flat input,body.theme-flat textarea,body.theme-flat select{border-radius:0}
body.theme-flat .topbar{box-shadow:none;border-bottom:2px solid #455a64}
body.theme-flat .sidebar a{border-radius:0}
body.theme-flat .srctab{border-radius:0}
body.theme-flat .pill,body.theme-flat .badge{border-radius:0}

/* 柔和圆润风：大圆角、柔和阴影、暖色背景 */
body.theme-soft{--bg:#fdf2f8;--brand:#ec4899;--brand-d:#db2777;--line:#f6d9e7;--ink:#4a2c3a;--muted:#a87e90;--star:#f59e0b}
body.theme-soft .card{border-radius:18px;box-shadow:0 6px 24px rgba(236,72,153,.10);border:none}
body.theme-soft .btn{border-radius:999px;box-shadow:0 4px 12px rgba(236,72,153,.20)}
body.theme-soft .btn.sec{background:#fff;box-shadow:none;border:1px solid #f6d9e7}
body.theme-soft input,body.theme-soft textarea,body.theme-soft select{border-radius:12px;border:1px solid #f6d9e7}
body.theme-soft .sidebar a{border-radius:12px}
body.theme-soft .sidebar a.active{background:#fce7f3;color:#db2777}
body.theme-soft .topbar{border-bottom:none;box-shadow:0 2px 12px rgba(236,72,153,.08)}
body.theme-soft .srctab{border-radius:999px}

/* 薄荷清新风：绿色主色、清爽留白 */
body.theme-mint{--bg:#f0fdf9;--brand:#10b981;--brand-d:#059669;--line:#cdeee1;--ink:#134e42;--muted:#6b9d8d;--star:#f59e0b}
body.theme-mint .card{border-radius:12px;box-shadow:0 2px 12px rgba(16,185,129,.08);border:1px solid #cdeee1}
body.theme-mint .btn{border-radius:8px}
body.theme-mint .btn.sec{background:#fff;border:1px solid #cdeee1;color:#059669}
body.theme-mint input,body.theme-mint textarea,body.theme-mint select{border-radius:8px;border:1px solid #cdeee1}
body.theme-mint .sidebar a.active{background:#d1fae5;color:#059669}
body.theme-mint .topbar{border-bottom:none;box-shadow:0 1px 8px rgba(16,185,129,.10)}

/* 暗夜模式：深色 + 精致 */
body.theme-dark{--bg:#0f172a;--panel:#1e293b;--ink:#e2e8f0;--muted:#94a3b8;--line:#334155;--brand:#60a5fa;--brand-d:#3b82f6;--star:#fbbf24;--border:#334155;--shadow:0 1px 3px rgba(0,0,0,.4)}
body.theme-dark .topbar,body.theme-dark .card,body.theme-dark .sidebar{background:var(--panel)}
body.theme-dark .card{border:1px solid #334155;border-radius:12px}
body.theme-dark input,body.theme-dark textarea,body.theme-dark select,body.theme-dark .rte,body.theme-dark .rte-editor{background:#0f172a;color:var(--ink);border-color:#334155}
body.theme-dark .selbar,body.theme-dark .rte-toolbar{background:#243244}
body.theme-dark .btn.sec{background:#334155;color:#e2e8f0;border-color:#475569}
body.theme-dark .sidebar a.active{background:#334155}
body.theme-dark .note{background:#243244}

/* 主题选择器 */
.theme-grid{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px}
.theme-opt{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 14px;border:2px solid var(--line);border-radius:10px;cursor:pointer;min-width:88px}
.theme-opt.sel{border-color:var(--brand)}
.theme-opt input{position:absolute;inset:0;opacity:0;cursor:pointer;margin:0}
.theme-swatch{width:44px;height:44px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.1)}
.theme-name{font-size:12px;color:var(--muted)}

/* ============ 登录/注册页风格 ============ */
.auth-body{min-height:100vh;background-size:cover;background-position:center;background-repeat:no-repeat}
/* 渐变风格 */
.auth-body.style-gradient{background:linear-gradient(135deg,#6366f1 0%,#8b5cf6 40%,#ec4899 100%)}
.auth-body.style-gradient .auth-wrap .card{backdrop-filter:blur(6px);background:rgba(255,255,255,.94)}
/* 极简风格 */
.auth-body.style-minimal{background:#fff}
.auth-wrap.style-minimal .card{box-shadow:none;border:1px solid var(--line)}
/* 左右分栏风格 */
.auth-wrap.style-split{max-width:860px;display:grid;grid-template-columns:1fr 1fr;align-items:stretch;gap:0;overflow:hidden;border-radius:16px;box-shadow:var(--shadow);background:var(--panel)}
.auth-wrap.style-split::before{content:"GoMail";display:flex;align-items:center;justify-content:center;font-size:34px;font-weight:800;color:#fff;background:linear-gradient(135deg,var(--brand),var(--brand-d));letter-spacing:2px}
.auth-wrap.style-split .card{box-shadow:none;border:none;border-radius:0;display:flex;flex-direction:column;justify-content:center}
/* 有背景图时卡片半透明增强可读性 */
.auth-body[style*="login-bg"] .auth-wrap .card{background:rgba(255,255,255,.95)}
@media(max-width:640px){.auth-wrap.style-split{grid-template-columns:1fr}.auth-wrap.style-split::before{display:none}}
/* 后台：登录页外观选择器 */
.style-grid{display:flex;flex-wrap:wrap;gap:10px;margin:8px 0}
.style-opt{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px;border:2px solid var(--line);border-radius:10px;cursor:pointer;width:104px}
.style-opt.sel{border-color:var(--brand)}
.style-opt input{position:absolute;inset:0;opacity:0;cursor:pointer;margin:0}
.style-prev{width:80px;height:52px;border-radius:6px;border:1px solid var(--line)}
.style-prev.classic{background:#f4f6fb}.style-prev.classic::after{content:"";display:block;width:44px;height:28px;margin:12px auto;background:#fff;border-radius:4px;box-shadow:0 1px 3px rgba(0,0,0,.15)}
.style-prev.gradient{background:linear-gradient(135deg,#6366f1,#ec4899)}
.style-prev.minimal{background:#fff}
.style-prev.split{background:linear-gradient(90deg,var(--brand) 50%,#fff 50%)}

/* 服务器资源监控 */
.res-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px}
.res{padding:12px 14px;border:1px solid var(--border,#e2e8f0);border-radius:10px;background:var(--panel)}
.res-top{display:flex;justify-content:space-between;font-weight:600;margin-bottom:8px}
.bar{height:10px;background:#eef2f7;border-radius:6px;overflow:hidden}
.bar-fill{height:100%;border-radius:6px;transition:width .5s ease,background .5s ease;background:#16a34a}
body.theme-dark .bar{background:#334155}

/* 邮件列表（表格版，全浏览器兼容） */
.maillist2{width:100%;table-layout:fixed;border-collapse:collapse}
.maillist2 .mrow:hover{background:#f8faff}
.maillist2 .mrow.unread{background:#fbfdff}
.maillist2 .mrow.unread .mcell b{font-weight:700}
.maillist2 .mcell b{font-weight:600}
.maillist2 .star{color:#cdd4df}
.maillist2 .star.on{color:var(--star)}
body.theme-dark .maillist2 .mrow:hover{background:#243244}
body.theme-dark .maillist2 .mrow.unread{background:#243244}
body.theme-dark .maillist2 td{border-bottom-color:#334155 !important}

/* 来源筛选标签 */
.srcfilter{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-bottom:12px}
.srcfilter-label{font-size:13px;color:var(--muted)}
.srctab{padding:4px 12px;border:1px solid var(--border,#e2e8f0);border-radius:16px;font-size:13px;color:var(--ink);text-decoration:none;background:var(--panel)}
.srctab:hover{border-color:var(--brand);text-decoration:none}
.srctab.active{background:var(--brand);color:#fff;border-color:var(--brand)}
/* 代收来源标记 */
.src-badge{display:inline-block;font-size:11px;padding:1px 7px;border-radius:10px;background:#e0f2fe;color:#0369a1;font-weight:600;vertical-align:middle}
body.theme-dark .src-badge{background:#0c4a6e;color:#bae6fd}
/* 弹窗 */
.modal-mask{position:fixed;inset:0;background:rgba(15,23,42,.45);z-index:200;align-items:center;justify-content:center}
.modal-box{background:var(--panel);border-radius:14px;padding:22px;width:min(90vw,420px);box-shadow:0 20px 60px rgba(0,0,0,.3)}
.modal-box .btn{width:100%;text-align:left}

/* 服务异常告警条 */
.svc-alert{background:#fef2f2;border:1px solid #fecaca;border-left:4px solid #dc2626;color:#991b1b;padding:14px 16px;border-radius:10px;margin-bottom:18px;line-height:1.6}
.svc-alert code{background:#fff;padding:1px 6px;border-radius:4px;color:#b91c1c}

/* 已读/未读明显区分 */
.maillist2 .mrow td{transition:background .15s}
.maillist2 .mrow.unread{background:#eff6ff}
.maillist2 .mrow.unread td{border-left:none}
.maillist2 .mrow.unread .mcell,.maillist2 .mrow.unread .mcell b{color:#0b2447;font-weight:700}
.maillist2 .mrow.unread td:first-child{box-shadow:inset 3px 0 0 var(--brand,#2563eb)}
/* 已读行：整体变灰、更淡 */
.maillist2 .mrow:not(.unread) .mcell{color:#8a94a6;font-weight:400}
.maillist2 .mrow:not(.unread) .mcell b{color:#6b7280;font-weight:500}
.maillist2 .mrow:not(.unread){background:#fff}
/* 未读圆点标记 */
.unread-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--brand,#2563eb);margin-right:6px;vertical-align:middle}
body.theme-dark .maillist2 .mrow.unread{background:#1e293b}
body.theme-dark .maillist2 .mrow.unread .mcell,body.theme-dark .maillist2 .mrow.unread .mcell b{color:#dbeafe}
body.theme-dark .maillist2 .mrow:not(.unread){background:#0f172a}

/* 紧凑头部 + 精简搜索框 */
.folder-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}
.mail-search{position:relative;display:flex;align-items:center;width:240px;max-width:42vw}
.mail-search .ms-icon{position:absolute;left:10px;font-size:13px;opacity:.55;pointer-events:none}
.mail-search input{width:100%;box-sizing:border-box;padding:7px 28px 7px 30px;border:1px solid var(--line,#e2e8f0);border-radius:18px;font-size:13px;background:var(--panel);transition:border-color .15s,box-shadow .15s}
.mail-search input:focus{border-color:var(--brand,#2563eb);box-shadow:0 0 0 3px rgba(37,99,235,.12);outline:none}
.mail-search .ms-clear{position:absolute;right:10px;color:var(--muted);font-size:12px;text-decoration:none;line-height:1}
.mail-search .ms-clear:hover{color:var(--brand,#2563eb)}
/* 来源筛选：更精简，与搜索对齐留白 */
.srcfilter{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-bottom:12px}
.srctab{padding:4px 12px;border:1px solid var(--line,#e2e8f0);border-radius:16px;font-size:12.5px;color:var(--muted);text-decoration:none;background:var(--panel);line-height:1.6}
.srctab:hover{border-color:var(--brand);color:var(--brand);text-decoration:none}
.srctab.active{background:var(--brand);color:#fff;border-color:var(--brand)}

/* 邮件正文文本区 */
.mailbody{white-space:pre-wrap;word-break:break-word;font-size:14px;line-height:1.75;color:var(--ink);padding:4px 2px}
body.theme-dark .mailbody{color:#e2e8f0}

/* 顶栏用户下拉菜单 */
.user-menu{position:relative;display:inline-block}
.user-menu .who{cursor:pointer;padding:6px 10px;border-radius:8px;display:inline-block}
.user-menu:hover .who{background:#eef2fb}
.user-drop{display:none;position:absolute;right:0;top:100%;min-width:180px;background:var(--panel);border:1px solid var(--line,#e2e8f0);border-radius:10px;box-shadow:0 8px 28px rgba(0,0,0,.12);padding:6px;z-index:120}
.user-menu:hover .user-drop{display:block}
.user-drop a{display:block;padding:9px 12px;border-radius:7px;color:var(--ink);font-size:13px;text-decoration:none}
.user-drop a:hover{background:#eef2fb;text-decoration:none}
body.theme-dark .user-menu:hover .who,body.theme-dark .user-drop a:hover{background:#334155}

/* 后台批量操作条 */
.bbar{display:flex;align-items:center;gap:12px;padding:10px 14px;margin-bottom:10px;background:#f8fafc;border:1px solid var(--border,#e2e8f0);border-radius:10px}
.bbar .bsel{display:flex;align-items:center;gap:6px;font-size:13px;cursor:pointer}
body.theme-dark .bbar{background:#243244}

/* 顶栏下拉：主号/小号 */
.user-drop{min-width:230px}
.ud-main{padding:9px 12px;font-weight:600;font-size:13px;display:flex;align-items:center;justify-content:space-between;gap:8px}
.ud-tag{font-size:10px;padding:2px 7px;border-radius:9px;background:#e2e8f0;color:#475569;font-weight:500}
.ud-tag.main{background:#dbeafe;color:#1d4ed8}
.ud-sect{padding:6px 12px 2px;font-size:11px;color:var(--muted);text-transform:none}
.ud-alias{padding:6px 12px 6px 18px;font-size:12.5px;color:var(--muted)}
.ud-add{display:block;padding:8px 12px;margin:4px 6px;border:1px dashed #cbd5e1;border-radius:7px;color:var(--brand,#2563eb);font-size:12.5px;text-align:center;text-decoration:none}
.ud-add:hover{background:#eef2fb;border-style:solid;text-decoration:none}
.ud-note{padding:7px 12px;font-size:12px;color:var(--muted);text-align:center}
.ud-div{height:1px;background:var(--line,#e2e8f0);margin:6px 4px}

/* 编辑器增强：表情/全屏/工具栏 */
.rte-toolbar{position:relative;display:flex;flex-wrap:wrap;align-items:center;gap:2px;padding:8px 10px;background:#fafbfc;border-bottom:1px solid var(--line,#e2e8f0)}
.rte-toolbar button{background:none;border:1px solid transparent;border-radius:6px;padding:5px 8px;cursor:pointer;font-size:14px;color:#475569;line-height:1;min-width:30px}
.rte-toolbar button:hover{background:#eef2f7;border-color:#e2e8f0}
.rte-toolbar select{border:1px solid var(--line,#e2e8f0);border-radius:6px;padding:4px 6px;font-size:12.5px;background:#fff;max-width:110px}
.rte-sep{width:1px;height:20px;background:var(--line,#e2e8f0);margin:0 5px}
.rte-color{position:relative;display:inline-flex;align-items:center;justify-content:center;padding:5px 8px;border-radius:6px;cursor:pointer;font-size:14px}
.rte-color:hover{background:#eef2f7}
.rte-color input[type=color]{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}
.emoji-panel{position:absolute;top:100%;left:10px;z-index:150;display:flex;flex-wrap:wrap;gap:2px;width:300px;padding:8px;background:#fff;border:1px solid var(--line,#e2e8f0);border-radius:10px;box-shadow:0 8px 28px rgba(0,0,0,.14)}
.emoji-item{cursor:pointer;padding:5px;border-radius:6px;font-size:18px;line-height:1}
.emoji-item:hover{background:#eef2f7}
.rte-full{position:fixed;inset:0;z-index:400;background:var(--panel,#fff);display:flex;flex-direction:column;border-radius:0}
.rte-full .rte-editor,.rte-full #rteSource{flex:1;min-height:0;max-height:none}
body.theme-dark .rte-toolbar{background:#243244}
body.theme-dark .rte-toolbar button{color:#cbd5e1}
body.theme-dark .emoji-panel{background:#1e293b;border-color:#334155}

/* ============ 布局风格选择器 ============ */
.layout-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px}
.layout-opt{display:flex;flex-direction:column;gap:6px;padding:12px;border:2px solid var(--line,#e2e8f0);border-radius:12px;cursor:pointer;transition:.15s}
.layout-opt:hover{border-color:var(--brand,#2563eb)}
.layout-opt.sel{border-color:var(--brand,#2563eb);background:#f5f8ff}
.layout-opt input{display:none}
.lo-name{font-weight:600;font-size:13px}
.lo-desc{font-size:11.5px;color:var(--muted);line-height:1.5}
.lo-prev{display:flex;gap:3px;height:46px;background:#f1f5f9;border-radius:7px;padding:5px}
.lo-prev i{background:#cbd5e1;border-radius:3px;display:block}
.lo-classic i:nth-child(1){width:22%}.lo-classic i:nth-child(2){flex:1}.lo-classic i:nth-child(3){display:none}
.lo-three i:nth-child(1){width:18%}.lo-three i:nth-child(2){width:34%}.lo-three i:nth-child(3){flex:1;background:#94a3b8}
.lo-compact i:nth-child(1){width:18%}.lo-compact i:nth-child(2){flex:1;background:repeating-linear-gradient(#cbd5e1 0 4px,#f1f5f9 4px 7px)}.lo-compact i:nth-child(3){display:none}
.lo-card i:nth-child(1){width:18%}.lo-card i:nth-child(2){flex:1;background:repeating-linear-gradient(#cbd5e1 0 10px,#f1f5f9 10px 14px)}.lo-card i:nth-child(3){display:none}
.lo-wide i:nth-child(1){width:100%;height:8px;background:#94a3b8}.lo-wide{flex-direction:column}.lo-wide i:nth-child(2){flex:1;width:100%}.lo-wide i:nth-child(3){display:none}
body.theme-dark .layout-opt.sel{background:#243244}

/* ============ 布局：紧凑（高密度） ============ */
body.layout-compact .maillist2 td{padding:5px 6px !important;font-size:13px}
body.layout-compact .maillist2 .mcell{font-size:13px}
body.layout-compact .card{border-radius:8px}
body.layout-compact .folder-head{margin-bottom:6px}
body.layout-compact .srcfilter{margin-bottom:7px}
body.layout-compact .sidebar a{padding:6px 12px;font-size:13px}
body.layout-compact .content{padding:14px}

/* ============ 布局：卡片流 ============ */
body.layout-card #mailListCard{background:transparent;border:none;box-shadow:none;padding:0}
body.layout-card .maillist2{border-collapse:separate;border-spacing:0 8px}
body.layout-card .maillist2 .mrow{background:var(--panel);box-shadow:0 1px 6px rgba(15,23,42,.07);border-radius:12px}
body.layout-card .maillist2 .mrow:hover{box-shadow:0 6px 18px rgba(15,23,42,.12);transform:translateY(-1px)}
body.layout-card .maillist2 td{border-bottom:none !important;padding:14px 8px !important}
body.layout-card .maillist2 td:first-child{border-radius:12px 0 0 12px}
body.layout-card .maillist2 td:last-child{border-radius:0 12px 12px 0}
body.layout-card .maillist2 .mrow.unread{box-shadow:0 1px 6px rgba(37,99,235,.18);border-left:3px solid var(--brand,#2563eb)}
body.theme-dark.layout-card .maillist2 .mrow{background:#1e293b}

/* ============ 布局：宽屏无边栏（顶部横向导航） ============ */
body.layout-wide .layout{display:block}
body.layout-wide .sidebar{position:static;width:100%;height:auto;display:flex;flex-wrap:wrap;gap:4px;align-items:center;border-right:none;border-bottom:1px solid var(--line);padding:8px 16px;overflow:visible}
body.layout-wide .sidebar .sect{display:none}
body.layout-wide .sidebar a{margin:0;padding:7px 12px;white-space:nowrap;font-size:13px}
body.layout-wide .sidebar .newfolder-btn{margin:0}
body.layout-wide .sidebar form{display:inline-block}
body.layout-wide .content{max-width:1400px;margin:0 auto;padding:20px 24px}

/* ============ 布局：三栏（列表 + 右侧预览） ============ */
body.layout-three .content{display:flex;gap:0;padding:0;height:calc(100vh - 54px);overflow:hidden}
body.layout-three .three-list{flex:0 0 420px;max-width:44%;overflow-y:auto;padding:14px;border-right:1px solid var(--line,#e2e8f0)}
body.layout-three .three-view{flex:1;min-width:0;overflow-y:auto;padding:18px 22px;background:var(--panel)}
body.layout-three .three-empty{display:flex;align-items:center;justify-content:center;height:100%;color:var(--muted);font-size:14px}
body.layout-three #mailListCard{box-shadow:none;border:1px solid var(--line,#e2e8f0)}
body.layout-three .maillist2 td{padding:9px 6px !important}

/* ============ 响应式：手机端适配（所有布局通用） ============ */
@media (max-width: 820px){
  .layout{flex-direction:column}
  .sidebar{position:static !important;width:100% !important;height:auto !important;display:flex;flex-wrap:wrap;gap:4px;border-right:none;border-bottom:1px solid var(--line);padding:8px 10px;overflow-x:auto}
  .sidebar .sect{display:none}
  .sidebar a{margin:0;padding:7px 11px;font-size:12.5px;white-space:nowrap}
  .sidebar .badge{margin-left:4px}
  .content{padding:12px !important}
  .folder-head{flex-direction:column;align-items:stretch;gap:8px}
  .mail-search{width:100% !important;max-width:none !important}
  .maillist2 td:nth-child(3){display:none}          /* 手机隐藏发件人列，主题优先 */
  .maillist2 td:nth-child(5){width:64px !important;font-size:11px}
  .topbar{padding:8px 12px}
  .who{max-width:42vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:inline-block;vertical-align:middle}
  .card-pad{padding:14px}
  .rte-toolbar{gap:1px;padding:6px}
  .rte-toolbar select{max-width:82px;font-size:11.5px}
  .modal-box{width:94vw !important;max-width:94vw !important}
  .stat-grid{grid-template-columns:repeat(2,1fr) !important}
  body.layout-three .content{display:block;height:auto;overflow:visible}
  body.layout-three .three-list{flex:none;max-width:none;border-right:none;padding:12px}
  body.layout-three .three-view{display:none}
  table{font-size:13px}
}
@media (max-width: 480px){
  .maillist2 td:nth-child(2){display:none}          /* 极窄屏隐藏星标列 */
  .layout-grid{grid-template-columns:1fr 1fr}
}
body.layout-three .maillist2 .mrow.active-row{background:#e0edff}
body.theme-dark.layout-three .maillist2 .mrow.active-row{background:#334155}