/* =========================================================
   老沈说售后 · 个人品牌网站
   深色主题 + 渐变光效 + 微交互  (无外部依赖)
   ========================================================= */
:root{
  --bg:#070b16; --bg-2:#0a0f1f; --surface:#101729; --surface-2:#15203a;
  --border:rgba(255,255,255,.09); --border-strong:rgba(255,255,255,.16);
  --text:#e6edf7; --text-dim:#9fb0c8; --text-mute:#64748b;
  --brand:#22d3ee; --brand-2:#3b82f6; --violet:#7c3aed; --red:#ff3b5c; --red-soft:#ff7a45;
  --grad:linear-gradient(135deg,#3b82f6 0%,#22d3ee 100%);
  --grad-red:linear-gradient(135deg,#ff3b5c 0%,#ff7a45 100%);
  --shadow:0 10px 40px rgba(0,0,0,.45);
  --radius:16px; --radius-sm:10px;
  --nav-h:68px; --maxw:1180px;
  --ease:cubic-bezier(.22,.61,.36,1);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:"PingFang SC","Microsoft YaHei","Segoe UI",system-ui,-apple-system,sans-serif;
  background:var(--bg); color:var(--text); line-height:1.75; font-size:15px;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
a{color:inherit; text-decoration:none}
img{max-width:100%; display:block}
::selection{background:rgba(34,211,238,.3); color:#fff}

/* ---------- 背景光效（纯 CSS，零开销） ---------- */
.bg-fx{position:fixed; inset:0; z-index:-2; overflow:hidden; pointer-events:none;
  background:
    radial-gradient(1100px 700px at 12% -8%, rgba(59,130,246,.20), transparent 60%),
    radial-gradient(900px 700px at 100% 0%, rgba(124,58,237,.18), transparent 55%),
    radial-gradient(800px 600px at 50% 120%, rgba(34,211,238,.12), transparent 60%),
    var(--bg);
}
.bg-fx::after{content:""; position:absolute; inset:0;
  background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:46px 46px; mask:radial-gradient(circle at 50% 30%,#000 0%,transparent 75%);
  opacity:.5;
}
.orb{position:fixed; border-radius:50%; filter:blur(70px); z-index:-1; pointer-events:none; opacity:.5; animation:float 14s var(--ease) infinite alternate}
.orb.a{width:380px;height:380px;background:#1d4ed8;top:-80px;left:-60px}
.orb.b{width:320px;height:320px;background:#7c3aed;top:40%;right:-80px;animation-delay:-4s}
.orb.c{width:300px;height:300px;background:#0e7490;bottom:-60px;left:30%;animation-delay:-8s}
@keyframes float{to{transform:translate3d(40px,30px,0) scale(1.12)}}

/* ---------- 布局 ---------- */
.wrap{width:100%; max-width:var(--maxw); margin:0 auto; padding:0 24px}
section{padding:96px 0; position:relative}
.eyebrow{display:inline-block; font-size:13px; letter-spacing:3px; text-transform:uppercase;
  color:var(--brand); font-weight:700; margin-bottom:14px;
  padding:5px 14px; border:1px solid rgba(34,211,238,.35); border-radius:999px;
  background:rgba(34,211,238,.06)}
.h2{font-size:34px; line-height:1.25; font-weight:800; letter-spacing:.5px; margin-bottom:14px}
.h2 .accent{background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent}
.sec-sub{color:var(--text-dim); max-width:640px; margin-bottom:44px; font-size:15.5px}
.center{text-align:center}
.center .sec-sub{margin-left:auto; margin-right:auto}

/* ---------- 按钮（渐变描边流动） ---------- */
.btn{display:inline-flex; align-items:center; gap:8px; padding:13px 26px; border-radius:999px;
  font-weight:700; font-size:14.5px; cursor:pointer; border:1px solid transparent;
  transition:transform .25s var(--ease), box-shadow .25s var(--ease); position:relative; white-space:nowrap}
.btn-primary{color:#04121f; background:var(--grad); box-shadow:0 8px 26px rgba(34,211,238,.35)}
.btn-primary:hover{transform:translateY(-3px); box-shadow:0 14px 36px rgba(34,211,238,.5)}
.btn-ghost{color:var(--text); border-color:var(--border-strong); background:rgba(255,255,255,.03)}
.btn-ghost:hover{transform:translateY(-3px); border-color:var(--brand); color:#fff; box-shadow:0 8px 26px rgba(34,211,238,.18)}
.btn-red{color:#fff; background:var(--grad-red); box-shadow:0 8px 26px rgba(255,59,92,.32)}
.btn-red:hover{transform:translateY(-3px); box-shadow:0 14px 36px rgba(255,59,92,.5)}
.btn[disabled]{opacity:.6; cursor:not-allowed; transform:none!important}

/* ---------- 顶部导航 ---------- */
.nav{position:fixed; top:0; left:0; right:0; height:var(--nav-h); z-index:1000;
  display:flex; align-items:center; transition:background .3s, backdrop-filter .3s, border-color .3s;
  border-bottom:1px solid transparent}
.nav.scrolled{background:rgba(7,11,22,.72); backdrop-filter:blur(16px); border-bottom-color:var(--border)}
.nav .wrap{display:flex; align-items:center; justify-content:space-between}
.logo{display:flex; align-items:center; gap:11px; font-weight:800; font-size:18px; letter-spacing:.5px}
.logo .mark{width:34px;height:34px;border-radius:10px; background:var(--grad); position:relative;
  box-shadow:0 0 18px rgba(34,211,238,.5); flex:none}
.logo .mark::after{content:""; position:absolute; inset:7px; border-radius:5px;
  border:2px solid rgba(4,18,31,.85)}
.logo .mark::before{content:""; position:absolute; left:50%; top:6px; width:2px; height:14px; background:var(--red);
  transform:translateX(-50%); border-radius:2px; box-shadow:0 0 8px var(--red)}
.logo small{display:block; font-size:11px; font-weight:500; color:var(--text-mute); letter-spacing:2px}
.nav-links{display:flex; align-items:center; gap:6px}
.nav-links a{padding:9px 15px; border-radius:9px; font-size:14.5px; color:var(--text-dim);
  transition:color .2s, background .2s; position:relative}
.nav-links a:hover{color:#fff; background:rgba(255,255,255,.05)}
.nav-links a.active{color:#fff}
.nav-links a.active::after{content:""; position:absolute; left:15px; right:15px; bottom:3px; height:2px;
  background:var(--grad); border-radius:2px}
.nav-cta{margin-left:8px}
.hamburger{display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:8px}
.hamburger span{width:24px; height:2px; background:var(--text); border-radius:2px; transition:.3s}
.hamburger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.hamburger.open span:nth-child(2){opacity:0}
.hamburger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.mobile-menu{position:fixed; inset:var(--nav-h) 0 0 0; background:rgba(7,11,22,.97); backdrop-filter:blur(14px);
  z-index:999; display:none; flex-direction:column; padding:20px 24px; gap:6px}
.mobile-menu.open{display:flex}
.mobile-menu a{padding:14px; font-size:17px; border-radius:10px; color:var(--text-dim)}
.mobile-menu a:hover{background:rgba(255,255,255,.05); color:#fff}

/* ---------- Hero ---------- */
.hero{min-height:100vh; display:flex; align-items:center; padding-top:var(--nav-h); position:relative}
.hero-grid{display:grid; grid-template-columns:1.15fr .85fr; gap:48px; align-items:center}
.hero h1{font-size:52px; line-height:1.18; font-weight:900; letter-spacing:1px; margin:18px 0 20px}
.hero h1 .grad{background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent}
.hero h1 .red{background:var(--grad-red); -webkit-background-clip:text; background-clip:text; color:transparent}
.type-line{font-size:19px; color:var(--text-dim); min-height:30px; margin-bottom:26px}
.type-line .caret{display:inline-block; width:2px; height:22px; background:var(--brand); margin-left:3px;
  vertical-align:-3px; animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.hero p.lead{color:var(--text-dim); max-width:520px; margin-bottom:32px; font-size:16px}
.hero-cta{display:flex; gap:14px; flex-wrap:wrap}
.hero-stats{display:grid; grid-template-columns:repeat(2,1fr); gap:16px}
.stat-card{background:linear-gradient(160deg,var(--surface),var(--surface-2));
  border:1px solid var(--border); border-radius:var(--radius); padding:22px; position:relative; overflow:hidden}
.stat-card::before{content:""; position:absolute; top:-40px; right:-40px; width:120px; height:120px;
  background:radial-gradient(circle,var(--brand),transparent 70%); opacity:.18}
.stat-card .num{font-size:38px; font-weight:900; background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent}
.stat-card .num.red{background:var(--grad-red); -webkit-background-clip:text; background-clip:text; color:transparent}
.stat-card .lbl{color:var(--text-dim); font-size:13.5px; margin-top:4px}

/* ---------- 关于老沈 ---------- */
.about-grid{display:grid; grid-template-columns:.9fr 1.1fr; gap:40px; align-items:start}
.about-card{background:linear-gradient(160deg,var(--surface),var(--surface-2));
  border:1px solid var(--border); border-radius:var(--radius); padding:30px; position:relative; overflow:hidden}
.about-card .avatar{width:84px;height:84px;border-radius:20px; background:var(--grad); display:flex;
  align-items:center; justify-content:center; font-size:34px; font-weight:900; color:#04121f; margin-bottom:18px;
  box-shadow:0 0 26px rgba(34,211,238,.4)}
.about-card h3{font-size:22px; margin-bottom:6px}
.about-card .role{color:var(--brand); font-size:14px; margin-bottom:16px}
.about-card p{color:var(--text-dim); font-size:14.5px; margin-bottom:14px}
.tag-row{display:flex; flex-wrap:wrap; gap:9px; margin:16px 0}
.tag{background:rgba(34,211,238,.08); border:1px solid rgba(34,211,238,.3); color:var(--brand);
  padding:6px 13px; border-radius:999px; font-size:13px; font-weight:600}
.timeline{margin-top:8px}
.tl-item{position:relative; padding:0 0 20px 26px; border-left:2px solid var(--border)}
.tl-item:last-child{padding-bottom:0}
.tl-item::before{content:""; position:absolute; left:-7px; top:4px; width:12px; height:12px; border-radius:50%;
  background:var(--grad); box-shadow:0 0 10px var(--brand)}
.tl-time{font-size:12.5px; color:var(--brand); font-weight:700}
.tl-head{font-size:15px; font-weight:700; color:var(--text); margin:2px 0}
.tl-desc{font-size:13.5px; color:var(--text-mute)}
.qr-box{margin-top:18px; background:rgba(255,255,255,.04); border:1px dashed var(--border-strong);
  border-radius:12px; padding:18px; text-align:center}
.qr-img{width:140px;height:140px;margin:0 auto 10px; border-radius:10px; object-fit:cover; display:block; border:1px solid var(--border-strong); background:#fff}
.qr-box .qr{width:120px;height:120px;margin:0 auto 10px; border-radius:10px; display:flex; align-items:center;
  justify-content:center; background:repeating-conic-gradient(#0b1220 0 25%, #1b2740 0 50%) 50%/14px 14px;
  border:1px solid var(--border-strong)}
.qr-box .qr span{background:var(--surface); padding:6px 10px; border-radius:6px; font-size:11px; color:var(--text-mute)}
.qr-box p{font-size:12.5px; color:var(--text-mute)}

/* ---------- 手册亮点 / 模块网格 ---------- */
.mod-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px}
.mod-card{background:linear-gradient(160deg,var(--surface),var(--surface-2)); border:1px solid var(--border);
  border-radius:var(--radius); padding:22px; display:flex; gap:16px; align-items:center;
  transition:transform .3s var(--ease), border-color .3s, box-shadow .3s; position:relative; overflow:hidden}
.mod-card:hover{transform:translateY(-5px); border-color:rgba(34,211,238,.5); box-shadow:0 16px 40px rgba(0,0,0,.4)}
.ring{--p:0; width:62px; height:62px; border-radius:50%; flex:none; position:relative;
  background:conic-gradient(var(--brand) calc(var(--p)*1%), rgba(255,255,255,.08) 0);
  display:flex; align-items:center; justify-content:center}
.ring::before{content:""; position:absolute; inset:6px; border-radius:50%; background:var(--surface)}
.ring b{position:relative; font-size:14px; font-weight:800; color:var(--text)}
.mod-card .m-name{font-size:15.5px; font-weight:700; line-height:1.4}
.mod-card .m-meta{font-size:12.5px; color:var(--text-mute); margin-top:3px}
.callout{border-radius:12px; padding:16px 18px; margin:26px 0; border-left:4px solid; font-size:14.5px; line-height:1.8}
.callout-danger{background:rgba(255,59,92,.08); border-color:var(--red); color:#ffb3c0}
.callout-info{background:rgba(34,211,238,.07); border-color:var(--brand); color:#bdf3fb}
.callout b{color:#fff}

/* ---------- 经验分享卡片 ---------- */
.post-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px}
.post-card{background:linear-gradient(160deg,var(--surface),var(--surface-2)); border:1px solid var(--border);
  border-radius:var(--radius); overflow:hidden; display:flex; flex-direction:column;
  transition:transform .3s var(--ease), border-color .3s, box-shadow .3s}
.post-card:hover{transform:translateY(-6px); border-color:rgba(34,211,238,.5); box-shadow:0 18px 44px rgba(0,0,0,.45)}
.post-cover{height:158px; position:relative; overflow:hidden; display:flex; align-items:flex-end; padding:16px}
.post-cover .pc-tag{position:relative; z-index:2; background:rgba(7,11,22,.7); backdrop-filter:blur(6px);
  color:var(--brand); font-size:12px; font-weight:700; padding:5px 12px; border-radius:999px; border:1px solid rgba(34,211,238,.35)}
.post-cover .pc-glow{position:absolute; inset:0; opacity:.9}
.post-body{padding:18px 20px 20px; display:flex; flex-direction:column; flex:1}
.post-body h3{font-size:16.5px; line-height:1.5; margin-bottom:10px}
.post-body p{color:var(--text-dim); font-size:13.5px; flex:1; margin-bottom:14px}
.post-foot{display:flex; align-items:center; justify-content:space-between; font-size:12.5px; color:var(--text-mute)}
.post-foot .read{color:var(--brand); font-weight:700; display:inline-flex; align-items:center; gap:5px}
.post-foot .read.pending{color:var(--text-mute); font-weight:500}
.pending-badge{display:inline-block; font-size:11px; color:var(--red-soft); border:1px solid rgba(255,122,69,.4);
  background:rgba(255,122,69,.08); padding:2px 9px; border-radius:999px}

/* ---------- 表单（留言 / 线索） ---------- */
.form-grid{display:grid; grid-template-columns:1fr 1fr; gap:46px; align-items:start}
.panel{background:linear-gradient(160deg,var(--surface),var(--surface-2)); border:1px solid var(--border);
  border-radius:var(--radius); padding:28px}
.panel h3{font-size:20px; margin-bottom:6px}
.panel .ph{color:var(--text-dim); font-size:13.5px; margin-bottom:20px}
.field{margin-bottom:16px}
.field label{display:block; font-size:13.5px; color:var(--text-dim); margin-bottom:7px}
.field label .req{color:var(--red)}
.field input, .field textarea, .field select{width:100%; padding:12px 14px; border-radius:10px;
  background:rgba(7,11,22,.6); border:1px solid var(--border); color:var(--text); font-size:14.5px; font-family:inherit;
  transition:border-color .2s, box-shadow .2s, background .2s}
.field input:focus, .field textarea:focus, .field select:focus{outline:none; border-color:var(--brand);
  box-shadow:0 0 0 3px rgba(34,211,238,.15); background:rgba(7,11,22,.85)}
.field textarea{resize:vertical; min-height:96px}
.field select{appearance:none; cursor:pointer}
.hp{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden}
.form-note{font-size:12.5px; color:var(--text-mute); margin-top:6px}
.form-ok{display:none; align-items:center; gap:8px; margin-top:14px; padding:12px 14px; border-radius:10px;
  background:rgba(34,211,238,.1); border:1px solid rgba(34,211,238,.35); color:var(--brand); font-size:14px}
.form-ok.show{display:flex}

/* 留言展示 */
.msg-list{margin-top:8px; display:flex; flex-direction:column; gap:12px; max-height:520px; overflow:auto; padding-right:4px}
.msg-item{background:rgba(7,11,22,.5); border:1px solid var(--border); border-radius:12px; padding:14px 16px}
.msg-item .m-top{display:flex; align-items:center; gap:10px; margin-bottom:6px}
.msg-item .m-avatar{width:32px;height:32px;border-radius:50%; background:var(--grad); color:#04121f;
  font-weight:800; font-size:13px; display:flex; align-items:center; justify-content:center; flex:none}
.msg-item .m-name{font-weight:700; font-size:14px}
.msg-item .m-time{font-size:11.5px; color:var(--text-mute); margin-left:auto}
.msg-item .m-text{color:var(--text-dim); font-size:14px; line-height:1.7; word-break:break-word}
.msg-empty{color:var(--text-mute); font-size:13.5px; text-align:center; padding:24px 0}

/* ---------- Footer ---------- */
.footer{border-top:1px solid var(--border); padding:54px 0 30px; background:rgba(7,11,22,.6)}
.footer-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:36px; margin-bottom:36px}
.footer h4{font-size:14px; color:var(--text); margin-bottom:14px; letter-spacing:1px}
.footer a, .footer p{color:var(--text-mute); font-size:13.5px; display:block; margin-bottom:9px; transition:color .2s}
.footer a:hover{color:var(--brand)}
.footer .desc{color:var(--text-dim); font-size:14px; max-width:360px; margin:12px 0}
.footer-bottom{border-top:1px solid var(--border); padding-top:22px; display:flex; justify-content:space-between;
  flex-wrap:wrap; gap:10px; color:var(--text-mute); font-size:12.5px}

/* ---------- Toast ---------- */
.toast{position:fixed; bottom:28px; left:50%; transform:translateX(-50%) translateY(20px); z-index:2000;
  background:linear-gradient(160deg,var(--surface-2),var(--surface)); border:1px solid var(--border-strong);
  color:var(--text); padding:13px 22px; border-radius:12px; box-shadow:var(--shadow); font-size:14px;
  opacity:0; pointer-events:none; transition:opacity .3s, transform .3s; display:flex; align-items:center; gap:9px}
.toast.show{opacity:1; transform:translateX(-50%) translateY(0)}
.toast .dot{width:8px;height:8px;border-radius:50%; background:var(--brand); box-shadow:0 0 10px var(--brand)}

/* ---------- 滚动揭示 ---------- */
.reveal{opacity:0; transform:translateY(26px); transition:opacity .7s var(--ease), transform .7s var(--ease)}
.reveal.in{opacity:1; transform:none}
.reveal.d1{transition-delay:.08s}.reveal.d2{transition-delay:.16s}.reveal.d3{transition-delay:.24s}.reveal.d4{transition-delay:.32s}

/* =========================================================
   手册阅读页 manual.html
   ========================================================= */
.manual-page{padding-top:var(--nav-h)}
.mlayout{display:grid; grid-template-columns:280px 1fr; gap:0; min-height:calc(100vh - var(--nav-h))}
.msidebar{position:sticky; top:var(--nav-h); align-self:start; height:calc(100vh - var(--nav-h)); overflow-y:auto;
  border-right:1px solid var(--border); padding:20px 14px; background:rgba(10,15,31,.5)}
.msidebar h4{font-size:12px; letter-spacing:2px; text-transform:uppercase; color:var(--text-mute); margin:6px 8px 12px}
.m-nav-item{display:flex; align-items:center; gap:10px; padding:10px 12px; border-radius:10px; cursor:pointer;
  font-size:13.5px; color:var(--text-dim); border:1px solid transparent; transition:.2s; margin-bottom:4px}
.m-nav-item:hover{background:rgba(255,255,255,.04); color:#fff}
.m-nav-item.active{background:rgba(34,211,238,.1); border-color:rgba(34,211,238,.35); color:#fff}
.m-nav-item .mn-num{width:26px;height:26px;border-radius:7px; background:rgba(255,255,255,.06); flex:none;
  display:flex; align-items:center; justify-content:center; font-weight:800; font-size:12px; color:var(--brand)}
.m-nav-item .mn-score{margin-left:auto; font-size:11px; color:var(--text-mute)}
.mcontent{padding:26px 30px 120px}
.mtopbar{position:sticky; top:var(--nav-h); z-index:50; background:rgba(7,11,22,.8); backdrop-filter:blur(12px);
  padding:14px 30px; border-bottom:1px solid var(--border); display:flex; gap:14px; align-items:center; flex-wrap:wrap}
.msearch{flex:1; min-width:200px; position:relative}
.msearch input{width:100%; padding:11px 14px 11px 40px; border-radius:10px; background:rgba(7,11,22,.6);
  border:1px solid var(--border); color:var(--text); font-size:14px}
.msearch input:focus{outline:none; border-color:var(--brand)}
.msearch::before{content:""; position:absolute; left:14px; top:50%; width:14px;height:14px; transform:translateY(-50%);
  border:2px solid var(--text-mute); border-radius:50%; opacity:.7}
.msearch::after{content:""; position:absolute; left:24px; top:58%; width:7px;height:2px; background:var(--text-mute); transform:rotate(45deg); opacity:.7}
.filters{display:flex; gap:8px; flex-wrap:wrap}
.chip{padding:8px 14px; border-radius:999px; border:1px solid var(--border); background:rgba(255,255,255,.03);
  color:var(--text-dim); font-size:13px; cursor:pointer; transition:.2s; white-space:nowrap}
.chip:hover{color:#fff; border-color:var(--border-strong)}
.chip.active{background:var(--grad); color:#04121f; border-color:transparent; font-weight:700}
.chip.red.active{background:var(--grad-red); color:#fff}

.mod-block{margin-bottom:40px; scroll-margin-top:120px}
.mod-head{display:flex; align-items:center; gap:14px; margin:8px 0 20px; padding-bottom:14px; border-bottom:2px solid var(--border)}
.mod-head .mh-num{width:42px;height:42px;border-radius:11px; background:var(--grad); color:#04121f; flex:none;
  display:flex; align-items:center; justify-content:center; font-weight:900; font-size:18px}
.mod-head .mh-title{font-size:21px; font-weight:800}
.mod-head .mh-score{margin-left:auto; background:rgba(34,211,238,.1); color:var(--brand); padding:6px 16px;
  border-radius:999px; font-weight:800; font-size:14px; border:1px solid rgba(34,211,238,.3)}

.chk-card{background:linear-gradient(160deg,var(--surface),var(--surface-2)); border:1px solid var(--border);
  border-radius:14px; padding:16px 18px; margin-bottom:12px; display:flex; gap:14px; align-items:flex-start;
  transition:border-color .25s, transform .25s, box-shadow .25s; position:relative}
.chk-card:hover{border-color:rgba(34,211,238,.4); transform:translateX(3px)}
.chk-card.scored-pass{border-color:rgba(34,197,94,.5)}
.chk-card.scored-fail{border-color:rgba(255,59,92,.5)}
.chk-id{font-weight:800; color:var(--brand); font-size:14px; min-width:52px; flex:none; padding-top:2px}
.chk-main{flex:1}
.chk-content{font-size:14.5px; line-height:1.6}
.chk-tags{display:flex; flex-wrap:wrap; gap:7px; margin-top:10px}
.ctag{font-size:11px; padding:3px 9px; border-radius:6px; font-weight:600; white-space:nowrap}
.ctag.method{background:rgba(59,130,246,.14); color:#93c5fd}
.ctag.score{background:rgba(34,197,94,.14); color:#86efac}
.ctag.level-A{background:rgba(255,59,92,.16); color:#ffb3c0}
.ctag.level-B{background:rgba(255,122,69,.14); color:#ffc9a8}
.ctag.level-C{background:rgba(34,197,94,.14); color:#86efac}
.ctag.redline{background:var(--grad-red); color:#fff}
.ctag.law{background:rgba(124,58,237,.16); color:#c4b5fd}
.chk-opts{display:flex; flex-direction:column; gap:6px; flex:none}
.chk-opts button{padding:7px 14px; border-radius:9px; border:1px solid var(--border); background:rgba(255,255,255,.03);
  color:var(--text-dim); font-size:13px; cursor:pointer; transition:.2s; white-space:nowrap}
.chk-opts button:hover{color:#fff; border-color:var(--border-strong)}
.chk-opts button.pass.on{background:#22c55e; color:#04121f; border-color:#22c55e; font-weight:700}
.chk-opts button.fail.on{background:var(--red); color:#fff; border-color:var(--red); font-weight:700}
.chk-opts button.na.on{background:var(--text-mute); color:#04121f; border-color:var(--text-mute); font-weight:700}
mark{background:rgba(34,211,238,.35); color:#fff; border-radius:3px; padding:0 2px}
.no-result{text-align:center; color:var(--text-mute); padding:50px 0; display:none}

.score-panel{position:fixed; bottom:22px; right:22px; z-index:200; background:linear-gradient(160deg,var(--surface-2),var(--surface));
  border:1px solid var(--border-strong); border-radius:14px; padding:16px 22px; box-shadow:var(--shadow); text-align:center; min-width:210px}
.score-panel .sp-total{font-size:34px; font-weight:900; background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent}
.score-panel .sp-lbl{font-size:12px; color:var(--text-mute)}
.score-panel .sp-grade{display:inline-block; margin-top:6px; padding:3px 14px; border-radius:999px; font-size:13px; font-weight:700}
.score-panel .sp-reset{margin-top:8px; font-size:11.5px; color:var(--text-mute); cursor:pointer; background:none; border:none; text-decoration:underline}
.g-excellent{background:rgba(34,197,94,.16); color:#86efac}
.g-pass{background:rgba(34,211,238,.14); color:var(--brand)}
.g-fail{background:rgba(255,59,92,.16); color:#ffb3c0}

/* ---------- 后台 admin ---------- */
.admin-wrap{max-width:960px; margin:0 auto; padding:120px 24px 60px}
.admin-wrap h2{font-size:26px; margin-bottom:6px}
.admin-sec{background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:18px; margin:18px 0; overflow:auto}
.admin-sec table{width:100%; border-collapse:collapse; font-size:13px}
.admin-sec th{text-align:left; color:var(--brand); padding:8px 10px; border-bottom:1px solid var(--border); font-weight:700}
.admin-sec td{padding:8px 10px; border-bottom:1px solid var(--border); color:var(--text-dim); vertical-align:top}
.admin-sec tr:hover td{background:rgba(255,255,255,.03)}
.admin-err{color:var(--red); padding:40px; text-align:center}

/* ---------- 响应式 ---------- */
@media(max-width:1024px){
  .hero-grid{grid-template-columns:1fr; gap:32px}
  .hero-stats{max-width:420px}
  .about-grid{grid-template-columns:1fr}
  .mod-grid, .post-grid{grid-template-columns:repeat(2,1fr)}
  .form-grid{grid-template-columns:1fr; gap:30px}
}
@media(max-width:768px){
  .nav-links{display:none}
  .hamburger{display:flex}
  .nav-cta{display:none}
  section{padding:68px 0}
  .h2{font-size:27px}
  .hero h1{font-size:38px}
  .type-line{font-size:16px}
  .mod-grid, .post-grid{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr; gap:26px}
  .footer-bottom{flex-direction:column}
  .mlayout{grid-template-columns:1fr}
  .mcontent{padding:18px 16px 120px}
  .mtopbar{padding:12px 16px}
  .msidebar{position:fixed; top:var(--nav-h); left:0; bottom:0; width:260px; z-index:900;
    transform:translateX(-100%); transition:transform .3s var(--ease); background:var(--bg-2)}
  .msidebar.open{transform:translateX(0)}
  .m-drawer-btn{display:inline-flex!important}
  .chk-card{flex-wrap:wrap}
  .chk-opts{flex-direction:row; width:100%; margin-top:10px}
}
.m-drawer-btn{display:none; align-items:center; gap:6px; padding:9px 14px; border-radius:10px; border:1px solid var(--border);
  background:rgba(255,255,255,.03); color:var(--text-dim); font-size:13px; cursor:pointer; margin-right:auto}
@media(min-width:769px){ .m-drawer-btn{display:none!important} }
@media(prefers-reduced-motion:reduce){
  .reveal{opacity:1; transform:none; transition:none}
  .orb{animation:none}
  html{scroll-behavior:auto}
}

/* =========================================================
   访问门控 · 审计手册受限展示
   ========================================================= */
.lock-banner{display:flex; align-items:center; gap:14px; padding:14px 18px; border-radius:12px; margin:16px 30px 0;
  background:rgba(255,59,92,.08); border:1px solid rgba(255,59,92,.4); color:#ffc2cd}
.lock-banner .lb-icon{width:34px;height:34px;border-radius:9px; background:var(--grad-red); color:#fff; flex:none;
  display:flex; align-items:center; justify-content:center; font-size:18px; box-shadow:0 0 16px rgba(255,59,92,.4)}
.lock-banner b{color:#fff}
.lock-banner .lb-open{margin-left:auto}

/* 受限：仅显示前 3 条，其余模糊锁定 */
.mod-block.locked .reveal-rest{position:relative}
.mod-block.locked .locked-mask{filter:blur(7px); opacity:.55; user-select:none; pointer-events:none}
.mod-block.locked .lock-overlay{position:relative; margin-top:-10px; text-align:center; padding:30px 20px;
  border:1px dashed rgba(255,59,92,.4); border-radius:14px; background:rgba(255,59,92,.05);
  color:#ffc2cd; margin-bottom:14px}
.mod-block.locked .lock-overlay .lo-title{font-size:17px; font-weight:800; color:#fff; margin-bottom:6px}
.mod-block.locked .lock-overlay .lo-sub{font-size:13.5px; color:var(--text-dim); margin-bottom:16px}
.locked-tag{display:inline-block; font-size:11px; color:#ffc2cd; border:1px solid rgba(255,59,92,.45);
  background:rgba(255,59,92,.1); padding:3px 10px; border-radius:999px; margin-left:8px}

/* 查询码弹窗 */
.code-modal{position:fixed; inset:0; z-index:3000; display:none; align-items:center; justify-content:center;
  background:rgba(4,7,14,.78); backdrop-filter:blur(8px); padding:24px}
.code-modal.open{display:flex}
.code-modal .cm-card{width:100%; max-width:440px; background:linear-gradient(160deg,var(--surface-2),var(--surface));
  border:1px solid var(--border-strong); border-radius:18px; padding:34px 30px; text-align:center; position:relative;
  box-shadow:var(--shadow)}
.code-modal .cm-card .cm-badge{width:64px;height:64px;border-radius:18px; margin:0 auto 16px; background:var(--grad-red);
  display:flex; align-items:center; justify-content:center; font-size:30px; color:#fff; box-shadow:0 0 26px rgba(255,59,92,.5)}
.code-modal h3{font-size:22px; margin-bottom:8px}
.code-modal p{color:var(--text-dim); font-size:14px; margin-bottom:20px}
.code-modal .field{text-align:left}
.code-modal input{text-align:center; letter-spacing:3px; font-size:16px; font-weight:700}
.code-modal .cm-err{color:var(--red); font-size:13px; min-height:18px; margin-top:8px}
.code-modal .cm-close{position:absolute; top:14px; right:16px; background:none; border:none; color:var(--text-mute);
  font-size:22px; cursor:pointer; line-height:1}
.code-modal .cm-hint{font-size:12px; color:var(--text-mute); margin-top:14px}

/* =========================================================
   富文本编辑器 · post-editor.html
   ========================================================= */
.editor-shell{max-width:1040px; margin:0 auto; padding:calc(var(--nav-h) + 28px) 22px 60px}
.editor-top{display:flex; align-items:center; gap:14px; margin-bottom:18px; flex-wrap:wrap}
.editor-top .et-title{font-size:22px; font-weight:800}
.editor-top .et-back{color:var(--text-dim); font-size:14px; display:inline-flex; gap:6px; align-items:center}
.editor-top .et-back:hover{color:#fff}
.editor-top .et-actions{margin-left:auto; display:flex; gap:10px; flex-wrap:wrap}
.editor-meta{background:linear-gradient(160deg,var(--surface),var(--surface-2)); border:1px solid var(--border);
  border-radius:14px; padding:18px 20px; margin-bottom:16px; display:grid; grid-template-columns:2fr 1fr 1fr; gap:14px}
.editor-meta .field{margin-bottom:0}
.editor-toolbar{display:flex; flex-wrap:wrap; gap:4px; padding:10px; background:var(--surface);
  border:1px solid var(--border); border-bottom:none; border-radius:14px 14px 0 0; position:sticky; top:var(--nav-h); z-index:60}
.editor-toolbar .tb-group{display:flex; gap:3px; padding-right:8px; margin-right:6px; border-right:1px solid var(--border)}
.editor-toolbar .tb-group:last-child{border-right:none; margin-right:0; padding-right:0}
.editor-toolbar button{width:34px; height:32px; border-radius:7px; border:1px solid transparent; background:rgba(255,255,255,.03);
  color:var(--text-dim); cursor:pointer; font-size:14px; display:flex; align-items:center; justify-content:center; transition:.15s}
.editor-toolbar button:hover{background:rgba(34,211,238,.12); color:#fff; border-color:rgba(34,211,238,.3)}
.editor-toolbar button.active{background:rgba(34,211,238,.18); color:#fff}
.editor-toolbar .tb-sep{width:1px; background:var(--border); margin:4px 2px}
.editor-area{min-height:420px; background:rgba(7,11,22,.55); border:1px solid var(--border); border-radius:0 0 14px 14px;
  padding:24px 28px; font-size:15.5px; line-height:1.9; color:var(--text); outline:none; overflow-y:auto; max-height:62vh}
.editor-area:focus{border-color:var(--brand)}
.editor-area h1{font-size:26px; margin:18px 0 10px; font-weight:800}
.editor-area h2{font-size:21px; margin:16px 0 8px; font-weight:800}
.editor-area h3{font-size:17px; margin:14px 0 6px; font-weight:700}
.editor-area p{margin:10px 0}
.editor-area img{max-width:100%; border-radius:10px; margin:12px 0; box-shadow:var(--shadow)}
.editor-area blockquote{border-left:4px solid var(--brand); padding:6px 16px; margin:12px 0; color:var(--text-dim);
  background:rgba(34,211,238,.05); border-radius:0 8px 8px 0}
.editor-area a{color:var(--brand); text-decoration:underline}
.editor-area ul, .editor-area ol{padding-left:24px; margin:10px 0}
.editor-area li{margin:5px 0}
.editor-area hr{border:none; border-top:1px solid var(--border); margin:18px 0}
.editor-status{font-size:12.5px; color:var(--text-mute); margin-top:10px; text-align:right}

/* =========================================================
   后台仪表盘 · admin.html（多标签）
   ========================================================= */
.admin-nav{display:flex; gap:6px; flex-wrap:wrap; margin:18px 0; border-bottom:1px solid var(--border); padding-bottom:12px}
.admin-nav button{padding:10px 18px; border-radius:10px; border:1px solid transparent; background:rgba(255,255,255,.03);
  color:var(--text-dim); font-size:14px; font-weight:600; cursor:pointer; transition:.2s}
.admin-nav button:hover{color:#fff}
.admin-nav button.active{background:var(--grad); color:#04121f; font-weight:800}
.admin-tab{display:none}
.admin-tab.active{display:block}
.stat-pills{display:flex; gap:14px; flex-wrap:wrap; margin-bottom:16px}
.stat-pill{background:var(--surface); border:1px solid var(--border); border-radius:12px; padding:14px 20px; min-width:120px}
.stat-pill .sp-n{font-size:24px; font-weight:900; background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent}
.stat-pill .sp-l{font-size:12.5px; color:var(--text-mute); margin-top:2px}

/* 状态徽章 */
.badge{display:inline-block; font-size:11.5px; font-weight:700; padding:3px 11px; border-radius:999px; white-space:nowrap}
.badge.draft{background:rgba(100,116,139,.18); color:#cbd5e1}
.badge.review{background:rgba(255,122,69,.16); color:#ffc9a8}
.badge.published{background:rgba(34,197,94,.16); color:#86efac}
.badge.rejected{background:rgba(255,59,92,.16); color:#ffb3c0}
.badge.active{background:rgba(34,211,238,.16); color:var(--brand)}
.badge.revoked{background:rgba(100,116,139,.18); color:#cbd5e1}
.badge.pending{background:rgba(255,122,69,.16); color:#ffc9a8}

/* 表格内操作按钮 */
.tbl-actions{display:flex; gap:6px; flex-wrap:wrap}
.mini-btn{padding:5px 12px; border-radius:8px; border:1px solid var(--border); background:rgba(255,255,255,.03);
  color:var(--text-dim); font-size:12.5px; cursor:pointer; transition:.15s; white-space:nowrap}
.mini-btn:hover{color:#fff; border-color:var(--border-strong)}
.mini-btn.ok{border-color:rgba(34,197,94,.4); color:#86efac}
.mini-btn.ok:hover{background:rgba(34,197,94,.14)}
.mini-btn.danger{border-color:rgba(255,59,92,.4); color:#ffb3c0}
.mini-btn.danger:hover{background:rgba(255,59,92,.14)}
.mini-btn.primary{border-color:rgba(34,211,238,.4); color:var(--brand)}
.mini-btn.primary:hover{background:rgba(34,211,238,.14)}
.mini-btn:disabled{opacity:.45; cursor:not-allowed}

.admin-sec table td .ttl{color:var(--text); font-weight:600}
.admin-sec table td .sub{color:var(--text-mute); font-size:11.5px; margin-top:2px}
.row-del{opacity:.4}
.row-del:hover{opacity:1}

/* 查询码管理 */
.code-gen{display:flex; gap:10px; align-items:flex-end; flex-wrap:wrap; margin-bottom:16px; padding:16px;
  background:var(--surface); border:1px solid var(--border); border-radius:12px}
.code-gen .field{margin-bottom:0}
.mono{font-family:"SF Mono",Consolas,Menlo,monospace; letter-spacing:1px}

/* =========================================================
   经验分享前台 · experience.html / post-detail.html
   ========================================================= */
.exp-hero{padding-top:calc(var(--nav-h) + 60px); padding-bottom:30px}
.exp-hero .h2{font-size:40px}
.exp-filters{display:flex; gap:10px; flex-wrap:wrap; margin:8px 0 30px}
.exp-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px}
.exp-card{background:linear-gradient(160deg,var(--surface),var(--surface-2)); border:1px solid var(--border);
  border-radius:var(--radius); overflow:hidden; display:flex; flex-direction:column; transition:transform .3s var(--ease), border-color .3s, box-shadow .3s}
.exp-card:hover{transform:translateY(-6px); border-color:rgba(34,211,238,.5); box-shadow:0 18px 44px rgba(0,0,0,.45)}
.exp-cover{height:170px; position:relative; overflow:hidden; display:flex; align-items:flex-end; padding:16px}
.exp-cover img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}
.exp-cover .pc-glow{position:absolute; inset:0; opacity:.85; z-index:0}
.exp-cover .pc-tag{position:relative; z-index:2; background:rgba(7,11,22,.7); backdrop-filter:blur(6px);
  color:var(--brand); font-size:12px; font-weight:700; padding:5px 12px; border-radius:999px; border:1px solid rgba(34,211,238,.35)}
.exp-body{padding:18px 20px 20px; display:flex; flex-direction:column; flex:1}
.exp-body h3{font-size:17px; line-height:1.5; margin-bottom:10px}
.exp-body p{color:var(--text-dim); font-size:13.5px; flex:1; margin-bottom:14px}
.exp-foot{display:flex; align-items:center; justify-content:space-between; font-size:12.5px; color:var(--text-mute)}
.exp-foot .read{color:var(--brand); font-weight:700}
.exp-empty{text-align:center; color:var(--text-mute); padding:60px 0; grid-column:1/-1}

/* 文章详情 */
.article-wrap{max-width:820px; margin:0 auto; padding:calc(var(--nav-h) + 30px) 22px 80px}
.article-cover{height:300px; border-radius:16px; overflow:hidden; position:relative; margin-bottom:26px;
  display:flex; align-items:flex-end; padding:22px}
.article-cover img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}
.article-cover .pc-glow{position:absolute; inset:0; opacity:.8}
.article-cover .ac-tag{position:relative; z-index:2; background:rgba(7,11,22,.7); backdrop-filter:blur(6px);
  color:var(--brand); font-size:12.5px; font-weight:700; padding:6px 14px; border-radius:999px; border:1px solid rgba(34,211,238,.35)}
.article-title{font-size:34px; font-weight:900; line-height:1.35; margin-bottom:14px}
.article-meta{display:flex; gap:16px; flex-wrap:wrap; color:var(--text-mute); font-size:13.5px; margin-bottom:26px;
  padding-bottom:20px; border-bottom:1px solid var(--border)}
.article-meta .am-author{color:var(--brand); font-weight:700}
.article-body{font-size:16px; line-height:1.95; color:var(--text)}
.article-body img{max-width:100%; border-radius:12px; margin:20px 0; box-shadow:var(--shadow)}
.article-body h1{font-size:27px; margin:26px 0 12px; font-weight:800}
.article-body h2{font-size:22px; margin:24px 0 10px; font-weight:800}
.article-body h3{font-size:18px; margin:20px 0 8px; font-weight:700}
.article-body p{margin:14px 0}
.article-body blockquote{border-left:4px solid var(--brand); padding:8px 18px; margin:18px 0; color:var(--text-dim);
  background:rgba(34,211,238,.05); border-radius:0 8px 8px 0}
.article-body a{color:var(--brand); text-decoration:underline}
.article-body ul, .article-body ol{padding-left:26px; margin:14px 0}
.article-body li{margin:7px 0}
.article-body hr{border:none; border-top:1px solid var(--border); margin:24px 0}
.article-protect{margin-top:30px; padding:14px 18px; border-radius:12px; background:rgba(255,59,92,.07);
  border:1px solid rgba(255,59,92,.35); color:#ffc2cd; font-size:13.5px; text-align:center}
.related{margin-top:46px; padding-top:26px; border-top:1px solid var(--border)}
.related h3{font-size:20px; margin-bottom:18px}
.related-list{display:grid; grid-template-columns:repeat(3,1fr); gap:16px}

/* 预览弹层 */
.prev-modal{position:fixed; inset:0; z-index:2500; display:none; align-items:flex-start; justify-content:center;
  background:rgba(4,7,14,.8); backdrop-filter:blur(8px); padding:40px 20px; overflow:auto}
.prev-modal.open{display:flex}
.prev-modal .pm-card{width:100%; max-width:780px; background:var(--bg-2); border:1px solid var(--border-strong);
  border-radius:18px; padding:40px; box-shadow:var(--shadow)}
.prev-modal .pm-close{position:absolute; top:18px; right:24px; background:none; border:none; color:var(--text-mute);
  font-size:24px; cursor:pointer}

/* =========================================================
   修正层 · 与真实 HTML/JS 类名对齐（覆盖上方同名死规则）
   ========================================================= */

/* ---------- 访问门控横幅（位于 manual-page 内，通栏提示条） ---------- */
.lock-banner{position:relative; z-index:100;
  display:flex; align-items:center; gap:14px; width:100%;
  padding:14px 22px; margin:0;
  background:rgba(255,59,92,.08); border-top:1px solid rgba(255,59,92,.25); border-bottom:1px solid rgba(255,59,92,.35);
  color:#ffc2cd; border-radius:0}
.lock-banner .lock-ic{font-size:22px; flex:none; width:36px; height:36px; border-radius:10px;
  background:var(--grad-red); color:#fff; display:flex; align-items:center; justify-content:center;
  box-shadow:0 0 16px rgba(255,59,92,.4)}
.lock-banner .lock-txt{flex:1; min-width:0}
.lock-banner .lock-txt b{display:block; color:#fff; font-size:15px; margin-bottom:3px}
.lock-banner .lock-txt span{display:block; font-size:13px; color:var(--text-dim); line-height:1.55}
.lock-banner .lock-form{display:flex; gap:8px; margin-left:auto; flex:none; align-items:center}
.lock-banner .lock-form input{padding:10px 14px; border-radius:10px; background:rgba(7,11,22,.55);
  border:1px solid rgba(255,59,92,.45); color:#fff; font-size:14px; width:210px; min-width:140px}
.lock-banner .lock-form input::placeholder{color:#ff9eb0}
.lock-banner .lock-form input:focus{outline:none; border-color:var(--red); box-shadow:0 0 0 3px rgba(255,59,92,.15)}
.lock-banner .lock-form button{white-space:nowrap; padding:10px 18px; border-radius:10px}

/* 受限卡片：仅显示前 3 条，其余锁定 */
.chk-card.locked{cursor:default; align-items:center; justify-content:center; min-height:120px;
  text-align:center; border-style:dashed; border-color:rgba(255,59,92,.4); background:rgba(255,59,92,.04)}
.chk-card.locked .lock-mask{display:flex; flex-direction:column; align-items:center; gap:10px}
.chk-card.locked .lm-ic{font-size:30px}
.chk-card.locked .lm-t{font-size:14px; color:var(--text-dim)}
.chk-card.locked .lm-t b{color:#fff; font-size:16px}
.chk-card.locked .lm-btn{margin-top:2px; padding:9px 18px; border-radius:999px; border:none;
  background:var(--grad-red); color:#fff; font-weight:700; cursor:pointer; font-size:13.5px}
.chk-card.locked .lm-btn:hover{box-shadow:0 8px 24px rgba(255,59,92,.45)}

/* ---------- 富文本编辑器 ---------- */
.editor-page{background:var(--bg)}
.ed-topbar{position:fixed; top:0; left:0; right:0; z-index:1000; height:var(--nav-h);
  display:flex; align-items:center; justify-content:space-between; gap:14px; padding:0 20px;
  background:rgba(7,11,22,.82); backdrop-filter:blur(16px); border-bottom:1px solid var(--border)}
.ed-left{display:flex; align-items:center; gap:14px; min-width:0; flex:1}
.ed-back{color:var(--text-dim); font-size:14px; white-space:nowrap; flex:none}
.ed-back:hover{color:#fff}
.ed-title{flex:1; min-width:0; background:transparent; border:none; color:var(--text);
  font-size:18px; font-weight:800; padding:6px 4px}
.ed-title:focus{outline:none}
.ed-status{flex:none; font-size:12.5px; font-weight:700; padding:4px 12px; border-radius:999px;
  background:rgba(255,255,255,.06); color:var(--text-dim); border:1px solid var(--border)}
.ed-status.st-draft{color:#cbd5e1; border-color:rgba(100,116,139,.4)}
.ed-status.st-pending{color:#ffc9a8; border-color:rgba(255,122,69,.4); background:rgba(255,122,69,.1)}
.ed-status.st-published{color:#86efac; border-color:rgba(34,197,94,.4); background:rgba(34,197,94,.1)}
.ed-status.st-rejected{color:#ffb3c0; border-color:rgba(255,59,92,.4); background:rgba(255,59,92,.1)}
.ed-right{display:flex; gap:10px; flex:none}
.ed-layout{display:grid; grid-template-columns:1fr 320px; gap:0; min-height:calc(100vh - var(--nav-h));
  padding-top:var(--nav-h)}
.ed-main{display:flex; flex-direction:column; min-width:0; border-right:1px solid var(--border)}
.ed-toolbar{display:flex; flex-wrap:wrap; gap:4px; padding:10px 16px; background:var(--surface);
  border-bottom:1px solid var(--border); position:sticky; top:var(--nav-h); z-index:60}
.ed-toolbar .tb{width:34px; height:32px; border-radius:7px; border:1px solid transparent; background:rgba(255,255,255,.03);
  color:var(--text-dim); cursor:pointer; font-size:14px; display:flex; align-items:center; justify-content:center; transition:.15s}
.ed-toolbar .tb:hover{background:rgba(34,211,238,.12); color:#fff; border-color:rgba(34,211,238,.3)}
.ed-toolbar .tb-sep{width:1px; background:var(--border); margin:4px 4px}
.tb-color{width:30px; height:30px; padding:0; border:1px solid var(--border); border-radius:7px; background:none; cursor:pointer}
.cbar{display:inline-block; width:14px; height:14px; border-radius:3px; vertical-align:middle}
.ed-editor{flex:1; min-height:420px; background:rgba(7,11,22,.5); padding:28px 34px; font-size:15.5px; line-height:1.95;
  color:var(--text); outline:none; overflow-y:auto; max-height:calc(100vh - var(--nav-h) - 120px)}
.ed-editor h1{font-size:26px; margin:18px 0 10px; font-weight:800}
.ed-editor h2{font-size:21px; margin:16px 0 8px; font-weight:800}
.ed-editor h3{font-size:17px; margin:14px 0 6px; font-weight:700}
.ed-editor p{margin:10px 0}
.ed-editor img{max-width:100%; border-radius:10px; margin:12px 0; box-shadow:var(--shadow)}
.ed-editor blockquote{border-left:4px solid var(--brand); padding:6px 16px; margin:12px 0; color:var(--text-dim);
  background:rgba(34,211,238,.05); border-radius:0 8px 8px 0}
.ed-editor a{color:var(--brand); text-decoration:underline}
.ed-editor ul,.ed-editor ol{padding-left:24px; margin:10px 0}
.ed-editor li{margin:5px 0}
.ed-editor hr{border:none; border-top:1px solid var(--border); margin:18px 0}
.ed-hint{font-size:12.5px; color:var(--text-mute); padding:10px 16px; border-top:1px solid var(--border)}
.ed-side{padding:24px 18px; overflow-y:auto}
.ed-field{margin-bottom:18px}
.ed-field label{display:block; font-size:13px; color:var(--text-dim); margin-bottom:7px}
.ed-field textarea,.ed-field input{width:100%; padding:11px 13px; border-radius:10px; background:rgba(7,11,22,.6);
  border:1px solid var(--border); color:var(--text); font-size:14px; font-family:inherit}
.ed-field textarea{resize:vertical; min-height:80px}
.ed-field textarea:focus,.ed-field input:focus{outline:none; border-color:var(--brand)}
.ed-cover{height:140px; border-radius:12px; overflow:hidden; background:rgba(255,255,255,.04);
  border:1px dashed var(--border-strong); display:flex; align-items:center; justify-content:center; position:relative}
.ed-cover img{width:100%; height:100%; object-fit:cover}
.ed-cover-empty{color:var(--text-mute); font-size:13px}
.ed-cover-actions{display:flex; gap:8px; margin-top:10px; flex-wrap:wrap}
.ed-channels{display:flex; flex-direction:column; gap:8px}
.ed-channels label{display:flex; align-items:center; gap:8px; font-size:14px; color:var(--text-dim); cursor:pointer}
.ed-meta{font-size:12px; color:var(--text-mute); margin-top:10px; line-height:1.7; word-break:break-all}
.btn.sm{padding:9px 16px; font-size:13px}

/* ---------- 后台仪表盘 ---------- */
.admin-page{background:var(--bg)}
.admin-shell{display:grid; grid-template-columns:240px 1fr; min-height:100vh}
.admin-side{background:rgba(10,15,31,.6); border-right:1px solid var(--border); padding:24px 16px;
  display:flex; flex-direction:column; gap:18px; position:sticky; top:0; height:100vh}
.ad-logo{display:flex; align-items:center; gap:10px; font-weight:800; font-size:15px}
.ad-logo .mark{width:28px;height:28px;border-radius:8px; background:var(--grad); position:relative; box-shadow:0 0 14px rgba(34,211,238,.4)}
.ad-logo .mark::after{content:""; position:absolute; inset:6px; border-radius:4px; border:2px solid rgba(4,18,31,.85)}
.ad-tabs{display:flex; flex-direction:column; gap:6px}
.ad-tab{padding:12px 16px; border-radius:10px; border:1px solid transparent; background:rgba(255,255,255,.03);
  color:var(--text-dim); font-size:14.5px; font-weight:600; cursor:pointer; text-align:left; transition:.2s}
.ad-tab:hover{color:#fff}
.ad-tab.active{background:var(--grad); color:#04121f; font-weight:800}
.ad-home{margin-top:auto; color:var(--text-mute); font-size:13.5px}
.ad-home:hover{color:var(--brand)}
.admin-main{padding:30px 32px 60px; min-width:0}
.ad-top{display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:8px; flex-wrap:wrap}
.ad-top h2{font-size:24px}
.ad-token{display:flex; gap:8px; align-items:center}
.ad-token input{padding:10px 14px; border-radius:10px; background:rgba(7,11,22,.6); border:1px solid var(--border);
  color:var(--text); font-size:14px; width:240px}
.ad-token input:focus{outline:none; border-color:var(--brand)}
.ad-status{font-size:13px; color:var(--text-mute); margin-bottom:16px; min-height:18px}
.ad-pane{display:none}
.ad-pane.active{display:block}
.ad-sec{background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:8px 14px; margin:14px 0; overflow:auto}
.ad-sec table{width:100%; border-collapse:collapse; font-size:13px}
.ad-sec th{text-align:left; color:var(--brand); padding:10px 12px; border-bottom:1px solid var(--border); font-weight:700; white-space:nowrap}
.ad-sec td{padding:10px 12px; border-bottom:1px solid var(--border); color:var(--text-dim); vertical-align:top}
.ad-sec tr:hover td{background:rgba(255,255,255,.03)}
.ad-sec tr:last-child td{border-bottom:none}
.ad-select,.ad-input{padding:10px 14px; border-radius:10px; background:rgba(7,11,22,.6); border:1px solid var(--border);
  color:var(--text); font-size:14px}
.ad-select:focus,.ad-input:focus{outline:none; border-color:var(--brand)}
.ov-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:14px}
.ov-card{background:var(--surface); border:1px solid var(--border); border-radius:12px; padding:18px 20px}
.ov-num{font-size:28px; font-weight:900; background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent}
.ov-lbl{font-size:13px; color:var(--text-mute); margin-top:4px}
.badge{display:inline-block; font-size:11.5px; font-weight:700; padding:3px 11px; border-radius:999px; white-space:nowrap}
.badge.st-draft{background:rgba(100,116,139,.18); color:#cbd5e1}
.badge.st-pending{background:rgba(255,122,69,.16); color:#ffc9a8}
.badge.st-published{background:rgba(34,197,94,.16); color:#86efac}
.badge.st-rejected{background:rgba(255,59,92,.16); color:#ffb3c0}
.acts{white-space:nowrap}
.lnk{color:var(--brand); cursor:pointer; font-weight:600; font-size:13px; margin-right:4px; text-decoration:none}
.lnk:hover{text-decoration:underline}
.lnk.act{padding:3px 9px; border-radius:7px; border:1px solid var(--border); background:rgba(255,255,255,.03)}
.lnk.act:hover{border-color:var(--brand); text-decoration:none}
.lnk.act.ok{color:#86efac; border-color:rgba(34,197,94,.4)}
.lnk.act.bad{color:#ffb3c0; border-color:rgba(255,59,92,.4)}
.lnk.act.del{color:#ffb3c0; border-color:rgba(255,59,92,.4)}

/* ---------- 经验分享前台 ---------- */
.sub-hero{padding:calc(var(--nav-h) + 70px) 0 50px; text-align:center}
.sub-hero .lead{color:var(--text-dim); font-size:16px; max-width:560px; margin:10px auto 0}
.exp-list-wrap{padding:10px 0 90px}

/* ---------- 文章详情 ---------- */
.article-detail{background:var(--bg)}
.art-loading{color:var(--text-mute); padding:40px 0; text-align:center}
.art-meta-top{margin-bottom:14px}
.art-title{font-size:34px; font-weight:900; line-height:1.35; margin-bottom:10px}
.art-sub{color:var(--text-dim); font-size:16px; margin-bottom:14px}
.art-info{display:flex; gap:18px; flex-wrap:wrap; color:var(--text-mute); font-size:13.5px; margin-bottom:22px;
  padding-bottom:18px; border-bottom:1px solid var(--border)}
.art-cover{height:300px; border-radius:16px; background:rgba(255,255,255,.04); margin-bottom:24px}
.art-content{font-size:16px; line-height:1.95; color:var(--text)}
.art-content img{max-width:100%; border-radius:12px; margin:20px 0; box-shadow:var(--shadow)}
.art-content h1{font-size:27px; margin:26px 0 12px; font-weight:800}
.art-content h2{font-size:22px; margin:24px 0 10px; font-weight:800}
.art-content h3{font-size:18px; margin:20px 0 8px; font-weight:700}
.art-content p{margin:14px 0}
.art-content blockquote{border-left:4px solid var(--brand); padding:8px 18px; margin:18px 0; color:var(--text-dim);
  background:rgba(34,211,238,.05); border-radius:0 8px 8px 0}
.art-content a{color:var(--brand); text-decoration:underline}
.art-content ul,.art-content ol{padding-left:26px; margin:14px 0}
.art-content li{margin:7px 0}
.art-content hr{border:none; border-top:1px solid var(--border); margin:24px 0}
.atag{display:inline-block; font-size:12px; color:var(--brand); background:rgba(34,211,238,.08);
  border:1px solid rgba(34,211,238,.3); padding:3px 10px; border-radius:999px; margin:4px 6px 4px 0}
.art-tags{margin:20px 0}
.art-foot-note{margin-top:24px; padding:14px 18px; border-radius:12px; background:rgba(255,59,92,.07);
  border:1px solid rgba(255,59,92,.35); color:#ffc2cd; font-size:13.5px; text-align:center}
.art-related{margin-top:40px; padding-top:26px; border-top:1px solid var(--border)}
.art-related h3{font-size:20px; margin-bottom:18px}
.post-grid.sm{grid-template-columns:repeat(3,1fr); gap:16px}

/* ---------- 响应式（修正层） ---------- */
@media(max-width:1024px){
  .ov-grid{grid-template-columns:repeat(2,1fr)}
  .ed-layout{grid-template-columns:1fr 280px}
}
@media(max-width:768px){
  .ed-layout{grid-template-columns:1fr; padding-top:var(--nav-h)}
  .ed-main{border-right:none; border-bottom:1px solid var(--border)}
  .ed-side{height:auto}
  .admin-shell{grid-template-columns:1fr}
  .admin-side{position:static; height:auto; flex-direction:row; flex-wrap:wrap; align-items:center; gap:10px}
  .ad-tabs{flex-direction:row; flex-wrap:wrap; flex:1}
  .ad-tab{padding:9px 12px; font-size:13px}
  .ad-home{margin:0}
  .ov-grid{grid-template-columns:repeat(2,1fr)}
  .art-title{font-size:26px}
  .art-cover{height:200px}
  .lock-banner{flex-wrap:wrap; gap:12px; padding:14px 16px}
  .lock-banner .lock-txt{width:100%; flex:none}
  .lock-banner .lock-form{width:100%; margin-left:0}
  .lock-banner .lock-form input{flex:1}
  .post-grid.sm{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){
  .reveal{opacity:1; transform:none; transition:none}
  .orb{animation:none}
  html{scroll-behavior:auto}
}

/* 受保护页面：禁止文本选择（配合 protect.js 的 JS 拦截） */
html.protect-on, html.protect-on body,
html.protect-on *:not(input):not(textarea):not([contenteditable]){user-select:none; -webkit-user-select:none}

/* ============ 后台登录视图（账号体系） ============ */
.login-view{display:flex; align-items:center; justify-content:center; min-height:100vh; padding:24px; position:relative; z-index:2}
.login-card{width:100%; max-width:400px; background:rgba(10,15,31,.82); backdrop-filter:blur(14px);
  border:1px solid var(--border); border-radius:20px; padding:36px 32px; text-align:center;
  box-shadow:0 24px 60px rgba(0,0,0,.45)}
.login-logo{display:flex; align-items:center; justify-content:center; gap:10px; font-weight:700; letter-spacing:.5px; margin-bottom:6px}
.login-logo .mark{width:14px; height:14px; border-radius:4px; background:linear-gradient(135deg,var(--brand),var(--brand2))}
.login-card h1{font-size:20px; margin:6px 0 24px; color:var(--text)}
.login-form{display:flex; flex-direction:column; gap:14px; text-align:left}
.login-form label{display:flex; flex-direction:column; gap:6px; font-size:13px; color:var(--text-mute)}
.login-form input{padding:12px 14px; border-radius:10px; background:rgba(7,11,22,.6);
  border:1px solid var(--border); color:var(--text); font-size:14px}
.login-form input:focus{outline:none; border-color:var(--brand); box-shadow:0 0 0 3px rgba(34,211,238,.12)}
.login-form .btn{margin-top:6px; padding:12px}
.login-err{min-height:18px; font-size:13px; color:#ffb3c0; text-align:center}
.login-home{display:inline-block; margin-top:18px; font-size:13px; color:var(--text-mute)}
.login-home:hover{color:var(--brand)}

/* 顶栏用户区 */
.ad-user{display:flex; gap:8px; align-items:center; flex-wrap:wrap}
.ad-user-name{font-size:13px; color:var(--text-mute); background:rgba(34,211,238,.08);
  border:1px solid rgba(34,211,238,.2); border-radius:999px; padding:6px 14px}
.ad-user-name b{color:var(--brand); font-weight:600}

/* 用户管理 */
.user-create{display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:10px; margin:12px 0 4px}
.user-tip{font-size:12.5px; color:var(--text-mute); margin-top:8px; line-height:1.7}
.by-chip{display:inline-block; margin-left:6px; padding:1px 8px; border-radius:999px; font-size:11.5px;
  background:rgba(124,58,237,.14); color:#c4b5fd; border:1px solid rgba(124,58,237,.25); vertical-align:middle}

/* 编辑器内嵌登录 */
.ed-login{display:flex; align-items:center; justify-content:center; min-height:60vh}
.ed-login .login-card{max-width:360px}

@media (max-width:768px){
  .login-card{padding:28px 20px}
  .user-create{grid-template-columns:1fr}
}

/* ===== 系统设置面板 ===== */
.login-hint{margin-top:10px; font-size:12.5px; line-height:1.9; color:var(--text-mute,#8b96ad); text-align:left;
  background:rgba(59,130,246,.07); border:1px solid rgba(59,130,246,.25); border-radius:8px; padding:8px 12px; display:none}
.login-hint:not(:empty){display:block}
.set-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:14px; margin-top:6px}
.set-field label{display:block; font-size:12.5px; color:var(--text-mute,#8b96ad); margin-bottom:6px}
.set-span{grid-column:1/-1}
.set-switch{display:flex; flex-direction:column; gap:12px; margin-top:8px}
.sw-item{display:flex; gap:12px; align-items:flex-start; cursor:pointer; padding:10px 12px; border:1px solid var(--border,#232c40);
  border-radius:10px; transition:border-color .2s}
.sw-item:hover{border-color:var(--brand,#3b82f6)}
.sw-item input{margin-top:4px; width:16px; height:16px; accent-color:var(--brand,#3b82f6); flex:none}
.sw-item span{font-size:14px; color:var(--text,#e8ecf4)}
.sw-desc{font-size:12px; color:var(--text-mute,#8b96ad); margin-top:2px}
.db-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:12px}
.db-item{background:rgba(7,11,22,.5); border:1px solid var(--border,#232c40); border-radius:10px; padding:12px 14px}
.db-lbl{font-size:11.5px; color:var(--text-mute,#8b96ad); margin-bottom:4px}
.db-val{font-size:14px; color:var(--text,#e8ecf4); word-break:break-all}
@media(max-width:768px){
  .set-grid{grid-template-columns:1fr}
  .db-grid{grid-template-columns:1fr}
}

/* ================= 访客统计面板 ================= */
.ana-kpis{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-bottom:14px}
.ana-kpi{background:var(--surface-2,#15203a);border:1px solid var(--border,rgba(255,255,255,.09));border-radius:var(--radius-sm,10px);padding:14px 16px}
.ana-kpi .kpi-num{font-size:24px;font-weight:700;color:var(--brand,#22d3ee);line-height:1.2}
.ana-kpi .kpi-lbl{font-size:12px;color:var(--text-mute,#64748b);margin-top:4px}
.ana-toolbar{display:flex;align-items:center;gap:14px;margin-bottom:12px;flex-wrap:wrap}
.ana-note{font-size:12px;color:var(--text-mute,#64748b)}
.ana-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.ana-card{background:var(--surface,#101729);border:1px solid var(--border,rgba(255,255,255,.09));border-radius:var(--radius-sm,10px);padding:16px}
.ana-card h3{font-size:14px;margin-bottom:10px;color:var(--text,#e6edf7)}
.ana-card.ana-wide{grid-column:1 / -1}
.ana-sub{font-size:12px;color:var(--text-mute,#64748b);font-weight:400;margin-left:8px}
.ana-chart{min-height:60px}
.ana-svg{width:100%;height:auto;display:block}
.ana-svg-d{width:140px;height:140px;flex:none}
.ana-empty{padding:28px 0;text-align:center;color:var(--text-mute,#64748b);font-size:13px}
.ana-legend{display:flex;gap:18px;justify-content:center;margin-top:6px;font-size:12px;color:var(--text-dim,#9fb0c8)}
.ana-legend i{display:inline-block;width:16px;height:3px;border-radius:2px;margin-right:6px;vertical-align:middle}
/* 横向条形图 */
.ana-bars{display:flex;flex-direction:column;gap:8px}
.bar-row{display:grid;grid-template-columns:minmax(64px,110px) 1fr 44px auto;gap:8px;align-items:center;font-size:12.5px}
.bar-lbl{color:var(--text-dim,#9fb0c8);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bar-track{background:rgba(255,255,255,.06);border-radius:5px;height:14px;overflow:hidden}
.bar-fill{display:block;height:100%;border-radius:5px;opacity:.9;transition:width .5s var(--ease,ease)}
.bar-val{color:var(--text,#e6edf7);font-weight:600;text-align:right}
.bar-x{color:var(--text-mute,#64748b);font-size:11px;white-space:nowrap}
/* 环形图 */
.ana-donut{display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.donut-legend{display:flex;flex-direction:column;gap:6px;flex:1;min-width:140px}
.donut-lg{display:flex;align-items:center;gap:8px;font-size:12.5px}
.donut-lg i{width:10px;height:10px;border-radius:3px;flex:none}
.donut-lg span{color:var(--text-dim,#9fb0c8);flex:1}
.donut-lg b{color:var(--text,#e6edf7)}
.donut-lg em{color:var(--text-mute,#64748b);font-style:normal;font-size:11px;width:36px;text-align:right}
/* 明细表 */
#anaTable .ana-path{max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text-dim,#9fb0c8)}
@media(max-width:900px){
  .ana-kpis{grid-template-columns:repeat(2,1fr)}
  .ana-grid{grid-template-columns:1fr}
  #anaTable .ana-path{max-width:150px}
}