/* ================================================================
   心理学知识库 · 全站设计基线（暖阳米白 · 温馨简约）
   ---------------------------------------------------------------
   这是一份公共样式，所有页面通过 <link> 引入。
   **改这里 = 全站生效**，不再需要逐页复制粘贴。
   页面自己的 <style> 写在后面，优先级更高（可做局部微调）。

   主题：暖阳米白（2026-10-28 老板选定，替代原暗夜金）
   - 底：燕麦米白（#FAF7F2），卡片纯白（#FFFFFF）
   - 主色：焦糖棕（#B08D57），文字用深焦糖（#8A6534）保证可读
   - 不用纯白做页面底：长时间读案例卡不刺眼
   ================================================================ */

:root{
  /* —— 底色 —— */
  --bg:#FAF7F2;          /* 页面底 */
  --bg2:#F4EFE7;         /* 次级底 */
  --panel:#FFFFFF;       /* 卡片 */
  --panel2:#F7F3EC;      /* 输入框 / 次级卡片 */

  /* —— 描边 —— */
  --line:#E8E0D6;
  --line2:#DCD2C4;

  /* —— 主色（焦糖）—— */
  --accent:#B08D57;      /* 主色：按钮、强调、进度 */
  --accent2:#8A6534;     /* 深主色：需要高可读性的文字 */
  --accent-soft:#F0E7D8; /* 淡主色：选中态底 */
  --accent-dim:#A89070;  /* 弱主色：次要强调 */

  /* —— 文字 —— */
  --text:#3D3730;        /* 主文字 */
  --text2:#6F655A;       /* 次文字 */
  --muted:#948A7C;       /* 弱文字 / 占位 */

  /* —— 语义色 —— */
  --ok:#4F8A63;
  --warn:#B5822F;
  --danger:#C05545;
  --info:#4A7BA7;
  --purple:#7B6BB5;

  /* —— 旧名兼容：各页 CSS 里大量引用 --gold* / --border / --blue —— */
  --gold:var(--accent);
  --gold2:var(--accent2);
  --gold-dim:var(--accent-dim);
  --border:var(--line);
  --blue:var(--info);
  --green:var(--ok);
  --red:var(--danger);

  /* —— 布局 —— */
  --wrap-max:1080px;     /* 各页可覆盖 */
}

*{box-sizing:border-box}

html,body{margin:0;padding:0;background:var(--bg);color:var(--text)}

body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
  font-size:14px;line-height:1.6;
  background:radial-gradient(1200px 600px at 50% -200px,#F3EADB 0%,var(--bg) 60%);
  min-height:100vh;
}

a{color:var(--accent2);text-decoration:none}

.wrap{max-width:var(--wrap-max);margin:0 auto;padding:28px 20px 80px}

/* —— 页头 —— */
header{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin-bottom:8px}
h1{font-size:22px;margin:0;letter-spacing:1px;color:var(--accent2);font-weight:600}
.sub{font-size:13px;color:var(--muted)}

/* —— 导航（八页统一，2026-10-27 定）—— */
nav{margin:14px 0 20px;display:flex;gap:16px;font-size:13px;align-items:center;flex-wrap:wrap}
nav a{color:var(--accent-dim);border-bottom:1px dotted var(--line2);padding-bottom:2px}
nav a:hover{color:var(--accent2)}

/* —— 表单控件 —— */
input[type=text],input[type=password],textarea{
  background:var(--panel);border:1px solid var(--line2);border-radius:9px;
  color:var(--text);outline:none;transition:border-color .2s,box-shadow .2s}
input[type=text]:focus,input[type=password]:focus,textarea:focus{
  border-color:var(--accent);box-shadow:0 0 0 3px rgba(176,141,87,.15)}
input[type=text]::placeholder,input[type=password]::placeholder,textarea::placeholder{color:var(--muted)}

button{
  background:var(--accent);border:1px solid var(--accent);border-radius:9px;
  color:#fff;font-size:14px;cursor:pointer;letter-spacing:1px;transition:.18s;
}
/* hover 用亮度微调而不是换背景色：
   实心主按钮（焦糖底白字）与浅底次要按钮（index 用）都能安全继承，
   不会因为基线换背景导致文字与底色撞色 */
button:hover{filter:brightness(1.04);border-color:var(--accent2)}
button:active{transform:translateY(1px)}
button:disabled{opacity:.45;cursor:not-allowed;transform:none}
button.ghost{background:transparent;color:var(--accent2);border:1px solid var(--line2);font-weight:400}
button.ghost:hover{background:var(--accent-soft);border-color:var(--accent);color:var(--accent2)}

/* —— 通用小件 —— */
.empty{text-align:center;padding:48px 20px;color:var(--muted);font-size:14px;line-height:2}
.err{color:var(--danger);font-size:13px;min-height:20px}
.hint{color:var(--muted);font-size:12px;margin-top:6px}

/* —— 焦点可见性（键盘操作）—— */
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{
  outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}