/* =========================================================
   网上练兵入口单页 practice.css
   仅复用全站设计令牌与内页骨架（news.css banner/面包屑/页脚内页覆盖），
   其余 pb- 前缀自成体系：说明条 + 双入口卡（蓝/青双色与考试通道页同源，右上角 01/02 大序号呼应练兵编号）
   ========================================================= */
:root{
  --primary:#1A5CFF; --primary-2:#2E7CFF;
  --navy:#14317C;
  --sky-4:#F2F9FF;
  --t1:#16233F; --t2:#5A6A8C; --t3:#93A1BE; --line:#E3EAF7;
  --surface:#F5F8FF;
  --shadow:0 10px 30px rgba(26,92,255,.10);
  --shadow-lg:0 22px 48px rgba(10,35,90,.16);
  --ease:cubic-bezier(.22,.61,.36,1);
  --font-cn:"MiSans","HarmonyOS Sans SC","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  --font-num:"Bahnschrift","DIN Alternate","Segoe UI",var(--font-cn);
  --ev-green:#0FB5BA; --ev-green-d:#0A8F92;
  --orange:#FF8A3D;
}

.pb-wrap{padding-bottom:40px}

/* ============ ① 顶部说明条（浅灰底卡：与全站 --surface 内页底色同源） ============ */
.pb-note{position:relative;border-radius:24px;margin-top:18px;
  background:var(--surface);
  border:1px solid rgba(26,92,255,.14);
  color:var(--t1);padding:26px 30px;box-shadow:var(--shadow)}
.pb-note-main{min-width:0}
.pb-note-title{font-size:16.5px;font-weight:700;line-height:1.7;letter-spacing:.02em;color:var(--navy)}
.pb-note-title b{color:var(--orange);font-weight:800} /* 练兵要点：与全站「丰厚奖金」同款活力橙点缀 */

/* ============ ② 双入口卡 ============ */
.pb-entries{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:22px}
.pb-card{position:relative;background:#fff;border-radius:24px;padding:28px 30px 26px;min-width:0;
  box-shadow:var(--shadow);border:1px solid rgba(227,234,247,.9);overflow:hidden;
  transition:transform .3s var(--ease),box-shadow .3s var(--ease);display:flex;flex-direction:column}
.pb-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg)}
/* 顶部色条 + 角部渐晕 */
.pb-card::before{content:"";position:absolute;inset:0 0 auto;height:6px}
.pb-card::after{content:"";position:absolute;right:-70px;top:-90px;width:230px;height:230px;border-radius:50%;pointer-events:none}
.pb-blue::before{background:linear-gradient(90deg,var(--primary-2),var(--primary))}
.pb-blue::after{background:radial-gradient(circle,rgba(46,124,255,.12),transparent 65%)}
.pb-green::before{background:linear-gradient(90deg,var(--ev-green),var(--ev-green-d))}
.pb-green::after{background:radial-gradient(circle,rgba(15,181,186,.12),transparent 65%)}
/* 右上角大序号（练兵 01 / 02，水印式衬底） */
.pb-num{position:absolute;right:22px;top:14px;z-index:1;pointer-events:none;
  font-family:var(--font-num);font-size:64px;font-weight:800;line-height:1;letter-spacing:.04em;opacity:.08}
.pb-blue .pb-num{color:var(--primary)}
.pb-green .pb-num{color:var(--ev-green-d)}
.pb-card-head{position:relative;z-index:2;padding-top:10px;margin-bottom:2px}
.pb-card-title{font-size:clamp(19px,2vw,23px);font-weight:900;color:var(--navy);letter-spacing:.03em;line-height:1.35}
.pb-card-sub{position:relative;z-index:2;margin:4px 0 0;font-size:13.5px;line-height:1.6;color:var(--t2)}
/* 信息栏 */
.pb-info{position:relative;z-index:2;margin:14px 0 22px;display:flex;flex-direction:column;gap:0}
.pb-info>div{display:grid;grid-template-columns:86px minmax(0,1fr);gap:12px;padding:11px 0;border-top:1px dashed var(--line);font-size:14px;line-height:1.7}
.pb-info dt{font-weight:800;color:var(--primary);letter-spacing:.02em}
.pb-green .pb-info dt{color:var(--ev-green-d)}
.pb-info dd{color:var(--t1)}
.pb-info dd b{font-weight:800;color:var(--navy);padding:0 1px}
.pb-blue .pb-info dd b{color:var(--primary)}
.pb-green .pb-info dd b{color:var(--ev-green-d)}
/* 进入按钮（贴卡片底部，真实外链新窗口打开） */
.pb-go{position:relative;z-index:2;margin-top:auto;display:flex;align-items:center;justify-content:center;gap:8px;
  font-size:16.5px;font-weight:800;letter-spacing:.06em;color:#fff;text-decoration:none;
  border-radius:14px;padding:15px 22px;transition:transform .25s var(--ease),box-shadow .25s var(--ease),filter .25s}
.pb-go .ic{width:18px;height:18px;transition:transform .25s var(--ease)}
.pb-blue .pb-go{background:linear-gradient(120deg,var(--primary-2),var(--primary) 55%,#1140C2);box-shadow:0 12px 26px rgba(26,92,255,.32)}
.pb-green .pb-go{background:linear-gradient(120deg,#17C6C0,var(--ev-green) 55%,var(--ev-green-d));box-shadow:0 12px 26px rgba(15,181,186,.3)}
.pb-go:hover{transform:translateY(-2px);filter:brightness(1.05)}
.pb-blue .pb-go:hover{box-shadow:0 18px 34px rgba(26,92,255,.42)}
.pb-green .pb-go:hover{box-shadow:0 18px 34px rgba(15,181,186,.4)}
.pb-go:hover .ic{transform:translateX(4px)}
.pb-go:focus-visible{outline:3px solid rgba(26,92,255,.4);outline-offset:2px}

/* ============ 响应式 ============ */
@media (max-width:995px){
  .pb-note{padding:22px 22px 20px}
  .pb-entries{grid-template-columns:1fr;gap:16px}
  .pb-card{padding:22px 22px 20px}
  .pb-num{font-size:52px;right:16px}
}
@media (max-width:620px){
  .pb-wrap{padding-bottom:28px}
  .pb-note{border-radius:18px}
  .pb-note-title{font-size:14.5px}
  .pb-card{border-radius:18px}
  .pb-num{font-size:44px;top:10px}
  .pb-info>div{grid-template-columns:72px minmax(0,1fr);font-size:13px;padding:9px 0}
  .pb-go{font-size:15px;padding:13px 18px;border-radius:12px}
}
@media (prefers-reduced-motion:reduce){
  .pb-card,.pb-go{transition:none}
}