/* ============================================================
   tokens.css · 平台运营后台 & 入驻落地页 共享设计令牌
   设计来源：prototype/index.html（米白 / 墨棕 / 香槟金）
   后台取向：更「工具感」——克制用色、密排、弱圆角、强分隔线
   ============================================================ */
:root{
  /* 基底 */
  --bg:#F7F1EC;          /* 米白内容区 */
  --bg-2:#F1E8E0;
  --card:#FFFFFF;
  --sidebar:#2B2320;     /* 墨棕深色侧栏 */
  --sidebar-2:#3A2F29;
  --sidebar-line:#413631;

  /* 文字 */
  --ink:#2B2320;
  --ink-2:#6E6259;
  --ink-3:#A79A90;
  --ink-on-dark:#CFC4B9;
  --ink-on-dark-2:#948779;

  /* 品牌金 */
  --gold:#C9A063;
  --gold-2:#E3C89A;
  --gold-soft:#F4E9D8;
  --gold-ink:#8A6A34;

  /* 语义色（低饱和，工具感） */
  --line:#EDE4DA;
  --line-2:#E2D6C9;
  --ok:#5E7D63;
  --ok-soft:#EAF0EA;
  --danger:#B4553F;
  --danger-soft:#FBEDE9;
  --warn:#B98033;
  --warn-soft:#FBF0DF;
  --info:#5A7488;
  --info-soft:#E9EFF4;
  --mute-soft:#F0EBE5;

  /* 圆角（后台约 8/10，比 C 端 20 更硬） */
  --r:10px;
  --r-sm:7px;
  --r-lg:14px;
  --r-pill:999px;

  /* 阴影（几乎不用大投影） */
  --sh:0 1px 2px rgba(43,35,32,.05);
  --sh-pop:0 18px 48px -20px rgba(43,35,32,.42), 0 2px 6px rgba(43,35,32,.06);
  --focus:0 0 0 3px rgba(201,160,99,.32);

  /* 字体 */
  --sans:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",Arial,sans-serif;
  --serif:"Songti SC","Noto Serif SC","Source Han Serif SC",Georgia,serif;
  --mono:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace;

  /* 布局 */
  --nav-w:232px;
  --top-h:56px;
  --row-h:44px;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:var(--sans);color:var(--ink);background:var(--bg);
  font-size:13px;line-height:1.5;-webkit-font-smoothing:antialiased;
}
button{font-family:inherit;font-size:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
input,select,textarea{font-family:inherit;font-size:inherit;color:inherit}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4,p{margin:0}
ul{margin:0;padding:0;list-style:none}
.num{font-family:var(--mono);font-variant-numeric:tabular-nums;letter-spacing:-.01em}

/* ---------------- 按钮 ---------------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  height:32px;padding:0 12px;border-radius:var(--r-sm);
  border:1px solid var(--line-2);background:#fff;color:var(--ink);
  font-size:12.5px;font-weight:500;white-space:nowrap;
  transition:background .16s,border-color .16s,color .16s,box-shadow .16s,transform .06s;
}
.btn:hover{border-color:#D3C4B4;background:#FDFAF7}
.btn:active{transform:translateY(1px)}
.btn:focus-visible{outline:none;box-shadow:var(--focus)}
.btn[disabled],.btn.is-disabled{opacity:.45;cursor:not-allowed;transform:none}
.btn--primary{background:var(--ink);border-color:var(--ink);color:#FFFDFA}
.btn--primary:hover{background:#3A2F29;border-color:#3A2F29}
.btn--gold{background:var(--gold);border-color:var(--gold);color:#2B2013}
.btn--gold:hover{background:#BF9552;border-color:#BF9552}
.btn--danger{color:var(--danger);border-color:#E8CFC7;background:#fff}
.btn--danger:hover{background:var(--danger-soft);border-color:#DFBDB2}
.btn--ghost{background:transparent;border-color:transparent;color:var(--ink-2)}
.btn--ghost:hover{background:#F2EAE2;color:var(--ink)}
.btn--sm{height:26px;padding:0 9px;font-size:12px;border-radius:6px}
.btn--lg{height:40px;padding:0 18px;font-size:14px;border-radius:8px}
.btn--block{width:100%}
.btn-row{display:flex;gap:8px;flex-wrap:wrap}

/* ---------------- 表单 ---------------- */
.field{display:flex;flex-direction:column;gap:6px}
.field > label,.lbl{font-size:12px;color:var(--ink-2);font-weight:500;letter-spacing:.01em}
.input,.select,.textarea{
  height:32px;padding:0 10px;border:1px solid var(--line-2);border-radius:var(--r-sm);
  background:#fff;width:100%;transition:border-color .16s,box-shadow .16s;
}
.textarea{height:auto;padding:8px 10px;resize:vertical;min-height:72px;line-height:1.6}
.input:hover,.select:hover,.textarea:hover{border-color:#D3C4B4}
.input:focus,.select:focus,.textarea:focus{outline:none;border-color:var(--gold);box-shadow:var(--focus)}
.select{appearance:none;padding-right:26px;cursor:pointer;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'><path d='M2.5 4.5 6 8l3.5-3.5' fill='none' stroke='%236E6259' stroke-width='1.4' stroke-linecap='round'/></svg>");
  background-repeat:no-repeat;background-position:right 9px center;
}
.field .hint{font-size:11.5px;color:var(--ink-3)}
.field .err{font-size:11.5px;color:var(--danger)}

/* ---------------- 胶囊标签 ---------------- */
.pill{
  display:inline-flex;align-items:center;gap:5px;height:21px;padding:0 8px;
  border-radius:var(--r-pill);font-size:11.5px;letter-spacing:.01em;white-space:nowrap;
  background:var(--mute-soft);color:var(--ink-2);
}
.pill i{width:5px;height:5px;border-radius:50%;background:currentColor;opacity:.85;flex:0 0 auto}
.pill--ok{background:var(--ok-soft);color:#44604A}
.pill--gold{background:var(--gold-soft);color:var(--gold-ink)}
.pill--warn{background:var(--warn-soft);color:#94641F}
.pill--danger{background:var(--danger-soft);color:#94402E}
.pill--info{background:var(--info-soft);color:#46647A}
.pill--mute{background:var(--mute-soft);color:var(--ink-3)}

/* ---------------- 其他原子 ---------------- */
.mono{font-family:var(--mono)}
.muted{color:var(--ink-2)}
.dim{color:var(--ink-3)}
.gold{color:var(--gold-ink)}
.divider{height:1px;background:var(--line);border:0;margin:0}
.tag-dot{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--ink-2)}
.tag-dot i{width:6px;height:6px;border-radius:50%;background:var(--gold)}
.kbd{font-family:var(--mono);font-size:11px;padding:1px 5px;border:1px solid var(--line-2);border-bottom-width:2px;border-radius:4px;color:var(--ink-2);background:#FDFAF7}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
