/* Classical — 设计系统 token（取自 _ds/classical-…/styles.css），后台全局基础样式。 */
:root {
  --color-bg: #f3f2f2;
  --color-surface: #eae9e9;
  --color-text: #201f1d;
  --color-accent: #b68235;
  --color-accent-2: #ac803e;
  --color-divider: color-mix(in srgb, #201f1d 16%, transparent);

  --color-neutral-100: #f8f4f4;
  --color-neutral-200: #eae7e7;
  --color-neutral-300: #d7d3d3;
  --color-neutral-400: #bab6b6;
  --color-neutral-500: #9b9797;
  --color-neutral-600: #7d7979;
  --color-neutral-700: #605d5d;
  --color-neutral-800: #444141;
  --color-neutral-900: #2d2b2b;

  --color-accent-100: #fff3e4;
  --color-accent-200: #ffe3bf;
  --color-accent-300: #facb8d;
  --color-accent-400: #e1ad66;
  --color-accent-500: #c28d41;
  --color-accent-600: #a06f24;
  --color-accent-700: #7d5411;
  --color-accent-800: #5a3b0a;
  --color-accent-900: #3a270d;

  /* 告警色。整套 token 原来只有中性色 + 金色，没有一个「出事了」的颜色，
     出题自检那条提示只能自己带一套硬编码色值——那就是下一个人改配色时改不到的地方。
     所以补进 token 里：偏砖红，压低饱和度跟这套暖灰金配得上，不用纯 #f00 那种警报红。 */
  --color-danger: #9c3328;
  --color-danger-bd: #d8a49d;
  --color-danger-bg: #fbeeec;

  --font-heading: "Cormorant Garamond", "Noto Serif SC", system-ui, serif;
  --font-body: "Lora", "Noto Serif SC", Georgia, serif;

  --radius-sm: 2px;
  --radius-md: 4px;
  --radius-lg: 7px;

  --shadow-sm: 0 1px 2px color-mix(in srgb, #2d2b2b 14%, transparent);
  --shadow-md: 0 3px 10px color-mix(in srgb, #2d2b2b 16%, transparent);
  --shadow-lg: 0 12px 32px color-mix(in srgb, #2d2b2b 22%, transparent);
}

*, *::before, *::after { box-sizing: border-box; }
body {
  margin: 0; background: #f3f2f2; color: #201f1d;
  font-family: "Lora", "Noto Serif SC", Georgia, serif;
  -webkit-font-smoothing: antialiased;
}
a { color: #7d5411; text-decoration: none; }
a:hover { color: #a06f24; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: #d7d3d3; border-radius: 6px; }
input, textarea { font-family: inherit; }
:focus { outline: none; }
::selection { background: color-mix(in srgb, var(--color-accent) 30%, transparent); }

/* 设计稿里的 style-hover / style-focus，在真实 DOM 里用 class 表达 */
.hov-accent:hover { background: var(--color-accent-100) !important; }
.hov-neutral:hover { background: var(--color-neutral-200) !important; }
.hov-bd:hover { border-color: var(--color-accent) !important; }
.hov-fg:hover { color: var(--color-accent-700) !important; }
.fc-accent:focus { border-color: var(--color-accent) !important; }
.fc-accent-b:focus { border-bottom-color: var(--color-accent) !important; }

.toast {
  position: fixed; left: 50%; bottom: 34px; transform: translateX(-50%);
  background: var(--color-neutral-900); color: var(--color-neutral-100);
  padding: 10px 18px; border-radius: var(--radius-md); font-size: 13px;
  box-shadow: var(--shadow-lg); z-index: 60; opacity: 0; pointer-events: none;
  transition: opacity .18s ease;
}
.toast.on { opacity: 1; }