/* 云发卡 - 前台共享样式 */
:root{
  --pri:#2563eb; --pri-d:#1d4ed8; --bg:#f5f7fb; --card:#fff;
  --tx:#1e293b; --mut:#64748b; --line:#e2e8f0; --ok:#16a34a; --warn:#d97706; --bad:#dc2626;
  --r:12px;
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;background:var(--bg);color:var(--tx);font-size:15px;line-height:1.6}
a{color:var(--pri);text-decoration:none}
.wrap{max-width:1100px;margin:0 auto;padding:0 16px}
/* 顶栏 */
.topbar{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:50}
.topbar .wrap{display:flex;align-items:center;height:60px;gap:24px}
.logo{font-size:20px;font-weight:800;color:var(--pri);display:flex;align-items:center;gap:8px}
.logo i{width:30px;height:30px;border-radius:8px;background:linear-gradient(135deg,#2563eb,#7c3aed);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-style:normal;font-size:16px}
.nav{display:flex;gap:4px;flex:1}
.nav a{padding:8px 14px;border-radius:8px;color:var(--tx);font-size:14px}
.nav a:hover,.nav a.on{background:#eff6ff;color:var(--pri)}
/* 按钮/表单 */
.btn{display:inline-block;background:var(--pri);color:#fff;border:0;border-radius:8px;padding:10px 22px;font-size:15px;cursor:pointer}
.btn:hover{background:var(--pri-d)}
.btn.ghost{background:#fff;color:var(--pri);border:1px solid var(--pri)}
.btn.sm{padding:6px 14px;font-size:13px}
.btn.block{width:100%}
.btn:disabled{opacity:.5;cursor:not-allowed}
input,select,textarea{width:100%;border:1px solid var(--line);border-radius:8px;padding:10px 12px;font-size:15px;background:#fff;color:var(--tx)}
input:focus,select:focus,textarea:focus{outline:2px solid #bfdbfe;border-color:var(--pri)}
label{display:block;font-size:13px;color:var(--mut);margin:14px 0 6px}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:24px;box-shadow:0 1px 3px rgba(0,0,0,.04)}
/* 首页 hero */
.hero{background:linear-gradient(135deg,#1e3a8a,#7c3aed);color:#fff;padding:70px 0;text-align:center}
.hero h1{font-size:38px;margin-bottom:12px}
.hero p{opacity:.85;font-size:16px;margin-bottom:26px}
.hero .btn{background:#fff;color:#1e3a8a;font-weight:700;margin:0 6px}
.feats{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin:36px 0}
.feat{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:22px}
.feat h3{font-size:16px;margin-bottom:8px}
.feat p{font-size:13px;color:var(--mut)}
.steps{display:flex;gap:12px;flex-wrap:wrap;margin:20px 0 40px}
.step{flex:1;min-width:200px;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:18px;text-align:center}
.step b{display:block;width:36px;height:36px;border-radius:50%;background:#eff6ff;color:var(--pri);margin:0 auto 10px;line-height:36px}
/* 表单页 */
.formpage{max-width:440px;margin:50px auto}
.formpage h2{text-align:center;margin-bottom:6px}
.formpage .sub{text-align:center;color:var(--mut);font-size:13px;margin-bottom:8px}
/* 表格 */
table{width:100%;border-collapse:collapse;font-size:14px}
th,td{padding:10px 12px;border-bottom:1px solid var(--line);text-align:left}
th{background:#f8fafc;color:var(--mut);font-weight:600;font-size:13px}
/* 徽标 */
.tag{display:inline-block;padding:2px 10px;border-radius:20px;font-size:12px;background:#eff6ff;color:var(--pri)}
.tag.ok{background:#dcfce7;color:var(--ok)} .tag.warn{background:#fef3c7;color:var(--warn)} .tag.bad{background:#fee2e2;color:var(--bad)}
/* 页脚 */
footer{margin-top:60px;border-top:1px solid var(--line);background:#fff;padding:28px 0;color:var(--mut);font-size:13px}
footer .wrap{display:flex;gap:24px;flex-wrap:wrap;justify-content:space-between}
/* toast */
#toast{position:fixed;top:18px;left:50%;transform:translateX(-50%);z-index:999;display:flex;flex-direction:column;gap:8px}
.toastmsg{background:#1e293b;color:#fff;padding:10px 20px;border-radius:10px;font-size:14px;box-shadow:0 4px 14px rgba(0,0,0,.2)}
/* 店铺页 */
.shophead{background:linear-gradient(135deg,#2563eb,#7c3aed);color:#fff;padding:34px 0}
.shophead h1{font-size:24px}
.shophead p{opacity:.85;font-size:13px}
.shopbody{display:grid;grid-template-columns:200px 1fr;gap:18px;margin:20px 0}
@media(max-width:700px){.shopbody{grid-template-columns:1fr}}
.catlist{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:10px;align-self:start}
.catlist a{display:block;padding:10px 12px;border-radius:8px;color:var(--tx);font-size:14px;cursor:pointer}
.catlist a.on,.catlist a:hover{background:#eff6ff;color:var(--pri)}
.goods{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px}
.good{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:18px;cursor:pointer;transition:.15s}
.good:hover{border-color:var(--pri);transform:translateY(-2px)}
.good h3{font-size:15px;margin-bottom:6px}
.good .price{color:#dc2626;font-weight:800;font-size:20px}
.good .stock{font-size:12px;color:var(--mut)}
/* 弹窗 */
.modal{position:fixed;inset:0;background:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center;z-index:100;padding:16px}
.modal .box{background:#fff;border-radius:14px;padding:28px;max-width:520px;width:100%;max-height:90vh;overflow:auto}
.kv{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px dashed var(--line);font-size:14px}
.kv b{color:var(--tx)}
.payqr{text-align:center;padding:16px}
.payqr .fakeqr{width:200px;height:200px;margin:0 auto;background:#fff;border:1px solid var(--line);display:grid;grid-template-columns:repeat(12,1fr);grid-template-rows:repeat(12,1fr)}
.cards-out{background:#f8fafc;border:1px dashed var(--line);border-radius:8px;padding:12px;margin:8px 0;font-family:monospace;font-size:13px;word-break:break-all}
.notice{background:#fffbeb;border:1px solid #fde68a;border-radius:8px;padding:12px 16px;font-size:13px;color:#92400e;margin:14px 0}