/* M7-A 动物森友会视觉基座：全站唯一色源。 */

/* ── 站点主字体：猫啃忘形圆 ──────────────────────────
 * 来源：猫啃网（OFL 1.1，免费商用，无需署名）
 * 已用 pyftsubset 子集化：6900 字符（含 GB2312 一二三级常用字）
 * 原始 2976KB → 1031KB（woff2）
 * 回滚：删掉本段并还原 --ai-font 即可 */
@font-face{
  font-family:'MaoKenWangXingYuan';
  src:url('/static/fonts/maoken-wangxing.woff2') format('woff2');
  font-weight:400;
  font-style:normal;
  font-display:swap;
}

:root{
  /* ── 底色：暖米黄纸感 ── */
  --ai-bg:          #f8f8f0;   /* 页面底 */
  --ai-surface:     #f7f3df;   /* 卡片面 */
  --ai-surface-2:   #fdfbf0;   /* 更高一层（弹层/悬浮）*/
  --ai-surface-3:   #efe9d4;   /* 凹陷/衬底 */
  --ai-track:       #e8e2cc;   /* 进度条底槽 */

  /* ── 文字：暖棕褐（禁止纯黑）── */
  --ai-text:        #794f27;   /* 标题/主文字 */
  --ai-text-2:      #725d42;   /* 正文 */
  --ai-text-3:      #766a56;   /* 次要/说明  4.75:1（原 #9f927d 仅 2.74:1，2026-10-04 调深一档）*/
  --ai-text-inv:    #fffdf5;   /* 深底上的反白字 */

  /* ── 板块仪表盘横幅遮罩（四条横幅共用，保证视觉一致）──
     从下往上渐深：文字区够暗（奶油字 ≥4.5:1），上半部保住插画。
     旧平铺 rgba(121,79,39,.42) 实测最亮的 banner-todo 文字区只有 1.67:1、
     banner-study 2.18:1，均低于门槛（大字 3:1 / 小字 4.5:1）。*/
  --ai-banner-scrim: linear-gradient(to top,
      rgba(74,47,22,.82)   0%,
      rgba(74,47,22,.74)  44%,
      rgba(121,79,39,.46) 66%,
      rgba(121,79,39,.13) 86%,
      rgba(121,79,39,0)  100%);

  /* ── 主色与语义色 ── */
  --ai-primary:     #19c8b9;   /* 薄荷青：主按钮/选中/进度 */
  /* 主色「实体面」：只给承载反白字的实心按钮/标签用（薄荷青底白字仅 2.06:1）。
     进度条/图标/焦点环/装饰仍用 --ai-primary 薄荷青，品牌色不变。
     面 #0a7d74 反白 4.91:1、hover #0b8377 4.6:1、厚度 #075e57 更深。 */
  --ai-primary-solid:    #0a7d74;
  --ai-primary-solid-hi: #0b8377;
  --ai-primary-solid-dk: #075e57;
  --ai-primary-dk:  #12a396;   /* 主色按下态 */
  --ai-primary-lt:  #d6f5f2;   /* 主色浅底 */
  /* 数值/强调文字专用：与 --ai-primary-dk 同色相但更暗，米白底 4.79:1 / 浅青底 4.63:1。
     原字体色用 --ai-primary-dk 只有 2.81:1。只用于 color 属性——
     按钮厚度阴影、进度条渐变、边框仍留在 --ai-primary-dk 上，不受影响。 */
  --ai-ink-num:     #22776e;
  --ai-success:     #6fba2c;   /* 完成/已读 */
  --ai-success-lt:  #e8f5d8;
  --ai-warn:        #f5c31c;   /* 提醒 */
  --ai-warn-lt:     #fdf3d0;
  --ai-danger:      #e05a5a;   /* 错误/逾期 */
  --ai-danger-lt:   #fbe4e4;
  /* 逾期/危险「文字与硬边」专用：与 --ai-danger 同色相但更暗。
     --ai-danger(#e05a5a) 在 --ai-surface-2(#fdfbf0) 上只有 3.50:1，
     不满足正文 4.5:1；--ai-danger-ink(#a52f2f) 实测 6.64:1。
     只用于 color / 2px 硬边，按钮底色仍用 --ai-danger。 */
  --ai-danger-ink:  #a52f2f;

  /* ── 语义色「实体面」：同主色实体面逻辑，只给承载反白字的实心面用 ──
     危险红 #e05a5a 反白仅 3.57:1、成功绿 #6fba2c 仅 2.36:1；
     图标/热力图/装饰仍用原 --ai-danger / --ai-success。 */
  --ai-danger-solid:    #b84646;   /* 反白 5.15:1 */
  --ai-danger-solid-dk: #a83d3d;   /* 厚度/按下 6.07:1 */
  --ai-success-solid:    #4a7d18;  /* 反白 4.87:1 */
  --ai-success-solid-dk: #3f6b12;  /* 厚度 6.21:1 */

  /* ── 边框与 3D 厚度（动森按钮的关键）── */
  --ai-border:      #d8cdb8;
  /* 卡片专用描边（官方 --animal-border #c4b89e）：官方规则8 规定 Card 无阴影，
     层次靠 1.5px 描边 + hover 上浮，所以描边要比普通边框深一档 */
  --ai-card-border: #c4b89e;
  --ai-edge:        #bdaea0;   /* 按钮底部厚度色 */
  --ai-edge-dk:     #a3907f;   /* 深色按钮厚度 */

  /* ── 圆角 ── */
  --ai-r-sm:   12px;
  --ai-r-md:   20px;   /* 卡片标准圆角 */
  --ai-r-lg:   28px;   /* 大容器 */
  --ai-r-pill: 50px;   /* 按钮/输入框/标签：药丸形 */

  /* ── 阴影（柔和分层，不用硬描边）── */
  --ai-sh-1: 0 1px 2px rgba(121,79,39,.10), 0 4px 10px rgba(121,79,39,.13);
  --ai-sh-2: 0 2px 4px rgba(121,79,39,.12), 0 8px 20px rgba(121,79,39,.17);
  --ai-sh-3: 0 4px 8px rgba(121,79,39,.14), 0 16px 38px rgba(121,79,39,.20);

  /* ── 动效 ── */
  /* 1) 通用档（旧，保留兼容：多处在用，别删） */
  --ai-ease: cubic-bezier(.4,0,.2,1);
  --ai-t-fast: .15s;
  --ai-t-mid:  .25s;
  --ai-t-slow: .35s;

  /* 2) 方向缓动（2026-10-23 补）：
        进去减速到位，出来加速离场，回弹只用在按压与落位。
        全站只有一条 ease 是所有东西看着一样平的原因。 */
  --ai-ease-out:    cubic-bezier(0,0,.2,1);       /* 进入：起快收慢，稳稳落在目标位 */
  --ai-ease-in:     cubic-bezier(.4,0,1,1);       /* 退出：起慢收快，迅速消失 */
  --ai-ease-spring: cubic-bezier(.34,1.56,.64,1); /* 回弹：过冲 56%，再多就变廉价玩具 */

  /* 3) 语义时长（按交互类型取，不要按"快慢"猜） */
  --ai-t-tap:       .12s;  /* 按压 / hover 反馈：快到感觉不出延迟 */
  --ai-t-toast-in:  .25s;  /* 提示条进 */
  --ai-t-toast-out: .20s;  /* 提示条出（必须比进快） */
  --ai-t-in:        .26s;  /* 弹层 / 面板进入 */
  --ai-t-out:       .20s;  /* 弹层 / 面板关闭（永远比进入快） */
  --ai-t-panel:     .42s;  /* 大面板 / 板块切换 / 抽屉抽出 */
  --ai-t-stagger-cap: 400ms; /* 列表逐项入场「总时长」上限，不是单项时长 */

  /* ── 字体：主字体「猫啃忘形圆」（原生简体圆体），数字/英文兜底 Nunito ── */
  --ai-font: "MaoKenWangXingYuan", "Nunito", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei",
             "Source Han Sans SC", "Noto Sans CJK SC", system-ui, sans-serif;

  /* ── 焦点（官方规则6：Input/Switch/Checkbox 焦点为黄，禁蓝）── */
  --ai-focus:        #ffcc00;
  --ai-focus-glow:   rgba(255,204,0,.30);   /* 输入框焦点光晕 */
  --ai-focus-halo:   rgba(255,204,0,.55);   /* 登录页焦点环 */

  /* ── 主色派生 ── */
  --ai-primary-hover: #3dd4c6;              /* 主按钮 hover：比主色亮一档 */
  --ai-primary-halo:  rgba(25,200,185,.22); /* 地图热区聚焦外环 */

  /* ── 语义色深号：只用于「文字 / 按钮厚度」，不动按钮底色 ── */
  --ai-success-dk:  #52901e;   /* 成功按钮 3D 厚度 */
  --ai-success-ink: #4a7d18;   /* 成功标签文字（浅绿底上）*/
  --ai-warn-ink:    #9d7a00;   /* 提醒标签文字（浅黄底上）*/
  --ai-danger-dk:   #b84646;   /* 危险按钮厚度 + 危险标签文字 */

  /* ── 地图房间木质门牌 ── */
  --ai-sign:      #ca9a7e;
  --ai-sign-edge: #4b1c0d;
  --ai-sign-ink:  #3a2416;

  /* ── 通用件 ── */
  --ai-border-hover: #a89878;               /* 输入框 hover 描边（login.css 一直在引用这个名字，此前从未定义）*/
  --ai-sh-soft: 0 2px 4px 0 rgba(61,52,40,.06);   /* 官方 default 按钮软阴影 */
  --ai-sh-up:   0 -4px 14px rgba(121,79,39,.10);  /* 底部吸附条上投影 */
  --ai-scrim:   rgba(121,79,39,.35);              /* 弹窗背板 */
  --ai-sh-text:    0 2px 10px rgba(74,47,22,.18); /* 横幅文字投影：暖褐，禁纯黑 */
  --ai-sh-text-sm: 0 1px 6px  rgba(74,47,22,.22);
  --ai-mark:    rgba(255,206,86,.42);             /* 正文高亮底 */
  --ai-login-veil: linear-gradient(180deg, rgba(248,248,240,.30), rgba(248,248,240,.52));
  --ai-login-glow: radial-gradient(58% 52% at 50% 46%, rgba(255,255,255,.38) 0%, rgba(248,248,240,.10) 62%, rgba(239,233,212,.30) 100%);

  /* 兼容旧选择器：全部落到新色板，禁止冷灰/深蓝残留。 */
  --bg-deep: var(--ai-surface-3);
  --bg-base: var(--ai-bg);
  --bg-panel: var(--ai-surface);
  --bg-panel-2: var(--ai-surface-2);
  --bg-hover: var(--ai-primary-lt);
  --text-primary: var(--ai-text);
  --text-secondary: var(--ai-text-2);
  --text-muted: var(--ai-text-3);
  --text-inverse: var(--ai-text-inv);
  --accent: var(--ai-primary);
  --accent-2: var(--ai-primary-dk);
  --success: var(--ai-success);
  --warning: var(--ai-warn);
  --danger: var(--ai-danger);
  --orange: #ef9b57;
  --lime: var(--ai-success-lt);
  --magenta: #c25aa0;
  --rarity-common:#9f927d; --rarity-uncommon:#6fba2c; --rarity-rare:#19c8b9; --rarity-epic:#c25aa0; --rarity-legendary:#f5c31c;
  --skill-communication:#19c8b9; --skill-data:#6fba2c; --skill-art:#ef9b57; --skill-jianghu:#e05a5a; --skill-life:#f5c31c;
  --fs-xs:12px; --fs-md:24px; --fs-lg:36px; --fs-xl:48px;
  --font-px: var(--ai-font);
  --font-body: var(--ai-font);
  --bevel: none;
  --bevel-inverse: none;
  --shadow-hard-sm: var(--ai-sh-1); --shadow-hard: var(--ai-sh-2);
  --glow-accent: 0 0 0 3px var(--ai-primary-lt);

  /* ---------- 贴纸装饰层（2026-10-10）：背景平铺 + 网站边框 ----------
     调强度只改这三个数：--deco-bg-op 背景浓度 / --deco-frame-op 虚线浓度 / --deco-corner 四角尺寸 */
  --deco-bg-op: .32;
  --deco-frame-op: .55;
  --deco-corner: 46px;
}

/* ---------- 手机端表单字号（2026-10-17）----------
   iOS Safari 的规矩：input / textarea / select 的 font-size 小于 16px 时，
   一聚焦就自动把整页放大，输入完还停在放大状态 —— 看着像「整个界面都变大了」。
   窄屏统一抬到 16px，字大一点，换整页不跳。门槛就是 16，别改成 15 去试探。 */
@media (max-width: 900px) {
  input:not([type=checkbox]):not([type=radio]):not([type=range]),
  textarea,
  select {
    font-size: 16px !important;
  }
}
