/* ===== 门户通用样式 ===== */
:root{
  --p-primary:#4f46e5; --p-primary-2:#06b6d4; --p-ink:#0f172a;
  --p-muted:#6b7280; --p-line:rgba(15,23,42,.1);
  --p-bg:#f6f7fb; --p-card:#fff; --p-ok:#16a34a; --p-warn:#d97706; --p-err:#dc2626;
}
*{box-sizing:border-box;}
/* ★ 兜底：hidden 属性必须真正隐藏元素。
   作者样式（如 .rn-mask{display:flex}、.p-cred{display:grid}）优先级高于浏览器默认的
   [hidden]{display:none}，若不在这里强制覆盖，带 hidden 的弹窗/折叠区会一直显示且无法通过
   el.hidden=true 关闭（表现为「进个人中心就弹出续费窗口并卡住」）。 */
[hidden]{display:none !important;}
body.p-body{margin:0;background:var(--p-bg);color:var(--p-ink);
  font-family:"PingFang SC","Microsoft YaHei",system-ui,-apple-system,"Segoe UI",sans-serif;
  font-size:14px;line-height:1.6;}
a{color:inherit;text-decoration:none;}
.p-wrap{max-width:1200px;margin:0 auto;padding:0 20px;}

/* 导航 */
.p-nav{background:#fff;border-bottom:1px solid var(--p-line);position:sticky;top:0;z-index:50;}
.p-nav-inner{max-width:1240px;margin:0 auto;padding:0 20px;height:64px;display:flex;align-items:center;gap:24px;}
.p-nav-brand{display:flex;align-items:center;gap:9px;font-size:17px;font-weight:800;letter-spacing:-.02em;}
.p-nav-brand b{color:var(--p-primary);}
.p-nav-mark{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;
  background:linear-gradient(135deg,var(--p-primary),var(--p-primary-2));color:#fff;font-size:14px;font-weight:800;}
.p-nav nav{display:flex;gap:6px;flex:1;flex-wrap:wrap;}
.p-nav nav a{padding:7px 13px;border-radius:9px;font-size:14px;font-weight:600;color:#3d4b60;transition:.16s;}
.p-nav nav a:hover{background:var(--p-bg);color:var(--p-primary);}
.p-nav nav a.on{background:rgba(79,70,229,.1);color:var(--p-primary);}
.p-nav-right{margin-left:auto;display:flex;align-items:center;gap:12px;}
.p-nav-user{font-size:13.5px;font-weight:600;display:flex;align-items:center;gap:6px;}
.p-tag{font-style:normal;font-size:10.5px;font-weight:800;padding:2px 6px;border-radius:5px;
  background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff;}
.p-btn-line{border:1px solid var(--p-line);background:#fff;border-radius:9px;padding:7px 14px;
  font-size:13.5px;font-weight:600;cursor:pointer;color:#3d4b60;font-family:inherit;transition:.16s;}
.p-btn-line:hover{border-color:var(--p-primary);color:var(--p-primary);}
@media(max-width:860px){
  .p-nav-inner{height:auto;padding:12px 16px;flex-wrap:wrap;gap:10px;}
  .p-nav nav{order:3;width:100%;overflow-x:auto;}
  .p-nav-right{margin-left:0;}
}

/* 通用块 */
.p-main{padding:28px 0 60px;min-height:60vh;}
.p-hd{margin-bottom:22px;}
.p-hd h1{font-size:26px;margin:0 0 6px;letter-spacing:-.02em;}
.p-hd p{margin:0;color:var(--p-muted);font-size:14px;}
.p-card{background:var(--p-card);border:1px solid var(--p-line);border-radius:14px;padding:20px 22px;}
.p-card+.p-card{margin-top:16px;}
.p-card-hd{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px;flex-wrap:wrap;}
.p-card-hd h2{margin:0;font-size:16px;}
.p-card-hd .sub{font-size:13px;color:var(--p-muted);}

.p-grid{display:grid;gap:14px;}
.p-stats{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));}
.p-stat{background:#fff;border:1px solid var(--p-line);border-radius:14px;padding:16px 18px;}
.p-stat span{display:block;font-size:12.5px;color:var(--p-muted);margin-bottom:6px;}
.p-stat b{font-size:24px;letter-spacing:-.03em;}
.p-stat.ok b{color:var(--p-ok);}
.p-stat.warn b{color:var(--p-warn);}
.p-stat.pri b{color:var(--p-primary);}
.p-stat i{font-style:normal;font-size:13px;color:var(--p-muted);font-weight:400;margin-left:4px;}

/* 按钮 */
.p-btn{border:0;border-radius:10px;padding:10px 18px;font-size:14px;font-weight:600;cursor:pointer;
  font-family:inherit;transition:.18s;background:linear-gradient(135deg,var(--p-primary),var(--p-primary-2));color:#fff;}
.p-btn:hover{filter:brightness(1.07);transform:translateY(-1px);}
.p-btn:disabled{opacity:.55;cursor:not-allowed;transform:none;filter:none;}
.p-btn.ghost{background:#fff;color:#3d4b60;border:1px solid var(--p-line);}
.p-btn.ghost:hover{border-color:var(--p-primary);color:var(--p-primary);}
.p-btn.sm{padding:6px 12px;font-size:12.5px;border-radius:8px;}
.p-btn.danger{background:#fff;color:var(--p-err);border:1px solid #fecaca;}
.p-btn.danger:hover{background:#fef2f2;}
.p-btn-block{width:100%;}

/* 表格 */
.p-tb{width:100%;border-collapse:collapse;}
.p-tb th{text-align:left;font-size:12.5px;color:#3d4b60;font-weight:700;padding:11px 12px;
  border-bottom:1px solid var(--p-line);background:#fafbfe;white-space:nowrap;}
.p-tb td{padding:12px;border-bottom:1px solid var(--p-line);font-size:13px;color:#4a5568;vertical-align:middle;}
.p-tb tr:last-child td{border-bottom:0;}
.p-tb tbody tr:hover td{background:#fafbff;}
.p-tb .money{font-weight:800;color:var(--p-ink);white-space:nowrap;}
.p-tb-outer{overflow-x:auto;border:1px solid var(--p-line);border-radius:14px;background:#fff;}

/* 标签 */
.p-badge{display:inline-block;padding:3px 9px;border-radius:999px;font-size:11.5px;font-weight:800;white-space:nowrap;}
.p-badge.ok{background:rgba(34,197,94,.14);color:var(--p-ok);}
.p-badge.warn{background:rgba(245,158,11,.16);color:var(--p-warn);}
.p-badge.err{background:rgba(220,38,38,.12);color:var(--p-err);}
.p-badge.mute{background:rgba(15,23,42,.07);color:#5f6b7a;}
.p-badge.pri{background:rgba(79,70,229,.12);color:var(--p-primary);}

/* 表单 */
.p-field{margin-bottom:14px;}
.p-field label{display:block;font-size:13px;font-weight:600;color:#3d4b60;margin-bottom:6px;}
.p-field label i{color:var(--p-err);font-style:normal;}
.p-input,.p-select,.p-textarea{width:100%;border:1px solid var(--p-line);border-radius:10px;padding:10px 13px;
  font-size:14px;font-family:inherit;color:var(--p-ink);background:#fff;transition:.16s;}
.p-input:focus,.p-select:focus,.p-textarea:focus{outline:0;border-color:var(--p-primary);box-shadow:0 0 0 3px rgba(79,70,229,.1);}
.p-textarea{min-height:88px;resize:vertical;}
.p-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.p-hint{font-size:12px;color:var(--p-muted);margin-top:6px;}
.p-err{font-size:12.5px;color:var(--p-err);margin-top:6px;min-height:1px;}

/* 登录/注册 */
.p-auth{min-height:100vh;display:grid;place-items:center;padding:30px 18px;
  background:linear-gradient(135deg,#eef2ff,#e0f2fe);}
.p-auth-box{width:100%;max-width:430px;background:#fff;border-radius:18px;padding:34px 32px;
  box-shadow:0 24px 60px rgba(15,23,42,.12);}
.p-auth-box h1{margin:0 0 4px;font-size:24px;letter-spacing:-.02em;}
.p-auth-sub{margin:0 0 22px;color:var(--p-muted);font-size:13.5px;}
.p-tabs{display:flex;gap:6px;background:var(--p-bg);padding:4px;border-radius:11px;margin-bottom:22px;}
.p-tabs button{flex:1;border:0;background:none;padding:9px;border-radius:8px;font-size:14px;font-weight:600;
  cursor:pointer;color:#3d4b60;font-family:inherit;transition:.16s;}
.p-tabs button.on{background:#fff;color:var(--p-primary);box-shadow:0 1px 4px rgba(15,23,42,.1);}
.p-demo{border:1px dashed rgba(79,70,229,.35);background:rgba(79,70,229,.05);border-radius:11px;
  padding:12px 14px;margin-top:16px;font-size:12.5px;line-height:1.8;color:#4a5568;}
.p-demo b{color:var(--p-primary);}
.p-demo a{cursor:pointer;color:var(--p-primary);font-weight:700;text-decoration:underline;}

/* 已登录提示条 */
.p-logged{border:1px solid rgba(79,70,229,.28);background:rgba(79,70,229,.06);border-radius:11px;
  padding:12px 14px;margin-bottom:18px;font-size:13px;color:#3d4b60;
  display:flex;flex-wrap:wrap;align-items:center;gap:10px;}
.p-logged span{font-weight:600;color:var(--p-ink);}
.p-logged-go{margin-left:auto;color:var(--p-primary);font-weight:700;font-size:12.5px;text-decoration:none;
  border:1px solid rgba(79,70,229,.3);background:#fff;border-radius:8px;padding:5px 10px;}
.p-logged-go:hover{background:var(--p-primary);color:#fff;}
.p-logged-out{border:0;background:none;color:var(--p-muted);font-size:12.5px;cursor:pointer;
  font-family:inherit;text-decoration:underline;padding:0;}
.p-logged-out:hover{color:var(--p-err);}
.p-logged-tip{flex-basis:100%;margin:0;font-size:12px;color:var(--p-muted);}

/* 后台收款码上传 */
.qr-up{display:flex;flex-direction:column;gap:10px;align-items:flex-start;
  border:1px dashed rgba(79,70,229,.35);border-radius:12px;padding:12px;background:#fbfbff;}
.qr-prev{width:132px;height:132px;object-fit:contain;border:1px solid var(--p-line);border-radius:10px;background:#fff;}
.qr-ops{display:flex;gap:8px;flex-wrap:wrap;}

/* 到期进度条 */
.p-bar{height:6px;border-radius:99px;background:rgba(15,23,42,.08);overflow:hidden;margin-top:7px;}
.p-bar i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--p-primary),var(--p-primary-2));}
.p-bar i.warn{background:linear-gradient(90deg,#f59e0b,#d97706);}
.p-bar i.err{background:linear-gradient(90deg,#ef4444,#dc2626);}

/* 空状态 */
.p-empty{padding:48px 20px;text-align:center;color:var(--p-muted);}
.p-empty span{font-size:38px;display:block;margin-bottom:10px;opacity:.45;}
.p-empty p{margin:0 0 14px;}

/* 提示条 */
.p-toast{position:fixed;left:50%;bottom:34px;transform:translate(-50%,16px);z-index:300;
  background:#0f172a;color:#fff;padding:11px 20px;border-radius:99px;font-size:14px;font-weight:600;
  opacity:0;pointer-events:none;transition:.26s;box-shadow:0 14px 34px rgba(15,23,42,.26);}
.p-toast.show{opacity:1;transform:translate(-50%,0);}
.p-toast.err{background:#dc2626;}

/* 弹窗 */
.p-mask{position:fixed;inset:0;background:rgba(15,23,42,.5);z-index:200;display:grid;place-items:center;padding:20px;}
.p-modal{background:#fff;border-radius:16px;padding:26px;width:min(440px,100%);max-height:84vh;overflow:auto;}
.p-modal h3{margin:0 0 14px;font-size:18px;}
.p-modal-foot{display:flex;gap:10px;margin-top:18px;}
.p-modal-foot .p-btn{flex:1;}

/* 凭证 */
.p-cred{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;
  background:var(--p-bg);border-radius:11px;padding:13px 15px;margin-top:12px;}
.p-cred div{min-width:0;}
.p-cred span{display:block;font-size:11.5px;color:var(--p-muted);}
.p-cred b{font-family:ui-monospace,Consolas,monospace;font-size:13px;word-break:break-all;}
.p-copy{border:0;background:none;color:var(--p-primary);font-size:12px;cursor:pointer;padding:0 0 0 6px;font-family:inherit;}

/* 交付方式：分享链接 / 二维码 */
.p-credlinks{display:grid;gap:8px;grid-column:1/-1;}
.p-credlink{display:flex;align-items:flex-start;gap:8px;background:#fff;border:1px solid var(--p-line);
  border-radius:9px;padding:8px 10px;}
.p-credlink code{flex:1;min-width:0;font-family:ui-monospace,Consolas,monospace;font-size:12px;
  word-break:break-all;line-height:1.6;color:var(--p-ink);}
.p-credqr{grid-column:1/-1;display:flex;flex-direction:column;align-items:center;gap:8px;padding:4px 0;}
.p-credqr img{max-width:190px;width:100%;border:1px solid var(--p-line);border-radius:11px;background:#fff;padding:6px;}
.p-credqrn{margin:0;font-size:11.5px;color:var(--p-muted);text-align:center;}

/* 移动端表格转卡片 */
@media(max-width:780px){
  .p-tb thead{display:none;}
  .p-tb tr{display:grid;grid-template-columns:1fr;padding:12px 0;border-bottom:1px solid var(--p-line);gap:0;}
  .p-tb td{border:0;padding:3px 14px;display:flex;justify-content:space-between;gap:14px;text-align:right;}
  .p-tb td::before{content:attr(data-l);font-size:11.5px;color:var(--p-muted);font-weight:700;text-align:left;}
  .p-tb tbody tr:hover td{background:transparent;}
  .p-row{grid-template-columns:1fr;}
}

@media print{.p-nav,.p-modal-foot,.p-btn{display:none!important;}}

/* ===== 语言切换器（中 / EN） ===== */
.lang-sw{display:inline-flex;align-items:center;gap:2px;padding:2px;background:#fff;
  border:1px solid var(--p-line);border-radius:999px;vertical-align:middle;}
.lang-sw button{border:0;background:none;font-family:inherit;font-size:12.5px;font-weight:700;
  color:#5b6472;padding:5px 11px;border-radius:999px;cursor:pointer;line-height:1.35;transition:.16s;white-space:nowrap;}
.lang-sw button:hover{color:var(--p-primary);}
.lang-sw button.on{background:linear-gradient(135deg,var(--p-primary),var(--p-primary-2));color:#fff;}
.p-nav-right .lang-sw{margin-right:2px;}