/* ===========================================================
   王钻联盟 · 共享设计系统
   =========================================================== */
:root{
  /* 品牌色（取自王钻联盟 IP：深海军蓝 / 水晶蓝 / 王者金） */
  --gold:#F0B90B;
  --gold-2:#FFD75E;
  --gold-3:#8A6400;
  --purple:#2F7BFF;      /* 主品牌蓝（原紫，全局替换） */
  --royal:#0B2A6B;       /* 皇家深蓝 */
  --crystal:#5FD0FF;     /* 水晶蓝 */
  --cyan:#5FD0DD;
  --red:#FF4D4F;
  --green:#22C55E;
  --orange:#FF8A3D;

  /* 中国股市/价格约定：涨=红，跌=绿 */
  --price:#FF4D4F;

  /* 暗色主题（C端 · 海军蓝夜色） */
  --bg:#060C24;
  --bg-2:#0A1230;
  --panel:#0E1A40;
  --panel-2:#14234E;
  --panel-3:#1B2F62;
  --line:#20305E;
  --text:#EAF0FF;
  --muted:#8B97BC;
  --muted-2:#5A678F;

  /* 后台主题：左黑（侧边栏在 admin.css 单独定义）右白（内容区浅色） */
  --a-bg:#F3F5FA;
  --a-panel:#FFFFFF;
  --a-panel-2:#F7F8FC;
  --a-line:#E5E9F2;
  --a-text:#1B2437;
  --a-muted:#68748F;
  --a-hover:#EDF1F8;

  --r-s:8px; --r-m:12px; --r-l:18px; --r-xl:26px;
  --sh-1:0 2px 10px rgba(9,12,20,.06);
  --sh-2:0 10px 30px rgba(9,12,20,.10);
  --sh-dark:0 16px 40px rgba(0,0,0,.45);
  --ff:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Segoe UI",Roboto,sans-serif;
  --ff-num:"DIN Alternate","SF Mono",Menlo,Consolas,monospace;
}

*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:var(--ff);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:0;background:none;color:inherit}
input,textarea,select{font-family:inherit;outline:none}
img{display:block;max-width:100%}
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-thumb{background:rgba(140,150,175,.35);border-radius:8px}
::-webkit-scrollbar-thumb:hover{background:rgba(140,150,175,.6)}
::-webkit-scrollbar-track{background:transparent}

/* ---------- 通用元件 ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  height:36px;padding:0 16px;border-radius:var(--r-s);
  font-size:13px;font-weight:600;letter-spacing:.2px;
  transition:.18s ease;white-space:nowrap;
}
.btn-gold{background:linear-gradient(135deg,var(--gold-2),var(--gold));color:#231A00;box-shadow:0 4px 14px rgba(240,185,11,.28)}
.btn-gold:hover{filter:brightness(1.08);transform:translateY(-1px)}
.btn-purple{background:linear-gradient(135deg,var(--crystal),var(--purple));color:#fff;box-shadow:0 4px 14px rgba(47,123,255,.35)}
.btn-purple:hover{filter:brightness(1.08);transform:translateY(-1px)}
.btn-ghost{background:transparent;border:1px solid var(--a-line);color:var(--a-text)}
.btn-ghost:hover{background:var(--a-hover)}
.btn-danger{background:#FFF1F1;color:#D9363E;border:1px solid #FFD9D9}
.btn-danger:hover{background:#FFE6E6}
.btn-ok{background:#EDFBF2;color:#15803D;border:1px solid #C7F0D6}
.btn-ok:hover{background:#DFF7E8}
.btn-sm{height:28px;padding:0 10px;font-size:12px;border-radius:6px}
.btn-lg{height:46px;padding:0 26px;font-size:15px;border-radius:var(--r-m)}
.btn-block{width:100%}
.btn[disabled]{opacity:.45;cursor:not-allowed;transform:none!important}

.tag{display:inline-flex;align-items:center;gap:4px;height:20px;padding:0 8px;border-radius:5px;font-size:11px;font-weight:600;line-height:1}
.tag-gold{background:rgba(240,185,11,.14);color:#FFD75E}
.tag-purple{background:rgba(47,123,255,.16);color:#7FB4FF}
.tag-cyan{background:rgba(95,208,255,.14);color:#5FD0FF}
.tag-red{background:rgba(255,77,79,.13);color:#D9363E}
.tag-green{background:rgba(34,197,94,.14);color:#15803D}
.tag-gray{background:rgba(120,130,155,.14);color:#5F6679}
.tag-blue{background:rgba(45,120,255,.12);color:#1D5FD8}

.mono{font-family:var(--ff-num);font-variant-numeric:tabular-nums}

/* ---------- 弹层 ---------- */
.mask{
  position:absolute;inset:0;background:rgba(4,6,12,.62);backdrop-filter:blur(3px);
  display:flex;align-items:center;justify-content:center;z-index:60;animation:fade .2s ease;
}
.mask.fixed{position:fixed}
@keyframes fade{from{opacity:0}to{opacity:1}}
@keyframes pop{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
.dialog{
  width:min(420px,86%);background:var(--panel);border:1px solid var(--line);
  border-radius:var(--r-l);padding:22px;animation:pop .22s cubic-bezier(.2,.9,.3,1.2);
  box-shadow:var(--sh-dark);
}
.dialog.light{background:#fff;border-color:var(--a-line);color:var(--a-text);box-shadow:var(--sh-2)}
.dialog h3{margin:0 0 6px;font-size:17px}
.dialog .dlg-sub{font-size:13px;color:var(--muted);margin-bottom:16px}
.dialog.light .dlg-sub{color:var(--a-muted)}
.dlg-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:20px}

.field{margin-bottom:14px}
.field label{display:block;font-size:12.5px;font-weight:600;color:var(--muted);margin-bottom:6px}
.field input[type=text],.field input[type=number],.field select,.field textarea{
  width:100%;height:40px;padding:0 12px;border-radius:var(--r-s);
  background:var(--panel-2);border:1px solid var(--line);color:var(--text);font-size:14px;
}
.field textarea{height:92px;padding:10px 12px;resize:vertical;line-height:1.6}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(240,185,11,.13)}

