/* ── DESIGN TOKENS (PASTEL TOY · 粉彩玩具風) ── */
    /* 固定淺色：雲朵米杏底 + 暖深灰文字（不提供深色模式） */
    :root {
      /* —— 表面系：三階層級（地面 → 凹陷 → 抬起） ——
         這三個值必須看得出差別。原本 --bg #faf6ee 與 --surface #f8f8f4 只差 1%，
         層級全靠陰影撐，遠看整頁是一片米糊、眼睛找不到落點。
         規則：地面最深，卡片／浮層最亮，卡片內的輸入區與清單項凹回去。 */
      --bg:              var(--white-cream-deep); /* 地面：頁面底，最深 */
      --hero:            var(--surface);          /* hero 面板＝抬起面 */
      --topbar-bg:       var(--surface);          /* topbar＝抬起面 */
      --surface:         var(--white-raised);     /* 抬起：卡片／浮層／抽屜，最亮 */
      --surface-t:       rgba(253, 251, 247, 0.82); /* 抬起面半透明 */
      --surface-off:     var(--white-recessed);   /* 凹陷：卡片內的輸入區、清單項 */

      /* —— 邊界線：用透明度疊出柔邊,不寫死灰階 —— */
      --line:            rgba(58, 58, 61, 0.08);
      --line-dash:       rgba(58, 58, 61, 0.18);

      /* —— 文字：暖深灰（避開死黑） —— */
      --text:            #3a3a3d;
      --muted:           #7a7a80;
      --faint:           #b5b5ba;

      /* —— Pastel 多彩調色盤（給 workspace.color 標記用） —— */
      --pastel-sky:      #a8c8e0;          /* 嬰兒藍 */
      --pastel-mint:     #b8d8c8;          /* 鼠尾草綠 */
      --pastel-butter:   #f0e0a8;          /* 奶油黃 */
      --pastel-blush:    #e8c0c8;          /* 奶昔粉 */
      --pastel-lavender: #c8c0e0;          /* 薰衣草紫 */
      --pastel-peach:    #f0c8a8;          /* 奶橘 */

      /* —— Pastel 白卡（玩具風的白,給卡片/底色用） —— */
      --white-cream-deep: #efe7d9;         /* 米杏地面,比雲朵米杏深一階 */
      --white-recessed:   #f4eee3;         /* 凹陷面,介於地面與抬起面 */
      --white-raised:     #fdfbf7;         /* 抬起面,暖白,全畫面最亮 */
      --white-cloud-a:   #faf6ee;          /* 雲朵米杏,微暖 */
      --white-cloud-b:   #f8f8f4;          /* 雲朵暖白,中性無色相 */
      --white-snow:      #f6f9fc;          /* 雪糕白,微藍 */
      --white-porcelain: #f8f8f6;          /* 陶瓷白,微灰 */

      /* —— 主互動色：粉彩藍（降飽和提亮） —— */
      --primary:         #8fb8c8;
      --primary-soft:    #b8d4e0;
      --secondary-soft:  #e0d8e8;

      /* —— 容器 —— */
      --chip:            #f2ede4;
      --tab-bg:          #ece5d8;
      --studio-bg:       #f4efe7;
      --studio-border:   rgba(58, 58, 61, 0.05);
      --flow-bg:         var(--surface);
      --flow-border:     rgba(58, 58, 61, 0.06);

      /* —— 陰影：clay 軟邊界（外柔 + 內一道光,像被捏過的黏土） —— */
      --shadow-xs: 0 1px 2px rgba(58, 58, 61, 0.04),
                   inset 0 1px 0 rgba(255, 255, 255, 0.6);
      --shadow-sm: 0 4px 12px rgba(58, 58, 61, 0.06),
                   inset 0 1px 0 rgba(255, 255, 255, 0.7);
      --shadow-md: 0 8px 24px rgba(58, 58, 61, 0.08),
                   inset 0 1px 0 rgba(255, 255, 255, 0.8);
      --shadow-lg: 0 16px 40px rgba(58, 58, 61, 0.10),
                   inset 0 1px 0 rgba(255, 255, 255, 0.9);

      /* —— 過渡：Q 彈玩具感 —— */
      --tr: 380ms cubic-bezier(0.34, 1.56, 0.64, 1);

      /* —— 語意化 —— */
      --brand-mark-bg:     #8fb8c8;
      --brand-mark-text:   #ffffff;
      --btn-ghost-text:    #6a6a70;
      --btn-primary-text:  #ffffff;
      --kicker-bg:         var(--surface);
      --kicker-text:       #8fb8c8;
      --hero-desc-text:    #7a7a80;
      --flow-progress-track: rgba(58, 58, 61, 0.06);
      --flow-when-text:    #8fb8c8;
      --overlay-bg:        rgba(58, 58, 61, 0.3);
      --active-count-bg:   rgba(143, 184, 200, 0.18);
      --active-count-text: #3a3a3d;
      --danger:            #e58c7e;
      --danger-hover:      #f3aba0;

      /* —— 按鈕階梯：三級都保持按鈕外型,靠「填色多寡」分輕重,不做文字按鈕 ——
         primary  實心主色（儲存／建立這類提交動作）
         accent   淡染主色（某個區塊自己的主要動作,例如附件卡的「編輯（下載）」）
         ghost    抬起面 + 細邊（次要動作：上傳新版、版本、複製連結、邀請）
         danger   同 ghost 形狀但字是 --danger,hover 才填滿（移除、刪除） */
      --btn-accent-bg:     color-mix(in srgb, var(--primary-soft) 42%, var(--surface));
      --btn-accent-text:   #3f6675;   /* 主色壓深到可讀,不是另發明一個色相 */
      --btn-accent-border: color-mix(in srgb, var(--primary) 45%, transparent);

      /* —— 「編輯中」軟鎖：狀態,不是錯誤,所以不能跟「移除」共用 --danger —— */
      --lock-text:         var(--stamp-reviewing-text);

      /* —— 審閱蓋章：pastel 化（柔軟但有識別度） —— */
      --stamp-approved:        #c8e0c8;
      --stamp-approved-text:   #3a5a3a;
      --stamp-reviewing:       #f0e0a8;
      --stamp-reviewing-text:  #6a5a2a;
      --stamp-rejected:        #f0c8c0;
      --stamp-rejected-text:   #6a3030;

      /* —— Focus 環（輸入框聚焦光暈） —— */
      --focus-ring:            rgba(143, 184, 200, 0.22);
    }