/* ============================================================================
   慢慢富 · 全局设计令牌（全站唯一色板 / 版式 / 圆角 / 阴影 / 间距）
   来源：mmfu_website（mmfu_home / register / features / about）视觉语言
   用法：所有页面先加载本文件，再加载各自页面样式；页面样式不再定义 :root
   层级：原始色板 → 语义令牌 → 组件令牌，业务代码只用后两层
   ========================================================================== */

:root{
  /* ---------- 1. 原始色板 ---------- */
  --mm-green-900:#16302a;
  --mm-green-800:#1f4237;
  --mm-green-700:#2f5d4e;   /* 品牌主色 */
  --mm-green-500:#4a7a68;
  --mm-green-300:#8ba89b;
  --mm-green-200:#cddfd7;
  --mm-green-100:#e8f0ec;
  --mm-green-50:#f3f7f4;

  --mm-paper-0:#ffffff;
  --mm-paper-1:#f7f6f1;     /* 页面底色 */
  --mm-paper-2:#efece3;
  --mm-paper-3:#faf9f5;

  --mm-ink-900:#23332d;
  --mm-ink-700:#3f4f49;
  --mm-ink-500:#5d6b64;
  --mm-ink-300:#8b968f;

  --mm-amber-700:#8a5a1c;
  --mm-amber-500:#c8892a;   /* 强调色 */
  --mm-amber-100:#f4e3c3;
  --mm-amber-50:#f9f2e5;

  --mm-line-200:#dfe3df;
  --mm-line-100:#eceee9;
  --mm-line-300:#cfc7ba;   /* 暖灰描边（幽灵按钮 / 分隔线） */

  --mm-red-600:#c0392b;
  --mm-red-200:#f2c9c4;
  --mm-red-50:#fbedeb;
  --mm-green-ok:#0b7a53;
  --mm-green-ok-50:#eaf6f1;

  /* ---------- 2. 语义令牌 ---------- */
  --fn-brand:var(--mm-green-700);
  --fn-brand-dark:var(--mm-green-800);
  --fn-brand-deep:var(--mm-green-900);
  --fn-brand-hover:var(--mm-green-800);
  --fn-brand-mid:var(--mm-green-500);
  --fn-brand-line:var(--mm-green-200);
  --fn-brand-soft:var(--mm-green-100);
  --fn-brand-mute:var(--mm-green-300);
  --fn-brand-light:var(--mm-green-100);
  --fn-brand-tint:var(--mm-green-50);

  --fn-bg:var(--mm-paper-1);
  --fn-bg-2:var(--mm-paper-2);
  --fn-surface:#ffffff;
  --fn-surface-2:var(--mm-paper-3);

  --fn-text:var(--mm-ink-900);
  --fn-text-2:var(--mm-ink-700);
  --fn-text-3:var(--mm-ink-500);
  --fn-text-4:var(--mm-ink-300);

  --fn-line:var(--mm-line-200);
  --fn-line-soft:var(--mm-line-100);
  --fn-line-2:var(--mm-line-300);

  --fn-accent:var(--mm-amber-500);
  --fn-accent-dark:var(--mm-amber-700);
  --fn-accent-soft:var(--mm-amber-100);
  --fn-accent-tint:var(--mm-amber-50);

  /* A 股习惯：涨红跌绿，必须同时有 +/- 与文字兜底 */
  --fn-up:var(--mm-red-600);
  --fn-up-line:var(--mm-red-200);
  --fn-up-soft:var(--mm-red-50);
  --fn-down:var(--mm-green-ok);
  --fn-ok:var(--mm-green-ok);
  --fn-ok-soft:var(--mm-green-ok-50);
  --fn-warn:#b45309;
  --fn-warn-text:#92400e;
  --fn-warn-line:#fde68a;
  --fn-warn-soft:#fffbeb;

  /* ---------- 3. 组件令牌 ---------- */
  --fn-radius-xs:4px;
  --fn-radius-sm:6px;
  --fn-radius:10px;
  --fn-radius-lg:14px;
  --fn-radius-pill:999px;

  --fn-shadow-1:0 1px 2px rgba(31,66,55,.05);
  --fn-shadow-2:0 1px 2px rgba(31,66,55,.05), 0 10px 24px -16px rgba(31,66,55,.20);
  --fn-shadow-3:0 16px 40px -16px rgba(22,48,42,.26);

  --fn-space-1:4px; --fn-space-2:8px; --fn-space-3:12px;
  --fn-space-4:16px; --fn-space-6:24px; --fn-space-8:32px; --fn-space-12:48px;

  --fn-text-xs:12px; --fn-text-sm:13px; --fn-text-base:14px; --fn-text-lg:16px;
  --fn-text-xl:20px; --fn-text-2xl:26px; --fn-text-3xl:32px;
  --fn-leading:1.75;
  --fn-ease:cubic-bezier(.2,.7,.3,1);
  --fn-dur:.2s;

  --fn-font-sans:"PingFang SC","Microsoft YaHei","Helvetica Neue",-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  --fn-font-serif:"Songti SC","Noto Serif SC","Source Han Serif SC",Georgia,"Times New Roman",serif;
  --fn-max:1080px;      /* 官网 / 认证页内容宽度 */
  --fn-max-wide:1320px; /* 工作表内容宽度 */

  /* ---------- 4. 兼容别名（页面样式历史命名，统一映射到上面三层） ---------- */
  --brand:var(--fn-brand); --brand-700:var(--fn-brand-dark); --brand-soft:var(--fn-brand-light);
  --green:var(--fn-brand); --green-2:var(--fn-brand-mid); --green-soft:var(--fn-brand-light);
  --gold:var(--fn-accent); --gold-soft:var(--fn-accent-soft);
  --accent:var(--fn-brand); --warn:var(--fn-warn); --red:var(--fn-up); --red-soft:var(--fn-up-soft);
  --ink:var(--fn-text); --ink-2:var(--fn-text-2); --ink-3:var(--fn-text-3);
  --text:var(--fn-text); --muted:var(--fn-text-3); --dim:var(--fn-text-3);
  --paper:var(--fn-bg); --paper-2:var(--fn-bg-2); --bg:var(--fn-bg);
  --surface:var(--fn-surface); --panel:var(--fn-surface); --panel-2:var(--fn-surface-2);
  --line:var(--fn-line); --line-soft:var(--fn-line-soft);
  --up:var(--fn-up); --down:var(--fn-down);
  --radius:var(--fn-radius); --radius-sm:var(--fn-radius-sm); --r:var(--fn-radius);
  --shadow:var(--fn-shadow-2); --ease:var(--fn-ease);
  --serif:var(--fn-font-serif); --sans:var(--fn-font-sans); --font:var(--fn-font-sans);
  --w:1140px;
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-6:24px;

  /* 语义别名（仅保留仍在使用的键位；--fn-blue-* / --fn-slate-* 已删除，
     调用方一律改用语义令牌，避免出现「名叫 blue 实为绿色」的令牌） */
  --fn-red-600:var(--fn-up); --fn-red-50:var(--fn-up-soft);
  --fn-green-700:var(--fn-down); --fn-green-50:var(--fn-ok-soft);

  /* ---------- 5. Element Plus 主题变量 ---------- */
  --el-color-primary:var(--fn-brand);
  --el-color-primary-light-3:#6d8d83;
  --el-color-primary-light-5:#97aea6;
  --el-color-primary-light-7:#c1ceca;
  --el-color-primary-light-8:#d6dedb;
  --el-color-primary-light-9:var(--fn-brand-light);
  --el-color-primary-dark-2:var(--fn-brand-dark);
  --el-color-success:#0b7a53;
  --el-color-warning:var(--fn-accent);
  --el-color-danger:var(--fn-up);
  --el-color-error:var(--fn-up);
  --el-border-radius-base:8px;
  --el-border-radius-small:6px;
  --el-text-color-primary:var(--fn-text);
  --el-text-color-regular:var(--fn-text-2);
  --el-text-color-secondary:var(--fn-text-3);
  --el-text-color-placeholder:var(--fn-text-4);
  --el-border-color:var(--fn-line);
  --el-border-color-light:var(--fn-line);
  --el-border-color-lighter:var(--fn-line-soft);
  --el-fill-color-blank:var(--fn-surface);
  --el-bg-color:var(--fn-surface);
  --el-font-family:var(--fn-font-sans);
  --el-font-size-base:14px;
  --el-box-shadow-light:var(--fn-shadow-2);
}