/* 亮色表单（后台） */
.form-light .field label{color:var(--a-muted)}
.form-light .field input,.form-light .field select,.form-light .field textarea{
  background:#fff;border-color:var(--a-line);color:var(--a-text);
}
.form-light .field input:focus,.form-light .field select:focus,.form-light .field textarea:focus{
  border-color:var(--gold);box-shadow:0 0 0 3px rgba(240,185,11,.16);
}

/* Toast */
#toast-wrap{position:fixed;top:22px;left:50%;transform:translateX(-50%);z-index:9999;display:flex;flex-direction:column;gap:8px;align-items:center;pointer-events:none}
.toast{
  background:rgba(20,24,35,.95);color:#fff;padding:10px 18px;border-radius:10px;
  font-size:13.5px;font-weight:500;box-shadow:var(--sh-dark);animation:pop .2s ease;
  display:flex;align-items:center;gap:8px;border:1px solid rgba(255,255,255,.08);
}
.toast.ok{border-color:rgba(34,197,94,.5)}
.toast.err{border-color:rgba(255,77,79,.55)}

/* 空状态 */
.empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:56px 20px;color:var(--muted);font-size:13px}
.empty svg{opacity:.35}
.empty .ipm{width:84px;height:84px;object-fit:cover;border-radius:22px;
  border:1px solid rgba(95,208,255,.35);box-shadow:0 10px 30px rgba(11,42,107,.55)}

/* ---------- IP 形象元件（王钻 · 联盟形象大使） ---------- */
.ipm{object-fit:cover;display:block}
.ipm-badge{
  width:40px;height:40px;border-radius:12px;overflow:hidden;flex:0 0 auto;
  border:1px solid rgba(95,208,255,.45);box-shadow:0 4px 16px rgba(11,42,107,.6),0 0 0 2px rgba(240,185,11,.25)
}
.ipm-badge img{width:100%;height:100%;object-fit:cover}
.ipm-glow{position:relative}
.ipm-glow::before{
  content:"";position:absolute;inset:-14px;border-radius:50%;z-index:-1;
  background:radial-gradient(closest-side,rgba(47,123,255,.4),transparent 72%)
}

/* 图片占位（无外链依赖，纯 CSS 渐变生成） */
.ph{position:relative;overflow:hidden;background:var(--panel-2)}
.ph::after{
  content:attr(data-l);position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-size:12px;color:rgba(255,255,255,.72);letter-spacing:1px;text-shadow:0 1px 6px rgba(0,0,0,.4);text-align:center;padding:6px;
}
