/* 友谊湾品牌设计 token — 石材街区
   参考：暖米色石灰岩立面 / 现代克制的几何体量 / 傍晚暖灯光 */
:root{
  /* 中性 */
  --bg:           #F5EFE4;   /* 石灰岩米白 */
  --bg-dim:       #EDE5D5;   /* 暖沙 */
  --surface:      #FFFFFF;
  --surface-soft: #FBF7EE;

  /* 主色 — 深石墨灰，对应建筑顶板 */
  --primary:      #2B2A26;
  --primary-soft: #E8E4DA;
  --primary-line: #C9C2B0;   /* 细线灰 */

  /* 点睛 — 傍晚暖光琥珀 */
  --accent:       #C68A4A;
  --accent-dark:  #A36F32;
  --accent-soft:  #F2E2C9;

  /* 文字 */
  --text:         #1F1E1B;
  --text-muted:   #6F6A5F;
  --text-faint:   #A39E92;

  --border:       #E6DCC8;
  --border-strong:#D2C7AF;

  --radius-md:    14px;
  --radius-lg:    20px;
}

*{ -webkit-tap-highlight-color: transparent; box-sizing: border-box; }
html,body{
  background: var(--bg); color: var(--text);
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  font-feature-settings: "tnum";
  -webkit-font-smoothing: antialiased;
}

/* 品牌衬线字 */
.serif{ font-family: "Noto Serif SC", "Songti SC", "STSong", serif; letter-spacing: 0.04em; font-weight: 500; }
.tracking{ letter-spacing: 0.16em; }

/* 极细分隔线（建筑制图感） */
.rule{ height:1px; background: var(--border-strong); opacity:.7; }

/* 顶部品牌徽标 */
.wordmark{ display:inline-flex; align-items:center; gap:10px; }
.wordmark .bar{ width:18px; height:1px; background: var(--primary); }
.wordmark .zh{ font-family: "Noto Serif SC","Songti SC",serif; font-weight:500; letter-spacing: 0.24em; color: var(--primary); }
.wordmark .en{ font-size: 10px; letter-spacing: 0.32em; color: var(--text-muted); text-transform: uppercase; }

/* 按钮 */
.btn{ display:flex; align-items:center; justify-content:center; padding:14px 18px; border-radius: var(--radius-md); font-weight:500; transition: background .15s, color .15s; cursor:pointer; }
.btn-primary{ background: var(--primary); color:#fff; }
.btn-primary:hover{ background:#000; }
.btn-accent{ background: var(--accent); color:#fff; }
.btn-accent:hover{ background: var(--accent-dark); }
.btn-ghost{ background: transparent; color: var(--primary); border:1px solid var(--border-strong); }
.btn-ghost:hover{ background: var(--surface); }

/* 输入框 */
.field{ display:block; margin-bottom: 18px; }
.field .lbl{ display:flex; justify-content:space-between; font-size: 12px; color: var(--text-muted); margin-bottom: 8px; letter-spacing: 0.06em; }
.field .lbl .hint{ color: var(--text-faint); }
.field input, .field select{
  width:100%; background: var(--surface); border:1px solid var(--border);
  border-radius: 12px; padding: 13px 14px; font-size: 16px; color: var(--text);
  outline: none; transition: border-color .15s, box-shadow .15s;
  -webkit-appearance: none; appearance: none;
}
.field input:focus, .field select:focus{
  border-color: var(--primary); box-shadow: 0 0 0 3px rgba(43,42,38,0.06);
}

/* 卡片 */
.card{ background: var(--surface); border-radius: var(--radius-lg); border: 1px solid var(--border); }
.card-soft{ background: var(--surface-soft); border-radius: var(--radius-lg); border: 1px solid var(--border); }

/* 标签 */
.chip{ display:inline-flex; align-items:center; padding: 4px 10px; border-radius: 999px; font-size: 12px; letter-spacing: 0.08em; }
.chip-stone{ background: var(--primary-soft); color: var(--primary); }
.chip-amber{ background: var(--accent-soft); color: var(--accent-dark); }

/* 链接 */
a.link{ color: var(--primary); text-decoration: underline; text-underline-offset: 3px; }

/* 隐藏外观-默认日期下三角的丑陋样式 */
input[type="date"]{ font-family: inherit; }