/* =========================================================================
   公众号写作助手 · Liquid Glass 视觉重构
   设计语言：macOS 天气 App（液态玻璃材质/空间层级/光影/透明度/交互反馈）
   浅色 + 深色双主题，跟随系统自动切换（prefers-color-scheme）
   仅外观改动，不影响任何功能与结构
   ========================================================================= */
:root{
  /* 浅色主题（默认） - 丰富色彩 */
  --bg1:#F0E8FF; --bg2:#E0F0FF; --bg3:#FFEFE8;
  --glow1:rgba(120,80,255,.22); --glow2:rgba(0,180,255,.18); --glow3:rgba(255,120,80,.15);
  --glass:rgba(255,255,255,.45);
  --glass-strong:rgba(255,255,255,.65);
  --glass-soft:rgba(255,255,255,.28);
  --glass-line:rgba(255,255,255,.8);
  --glass-line-soft:rgba(0,0,0,.05);
  --ink:#1A1F2B; --sub:#5C6674; --line:rgba(16,32,58,.08);
  --primary:#6C5CE7; --primary-soft:rgba(108,92,231,.14);
  --primary-deep:#5A4BD1;
  --accent:#FF6B4A; --accent-soft:rgba(255,107,74,.14);
  --info:#0984E3; --info-soft:rgba(9,132,227,.14);
  --success:#00B894; --success-soft:rgba(0,184,148,.14);
  --warn:#F39C12; --warn-soft:rgba(243,156,18,.15);
  --err:#E74C3C; --err-soft:rgba(231,76,60,.14);
  --shadow:0 10px 30px rgba(100,80,200,.12), 0 2px 8px rgba(100,80,200,.08);
  --shadow-hover:0 16px 40px rgba(100,80,200,.18), 0 4px 12px rgba(100,80,200,.10);
  --shadow-pop:0 24px 60px rgba(80,60,180,.25), 0 6px 16px rgba(80,60,180,.15);
  --blur:32px; --radius:16px;
  --sidebar-w:232px;
}
@media (prefers-color-scheme: dark){
  :root{
    --bg1:#12101F; --bg2:#0D1B2A; --bg3:#1F1512;
    --glow1:rgba(120,80,255,.25); --glow2:rgba(0,180,255,.18); --glow3:rgba(255,120,80,.12);
    --glass:rgba(40,36,60,.55);
    --glass-strong:rgba(50,45,75,.8);
    --glass-soft:rgba(255,255,255,.06);
    --glass-line:rgba(255,255,255,.12);
    --glass-line-soft:rgba(255,255,255,.06);
    --ink:#F1F4F9; --sub:#98A2B3; --line:rgba(255,255,255,.10);
    --primary:#8B7CF6; --primary-soft:rgba(139,124,246,.25);
    --primary-deep:#A294F8;
    --accent:#FF8A6B; --accent-soft:rgba(255,138,107,.16);
    --info:#54A0FF; --info-soft:rgba(84,160,255,.16);
    --success:#55EFC4; --success-soft:rgba(85,239,196,.16);
    --warn:#FDCB6E; --warn-soft:rgba(253,203,110,.16);
    --err:#FF6B6B; --err-soft:rgba(255,107,107,.15);
    --shadow:0 10px 30px rgba(0,0,0,.5), 0 2px 8px rgba(0,0,0,.35);
    --shadow-hover:0 16px 44px rgba(0,0,0,.6), 0 4px 12px rgba(0,0,0,.4);
    --shadow-pop:0 24px 60px rgba(0,0,0,.65), 0 6px 18px rgba(0,0,0,.45);
    --blur:32px;
  }
}
*{box-sizing:border-box; margin:0; padding:0;}
html,body{height:100%;}
body{
  background:linear-gradient(135deg,var(--bg1),var(--bg2),var(--bg3)) fixed;
  color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","PingFang SC","Microsoft YaHei","Helvetica Neue",Arial,sans-serif;
  font-size:15px; line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
body::before{
  content:""; position:fixed; inset:0; z-index:-1; pointer-events:none;
  background:
    radial-gradient(1100px 760px at 12% -4%, var(--glow1), transparent 62%),
    radial-gradient(900px 620px at 92% 96%, var(--glow2), transparent 60%),
    radial-gradient(700px 500px at 50% 50%, var(--glow3), transparent 65%);
}
button{font-family:inherit; cursor:pointer;}
input,textarea,select{font-family:inherit; font-size:14px; color:var(--ink);}
a{color:var(--primary); text-decoration:none;}
/* ===== 应用外壳（玻璃） ===== */
.app{display:flex; min-height:100vh;}
.sidebar{
  width:var(--sidebar-w); padding:18px 14px; display:flex; flex-direction:column; gap:6px;
  position:fixed; top:0; left:0; bottom:0; z-index:30;
  background:var(--glass); backdrop-filter:blur(var(--blur)) saturate(2.0);
  -webkit-backdrop-filter:blur(var(--blur)) saturate(2.0);
  border-right:1px solid var(--glass-line);
  box-shadow:var(--shadow);
}
.sidebar .brand{display:flex; align-items:center; gap:10px; padding:6px 10px 18px; color:var(--ink); font-weight:700; font-size:15.5px; border-bottom:1px solid var(--glass-line-soft);}
.brand-logo{
  width:32px; height:32px; border-radius:10px; flex:0 0 32px;
  background:linear-gradient(135deg,var(--primary),var(--info));
  display:flex; align-items:center; justify-content:center; color:#fff; font-weight:700; font-size:16px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.4), 0 4px 12px rgba(108,92,231,.4);
}
.sidebar .nav-item{
  display:flex; align-items:center; gap:10px; padding:10px 12px; border-radius:10px;
  font-size:14px; color:var(--sub); border:none; background:transparent; width:100%; text-align:left;
  transition:background .16s ease,color .16s ease,transform .12s ease;
}
.sidebar .nav-item:hover{background:var(--glass-soft); color:var(--ink); transform:translateX(2px);}
.sidebar .nav-item.active{
  background:linear-gradient(135deg,var(--primary-soft),var(--info-soft));
  color:var(--primary); font-weight:700;
  box-shadow:inset 0 0 0 1px var(--glass-line), 0 4px 12px var(--primary-soft);
}
.sidebar .nav-item:active{transform:scale(.97);}
.sidebar .nav-spacer{flex:1;}
.sidebar .nav-foot{border-top:1px solid var(--glass-line-soft); padding-top:10px;}
.nav-ico{width:18px; height:18px; flex:0 0 18px; opacity:.9;}
.main{flex:1; margin-left:var(--sidebar-w); display:flex; flex-direction:column; min-height:100vh;}
.topbar{
  background:var(--glass-soft); backdrop-filter:blur(var(--blur)) saturate(1.6);
  -webkit-backdrop-filter:blur(var(--blur)) saturate(1.6);
  border-bottom:1px solid var(--glass-line);
  padding:calc(12px + env(safe-area-inset-top, 0px)) 26px 12px; display:flex; align-items:center; gap:14px;
  position:sticky; top:0; z-index:20;
}
.topbar .t-title{font-size:17px; font-weight:700;}
.topbar .t-sub{font-size:12.5px; color:var(--sub);}
.topbar .t-right{margin-left:auto; display:flex; align-items:center; gap:10px; flex-wrap:wrap;}
.brand-mini{display:flex; align-items:center; gap:8px;}
.brand-mini-logo{width:26px; height:26px; border-radius:8px; object-fit:cover; box-shadow:0 2px 8px rgba(10,25,60,.18);}
.brand-mini-name{font-size:14px; font-weight:700; color:var(--ink); letter-spacing:.2px;}
.content{flex:1; padding:24px 26px 90px;}
.chip{
  display:inline-flex; align-items:center; gap:6px;
  background:var(--glass-soft); border:1px solid var(--glass-line-soft);
  border-radius:20px; padding:5px 12px; font-size:12.5px;
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
}
.chip .dot{width:8px; height:8px; border-radius:50%;}
.dot-ok{background:var(--primary);} .dot-warn{background:var(--warn);} .dot-err{background:var(--err);}
/* ===== 登录态布局（玻璃） ===== */
body.auth-mode .sidebar, body.auth-mode .topbar, body.auth-mode .mnav{display:none;}
body.auth-mode .main{margin-left:0;}
body.auth-mode .content{padding:0; display:flex; align-items:center; justify-content:center; min-height:100vh;}
.auth-card{
  width:100%; max-width:400px;
  background:var(--glass-strong); backdrop-filter:blur(var(--blur)) saturate(1.7);
  -webkit-backdrop-filter:blur(var(--blur)) saturate(1.7);
  border:1px solid var(--glass-line); border-radius:20px;
  padding:32px 34px; margin:20px; box-shadow:var(--shadow-pop);
}
.auth-card .brand{display:flex; align-items:center; gap:10px; justify-content:center; margin-bottom:6px; font-weight:700; font-size:17px; color:var(--ink);}
.auth-card .auth-sub{text-align:center; color:var(--sub); font-size:13px; margin-bottom:18px;}
.auth-switch{text-align:center; margin-top:16px; font-size:13.5px; color:var(--sub);}
/* ===== 通用组件 ===== */
.view{display:none;}
.view.active{display:block; animation:fadeUp .22s ease;}
@keyframes fadeUp{from{transform:translateY(6px);}to{transform:none;}}
.card{
  background:var(--glass); backdrop-filter:blur(var(--blur)) saturate(1.8);
  -webkit-backdrop-filter:blur(var(--blur)) saturate(1.8);
  border:1px solid var(--glass-line); border-radius:var(--radius);
  padding:18px 20px; margin-bottom:16px; box-shadow:var(--shadow);
  transition:transform .16s ease, box-shadow .16s ease;
}
.card:hover{transform:translateY(-1px); box-shadow:var(--shadow-hover);}
.card h3{font-size:15px; margin-bottom:12px;}
.row{display:flex; gap:16px; flex-wrap:wrap;}
.grow{flex:1; min-width:260px;}
label{display:block; font-size:13px; color:var(--sub); margin:12px 0 6px; font-weight:600;}
label .req{color:var(--err);}
input[type=text],input[type=password],input[type=number],input[type=search],textarea,select{
  width:100%; padding:10px 12px;
  border:1px solid var(--glass-line-soft); border-radius:10px;
  background:var(--glass-soft); outline:none; transition:border-color .16s ease, box-shadow .16s ease, background .16s ease;
  box-shadow:inset 0 1px 2px rgba(10,20,40,.05);
}
input::placeholder,textarea::placeholder{color:var(--sub); opacity:.7;}
input:focus,textarea:focus,select:focus{
  border-color:var(--primary);
  box-shadow:0 0 0 3px var(--primary-soft), inset 0 1px 2px rgba(10,20,40,.05);
}
textarea{resize:vertical; min-height:70px;}
.help{font-size:12px; color:var(--sub); margin-top:4px;}
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:6px;
  border:none; border-radius:10px; padding:9px 18px; font-size:14px; font-weight:600;
  transition:transform .12s ease, box-shadow .16s ease, background .16s ease, opacity .15s;
}
.btn:disabled{opacity:.5; cursor:not-allowed;}
.btn:active:not(:disabled){transform:scale(.96);}
.btn-pri{
  background:linear-gradient(135deg,var(--primary),var(--info)); color:#fff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.25), 0 4px 14px var(--primary-soft);
}
.btn-pri:hover:not(:disabled){filter:brightness(1.06); box-shadow:inset 0 1px 0 rgba(255,255,255,.25), 0 6px 18px var(--primary-soft); transform:translateY(-1px);}
.btn-acc{
  background:linear-gradient(180deg,var(--accent),#E04E2E); color:#fff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28), 0 4px 14px rgba(255,107,74,.3);
}
.btn-acc:hover:not(:disabled){filter:brightness(1.06);}
.btn-ghost{
  background:var(--glass-soft); border:1px solid var(--glass-line); color:var(--ink);
  backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35);
}
.btn-ghost:hover{border-color:var(--primary); color:var(--primary);}
.btn-sm{padding:6px 12px; font-size:13px; border-radius:9px;}
.btn-lg{width:100%; padding:12px; font-size:15px;}
.switch{position:relative; display:inline-block; width:44px; height:24px; flex:0 0 44px;}
.switch input{opacity:0; width:0; height:0;}
.switch .sl{
  position:absolute; inset:0; background:rgba(120,130,145,.4); border-radius:24px; transition:.2s;
  box-shadow:inset 0 1px 3px rgba(0,0,0,.2);
}
.switch .sl::before{
  content:""; position:absolute; width:18px; height:18px; left:3px; top:3px;
  background:#fff; border-radius:50%; transition:.2s;
  box-shadow:0 1px 3px rgba(0,0,0,.25), 0 0 0 .5px rgba(0,0,0,.05);
}
.switch input:checked + .sl{background:linear-gradient(135deg,var(--primary),var(--info));}
.switch input:checked + .sl::before{transform:translateX(20px);}
.switch-row{display:flex; align-items:center; gap:10px;}
.badge{display:inline-block; padding:2px 10px; border-radius:20px; font-size:12px; font-weight:700; box-shadow:inset 0 1px 0 rgba(255,255,255,.4);}
.b-ok{background:var(--primary-soft); color:var(--primary);}
.b-warn{background:var(--warn-soft); color:var(--warn);}
.b-err{background:var(--err-soft); color:var(--err);}
.b-info{background:var(--info-soft); color:var(--info);}
.b-gray{background:var(--glass-soft); color:var(--sub);}
.tag{display:inline-block; padding:1px 8px; border-radius:6px; background:var(--glass-soft); font-size:12px; color:var(--sub); margin-right:6px;}
.empty{padding:40px 20px; text-align:center; color:var(--sub); font-size:13.5px;}
table{width:100%; border-collapse:collapse; font-size:13px;}
th{
  background:var(--glass-soft); color:var(--sub); text-align:left;
  padding:9px 10px; font-size:12.5px; border-bottom:1px solid var(--glass-line-soft);
}
td{padding:9px 10px; border-bottom:1px solid var(--glass-line-soft); vertical-align:middle;}
tr:hover td{background:var(--glass-soft);}
.muted{color:var(--sub); font-size:12.5px;}
.small{font-size:12.5px;}
.wrap{overflow-x:auto;}
/* ===== 模态（macOS 弹窗：背景模糊 + 强玻璃） ===== */
.overlay{
  position:fixed; inset:0; display:none; align-items:center; justify-content:center; z-index:60; padding:20px;
  background:rgba(12,18,30,.32);
  backdrop-filter:blur(10px) saturate(1.3); -webkit-backdrop-filter:blur(10px) saturate(1.3);
}
.overlay.show{display:flex;}
.dialog{
  background:var(--glass-strong); backdrop-filter:blur(var(--blur)) saturate(2.0);
  -webkit-backdrop-filter:blur(var(--blur)) saturate(2.0);
  border:1px solid var(--glass-line); border-radius:18px;
  width:100%; max-width:460px; max-height:88vh; overflow:auto; padding:22px 24px;
  box-shadow:var(--shadow-pop);
}
.dialog h3{font-size:16px; margin-bottom:14px;}
.dialog .d-actions{display:flex; gap:10px; margin-top:18px;}
.dialog .d-actions .btn{flex:1;}
.close-x{float:right; border:none; background:none; font-size:20px; color:var(--sub); line-height:1;}
/* ===== Toast ===== */
#toast{
  position:fixed; top:50%; left:50%; transform:translate(-50%,-50%);
  background:var(--glass-strong); backdrop-filter:blur(20px) saturate(1.6);
  -webkit-backdrop-filter:blur(20px) saturate(1.6);
  color:var(--ink); border:1px solid var(--glass-line);
  padding:10px 20px; border-radius:12px; font-size:13.5px; z-index:90; display:none;
  box-shadow:var(--shadow-pop); max-width:88vw;
}
#toast.show{display:block;}
#toast.ok{background:var(--primary); color:#fff; border-color:transparent;}
#toast.err{background:var(--err); color:#fff; border-color:transparent;}
/* ===== 底部移动导航（玻璃条） ===== */
.mnav{display:none;}
/* ===== 工作台 ===== */
.tabs{display:flex; gap:6px; border-bottom:1px solid var(--glass-line-soft); margin-bottom:16px;}
.tab-btn{
  border:none; background:none; padding:10px 18px; font-size:14.5px; font-weight:600;
  color:var(--sub); border-bottom:3px solid transparent; transition:color .15s ease;
}
.tab-btn.active{color:var(--primary); border-bottom-color:var(--primary);}
.pane{display:none;}
.pane.active{display:block;}
.gen-result{
  border:1px solid var(--glass-line); border-radius:var(--radius);
  background:var(--glass); backdrop-filter:blur(var(--blur)) saturate(1.8);
  -webkit-backdrop-filter:blur(var(--blur)) saturate(1.8);
  margin-top:16px; overflow:hidden; box-shadow:var(--shadow);
}
.gen-result .gr-head{display:flex; align-items:center; gap:10px; padding:12px 18px; border-bottom:1px solid var(--glass-line-soft); background:var(--glass-soft); flex-wrap:wrap;}
.gen-result .gr-body{padding:18px;}
.gen-result .gr-title{font-size:19px; font-weight:700; margin-bottom:10px;}
.gen-result .gr-text{font-size:15px; color:var(--ink); padding:0 1em;}
.gen-result .gr-text p{margin:0 0 14px; line-height:1.85;}
.gen-result .gr-text p:last-child{margin-bottom:0;}
.gen-loading{
  border:1px dashed var(--primary); border-radius:var(--radius);
  background:var(--primary-soft); padding:26px; text-align:center; color:var(--primary);
  font-size:13.5px; margin-top:16px; backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
}
.gen-progress{
  height:8px; border-radius:99px; background:var(--glass-soft); overflow:hidden;
  margin:14px auto 2px; max-width:360px;
  box-shadow:inset 0 0 0 1px rgba(20,44,82,.18), inset 0 1px 3px rgba(0,0,0,.08);
}
.gen-progress-bar{height:100%; border-radius:99px; background:linear-gradient(90deg,var(--primary),var(--info)); width:0%; transition:width .25s ease;}
.gen-progress-bar.anim{animation:genBarFlow 1.3s ease-in-out infinite;}
@keyframes genBarFlow{0%{margin-left:0; width:14%;}50%{width:72%;}100%{margin-left:100%; width:14%;}}
.spinner{width:14px; height:14px; border:2px solid rgba(255,255,255,.45); border-top-color:#fff; border-radius:50%; display:inline-block; vertical-align:-2px; margin-right:6px; animation:spin .7s linear infinite;}
@keyframes spin{to{transform:rotate(360deg);}}
.img-thumb{
  width:72px; height:72px; border-radius:10px; object-fit:cover; cursor:pointer;
  border:2px solid var(--glass-line); box-shadow:var(--shadow);
  transition:transform .14s ease, border-color .14s ease;
}
.img-thumb:hover{transform:scale(1.04);}
.img-thumb.sel{border-color:var(--primary);}
.img-thumb.off{opacity:.35; filter:grayscale(1);}
/* ===== 首页会员卡（macOS 蓝色渐变玻璃卡） ===== */
.member-hero{
  background:linear-gradient(135deg,var(--primary),var(--info) 55%,var(--accent));
  border-radius:18px; color:#fff; padding:24px 26px; display:flex; align-items:center; gap:20px; flex-wrap:wrap; margin-bottom:16px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.25), 0 14px 34px var(--primary-soft);
  position:relative; overflow:hidden;
}
.member-hero::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(120deg, rgba(255,255,255,.14), transparent 40%, rgba(255,255,255,.04));
}
.member-hero .mh-greet{flex:1 1 100%; position:relative; z-index:1; padding-bottom:8px; border-bottom:1px solid rgba(255,255,255,.2); margin-bottom:6px;}
.member-hero .mh-greet-hi{font-size:21px; font-weight:700; line-height:1.3;}
.member-hero .mh-greet-sub{font-size:12.5px; opacity:.85; margin-top:2px;}
.member-hero .mh-left{flex:1; min-width:220px; position:relative; z-index:1;}
.member-hero .mh-plan{font-size:13px; opacity:.85;}
.member-hero .mh-name{font-size:22px; font-weight:700; margin:2px 0 6px;}
.member-hero .mh-sub{font-size:12.5px; opacity:.8;}
.member-hero .mh-right{display:flex; flex-direction:column; gap:8px; align-items:flex-end; position:relative; z-index:1;}
.member-hero .days{font-size:34px; font-weight:700; line-height:1;}
.member-hero .days small{font-size:13px; font-weight:400; opacity:.85;}
.member-hero.expired{background:linear-gradient(135deg,#E03E3E,#8E1F1F); box-shadow:inset 0 1px 0 rgba(255,255,255,.25), 0 14px 34px rgba(200,40,40,.3);}
.member-hero.none{background:linear-gradient(135deg,#5B6472,#2A2F3A); box-shadow:inset 0 1px 0 rgba(255,255,255,.18), 0 14px 34px rgba(30,36,48,.3);}
.quick-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:14px;}
.quick-card{
  background:var(--glass); backdrop-filter:blur(var(--blur)) saturate(1.8);
  -webkit-backdrop-filter:blur(var(--blur)) saturate(1.8);
  border:1px solid var(--glass-line); border-radius:14px; padding:18px; cursor:pointer;
  box-shadow:var(--shadow);
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.quick-card:hover{border-color:rgba(20,44,82,.4); transform:translateY(-3px); box-shadow:var(--shadow-hover);}
.quick-card:active{transform:scale(.97);}
.quick-card .qc-ico{
  width:38px; height:38px; border-radius:11px; display:flex; align-items:center; justify-content:center;
  margin-bottom:10px; font-size:19px;
  background:var(--primary-soft); color:var(--primary);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.4);
}
.quick-card .qc-t{font-weight:700; font-size:14.5px;}
.quick-card .qc-d{font-size:12.5px; color:var(--sub); margin-top:4px;}
@media(max-width:820px){.quick-grid{grid-template-columns:1fr 1fr;}}
/* ===== 我的页 ===== */
.me-list{display:flex; flex-direction:column; gap:2px;}
.me-item{
  display:flex; align-items:center; gap:12px; padding:13px 10px; border:none; background:none;
  border-bottom:1px solid var(--glass-line-soft); font-size:14px; width:100%; text-align:left; color:var(--ink);
  border-radius:10px; transition:background .14s ease, color .14s ease;
}
.me-item:last-child{border-bottom:none;}
.me-item:hover{background:var(--glass-soft); color:var(--primary);}
.me-item .mi-arrow{margin-left:auto; color:var(--sub); opacity:.6; font-size:16px;}
.me-item .mi-status{font-size:12px;}
.skill-item{border:1px solid var(--glass-line-soft); border-radius:10px; padding:10px 14px; margin-bottom:8px; font-size:13px; cursor:pointer; background:var(--glass-soft); transition:border-color .14s ease;}
.skill-item:hover{border-color:var(--primary);}
.skill-item b{font-size:13.5px; display:block;}
/* ===== 编辑器（玻璃） ===== */
.ed-toolbar{
  display:flex; gap:6px; flex-wrap:wrap;
  border:1px solid var(--glass-line); border-bottom:none; border-radius:12px 12px 0 0;
  padding:8px 10px; background:var(--glass-soft);
  backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
}
.ed-toolbar button{border:1px solid var(--glass-line-soft); background:var(--glass-soft); border-radius:8px; padding:5px 10px; font-size:13px; transition:color .14s ease, border-color .14s ease;}
.ed-toolbar button:hover{border-color:var(--primary); color:var(--primary);}
.ed-body{
  border:1px solid var(--glass-line); border-radius:0 0 12px 12px;
  background:var(--glass); backdrop-filter:blur(var(--blur)) saturate(1.8);
  -webkit-backdrop-filter:blur(var(--blur)) saturate(1.8);
  min-height:300px; padding:18px; outline:none; font-size:15px; line-height:1.8;
}
.ed-body:focus{box-shadow:0 0 0 3px var(--primary-soft);}
.ed-body p{margin:0 0 16px; line-height:1.9;}
.ed-body p:last-child{margin-bottom:0;}
.ed-body img{margin:12px 0; border-radius:12px;}

.ed-body img{max-width:100%; border-radius:10px; margin:8px 0; box-shadow:var(--shadow);}
/* ===== 记录行 ===== */
.rec-row{display:flex; align-items:center; gap:12px; padding:12px 8px; border-bottom:1px solid var(--glass-line-soft); flex-wrap:wrap; border-radius:10px; transition:background .14s ease;}
.rec-row:hover{background:var(--glass-soft);}
.rec-row:last-child{border-bottom:none;}
.rec-row .rr-t{font-weight:700; font-size:14px; flex:1; min-width:200px;}
.rec-row:hover .rr-t{color:var(--primary);}
.rec-row .rr-m{font-size:12px; color:var(--sub);}
.rec-meta{display:flex; gap:6px; align-items:center; flex-wrap:wrap; font-size:12px; color:var(--sub);}
/* ===== 管理后台 ===== */
.stat-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:14px;}
.stat-card{
  background:var(--glass); backdrop-filter:blur(var(--blur)) saturate(1.8);
  -webkit-backdrop-filter:blur(var(--blur)) saturate(1.8);
  border:1px solid var(--glass-line); border-radius:14px; padding:16px 18px; box-shadow:var(--shadow);
  transition:transform .16s ease, box-shadow .16s ease;
}
.stat-card:hover{transform:translateY(-2px); box-shadow:var(--shadow-hover);}
.stat-card .sc-num{font-size:26px; font-weight:700; background:linear-gradient(135deg,var(--primary),var(--info)); -webkit-background-clip:text; background-clip:text; color:transparent;}
.stat-card .sc-lb{font-size:12.5px; color:var(--sub); margin-top:2px;}
@media(max-width:820px){.stat-grid{grid-template-columns:1fr 1fr;}}
.build-tag{position:fixed;right:8px;bottom:6px;z-index:9999;font-size:11px;color:#99a;background:rgba(255,255,255,.85);border-radius:6px;padding:1px 8px;}
/* 遇到问题卡片：桌面端固定 260px 宽 */
.home-tips .tips-fix{flex:0 0 260px;}
/* ===== 移动端 ===== */
@media(max-width:767px){
  .sidebar{display:none;}
  .main{margin-left:0;}
  .content{padding:16px 14px 84px;}
  .topbar{padding:calc(10px + env(safe-area-inset-top, 0px)) 14px 10px;}
  .mnav{
    display:flex; position:fixed; bottom:0; left:0; right:0; height:60px; z-index:40;
    background:var(--glass-strong); backdrop-filter:blur(28px) saturate(2.0);
    -webkit-backdrop-filter:blur(28px) saturate(2.0);
    border-top:1px solid var(--glass-line);
    box-shadow:0 -6px 20px rgba(15,30,55,.1);
  }
  .mnav .m-item{
    flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px;
    font-size:10.5px; color:var(--sub); border:none; background:none; transition:color .14s ease;
  }
  .mnav .m-item.active{color:var(--primary); font-weight:700;}
  .mnav .m-item svg{width:20px; height:20px;}
  .member-hero{flex-direction:column; align-items:flex-start;}
  .home-tips{flex-direction:column;}
  .home-tips > .card{flex:1 1 100%; width:100%;}
  /* 遇到问题卡片：手机端重置高度，标题+按钮横排紧凑一行 */
  .home-tips .tips-fix{flex:1 1 auto; height:auto; padding:10px 12px; flex-direction:row; align-items:center; justify-content:space-between;}
  .home-tips .tips-fix h3{margin:0; font-size:14px;}
  .home-tips .tips-fix .btn{width:auto; min-width:96px;}
  .main{width:100%;}
  .grow{min-width:0;}
  .build-tag{bottom:64px; right:10px;}
  .member-hero .mh-right{align-items:flex-start;}
  .hide-m{display:none;}
  /* 卡密表：手机端转卡片横排（小字、字段左标签右值，一页展示） */
  #cardTable thead{display:none;}
  #cardTable,#cardTable tbody,#cardTable tr,#cardTable td{display:block;width:100%;box-sizing:border-box;}
  #cardTable tr{border:1px solid var(--glass-line);border-radius:12px;padding:6px 10px;margin-bottom:10px;background:var(--glass-soft);}
  #cardTable td{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:5px 2px;border:none;font-size:12.5px;}
  #cardTable td::before{content:attr(data-label);color:var(--sub);font-size:11.5px;min-width:52px;flex-shrink:0;}
  #cardTable td[data-label="卡号"]{font-size:11.5px;word-break:break-all;}
  #cardTable td[data-label="操作"]{justify-content:flex-end;}
  /* 用户表：手机端转卡片横排（小字、一页展示完） */
  #userTable thead{display:none;}
  #userTable,#userTable tbody,#userTable tr,#userTable td{display:block;width:100%;box-sizing:border-box;}
  #userTable tr{border:1px solid var(--glass-line);border-radius:12px;padding:6px 10px;margin-bottom:10px;background:var(--glass-soft);}
  #userTable td{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:4px 2px;border:none;font-size:12.5px;}
  #userTable td::before{content:attr(data-label);color:var(--sub);font-size:11.5px;min-width:52px;flex-shrink:0;}
  #userTable td[data-label="会员到期"]{font-size:12px;}
  #userTable td[data-label="绑定设备"]{font-size:11.5px;word-break:break-all;}
  #userTable td[data-label="操作"]{justify-content:flex-end;}
}

/* ===== 质量卡片（发布质检） ===== */
.quality-card { margin: 12px 0; background: var(--info-soft); border-radius: 12px; padding: 12px 16px; backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border: 1px solid var(--glass-line-soft); }
.quality-card .qc-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; }
.quality-card .qc-verdict { background: var(--primary); color: #fff; font-size: 12px; border-radius: 999px; padding: 2px 10px; }
.quality-card .qc-metrics { display: flex; gap: 18px; flex-wrap: wrap; font-size: 13px; color: var(--sub); margin-bottom: 6px; }
.quality-card .qc-metrics b { color: var(--ink); }
.quality-card .qc-metrics b.qc-ok { color: #16a34a; }
.quality-card .qc-metrics b.qc-mid { color: #d97706; }
.quality-card .qc-metrics b.qc-bad { color: #dc2626; }
.quality-card .qc-issues { border-top: 1px dashed var(--glass-line-soft); padding-top: 8px; font-size: 13px; }
.quality-card .qc-item { margin: 6px 0; }
.quality-card .qc-sug { color: var(--sub); font-size: 12px; margin-top: 2px; }

/* ===== 手机预览框（保持结构） ===== */
.phone-frame { width: 100%; max-width: 360px; margin: 0 auto; background: var(--glass-soft); border-radius: 24px; padding: 10px; border: 1px solid var(--glass-line); box-shadow: var(--shadow); }
.pf-status { display: flex; justify-content: space-between; padding: 4px 14px 8px; font-size: 12px; color: var(--sub); }
.pf-title { font-size: 17px; font-weight: 700; line-height: 1.4; padding: 4px 14px 10px; color: var(--ink); }
.pf-body { background: var(--glass); border-radius: 14px; padding: 16px; max-height: 480px; overflow-y: auto; font-size: 14px; line-height: 1.7; color: var(--ink); }
.pf-body img { max-width: 100% !important; height: auto; border-radius: 8px; }

/* ===== 深色模式：用户名 chip 深色实底保证可读 ===== */
@media (prefers-color-scheme: dark){
  .chip{background:rgba(18,24,34,.72); border:1px solid rgba(255,255,255,.16); color:#F1F4F9;}
  .hot-row{background:rgba(255,255,255,.06); box-shadow:0 1px 3px rgba(0,0,0,.3);}
  .hot-title{color:var(--ink);}
  .hot-rank{color:var(--sub);}
  .hot-src-link{color:var(--primary);}
}

/* ===== 核心句标注：关键句加粗/变色 ===== */
.kw-blue{font-weight:700; color:var(--primary-deep);}
.kw-red{font-weight:700; color:var(--err);}
.gen-result .gr-text .kw-blue, .gen-result .gr-text .kw-red{font-weight:700;}

/* ===== 公众号排版优化：重点段色块 / 转折分隔符 / 段落呼吸感 ===== */
.kw-box{background:#F5F7FA; border-left:4px solid #E03E3E; padding:12px 16px; border-radius:6px; margin:16px 0; line-height:1.75;}
.kw-divider{text-align:center; color:#C8CDD6; margin:20px 0; letter-spacing:8px; font-size:14px;}
/* 爆款标题卡片：浅色模式下也要有清晰的框选效果（不依赖纯白透明底） */
.title-chip{display:block; width:100%; text-align:left; border:1.5px solid var(--line); background:var(--glass-soft); padding:9px 12px; margin-bottom:8px; border-radius:10px; font-size:13.5px; line-height:1.5; color:var(--ink); transition:border-color .14s ease, background .14s ease, box-shadow .14s ease;}
.title-chip:hover{border-color:var(--primary); background:var(--primary-soft); box-shadow:0 2px 10px rgba(15,30,55,.08);}
.title-chip.sel{border-color:var(--primary); background:var(--primary-soft); box-shadow:0 2px 12px rgba(15,30,55,.10);}
.gen-result .gr-text p, .ed-body p, #edBody p, .pf-body p{margin:12px 0; line-height:1.75;}

/* ===== 热点选题（内部版） ===== */
.hot-row { display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; margin-bottom: 8px; background: var(--card, #fff); border-radius: 10px; box-shadow: 0 1px 3px rgba(0,0,0,0.06); }
.hot-row:last-child { margin-bottom: 0; }
.btn-bookmark { background: #fff; color: var(--primary); border: 1px solid var(--primary); }
.btn-bookmark:active { background: var(--primary-soft); }
.btn-bookmarked { background: var(--primary); color: #fff; border: 1px solid var(--primary); }
.hot-rank { flex: 0 0 42px; text-align: center; font-size: 13px; font-weight: 800; color: var(--sub, #7a8299); padding-top: 2px; }
.hot-rank.hot-top { color: var(--warn, #d97706); font-size: 15px; }
.hot-body { flex: 1; min-width: 0; }
.hot-title { font-size: 14.5px; font-weight: 700; line-height: 1.5; }
.hot-actions { display: flex; gap: 6px; align-items: center; flex-shrink: 0; }
@media (max-width: 640px) {
  .hot-rank { flex-basis: 28px; font-size: 11px; }
  .hot-title { font-size: 14px; }
  .rec-meta { flex-wrap: wrap; gap: 4px; }
  .hot-row > span:last-child { flex-direction: column; gap: 4px; }
  .hot-row > span:last-child .btn { font-size: 12px; width: 72px; height: 30px; padding: 0; text-align: center; line-height: 28px; box-sizing: border-box; border-radius: 6px; border: 1px solid #142C52; }
}

/* 热点统计卡 */
.hot-stats { margin-bottom: 10px; }
.hs-card {
  background: linear-gradient(135deg, var(--primary) 0%, var(--info) 100%);
  color: #fff; border-radius: 12px; padding: 14px 16px;
  display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
}
.hs-num { font-size: 28px; font-weight: 700; line-height: 1; }
.hs-label { font-size: 12px; opacity: 0.85; }
.hs-chips { display: flex; gap: 6px; flex-wrap: wrap; margin-left: auto; }
.hs-chip {
  background: rgba(255,255,255,0.18); border-radius: 999px;
  padding: 3px 10px; font-size: 11px; color: #fff;
}
.hot-src-link {
  color: var(--pri); text-decoration: none; font-size: 11px;
  border-bottom: 1px dashed var(--pri);
}
.hot-src-link:active { opacity: 0.7; }

/* ===== 热点卡片深色模式覆盖（必须放在基础样式后面） ===== */
@media (prefers-color-scheme: dark){
  .hot-row{background:rgba(255,255,255,.06) !important; box-shadow:0 1px 3px rgba(0,0,0,.3) !important;}
  .hot-title{color:var(--ink) !important;}
  .hot-rank{color:var(--sub) !important;}
  .hot-src-link{color:var(--primary-deep) !important;}
  .hot-stats .hs-num{color:#fff;}
}