/* ================ 付费门 / 学习倒计时 ================ */
#payGate{
  position:fixed; inset:0; z-index:9999;
  background:rgba(20,40,30,.55); backdrop-filter:blur(4px);
  display:none; align-items:flex-start; justify-content:center;
  overflow-y:auto; padding:24px 14px 40px;
}
#payGate.show{ display:flex; }
.pg-card{
  width:100%; max-width:420px; background:var(--card);
  border-radius:22px; box-shadow:var(--shadow-big);
  padding:22px 20px 24px; margin:auto 0;
}
.pg-head{ text-align:center; font-size:19px; font-weight:700; margin-bottom:14px; }
.pg-body .btn-block{ width:100%; }

.pg-price{ text-align:center; font-size:46px; font-weight:800; color:var(--green-d); line-height:1.1; }
.pg-price small{ font-size:22px; font-weight:700; margin-right:2px; }
.pg-price span{ font-size:15px; font-weight:500; color:var(--ink2); }

.pg-rules{ list-style:none; margin:16px 0 6px; padding:0; }
.pg-rules li{ padding:9px 12px; background:var(--green-l); border-radius:12px; margin-bottom:8px; font-size:14px; line-height:1.5; }
.pg-rules b{ color:var(--green-d); }

.pg-owned{ margin:14px 0 4px; padding-top:12px; border-top:1px dashed var(--line); }

.pg-agree{ display:flex; align-items:flex-start; gap:7px; font-size:13px; color:var(--ink2);
  margin:16px 0 12px; line-height:1.5; }
.pg-agree input{ margin-top:2px; width:16px; height:16px; flex:none; accent-color:var(--green); }
.pg-agree a{ color:var(--blue); text-decoration:none; }

.pg-wxpay{
  width:100%; border:0; border-radius:14px; padding:15px;
  background:#07c160; color:#fff; font-size:17px; font-weight:700;
  display:flex; align-items:center; justify-content:center; gap:9px;
  box-shadow:0 6px 16px rgba(7,193,96,.28);
}
.pg-wxpay:active{ transform:scale(.99); }
.pg-wxpay:disabled{ opacity:.7; }
.pg-wx-ico{ display:inline-flex; align-items:center; justify-content:center;
  width:26px; height:26px; border-radius:7px; background:#fff; color:#07c160;
  font-size:16px; font-weight:800; }
.pg-foot{ text-align:center; margin-top:11px; }

/* 二维码区 */
.pg-qrtitle{ text-align:center; font-weight:700; font-size:16px; margin-bottom:10px; }
.pg-qr{ width:216px; height:216px; margin:0 auto; border:1px solid var(--line);
  border-radius:14px; padding:4px; background:#fff; display:flex; align-items:center; justify-content:center; }
.pg-qr img,.pg-qr canvas{ display:block; }
.pg-amount{ text-align:center; font-weight:700; margin:12px 0 6px; }
.pg-mocktag{ text-align:center; background:#fff3e0; color:#e88200; font-size:12px;
  border-radius:8px; padding:5px; margin:8px 0; }
.pg-wxwaiting{ text-align:center; color:var(--ink2); font-size:14px; margin-top:10px; }
.pg-order{ text-align:center; margin-top:10px; }

.pg-ok,.pg-err{ font-size:52px; text-align:center; margin:6px 0 2px; }
.pg-gift{ background:var(--orange-l); color:#d96b12; border-radius:12px;
  padding:10px 12px; font-size:14px; text-align:center; margin-top:12px; line-height:1.5; }
.pg-loading{ text-align:center; color:var(--ink2); padding:36px 0; }

.agree p{ margin:0 0 10px; line-height:1.6; }

/* 顶部学习倒计时条 */
#timeBar{
  position:fixed; top:8px; left:50%; transform:translateX(-50%);
  z-index:900; background:rgba(0,0,0,.72); color:#fff;
  padding:5px 14px; border-radius:999px; font-size:14px; letter-spacing:.5px;
  box-shadow:0 3px 10px rgba(0,0,0,.25); display:block;
}
#timeBar b{ font-variant-numeric:tabular-nums; }
#timeBar.warn{ background:var(--red); animation:tbPulse 1s ease-in-out infinite; }
#timeBar.hide{ display:none; }
@keyframes tbPulse{ 0%,100%{ opacity:1; } 50%{ opacity:.65; } }
/* 倒计时条下移，避免与 topbar 重叠（topbar 高度约 54px） */
#topbar{ padding-top:0; }
body.gated #app{ filter:blur(2px); }