:root{
  --main:#10b981;
  --accent:#fbbf24;
  --bg:#0a1410;
  --text:#ecfdf5;
  --panel:#0f1d17;
  --panel-2:#132a20;
  --line:rgba(16,185,129,.22);
  --dim:#8fb3a5;
  --shadow:0 10px 30px rgba(0,0,0,.55),0 2px 0 rgba(255,255,255,.03) inset;
  --shadow-sm:0 4px 14px rgba(0,0,0,.45);
  --title-font:"Source Han Serif SC","Noto Serif SC",Georgia,"Songti SC",serif;
  --body-font:"Source Han Sans SC","Noto Sans SC",Inter,"PingFang SC",sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:
    radial-gradient(1200px 600px at 78% -10%,rgba(16,185,129,.13),transparent 60%),
    radial-gradient(900px 500px at -10% 20%,rgba(251,191,36,.07),transparent 60%),
    var(--bg);
  color:var(--text);
  font-family:var(--body-font);
  font-size:13px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,h5{font-family:var(--title-font);font-weight:700;letter-spacing:.5px;margin:0}
a{text-decoration:none;color:inherit}
::selection{background:var(--main);color:#04170f}
img{display:block;max-width:100%}

/* ---------- 顶部导航 ---------- */
.topbar{
  position:sticky;top:0;z-index:900;
  background:linear-gradient(180deg,#0d1f18 0%,#0a1712 100%);
  border-bottom:1px solid var(--line);
  box-shadow:0 6px 24px rgba(0,0,0,.6),0 1px 0 rgba(16,185,129,.16) inset;
}
.topbar-inner{display:flex;align-items:center;gap:18px;padding:10px 0}
.brand{
  font-family:var(--title-font);
  font-size:20px;font-weight:800;letter-spacing:1px;
  color:var(--text);
  display:flex;align-items:center;gap:8px;
  text-shadow:0 2px 0 #05301f,0 0 18px rgba(16,185,129,.45);
  white-space:nowrap;
}
.brand i{color:var(--accent);filter:drop-shadow(0 0 6px rgba(251,191,36,.5))}
.nav-cats{display:flex;flex-wrap:wrap;gap:4px;margin-left:auto}
.nav-cats a{
  font-size:12.5px;padding:6px 11px;border-radius:8px;
  color:#b8d8ca;border:1px solid transparent;transition:.2s;
}
.nav-cats a:hover,.nav-cats a.active{
  color:var(--text);background:linear-gradient(180deg,#1a3a2c,#122a20);
  border-color:var(--line);box-shadow:0 3px 10px rgba(0,0,0,.5),0 1px 0 rgba(255,255,255,.05) inset;
}
.nav-cats a.hot i{color:var(--accent);margin-right:4px;font-size:11px}
.burger{
  display:none;margin-left:auto;background:linear-gradient(180deg,#1a3a2c,#10241c);
  border:1px solid var(--line);color:var(--text);border-radius:9px;width:40px;height:36px;
  box-shadow:var(--shadow-sm);
}
@media(max-width:991px){
  .burger{display:block}
  .nav-cats{
    display:none;width:100%;margin-left:0;padding-top:10px;
  }
  .nav-cats.open{display:flex}
  .topbar-inner{flex-wrap:wrap}
}

/* ---------- Hero ---------- */
.hero{
  position:relative;overflow:hidden;
  border-bottom:1px solid var(--line);
  background:#06100c;
}
.hero-slides{position:relative;height:420px}
.slide{
  position:absolute;inset:0;opacity:0;transition:opacity .9s ease;
  background-size:cover;background-position:center;
}
.slide.on{opacity:1}
.slide::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(5,14,10,.96) 0%,rgba(5,14,10,.82) 38%,rgba(5,14,10,.35) 72%,rgba(5,14,10,.72) 100%);
}
.slide-1{background-image:linear-gradient(135deg,#0d3b2b,#071c15 60%),radial-gradient(circle at 70% 30%,rgba(251,191,36,.25),transparent 55%)}
.slide-2{background-image:linear-gradient(135deg,#123c2f,#0a1a14 55%),radial-gradient(circle at 25% 65%,rgba(16,185,129,.3),transparent 55%)}
.slide-3{background-image:linear-gradient(135deg,#1d3a2a,#081410 60%),radial-gradient(circle at 80% 70%,rgba(251,191,36,.22),transparent 50%)}
.hero-content{
  position:relative;z-index:3;height:420px;display:flex;flex-direction:column;justify-content:flex-end;
  padding:34px 0 36px;
}
.hero-tag{
  display:inline-flex;align-items:center;gap:6px;align-self:flex-start;
  background:linear-gradient(180deg,rgba(251,191,36,.22),rgba(251,191,36,.08));
  border:1px solid rgba(251,191,36,.45);color:var(--accent);
  font-size:11.5px;padding:3px 10px;border-radius:20px;margin-bottom:14px;
  box-shadow:0 2px 10px rgba(251,191,36,.18);
}
.hero-title{
  font-size:clamp(26px,4.4vw,46px);line-height:1.15;color:#fff;
  text-shadow:0 4px 24px rgba(0,0,0,.85),0 1px 0 rgba(255,255,255,.12);
  max-width:760px;
}
.hero-title em{font-style:normal;color:var(--main)}
.hero-sub{color:#cfe9dd;max-width:640px;margin-top:12px;font-size:13.5px;text-shadow:0 2px 10px rgba(0,0,0,.8)}
.hero-meta{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px;align-items:center}
.pill{
  font-size:11.5px;padding:4px 11px;border-radius:20px;
  background:linear-gradient(180deg,#193a2b,#0e2119);
  border:1px solid var(--line);color:#bfe5d5;
  box-shadow:0 2px 8px rgba(0,0,0,.5),0 1px 0 rgba(255,255,255,.05) inset;
}
.pill.star{color:var(--accent);border-color:rgba(251,191,36,.4)}
.btn-play{
  display:inline-flex;align-items:center;gap:8px;
  background:linear-gradient(180deg,#14c78a,#0b8f63);color:#04170f;font-weight:700;
  padding:9px 20px;border-radius:10px;font-size:13px;
  box-shadow:0 8px 20px rgba(16,185,129,.32),0 1px 0 rgba(255,255,255,.35) inset;
  border:1px solid #1fd99a;transition:.2s;
}
.btn-play:hover{transform:translateY(-1px);box-shadow:0 12px 26px rgba(16,185,129,.45)}
.hero-dots{position:absolute;right:16px;bottom:18px;z-index:4;display:flex;gap:7px}
.hero-dots button{
  width:9px;height:9px;border-radius:50%;border:none;padding:0;
  background:rgba(236,253,245,.3);cursor:pointer;transition:.2s;
}
.hero-dots button.on{background:var(--accent);box-shadow:0 0 10px rgba(251,191,36,.8);width:22px;border-radius:6px}

/* ---------- 分类入口 ---------- */
.cat-strip{padding:22px 0 6px}
.cat-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}
@media(max-width:767px){.cat-grid{grid-template-columns:repeat(3,1fr)}}
.cat-card{
  background:linear-gradient(180deg,var(--panel-2),var(--panel));
  border:1px solid var(--line);border-radius:12px;padding:13px 10px;text-align:center;
  box-shadow:var(--shadow-sm),0 1px 0 rgba(255,255,255,.05) inset;transition:.22s;
}
.cat-card:hover{transform:translateY(-3px);border-color:var(--main);box-shadow:0 12px 26px rgba(0,0,0,.6),0 0 0 1px rgba(16,185,129,.35)}
.cat-card i{font-size:19px;color:var(--main);margin-bottom:6px;display:block;filter:drop-shadow(0 0 8px rgba(16,185,129,.4))}
.cat-card b{font-family:var(--title-font);font-size:13.5px;display:block}
.cat-card span{font-size:10.5px;color:var(--dim)}

/* ---------- 区块标题 ---------- */
.sec{padding:26px 0 4px}
.sec-head{display:flex;align-items:flex-end;gap:12px;margin-bottom:14px;border-bottom:1px solid var(--line);padding-bottom:9px}
.sec-head h2{font-size:18px;display:flex;align-items:center;gap:8px;white-space:nowrap}
.sec-head h2 i{color:var(--accent);font-size:15px}
.sec-head .more{margin-left:auto;font-size:12px;color:var(--dim)}
.sec-head .more:hover{color:var(--main)}
.sec-head p{margin:0;font-size:11.5px;color:var(--dim)}

/* ---------- 主布局:左侧筛选 + 右侧瀑布 ---------- */
.layout{display:grid;grid-template-columns:196px 1fr;gap:16px;align-items:start}
@media(max-width:991px){.layout{grid-template-columns:1fr}}
.side-filter{
  position:sticky;top:74px;
  background:linear-gradient(180deg,var(--panel-2),var(--panel));
  border:1px solid var(--line);border-radius:13px;padding:12px;
  box-shadow:var(--shadow);font-size:12px;
}
.side-filter h3{
  font-family:var(--title-font);font-size:13px;color:var(--accent);
  padding-bottom:7px;margin-bottom:8px;border-bottom:1px dashed rgba(16,185,129,.25);
  display:flex;align-items:center;gap:6px;
}
.side-filter .fgroup{margin-bottom:12px}
.side-filter .fgroup b{display:block;font-size:11px;color:var(--dim);margin-bottom:5px;font-weight:500}
.side-filter .fgroup a{
  display:block;padding:4px 8px;border-radius:7px;color:#b5d7c8;font-size:12px;transition:.16s;
  border-left:2px solid transparent;
}
.side-filter .fgroup a:hover,.side-filter .fgroup a.on{
  background:rgba(16,185,129,.13);color:#ecfdf5;border-left-color:var(--main);
}
@media(max-width:991px){.side-filter{position:static}}

/* ---------- 海报网格 ---------- */
.poster-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(148px,1fr));gap:12px;
}
.card-film{
  background:linear-gradient(180deg,#12291f,#0c1b15);
  border:1px solid rgba(16,185,129,.16);
  border-radius:11px;overflow:hidden;cursor:pointer;
  box-shadow:var(--shadow-sm);transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease;
  position:relative;
  display:flex;flex-direction:column;
}
.card-film:hover{
  transform:scale(1.028);border-color:var(--main);
  box-shadow:0 14px 30px rgba(0,0,0,.66),0 0 0 1px rgba(16,185,129,.5);
  z-index:2;
}
.poster-wrap{position:relative;aspect-ratio:2/3;overflow:hidden;background:linear-gradient(135deg,#123326,#0a1a13)}
.poster-wrap img{width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .5s ease}
.poster-wrap img.loaded{opacity:1}
.corner{
  position:absolute;top:0;left:0;z-index:2;
  background:linear-gradient(135deg,#10b981,#0a7a55);
  color:#03170f;font-size:10px;font-weight:700;padding:2px 7px;border-bottom-right-radius:8px;
  box-shadow:0 2px 8px rgba(0,0,0,.5);letter-spacing:.3px;
}
.corner.gold{background:linear-gradient(135deg,#fbbf24,#d99a05);color:#2a1c00}
.rate-badge{
  position:absolute;right:5px;bottom:5px;z-index:2;
  background:rgba(6,17,12,.86);border:1px solid rgba(251,191,36,.45);
  color:var(--accent);font-size:11px;font-weight:800;padding:1px 6px;border-radius:6px;
  backdrop-filter:blur(3px);
  display:flex;align-items:center;gap:2px;
}
.rate-badge i{font-size:9px}
.heat{
  position:absolute;left:5px;bottom:5px;z-index:2;
  background:rgba(6,17,12,.82);border:1px solid rgba(16,185,129,.4);
  color:#8ef0c7;font-size:10px;padding:1px 6px;border-radius:6px;
  display:flex;align-items:center;gap:3px;
}
.heat i{font-size:9px;color:#f97316}
.card-body{padding:7px 8px 9px;flex:1;display:flex;flex-direction:column;gap:2px}
.card-title{
  font-family:var(--title-font);font-size:12.5px;font-weight:700;color:#ecfdf5;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.card-sub{font-size:10.5px;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.card-tags{display:flex;gap:4px;flex-wrap:wrap;margin-top:1px}
.tag-mini{font-size:9.5px;padding:0 5px;border-radius:4px;background:rgba(16,185,129,.14);color:#88d9b8;border:1px solid rgba(16,185,129,.2)}

/* ---------- 排行榜 ---------- */
.rank-wrap{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
@media(max-width:767px){.rank-wrap{grid-template-columns:1fr}}
.rank-item{
  display:flex;gap:10px;align-items:center;padding:8px;border-radius:10px;cursor:pointer;
  background:linear-gradient(180deg,#11241c,#0b1a14);border:1px solid rgba(16,185,129,.14);
  box-shadow:var(--shadow-sm);transition:.2s;
}
.rank-item:hover{border-color:var(--main);transform:translateX(3px);box-shadow:0 10px 22px rgba(0,0,0,.6)}
.rank-no{
  font-family:var(--title-font);font-size:19px;font-weight:800;width:30px;text-align:center;
  color:#3a6b57;flex:none;text-shadow:0 2px 0 rgba(0,0,0,.5);
}
.rank-item:nth-child(1) .rank-no{color:#fbbf24;text-shadow:0 0 12px rgba(251,191,36,.6)}
.rank-item:nth-child(2) .rank-no{color:#d7e3de}
.rank-item:nth-child(3) .rank-no{color:#cd7f32}
.rank-thumb{width:44px;height:60px;border-radius:7px;overflow:hidden;flex:none;background:#0d2418;border:1px solid rgba(16,185,129,.2)}
.rank-thumb img{width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .5s}
.rank-thumb img.loaded{opacity:1}
.rank-info{min-width:0;flex:1}
.rank-info b{font-family:var(--title-font);font-size:12.5px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rank-info span{font-size:10.5px;color:var(--dim);display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rank-score{font-size:13px;font-weight:800;color:var(--accent);flex:none}

/* ---------- 标签页(精选片单) ---------- */
.tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}
.tabs button{
  background:linear-gradient(180deg,#14291f,#0d1c16);border:1px solid var(--line);
  color:#a8cbbc;padding:6px 14px;border-radius:9px;font-size:12px;cursor:pointer;transition:.2s;
  font-family:var(--body-font);
}
.tabs button:hover{color:#fff;border-color:var(--main)}
.tabs button.on{
  background:linear-gradient(180deg,#17c68c,#0a8b60);color:#04170f;font-weight:700;border-color:#25e0a0;
  box-shadow:0 6px 16px rgba(16,185,129,.35),0 1px 0 rgba(255,255,255,.35) inset;
}
.tab-pane{display:none}
.tab-pane.on{display:block;animation:fadeUp .4s ease}
@keyframes fadeUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* 片单盘点 */
.list-review{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
@media(max-width:767px){.list-review{grid-template-columns:1fr}}
.review-item{
  padding:10px 12px;border-radius:10px;background:linear-gradient(180deg,#11241c,#0b1a14);
  border:1px solid rgba(16,185,129,.14);border-left:3px solid var(--main);
  box-shadow:var(--shadow-sm);
}
.review-item b{font-family:var(--title-font);font-size:13px;color:#ecfdf5}
.review-item .meta{font-size:10.5px;color:var(--accent);margin-left:6px}
.review-item p{margin:4px 0 0;font-size:11.5px;color:#a9c6ba;line-height:1.65}

/* 心情选片 */
.mood-row{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.mood-row button{
  padding:8px 18px;border-radius:24px;border:1px solid var(--line);
  background:linear-gradient(180deg,#14291f,#0c1b15);color:#bfe5d5;font-size:12.5px;cursor:pointer;
  transition:.2s;box-shadow:var(--shadow-sm);
}
.mood-row button:hover{border-color:var(--accent);color:#fff}
.mood-row button.on{
  background:linear-gradient(180deg,#fbbf24,#d99a05);color:#2a1c00;font-weight:700;border-color:#ffd75e;
  box-shadow:0 8px 18px rgba(251,191,36,.3),0 1px 0 rgba(255,255,255,.4) inset;
}
.mood-pane{display:none}
.mood-pane.on{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;animation:fadeUp .35s ease}
@media(max-width:767px){.mood-pane.on{grid-template-columns:1fr}}
.mood-pane div{
  padding:9px 12px;border-radius:9px;background:linear-gradient(180deg,#11241c,#0b1a14);
  border:1px solid rgba(16,185,129,.14);font-size:12px;color:#b8d8ca;
}
.mood-pane div b{color:#ecfdf5;font-family:var(--title-font);margin-right:6px}

/* 时间线(小贴士) */
.timeline{position:relative;padding-left:22px}
.timeline::before{
  content:"";position:absolute;left:6px;top:6px;bottom:6px;width:2px;
  background:linear-gradient(180deg,var(--main),rgba(16,185,129,.08));
}
.tl-item{position:relative;padding:0 0 14px 4px}
.tl-item::before{
  content:"";position:absolute;left:-21px;top:4px;width:10px;height:10px;border-radius:50%;
  background:var(--accent);box-shadow:0 0 0 3px rgba(251,191,36,.16),0 0 10px rgba(251,191,36,.6);
}
.tl-item b{font-family:var(--title-font);font-size:12.5px;color:#ecfdf5;display:block;margin-bottom:2px}
.tl-item p{margin:0;font-size:11.5px;color:#a9c6ba;line-height:1.7}

/* ---------- 友链 ---------- */
.friend-links{padding:26px 0 8px}
.fl-box{
  background:linear-gradient(180deg,var(--panel-2),var(--panel));
  border:1px solid var(--line);border-radius:13px;padding:14px 16px;
  box-shadow:var(--shadow);font-size:12px;color:var(--dim);
}
.fl-box b{font-family:var(--title-font);color:var(--accent);font-size:13px;display:block;margin-bottom:6px;letter-spacing:.5px}

/* ---------- 页脚 ---------- */
footer{
  margin-top:20px;border-top:1px solid var(--line);
  background:linear-gradient(180deg,#08130f,#060d0a);
  padding:26px 0 18px;font-size:12px;color:var(--dim);
}
.foot-cols{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:20px;margin-bottom:16px}
@media(max-width:767px){.foot-cols{grid-template-columns:1fr}}
footer h4{font-family:var(--title-font);font-size:13.5px;color:#ecfdf5;margin-bottom:8px}
footer a{display:block;padding:3px 0;color:#8fb3a5}
footer a:hover{color:var(--main)}
.copy{border-top:1px dashed rgba(16,185,129,.2);padding-top:12px;text-align:center;font-size:11.5px}

/* ---------- 弹窗 ---------- */
.modal-mask{
  position:fixed;inset:0;z-index:2000;display:none;
  background:rgba(4,10,8,.78);backdrop-filter:blur(6px);
  align-items:center;justify-content:center;padding:18px;
}
.modal-mask.on{display:flex;animation:fadeUp .25s ease}
.modal-card{
  background:linear-gradient(180deg,#f6fffb 0%,#e9f7f1 100%);
  color:#0e2419;border-radius:16px;max-width:760px;width:100%;
  display:grid;grid-template-columns:210px 1fr;gap:0;overflow:hidden;
  box-shadow:0 30px 70px rgba(0,0,0,.8),0 1px 0 rgba(255,255,255,.9) inset;
  border:1px solid rgba(16,185,129,.5);position:relative;max-height:90vh;
}
@media(max-width:640px){.modal-card{grid-template-columns:1fr;max-height:88vh;overflow-y:auto}}
.modal-poster{background:#0d2418;position:relative;min-height:200px}
.modal-poster img{width:100%;height:100%;object-fit:cover;min-height:200px}
.modal-info{padding:18px 20px 20px;overflow-y:auto}
.modal-info h3{font-family:var(--title-font);font-size:20px;color:#07281a;margin-bottom:6px;padding-right:30px}
.modal-meta{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.m-chip{
  font-size:11px;padding:2px 9px;border-radius:20px;background:#d5f0e4;color:#0b6b4c;
  border:1px solid #a9e2cb;font-weight:600;
}
.m-chip.score{background:#fdf1cf;border-color:#f4d488;color:#8a5d00}
.modal-row{font-size:12px;color:#2c5443;margin-bottom:5px;line-height:1.7}
.modal-row b{color:#07281a;font-family:var(--title-font)}
.modal-plot{font-size:12px;color:#33594a;line-height:1.8;margin-top:8px;border-top:1px dashed #b6ddcc;padding-top:8px}
.modal-close{
  position:absolute;top:8px;right:8px;z-index:5;width:30px;height:30px;border-radius:50%;
  border:none;background:rgba(7,30,20,.82);color:#ecfdf5;font-size:16px;cursor:pointer;
  display:flex;align-items:center;justify-content:center;line-height:1;transition:.2s;
}
.modal-close:hover{background:#0b7a55;transform:rotate(90deg)}

/* ---------- 回到顶部 ---------- */
.to-top{
  position:fixed;right:18px;bottom:22px;z-index:1200;width:44px;height:44px;border-radius:50%;
  border:1px solid rgba(16,185,129,.5);
  background:linear-gradient(180deg,#14c78a,#0a7a55);color:#04170f;font-size:16px;
  display:flex;align-items:center;justify-content:center;cursor:pointer;
  box-shadow:0 10px 24px rgba(0,0,0,.6),0 1px 0 rgba(255,255,255,.35) inset;
  opacity:0;pointer-events:none;transform:translateY(14px);transition:.3s;
}
.to-top.show{opacity:1;pointer-events:auto;transform:none}
.to-top:hover{box-shadow:0 14px 30px rgba(16,185,129,.45)}

/* 懒加载占位 */
.ph{background:linear-gradient(100deg,#10251b 20%,#16342a 40%,#10251b 60%);background-size:200% 100%;animation:sh 1.4s infinite linear}
@keyframes sh{from{background-position:200% 0}to{background-position:-200% 0}}

/* --- 子页面追加 --- */
/* 顶部导航（沿用首页结构，本页补齐必要的兜底样式） */
.topbar {
  position:sticky;top:0;z-index:100;
  background:rgba(10,20,16,.92);
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);
}
.brand span {font-size:20px}
.brand:hover {color:var(--main)}
.nav-cats a:hover {color:var(--text)}
.nav-cats a.active::after {
  content:"";position:absolute;left:0;right:0;bottom:-4px;height:2px;
  background:var(--main);border-radius:2px;
}
.nav-cats a.hot {color:var(--accent)}
/* 页头 */
.about-hero {
  position:relative;overflow:hidden;
  border-bottom:1px solid var(--line);
  background:
    radial-gradient(900px 320px at 12% -20%, rgba(16,185,129,.20), transparent 60%),
    radial-gradient(700px 280px at 88% 0%, rgba(251,191,36,.12), transparent 60%),
    linear-gradient(180deg,#0c1a13 0%, var(--bg) 100%);
  padding:66px 0 54px;
}
.about-hero::after {
  content:"";position:absolute;inset:0;pointer-events:none;
  background:repeating-linear-gradient(90deg,rgba(255,255,255,.02) 0 1px,transparent 1px 90px);
  opacity:.5;
}
.about-hero .inner {position:relative;z-index:2;max-width:1240px;margin:0 auto;padding:0 20px}
.about-hero h1 {
  font-family:var(--title-font);
  font-size:clamp(28px,4.4vw,46px);
  line-height:1.22;margin:0 0 16px;font-weight:800;letter-spacing:.5px;
}
.about-hero h1 em {color:var(--main);font-style:normal}
.about-hero p {
  color:var(--dim);font-size:16px;line-height:1.85;
  max-width:760px;margin:0 0 26px;
}
.hero-pills {display:flex;flex-wrap:wrap;gap:10px}
.pill i {color:var(--main);font-size:12.5px}
.pill.amber i {color:var(--accent)}
/* 通用区块 */
.sec {padding:56px 0}
.sec-head h2 span {color:var(--main)}
/* 内容卡片（自写类名，不依赖 Bootstrap 组件） */
.about-card {
  background:linear-gradient(180deg,var(--panel) 0%, var(--panel-2) 100%);
  border:1px solid var(--line);border-radius:16px;
  padding:26px 24px;box-shadow:var(--shadow);height:100%;
}
.about-card .ic {
  width:44px;height:44px;border-radius:12px;display:grid;place-items:center;
  background:rgba(16,185,129,.14);border:1px solid var(--line);
  color:var(--main);font-size:18px;margin-bottom:16px;
}
.about-card.amber .ic {background:rgba(251,191,36,.13);border-color:rgba(251,191,36,.28);color:var(--accent)}
.about-card h3 {
  font-family:var(--title-font);font-size:18.5px;font-weight:700;
  margin:0 0 10px;letter-spacing:.3px;
}
.about-card p {color:var(--dim);font-size:14.5px;line-height:1.85;margin:0}
/* 正文段落块 */
.prose {
  background:var(--panel);border:1px solid var(--line);border-radius:16px;
  padding:30px 28px;box-shadow:var(--shadow-sm);
}
.prose p {color:var(--dim);font-size:15px;line-height:1.95;margin:0 0 16px}
.prose p:last-child {margin-bottom:0}
.prose strong {color:var(--text);font-weight:600}
/* 选片标准列表 */
.std-list {list-style:none;margin:0;padding:0}
.std-list li {
  display:flex;gap:14px;padding:16px 0;border-bottom:1px dashed var(--line);
}
.std-list li:last-child {border-bottom:none;padding-bottom:0}
.std-list li:first-child {padding-top:0}
.std-num {
  flex:0 0 34px;height:34px;border-radius:10px;
  display:grid;place-items:center;font-weight:800;font-size:14px;
  background:rgba(16,185,129,.14);border:1px solid var(--line);color:var(--main);
  font-family:var(--body-font);
}
.std-list h4 {margin:0 0 6px;font-size:15.5px;font-weight:700;color:var(--text);font-family:var(--title-font)}
.std-list p {margin:0;color:var(--dim);font-size:14.5px;line-height:1.8}
/* 数据条 */
.stat-strip {
  display:grid;grid-template-columns:repeat(4,1fr);gap:16px;
}
.stat-item {
  background:linear-gradient(180deg,var(--panel) 0%, var(--panel-2) 100%);
  border:1px solid var(--line);border-radius:14px;
  padding:22px 18px;text-align:center;box-shadow:var(--shadow-sm);
}
.stat-item b {
  display:block;font-family:var(--title-font);
  font-size:28px;color:var(--main);font-weight:800;letter-spacing:.5px;
}
.stat-item span {display:block;margin-top:6px;color:var(--dim);font-size:13.5px}
/* 时间线 */
.timeline {position:relative;padding-left:26px}
.tl-item:last-child {padding-bottom:0}
.tl-item h4 {
  margin:0 0 6px;font-size:15.5px;font-weight:700;font-family:var(--title-font);
}
.tl-item h4 small {color:var(--accent);font-weight:600;font-size:13px;margin-right:8px;font-family:var(--body-font)}
/* CTA */
.cta-box {
  background:
    radial-gradient(600px 220px at 15% 0%, rgba(16,185,129,.22), transparent 65%),
    linear-gradient(180deg,var(--panel-2),var(--panel));
  border:1px solid var(--line);border-radius:18px;
  padding:38px 30px;text-align:center;box-shadow:var(--shadow);
}
.cta-box h2 {
  font-family:var(--title-font);font-size:clamp(21px,2.6vw,28px);
  margin:0 0 12px;font-weight:800;
}
.cta-box p {color:var(--dim);font-size:15px;line-height:1.8;margin:0 auto 22px;max-width:640px}
.btn-ghost {
  display:inline-flex;align-items:center;gap:9px;
  background:transparent;border:1px solid var(--line);color:var(--text);
  font-weight:600;font-size:15px;padding:12px 24px;border-radius:999px;
  text-decoration:none;margin-left:12px;transition:border-color .2s,color .2s;
}
.btn-ghost:hover {border-color:var(--main);color:var(--main)}
/* 页脚 */
.foot {
  margin-top:20px;border-top:1px solid var(--line);
  background:linear-gradient(180deg,var(--bg),#08110d);
  padding:44px 0 26px;
}
.foot-inner {max-width:1240px;margin:0 auto;padding:0 20px}
.foot-grid {display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:30px}
.foot h5 {
  font-family:var(--title-font);font-size:15px;font-weight:700;
  margin:0 0 14px;color:var(--text);letter-spacing:.4px;
}
.foot p {color:var(--dim);font-size:14px;line-height:1.85;margin:0}
.foot ul {list-style:none;margin:0;padding:0}
.foot ul li {margin-bottom:10px}
.foot ul a {color:var(--dim);text-decoration:none;font-size:14px;transition:color .2s}
.foot ul a:hover {color:var(--main)}
.foot-bottom {
  margin-top:32px;padding-top:20px;border-top:1px solid var(--line);
  display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;
  color:var(--dim);font-size:13px;
}
.foot-brand {
  display:flex;align-items:center;gap:8px;font-family:var(--title-font);
  font-size:18px;font-weight:800;color:var(--text);margin-bottom:12px;
}
.foot-brand span {font-size:17px}
.stat-strip {grid-template-columns:repeat(2,1fr)}
.foot-grid {grid-template-columns:1fr}
.nav-cats a.active::after {display:none}
.about-hero {padding:44px 0 38px}
.prose {padding:24px 20px}
.btn-ghost {margin-left:0;margin-top:12px}

/* --- 子页面追加 --- */
/* 本页专属少量样式，配色全部沿用站点变量 */
  .guide-wrap {max-width:1120px;margin:0 auto;padding:0 18px;}
.guide-hero {
    background:linear-gradient(160deg,var(--panel-2),var(--bg) 70%);
    border-bottom:1px solid var(--line);padding:64px 0 48px;position:relative;overflow:hidden;
  }
.guide-hero::after {
    content:"";position:absolute;right:-80px;top:-80px;width:320px;height:320px;border-radius:50%;
    background:radial-gradient(circle,rgba(16,185,129,.20),transparent 70%);pointer-events:none;
  }
.guide-hero h1 {
    font-family:var(--title-font);color:var(--text);font-size:clamp(26px,4vw,42px);
    line-height:1.35;margin:14px 0 14px;font-weight:800;
  }
.guide-hero p {color:var(--dim);max-width:760px;line-height:1.9;margin:0;}
.g-tag {
    display:inline-flex;align-items:center;gap:8px;background:rgba(16,185,129,.12);
    border:1px solid var(--line);color:var(--main);border-radius:999px;
    padding:6px 16px;font-size:13px;letter-spacing:.5px;
  }
.guide-sec {padding:52px 0;border-bottom:1px solid var(--line);}
.guide-sec:last-of-type {border-bottom:none;}
.guide-sec h2 {
    font-family:var(--title-font);color:var(--text);font-size:clamp(20px,2.6vw,28px);
    font-weight:800;margin:0 0 8px;line-height:1.4;
  }
.guide-sec h2 .num {
    color:var(--main);font-family:var(--body-font);font-size:15px;font-weight:700;
    margin-right:10px;vertical-align:middle;
  }
.guide-sec .lead {color:var(--dim);margin:0 0 26px;line-height:1.85;max-width:820px;}
.step-grid {display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px;}
.step-card {
    background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:24px;
    box-shadow:var(--shadow-sm);transition:.25s;position:relative;
  }
.step-card:hover {transform:translateY(-4px);border-color:rgba(16,185,129,.5);}
.step-card .ico {
    width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;
    background:rgba(16,185,129,.14);color:var(--main);font-size:18px;margin-bottom:16px;
  }
.step-card h3 {color:var(--text);font-size:17px;font-weight:700;margin:0 0 10px;font-family:var(--body-font);}
.step-card p {color:var(--dim);font-size:14.5px;line-height:1.8;margin:0;}
.tip-list {list-style:none;padding:0;margin:0;display:grid;gap:14px;}
.tip-list li {
    background:var(--panel);border:1px solid var(--line);border-left:3px solid var(--main);
    border-radius:12px;padding:16px 20px;color:var(--dim);line-height:1.8;font-size:14.5px;
  }
.tip-list li strong {color:var(--text);font-weight:700;}
.cat-lines {display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;}
.cat-line {
    background:linear-gradient(150deg,var(--panel-2),var(--panel));
    border:1px solid var(--line);border-radius:14px;padding:20px 22px;box-shadow:var(--shadow-sm);
  }
.cat-line h3 {
    color:var(--accent);font-size:16px;font-weight:700;margin:0 0 8px;display:flex;align-items:center;gap:8px;
  }
.cat-line p {color:var(--dim);font-size:14px;line-height:1.8;margin:0;}
.faq-item {
    background:var(--panel);border:1px solid var(--line);border-radius:12px;margin-bottom:12px;overflow:hidden;
  }
.faq-item summary {
    cursor:pointer;padding:16px 20px;color:var(--text);font-weight:600;font-size:15px;
    list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px;
  }
.faq-item summary::-webkit-details-marker {display:none;}
.faq-item summary i {color:var(--main);transition:.25s;font-size:13px;}
.faq-item[open] summary i {transform:rotate(180deg);}
.faq-item .ans {padding:0 20px 18px;color:var(--dim);font-size:14.5px;line-height:1.85;}
.cta-box .btn-play {display:inline-flex;align-items:center;gap:10px;text-decoration:none;}
.guide-hero {padding:44px 0 34px;}
.guide-sec {padding:38px 0;}

/* --- 子页面追加 --- */
.page-hero {
    padding:56px 0 30px;
    background:radial-gradient(120% 120% at 12% 0%,rgba(16,185,129,.20),transparent 58%),
               radial-gradient(90% 90% at 92% 10%,rgba(251,191,36,.12),transparent 60%),
               var(--bg);
    border-bottom:1px solid var(--line);
  }
.page-hero .crumb {font-size:13px;color:var(--dim);margin-bottom:14px;letter-spacing:.4px}
.page-hero .crumb a {color:var(--dim);text-decoration:none}
.page-hero .crumb a:hover {color:var(--main)}
.page-hero .crumb span {color:var(--main)}
.page-hero h1 {
    font-family:var(--title-font);
    font-size:clamp(26px,4vw,44px);
    line-height:1.25;
    color:var(--text);
    margin:0 0 16px;
    letter-spacing:.5px;
  }
.page-hero h1 em {font-style:normal;color:var(--accent)}
.page-hero p {color:var(--dim);max-width:760px;line-height:1.9;font-size:15px;margin:0}
.page-hero .stamp {
    display:inline-flex;align-items:center;gap:8px;margin-top:20px;
    padding:7px 14px;border-radius:999px;font-size:12.5px;color:var(--accent);
    background:rgba(251,191,36,.10);border:1px solid rgba(251,191,36,.30);
  }
.doc-wrap {padding:44px 0 64px}
.doc-layout {display:grid;grid-template-columns:250px minmax(0,1fr);gap:34px;align-items:start}
.doc-toc {
    position:sticky;top:84px;
    background:var(--panel);border:1px solid var(--line);border-radius:14px;
    padding:20px 18px;box-shadow:var(--shadow-sm);
  }
.doc-toc h3 {
    font-size:13px;letter-spacing:2px;color:var(--dim);font-weight:600;
    margin:0 0 14px;text-transform:uppercase;
  }
.doc-toc a {
    display:block;color:var(--dim);text-decoration:none;font-size:13.5px;
    padding:8px 10px;border-radius:8px;border-left:2px solid transparent;
    transition:.2s;line-height:1.5;
  }
.doc-toc a:hover {color:var(--text);background:var(--panel-2);border-left-color:var(--main)}
.doc-body {
    background:var(--panel);border:1px solid var(--line);border-radius:16px;
    padding:36px 38px;box-shadow:var(--shadow);
  }
.doc-body section {padding-bottom:30px;margin-bottom:30px;border-bottom:1px dashed var(--line)}
.doc-body section:last-child {border-bottom:none;margin-bottom:0;padding-bottom:0}
.doc-body h2 {
    font-family:var(--title-font);
    font-size:clamp(19px,2.4vw,23px);color:var(--text);
    margin:0 0 16px;line-height:1.5;display:flex;gap:12px;align-items:flex-start;
  }
.doc-body h2 .num {
    flex:none;display:inline-flex;align-items:center;justify-content:center;
    width:30px;height:30px;border-radius:9px;font-size:14px;font-weight:700;
    background:rgba(16,185,129,.14);color:var(--main);border:1px solid var(--line);
    font-family:var(--body-font);
  }
.doc-body p {color:var(--dim);line-height:1.95;font-size:14.6px;margin:0 0 14px}
.doc-body p:last-child {margin-bottom:0}
.doc-body strong {color:var(--text);font-weight:600}
.doc-body ul {margin:0 0 14px;padding-left:0;list-style:none}
.doc-body ul li {
    position:relative;padding-left:22px;color:var(--dim);line-height:1.9;
    font-size:14.4px;margin-bottom:9px;
  }
.doc-body ul li::before {
    content:"\f058";font-family:"Font Awesome 6 Free";font-weight:900;
    position:absolute;left:0;top:2px;font-size:12px;color:var(--main);
  }
.doc-body .hl {
    background:var(--panel-2);border:1px solid var(--line);border-left:3px solid var(--accent);
    border-radius:10px;padding:16px 18px;margin:18px 0;color:var(--dim);
    font-size:14px;line-height:1.9;
  }
.doc-body .hl i {color:var(--accent);margin-right:8px}
.contact-box {
    display:flex;flex-wrap:wrap;gap:14px;margin-top:18px;
  }
.contact-box a {
    display:inline-flex;align-items:center;gap:9px;
    padding:11px 20px;border-radius:10px;text-decoration:none;font-size:14px;
    font-weight:600;transition:.22s;border:1px solid var(--line);
    color:var(--text);background:var(--panel-2);
  }
.contact-box a.primary {background:var(--main);color:#04140e;border-color:var(--main)}
.contact-box a:hover {transform:translateY(-2px);box-shadow:var(--shadow-sm)}
.contact-box a.primary:hover {background:#0ea472}
.doc-layout {grid-template-columns:1fr;gap:22px}
.doc-toc {position:static}
.doc-body {padding:26px 20px}
.page-hero {padding:38px 0 24px}
.doc-wrap {padding:30px 0 46px}

/* --- 子页面追加 --- */
/* ===== 本页专属少量样式（复用站点变量） ===== */
.contact-card {
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:16px;
  padding:26px 24px;
  height:100%;
  box-shadow:var(--shadow-sm);
  transition:border-color .2s,transform .2s;
}
.contact-card:hover {border-color:rgba(16,185,129,.5);transform:translateY(-2px);}
.contact-icon {
  width:46px;height:46px;border-radius:12px;
  display:flex;align-items:center;justify-content:center;
  background:rgba(16,185,129,.14);
  border:1px solid var(--line);
  color:var(--main);font-size:19px;margin-bottom:16px;
}
.contact-card h3 {
  font-family:var(--title-font);
  font-size:18px;color:var(--text);margin:0 0 12px;line-height:1.5;
}
.contact-card p {
  color:var(--dim);font-size:14.5px;line-height:1.85;margin:0 0 12px;
}
.contact-card p strong {color:var(--text);font-weight:600;}
.contact-mail {
  display:inline-flex;align-items:center;gap:8px;
  background:var(--panel-2);
  border:1px solid var(--line);
  color:var(--main) !important;
  font-size:14px;padding:7px 14px;border-radius:999px;
  margin:4px 0 10px !important;
  letter-spacing:.3px;
}
.contact-eta {
  color:var(--accent) !important;
  font-size:13px !important;
  padding-top:10px;border-top:1px dashed var(--line);
  margin:0 !important;
}
.tip-list li i {color:var(--main);margin-top:4px;font-size:13px;}
.tip-list li span {color:var(--dim);font-size:14.5px;line-height:1.8;}
.tip-list li span strong {color:var(--text);font-weight:600;}
.notice-panel {
  background:linear-gradient(160deg,var(--panel-2),var(--panel));
  border:1px solid var(--line);
  border-left:3px solid var(--accent);
  border-radius:14px;
  padding:24px;height:100%;
  box-shadow:var(--shadow-sm);
}
.notice-panel h3 {
  font-family:var(--title-font);
  font-size:17px;color:var(--accent);margin:0 0 14px;
  display:flex;align-items:center;gap:9px;
}
.notice-panel p {color:var(--dim);font-size:14.5px;line-height:1.9;margin:0 0 12px;}
.notice-panel p:last-child {margin-bottom:0;}
.notice-panel p strong {color:var(--text);}
.faq-list {display:flex;flex-direction:column;gap:12px;}
.faq-item h3 {
  font-size:16px;color:var(--text);margin:0 0 10px;
  display:flex;align-items:center;gap:10px;line-height:1.6;
  font-weight:600;
}
.faq-item h3 i {color:var(--main);font-size:12px;}
.faq-item p {color:var(--dim);font-size:14.5px;line-height:1.9;margin:0;}
.plain-card {
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:14px;
  padding:24px;height:100%;
  box-shadow:var(--shadow-sm);
}
.plain-card h3 {
  font-family:var(--title-font);
  font-size:17px;color:var(--text);margin:0 0 12px;
}
.plain-card p {color:var(--dim);font-size:14.5px;line-height:1.9;margin:0;}
/* ===== 页脚 ===== */
.footer {
  background:var(--panel);
  border-top:1px solid var(--line);
  padding:52px 0 26px;
  margin-top:56px;
}
.footer .brand {
  font-family:var(--title-font);
  font-size:20px;color:var(--text);
  display:inline-flex;align-items:center;gap:8px;
  text-decoration:none;margin-bottom:14px;
}
.footer-desc {color:var(--dim);font-size:13.5px;line-height:1.85;max-width:420px;}
.footer h4 {
  font-size:14px;color:var(--text);margin:0 0 14px;
  letter-spacing:.5px;font-weight:600;
}
.footer-links {list-style:none;padding:0;margin:0;}
.footer-links li {margin-bottom:10px;}
.footer-links a {
  color:var(--dim);font-size:13.5px;text-decoration:none;
  transition:color .2s;
}
.footer-links a:hover {color:var(--main);}
.footer-bottom {
  border-top:1px solid var(--line);
  margin-top:36px;padding-top:20px;
  display:flex;flex-wrap:wrap;gap:10px;
  justify-content:space-between;align-items:center;
}
.footer-bottom p {color:var(--dim);font-size:12.5px;margin:0;}
.contact-card {padding:22px 18px;}
.footer {padding:40px 0 22px;}