/* ============================================================
   各个击破 · 专属样式
   ============================================================ */
.gjp-hero{
  background:linear-gradient(135deg,var(--navy) 0%,#2A5680 60%,#356B96 100%);
  color:#fff;padding:54px 0 46px;border-bottom:3px solid var(--gold);
}
.gjp-hero .gh-in{max-width:1180px;margin:0 auto;padding:0 32px;}
.gjp-hero .eyebrow{font-size:13px;letter-spacing:2px;color:var(--gold-2);font-weight:600;margin-bottom:10px;}
.gjp-hero h1{color:#fff;font-size:34px;margin:0 0 12px;}
.gjp-hero p{color:rgba(255,255,255,.82);max-width:720px;font-size:15px;line-height:1.7;margin:0;}
.gjp-hero .badges{margin-top:18px;display:flex;gap:10px;flex-wrap:wrap;}
.gjp-hero .badge{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.25);
  padding:6px 14px;border-radius:20px;font-size:13px;color:#fff;}

.gjp-tabs{max-width:1180px;margin:0 auto;padding:22px 32px 0;}
.gjp-tabbar{display:flex;gap:10px;flex-wrap:wrap;border-bottom:1px solid var(--line);}
.gjp-tab{appearance:none;border:0;background:transparent;cursor:pointer;
  font-size:15px;font-weight:600;color:var(--ink-2);padding:12px 20px;border-bottom:3px solid transparent;}
.gjp-tab .t-ic{color:var(--gold);margin-right:7px;}
.gjp-tab.on{color:var(--navy);border-bottom-color:var(--gold);}
.gjp-tab .t-sub{display:block;font-size:11.5px;font-weight:400;color:var(--ink-3);margin-top:2px;}

.gjp-main{max-width:1180px;margin:0 auto;padding:26px 32px 60px;}
.gjp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
@media(max-width:900px){.gjp-grid{grid-template-columns:repeat(2,1fr);}.gjp-hero .gh-in,.gjp-tabs,.gjp-main{padding-left:16px;padding-right:16px;}}
@media(max-width:600px){.gjp-grid{grid-template-columns:1fr;}}

.gjp-card{background:var(--white);border:1px solid var(--line);border-radius:14px;overflow:hidden;
  display:flex;flex-direction:column;transition:transform .15s,box-shadow .15s,border-color .15s;}
.gjp-card:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(27,58,92,.12);border-color:var(--gold-2);}
.gjp-card .cov{height:118px;background:linear-gradient(135deg,var(--navy-2),var(--navy));position:relative;display:flex;align-items:center;justify-content:center;}
.gjp-card .cov .idx{font-size:46px;font-weight:800;color:rgba(255,255,255,.92);}
.gjp-card .cov .idx small{font-size:16px;font-weight:600;color:var(--gold-2);display:block;text-align:center;}
.gjp-card .cov .tag{position:absolute;top:10px;left:10px;background:rgba(255,255,255,.16);
  border:1px solid rgba(255,255,255,.28);color:#fff;font-size:11.5px;padding:3px 9px;border-radius:12px;}
.gjp-card .cov .dur{position:absolute;top:10px;right:10px;background:var(--gold);color:#fff;
  font-size:11.5px;font-weight:600;padding:3px 9px;border-radius:12px;}
.gjp-card .body{padding:14px 16px 16px;display:flex;flex-direction:column;flex:1;}
.gjp-card .body h3{margin:0 0 4px;font-size:17px;color:var(--navy);}
.gjp-card .body .en{font-size:12px;color:var(--ink-3);margin:0 0 10px;letter-spacing:.3px;}
.gjp-card .body .desc{font-size:13px;color:var(--ink-2);line-height:1.6;margin:0 0 14px;flex:1;}
.gjp-card .body .go{display:inline-flex;align-items:center;justify-content:center;gap:7px;
  background:var(--navy);color:#fff;font-size:13.5px;font-weight:600;padding:9px 0;border-radius:8px;text-decoration:none;}
.gjp-card .body .go:hover{background:var(--navy-2);text-decoration:none;}

.gjp-foot{max-width:1180px;margin:0 auto;padding:0 32px 50px;color:var(--ink-3);font-size:13px;}

/* ---------- 播放页 ---------- */
.ply-wrap{max-width:900px;margin:0 auto;padding:24px 20px 60px;}
.ply-back{font-size:13.5px;color:var(--navy-2);text-decoration:none;display:inline-block;margin-bottom:14px;}
.ply-back:hover{text-decoration:underline;}
.ply-head{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:6px;}
.ply-head h1{font-size:23px;color:var(--navy);margin:0;}
.ply-head .en{font-size:13px;color:var(--ink-3);}
.ply-head .part{font-size:12px;font-weight:600;color:#8A5F26;background:var(--gold-soft);
  border:1px solid #E8D5B5;padding:3px 10px;border-radius:12px;}
.ply-sub{color:var(--ink-2);font-size:14px;margin:0 0 16px;}

.ply-stage{position:relative;background:var(--white);border:1px solid var(--line);border-radius:16px;
  overflow:hidden;box-shadow:0 10px 30px rgba(27,58,92,.08);}
.ply-screen{position:relative;width:100%;aspect-ratio:640/360;background:var(--bg);}
.ply-screen .illu-svg{position:absolute;inset:0;width:100%;height:100%;opacity:0;transform:scale(.97);
  transition:opacity .5s ease,transform .5s ease;}
.ply-screen .illu-svg.show{opacity:1;transform:scale(1);}
.ply-navbtn{position:absolute;top:50%;transform:translateY(-50%);z-index:6;
  width:48px;height:48px;border-radius:50%;border:0;background:rgba(27,58,92,.55);color:#fff;
  font-size:30px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;
  text-decoration:none;transition:background .15s,transform .15s;}
.ply-navbtn:hover{background:var(--gold);text-decoration:none;transform:translateY(-50%) scale(1.06);}
.ply-navbtn.ply-prev{left:12px;}
.ply-navbtn.ply-next{right:12px;}
.ply-cap{position:absolute;left:0;right:0;bottom:0;padding:14px 18px;
  background:linear-gradient(0deg,rgba(27,58,92,.86),rgba(27,58,92,0));}
.ply-cap .ct{color:#fff;font-size:15px;font-weight:700;margin:0 0 4px;}
.ply-cap .cs{color:rgba(255,255,255,.9);font-size:13.5px;line-height:1.6;margin:0;}

.ply-bar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:14px 18px;border-top:1px solid var(--line);}
.ply-ctrl{display:flex;gap:8px;}
.ply-ctrl button{appearance:none;border:1px solid var(--line);background:var(--bg-2);color:var(--navy);
  width:42px;height:38px;border-radius:9px;font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;}
.ply-ctrl button:hover{background:var(--gold-soft);border-color:var(--gold-2);}
.ply-ctrl button.primary{background:var(--navy);color:#fff;border-color:var(--navy);}
.ply-ctrl button.primary:hover{background:var(--navy-2);}
.ply-prog{flex:1;height:8px;background:var(--bg-2);border-radius:6px;overflow:hidden;cursor:pointer;}
.ply-prog .fill{height:100%;width:0;background:linear-gradient(90deg,var(--gold-2),var(--gold));transition:width .2s linear;}
.ply-time{font-size:12.5px;color:var(--ink-3);font-variant-numeric:tabular-nums;min-width:74px;text-align:right;}
.ply-voice{flex-basis:100%;display:flex;align-items:center;gap:10px;margin-top:4px;flex-wrap:wrap;
  padding-top:12px;border-top:1px dashed var(--line);}
.ply-voice .vo{appearance:none;border:1px solid var(--line);background:var(--bg-2);color:var(--ink-2);
  font-size:13px;font-weight:600;padding:8px 14px;border-radius:9px;cursor:pointer;display:inline-flex;align-items:center;gap:6px;}
.ply-voice .vo:hover{background:var(--gold-soft);border-color:var(--gold-2);}
.ply-voice .vo.on{background:var(--gold);color:#fff;border-color:var(--gold);box-shadow:0 4px 12px rgba(212,160,60,.3);}
.ply-voice select{appearance:none;border:1px solid var(--line);background:var(--bg-2);color:var(--navy);
  font-size:13px;padding:7px 10px;border-radius:8px;cursor:pointer;}
.ply-voice select:hover{border-color:var(--gold-2);}
.ply-voice .vstat{font-size:12px;color:var(--ink-3);}
.ply-dots{display:flex;gap:6px;padding:0 18px 14px;flex-wrap:wrap;}
.ply-dots button{appearance:none;border:0;background:var(--line-2);width:9px;height:9px;border-radius:50%;padding:0;cursor:pointer;}
.ply-dots button.on{background:var(--gold);width:22px;border-radius:5px;}

/* 解说脚本面板 */
.ply-script{margin-top:22px;background:var(--white);border:1px solid var(--line);border-radius:14px;overflow:hidden;}
.ply-script .sh{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;
  border-bottom:1px solid var(--line);cursor:pointer;user-select:none;}
.ply-script .sh h2{margin:0;font-size:16px;color:var(--navy);}
.ply-script .sh .tog{font-size:13px;color:var(--navy-2);}
.ply-script .sbody{padding:6px 18px 18px;display:none;}
.ply-script.open .sbody{display:block;}
.ply-script ol{margin:10px 0 0;padding-left:0;list-style:none;counter-reset:s;}
.ply-script ol li{counter-increment:s;position:relative;padding:11px 0 11px 40px;border-bottom:1px dashed var(--line);
  font-size:14px;line-height:1.7;color:var(--ink-2);}
.ply-script ol li:before{content:counter(s);position:absolute;left:0;top:11px;width:26px;height:26px;border-radius:7px;
  background:var(--gold-soft);color:#8A5F26;font-weight:700;font-size:13px;display:flex;align-items:center;justify-content:center;}
.ply-script .take{margin:14px 0 0;padding:12px 14px;background:var(--gold-soft);border-left:4px solid var(--gold);
  border-radius:8px;font-size:14px;line-height:1.7;color:var(--ink);}
.ply-script .take b{color:#8A5F26;}
.ply-script .copy{margin-top:14px;appearance:none;border:1px solid var(--line);background:var(--bg-2);
  color:var(--navy);font-size:13px;padding:8px 16px;border-radius:8px;cursor:pointer;}
.ply-script .copy:hover{background:var(--gold-soft);border-color:var(--gold-2);}

.ply-nav{display:flex;justify-content:space-between;gap:12px;margin-top:22px;}
.ply-nav a{flex:1;text-align:center;background:var(--bg-2);border:1px solid var(--line);border-radius:10px;
  padding:12px;font-size:13.5px;color:var(--navy-2);text-decoration:none;}
.ply-nav a:hover{background:var(--gold-soft);border-color:var(--gold-2);text-decoration:none;color:var(--navy);}
.ply-nav a.disabled{opacity:.4;pointer-events:none;}
.ply-nav a .lab{display:block;font-size:11.5px;color:var(--ink-3);margin-bottom:3px;}

.gjp-note{background:var(--gold-soft);border-left:4px solid var(--gold);border-radius:8px;
  padding:12px 14px;font-size:13px;color:var(--ink);line-height:1.7;margin:0 0 18px;}