/* ---------- 基础重置与排版 ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;color:var(--fn-text);background:var(--fn-bg);
  font-family:var(--fn-font-sans);font-size:var(--fn-text-base);line-height:1.7;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
}
img,svg{max-width:100%}
a{color:var(--fn-brand);text-decoration:none}
/* :where() 不贡献特异性，让普通链接仍然悬浮加深；
   否则 a:hover 的 (0,1,1) 会盖过 .btn-primary 的 (0,1,0)，
   深绿底上的白字在悬浮瞬间变成深绿，按钮文字直接看不见 */
a:where(:hover){color:var(--fn-brand-dark)}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3,h4{color:var(--fn-text);line-height:1.35;margin:0 0 .5em;letter-spacing:.2px}
p{margin:0 0 1em}
code,kbd,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.94em}
::selection{background:rgba(47,93,78,.16)}
[v-cloak]{display:none}
.sr-only{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0;
}
:focus-visible{outline:2px solid var(--fn-brand);outline-offset:2px;border-radius:var(--fn-radius-xs)}
.num,.tnum{font-variant-numeric:tabular-nums}

/* ---------- 通用原子组件（新页面优先复用） ---------- */
.mm-wrap{max-width:var(--fn-max);margin:0 auto;padding:0 24px}
.mm-brand{display:flex;align-items:baseline;gap:8px;font-weight:700}
.mm-brand .cn{font-size:22px;letter-spacing:2px;color:var(--fn-brand)}
.mm-brand .py{font-size:12px;color:var(--fn-text-3);letter-spacing:1px}

