/* 去水印API中转站 - 用户端样式（紫色系，与后台统一） */
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:"Microsoft YaHei","PingFang SC","Helvetica Neue",sans-serif;background:#f4f5fa;font-size:14px;color:#333}
a{text-decoration:none;color:inherit}
img{max-width:100%}

/* ---------- 顶部导航 ---------- */
.topnav{background:linear-gradient(135deg,#3d3654,#4a4066);color:#cfc8e8;position:sticky;top:0;z-index:20;box-shadow:0 2px 10px rgba(60,50,110,.25)}
.topnav .in{max-width:1100px;margin:0 auto;display:flex;align-items:center;height:58px;padding:0 20px;gap:26px}
.topnav .logo{font-size:17px;font-weight:bold;color:#fff;letter-spacing:1px;display:flex;align-items:center;gap:8px}
.topnav .logo .dot{width:26px;height:26px;border-radius:8px;background:linear-gradient(135deg,#a18cd1,#f78fb3);display:inline-flex;align-items:center;justify-content:center;font-size:14px}
.topnav nav{display:flex;gap:4px;flex:1}
.topnav nav a{padding:8px 14px;border-radius:8px;font-size:14px;transition:.15s}
.topnav nav a:hover{background:rgba(255,255,255,.1);color:#fff}
.topnav nav a.on{background:rgba(255,255,255,.14);color:#fff}
.topnav .userbox{font-size:13px;display:flex;align-items:center;gap:10px}
.topnav .userbox a.btn-min{background:rgba(255,255,255,.14);color:#fff;padding:6px 14px;border-radius:20px}
.topnav .userbox a.out{color:#f2a3b8}

.wrap{max-width:1100px;margin:0 auto;padding:24px 20px 60px}

/* ---------- 卡片 ---------- */
.card{background:#fff;border-radius:12px;padding:22px 24px;box-shadow:0 2px 10px rgba(60,50,110,.06);margin-bottom:20px}
.card h3{font-size:15px;color:#3d3654;margin-bottom:16px;padding-bottom:10px;border-bottom:1px solid #f0eef8}
.card h3 small{color:#aaa;font-weight:normal;margin-left:8px}

/* ---------- 统计卡 ---------- */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;margin-bottom:20px}
.stat{background:#fff;border-radius:12px;padding:20px 22px;box-shadow:0 2px 10px rgba(60,50,110,.06)}
.stat .num{font-size:26px;font-weight:bold;background:linear-gradient(135deg,#a18cd1,#f78fb3);-webkit-background-clip:text;background-clip:text;color:transparent}
.stat .lbl{color:#999;font-size:13px;margin-top:6px}

/* ---------- 首页 Hero ---------- */
.hero{background:linear-gradient(135deg,#a18cd1 0%,#fbc2eb 100%);border-radius:18px;padding:56px 40px;color:#fff;text-align:center;margin-bottom:26px;box-shadow:0 12px 40px rgba(150,90,180,.25)}
.hero h1{font-size:32px;letter-spacing:2px;margin-bottom:14px;text-shadow:0 2px 8px rgba(0,0,0,.12)}
.hero p{font-size:15px;opacity:.95;margin-bottom:26px}
.hero .cta{display:inline-block;background:#fff;color:#7c5bb0;font-weight:bold;padding:12px 38px;border-radius:26px;font-size:15px;box-shadow:0 6px 18px rgba(0,0,0,.15);transition:.2s}
.hero .cta:hover{transform:translateY(-2px)}

.feats{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px;margin-bottom:26px}
.feat{background:#fff;border-radius:12px;padding:24px 20px;box-shadow:0 2px 10px rgba(60,50,110,.06);text-align:center}
.feat .ico{width:52px;height:52px;border-radius:14px;background:linear-gradient(135deg,#f3ecfd,#fdeef5);display:inline-flex;align-items:center;justify-content:center;font-size:24px;margin-bottom:12px}
.feat h4{color:#3d3654;font-size:15px;margin-bottom:8px}
.feat p{color:#999;font-size:13px;line-height:1.8}

/* ---------- 价格卡 ---------- */
.pkg-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px}
.pkg{background:#fff;border:2px solid #efeaf8;border-radius:14px;padding:28px 22px;text-align:center;position:relative;transition:.2s;display:flex;flex-direction:column}
.pkg:hover{border-color:#c9b8ec;transform:translateY(-3px);box-shadow:0 10px 26px rgba(120,80,180,.14)}
.pkg .ico{width:48px;height:48px;border-radius:50%;background:linear-gradient(135deg,#a18cd1,#f78fb3);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:20px;margin:0 auto 12px}
.pkg.member .ico{background:linear-gradient(135deg,#2fb380,#5fd3a5)}
.pkg h4{font-size:15px;color:#555;margin-bottom:6px}
.pkg .big{font-size:26px;font-weight:bold;color:#3d3654;margin-bottom:4px}
.pkg .ratio{font-size:13px;color:#a18cd1;margin-bottom:14px}
.pkg ul{list-style:none;flex:1;text-align:left;margin:0 auto 18px}
.pkg ul li{font-size:12.5px;color:#777;padding:5px 0;display:flex;align-items:center;gap:7px}
.pkg ul li::before{content:'✓';color:#2fb380;font-weight:bold}

/* ---------- 按钮 ---------- */
.btn{display:inline-block;padding:9px 22px;border:none;border-radius:8px;font-size:13.5px;cursor:pointer;transition:.15s;font-family:inherit}
.btn.pri{background:linear-gradient(135deg,#a18cd1,#f78fb3);color:#fff}
.btn.pri:hover{opacity:.88}
.btn.green{background:linear-gradient(135deg,#2fb380,#5fd3a5);color:#fff}
.btn.green:hover{opacity:.88}
.btn.plain{background:#f3f0fa;color:#6b5b95}
.btn.plain:hover{background:#e9e3f7}
.btn.danger{background:#fdeef0;color:#e05a6d}
.btn.sm{padding:5px 12px;font-size:12.5px;border-radius:6px}
.btn.lg{padding:12px 30px;font-size:15px;border-radius:24px}
.btn.blk{width:100%}

/* ---------- 表格 ---------- */
table.tb{width:100%;border-collapse:collapse;font-size:13.5px}
table.tb th{background:#f8f6fc;color:#6b5b95;text-align:left;padding:11px 12px;font-weight:bold;white-space:nowrap}
table.tb td{padding:11px 12px;border-bottom:1px solid #f4f2fa;color:#555;word-break:break-all}
table.tb tr:hover td{background:#fbfaff}
.tag{display:inline-block;padding:2px 10px;border-radius:20px;font-size:12px}
.tag.g{background:#e6f7ef;color:#2fb380}.tag.r{background:#fdeef0;color:#e05a6d}
.tag.y{background:#fff6e5;color:#e6a23c}.tag.p{background:#f3ecfd;color:#8d7ab8}

/* ---------- 表单 ---------- */
.form-row{display:flex;gap:18px;flex-wrap:wrap}
.form-item{margin-bottom:16px;flex:1;min-width:200px}
.form-item label{display:block;font-size:13px;color:#666;margin-bottom:6px}
.form-item label b{color:#e05a6d}
.form-item input[type=text],.form-item input[type=password],.form-item input[type=number],.form-item select,.form-item textarea{width:100%;padding:10px 12px;border:1.5px solid #e4ddf3;border-radius:8px;font-size:13.5px;outline:none;transition:.2s;background:#fff;font-family:inherit}
.form-item input:focus,.form-item select:focus,.form-item textarea:focus{border-color:#a18cd1;box-shadow:0 0 0 3px rgba(161,140,209,.12)}
.form-item .hint{color:#aaa;font-size:12px;margin-top:5px;line-height:1.7}

/* ---------- 提示 ---------- */
.alert{padding:12px 16px;border-radius:8px;font-size:13.5px;margin-bottom:18px}
.alert.ok{background:#e6f7ef;color:#2fb380;border:1px solid #c9ecd9}
.alert.err{background:#fdeef0;color:#e05a6d;border:1px solid #f8d3d8}
.alert.tip{background:#f7f3fd;color:#8d7ab8;border:1px solid #e8def8;line-height:1.9}
.alert.warn{background:#fff6e5;color:#e6a23c;border:1px solid #fae4bd;line-height:1.9}

/* ---------- 接口凭证展示 ---------- */
.api-box{background:#2e2a40;border-radius:10px;padding:16px 18px;color:#d8d2ee;font-family:Consolas,Menlo,monospace;font-size:12.5px;line-height:2;overflow-x:auto;position:relative;white-space:pre-wrap;word-break:break-all}
.api-box .cp{position:absolute;top:10px;right:12px;background:#4a4066;color:#fff;border:none;border-radius:6px;padding:4px 12px;font-size:12px;cursor:pointer}
.api-box .cp:hover{background:#5d5280}
.key-mask{letter-spacing:1px}

/* ---------- 登录/注册页 ---------- */
.auth-body{background:linear-gradient(135deg,#a18cd1 0%,#fbc2eb 100%);min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px}
.auth-card{background:#fff;border-radius:18px;padding:42px 40px;width:380px;box-shadow:0 24px 70px rgba(90,50,150,.3)}
.auth-card h2{text-align:center;color:#3d3654;font-size:20px;margin-bottom:6px}
.auth-card p.sub{text-align:center;color:#aaa;font-size:13px;margin-bottom:26px}
.auth-card .form-item input{padding:12px 14px;border-radius:10px}
.auth-card .btn{width:100%;padding:12px;border-radius:24px;font-size:15px;letter-spacing:2px}
.auth-card .foot{text-align:center;margin-top:18px;font-size:13px;color:#999}
.auth-card .foot a{color:#a18cd1}

/* ---------- 分页 ---------- */
.pager{margin-top:16px;text-align:right}
.pager a{display:inline-block;padding:6px 13px;margin-left:6px;background:#fff;border:1px solid #e4ddf3;border-radius:6px;color:#6b5b95;font-size:13px}
.pager a.on{background:linear-gradient(135deg,#a18cd1,#f78fb3);color:#fff;border-color:transparent}
.pager span{color:#aaa;margin-left:10px;font-size:13px}

/* ---------- 文档代码块 ---------- */
pre.code{background:#2e2a40;color:#d8d2ee;border-radius:10px;padding:16px 18px;font-family:Consolas,Menlo,monospace;font-size:12.5px;line-height:1.9;overflow-x:auto;margin-bottom:14px}
.doc-table{margin-bottom:18px}

/* ---------- 用户中心侧栏布局 ---------- */
.uc{display:grid;grid-template-columns:200px 1fr;gap:20px;align-items:start}
.uc .menu{background:#fff;border-radius:12px;padding:10px 0;box-shadow:0 2px 10px rgba(60,50,110,.06);position:sticky;top:76px}
.uc .menu a{display:block;padding:12px 22px;font-size:14px;color:#666;border-left:3px solid transparent;transition:.15s}
.uc .menu a:hover{background:#f8f6fc;color:#3d3654}
.uc .menu a.on{background:#f8f6fc;color:#7c5bb0;border-left-color:#a18cd1;font-weight:bold}
.uc .menu .top{padding:10px 22px 4px;font-size:12px;color:#bbb}

@media (max-width:860px){
  .uc{grid-template-columns:1fr}
  .uc .menu{position:static;display:flex;overflow-x:auto;padding:0}
  .uc .menu a{white-space:nowrap;border-left:none;border-bottom:3px solid transparent}
  .uc .menu a.on{border-bottom-color:#a18cd1}
  .topnav .in{gap:12px;padding:0 12px}
  .topnav nav a{padding:8px 8px}
  .hero{padding:38px 20px}
  .hero h1{font-size:24px}
}