.mm-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  min-height:40px;padding:9px 22px;border-radius:var(--fn-radius-sm);
  font-size:15px;line-height:1.2;cursor:pointer;border:1px solid transparent;
  transition:background var(--fn-dur) var(--fn-ease),border-color var(--fn-dur) var(--fn-ease),color var(--fn-dur) var(--fn-ease);
}
.mm-btn-primary{background:var(--fn-brand);color:#fff}
.mm-btn-primary:hover{background:var(--fn-brand-dark);color:#fff}
.mm-btn-ghost{background:transparent;color:var(--fn-brand);border-color:var(--fn-brand)}
.mm-btn-ghost:hover{background:var(--fn-brand-light)}
.mm-btn:disabled{opacity:.55;cursor:not-allowed;background:var(--fn-line);border-color:var(--fn-line);color:var(--fn-text-3)}

.mm-card{
  background:var(--fn-surface);border:1px solid var(--fn-line);
  border-radius:var(--fn-radius-lg);box-shadow:var(--fn-shadow-1);
}
.mm-tag{
  display:inline-flex;align-items:center;gap:4px;font-size:12px;line-height:1.6;
  padding:2px 10px;border-radius:var(--fn-radius-pill);
  background:var(--fn-brand-light);color:var(--fn-brand-dark);border:1px solid transparent;
}
.mm-tag-amber{background:var(--fn-accent-soft);color:var(--fn-accent-dark)}
.mm-tag-danger{background:var(--fn-up-soft);color:var(--fn-up)}
.mm-field{display:block;margin-bottom:16px}
.mm-field>label{display:block;font-size:13px;color:var(--fn-text-3);margin-bottom:6px}
.mm-field input,.mm-field select,.mm-field textarea{
  width:100%;padding:10px 12px;font-size:14px;color:var(--fn-text);
  background:var(--fn-surface);border:1px solid var(--fn-line);
  border-radius:var(--fn-radius-sm);outline:none;transition:border-color var(--fn-dur),box-shadow var(--fn-dur);
}
.mm-field input:focus,.mm-field select:focus,.mm-field textarea:focus{
  border-color:var(--fn-brand);box-shadow:0 0 0 3px rgba(47,93,78,.12);
}
.mm-hint{font-size:12px;color:var(--fn-text-3);line-height:1.7}
.mm-divider{height:1px;background:var(--fn-line);border:0;margin:20px 0}

/* Element Plus 与官网风格对齐：小圆角按钮 + 品牌绿主按钮 */
.el-button{border-radius:var(--fn-radius-sm)}
.el-button--primary{--el-button-bg-color:var(--fn-brand);--el-button-border-color:var(--fn-brand);
  --el-button-hover-bg-color:var(--fn-brand-dark);--el-button-hover-border-color:var(--fn-brand-dark);
  --el-button-active-bg-color:var(--fn-brand-deep);--el-button-active-border-color:var(--fn-brand-deep)}
.el-card,.el-dialog,.el-message-box{border-radius:var(--fn-radius-lg)}
.el-dialog__title{font-weight:600;color:var(--fn-text)}
/* 表格：EP 把 --el-table-* 声明在 .el-table 自身，写在 :root 会被其覆盖，故同层重声明 */
.el-table{
  --el-table-header-bg-color:var(--fn-brand-tint);
  --el-table-header-text-color:var(--fn-text-3);
  --el-table-row-hover-bg-color:var(--fn-brand-tint);
  --el-table-border-color:var(--fn-line-soft);
}
/* 固定列（如右侧「操作」）会脱离表头/行的底色，单独补齐，避免表头被截成两段 */
.el-table th.el-table__cell{
  background-color:var(--el-table-header-bg-color);
  color:var(--el-table-header-text-color);font-weight:600}
.el-table th.el-table-fixed-column--left,
.el-table th.el-table-fixed-column--right{background-color:var(--fn-brand-tint)!important}
.el-table td.el-table-fixed-column--left,
.el-table td.el-table-fixed-column--right{background-color:var(--fn-surface)}
.el-table .el-table__row:hover>td.el-table-fixed-column--left,
.el-table .el-table__row:hover>td.el-table-fixed-column--right{background-color:var(--fn-brand-tint)!important}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}
