/* =====================================================
   JR Academy / 匠人学院 — Design Tokens (Master Brand)
   Tagline: 学 AI 来匠人 / STUDY AI AT JR ACADEMY
   Sub: 一起成为 AI 时代的匠人
   Mascot: 牛小匠 · 红 JR 连帽衫 + 墨镜

   🚨 v6 convergence（2026-09-04）
      - 一个 JR 身份，按 Product / Editorial / Campaign 调整表达强度。
      - 颜色、字体与资产不随档位变化；只调整描边、圆角、阴影和色彩面积。
      - 旧 --jr-border / --jr-shadow-md / --jr-radius-0 保留给尚未迁移的 v5 deck。
        新实现从 --jr-craft-* 与对应 expression token 开始。

   Register B 对齐基准: curriculum/ai-adoption-bootcamp/src/styles/theme.ts
   ===================================================== */

:root {
  /* Product learning workspace — DESIGN.md 2026-09-07; scoped semantic tokens. */
  --jr-learning-canvas: var(--jr-craft-surface);
  --jr-learning-schedule: #F3F8FC;
  --jr-learning-focus: var(--jr-craft-ink);
  --jr-learning-explore: #FFF6D9;
  --jr-learning-journey: #EDF7F0;
  --jr-learning-action: var(--jr-craft-coral);
  --jr-learning-action-text: var(--jr-craft-ink);
  --jr-learning-nav-active: var(--jr-craft-ink);
  --jr-learning-nav-active-text: var(--jr-craft-surface);
  /* —— v6 · JR Soft Craft canonical core —— */
  --jr-craft-canvas: #FFFAF2;
  --jr-craft-surface: #FFFFFF;
  --jr-craft-ink: #17182F;
  --jr-craft-muted: #676273;
  --jr-craft-line: #E9DFD2;
  --jr-craft-coral: #FF6854;
  --jr-craft-pink: #F78FB4;
  --jr-craft-yellow: #FFD65A;
  --jr-craft-lime: #B9E74B;
  --jr-craft-sky: #69BFF0;
  --jr-craft-violet: #9A88EA;
  --jr-craft-gradient-ai: linear-gradient(100deg, #FF734F 0%, #F45279 52%, #8A6CE5 100%);
  --jr-craft-radius-product: 24px;
  --jr-craft-radius-editorial: 18px;
  --jr-craft-radius-campaign: 12px;
  --jr-craft-shadow-product: 0 2px 8px rgba(23,24,47,.05), 0 18px 46px rgba(23,24,47,.09);
  --jr-craft-shadow-editorial: 5px 6px 0 rgba(105,191,240,.72), 0 14px 34px rgba(23,24,47,.07);
  --jr-craft-shadow-campaign: 7px 8px 0 #17182F;
  --jr-craft-border-product: 1px solid #E9DFD2;
  --jr-craft-border-editorial: 1.5px solid rgba(23,24,47,.34);
  --jr-craft-border-campaign: 2px solid #17182F;

  /* —— Register A · Soft Polished（官网 / landing / user-facing product UI 默认）—— */
  --jr-soft-cream: var(--jr-craft-canvas);
  --jr-soft-cream-warm: #FFF7F1;
  --jr-soft-surface: #FFFFFF;
  --jr-soft-ink: var(--jr-craft-ink);
  --jr-soft-muted: var(--jr-craft-muted);
  --jr-soft-line: var(--jr-craft-line);
  --jr-soft-coral: var(--jr-craft-coral);
  --jr-soft-coral-deep: #F2542E;
  --jr-soft-purple: #7B61E8;
  --jr-soft-blue: #3E8EE0;
  --jr-soft-green: #34B37E;
  --jr-soft-amber: #F5B43C;
  --jr-soft-pink: #F0568C;
  --jr-soft-gradient-ai: linear-gradient(100deg, #FF7A4D 0%, #FF4F8F 52%, #9B6BFF 100%);
  --jr-soft-gradient-cta: linear-gradient(135deg, #FF7A4D 0%, #F2542E 100%);
  --jr-soft-shadow-sm: 0 1px 2px rgba(28, 27, 34, 0.05);
  --jr-soft-shadow-md: var(--jr-craft-shadow-product);
  --jr-soft-shadow-lg: 0 30px 64px rgba(28, 27, 34, 0.14);
  --jr-soft-radius-sm: 16px;
  --jr-soft-radius-md: 20px;
  --jr-soft-radius-lg: 24px;
  --jr-soft-radius-xl: 28px;
  --jr-soft-radius-pill: 999px;
  --jr-soft-font: Inter, 'Noto Sans SC', 'PingFang SC', 'Microsoft YaHei',
                  system-ui, -apple-system, sans-serif;

  /* —— Brand · Primary （主深色 v5：对齐 deck dark #10162f）—— */
  --jr-black:    #10162f;  /* 主深色 — 深色 slide / 主 CTA / Logo / 主标识（deck dark）*/
  --jr-ink-true: #000000;  /* 纯黑 — 仅用于边框 / 偏移硬阴影 */

  /* —— Brand · Accent (对齐 deck 六色)—— */
  --jr-red:      #ff5757;  /* 品牌主色 Red — 强调 / 主 CTA / 编号（deck red）*/
  --jr-red-aa:   #D92D20;  /* 可访问红底 — 白色小字 AA（保留）*/
  --jr-red-text: #B42318;  /* 可访问红字 — 浅红/暖底 AA（保留）*/
  --jr-yellow:   #FFDE59;  /* 黄色 Yellow — 强调 / 高亮 / 成就（deck yellow）*/
  --jr-green:    #7ED957;  /* 绿色 Green — 成功 / 数据（deck green）*/
  --jr-blue:     #38B6FF;  /* 蓝色 Blue — 信息 / 链接（deck blue，v5 回归）*/
  --jr-purple:   #CB6CE6;  /* 紫色 Purple — AI / 学习进度 / 装饰（deck purple）*/
  --jr-orange:   #FF914D;  /* 橙色 Orange — 警告 / 次强调（deck orange）*/

  /* —— Surface (deck 暖底，不纯白)—— */
  --jr-surface-canvas: #fff1e7; /* 页面暖底（deck warmBg）*/
  --jr-surface-panel:  #ffffff; /* 卡片 / 面板（neo-brutalism 多用纯白卡 + 黑边）*/
  --jr-surface-panel-alt: #FFF8F2;
  --jr-surface-dark:   #1a1a2e; /* 深色 slide 背景（deck darkBg）*/

  /* —— Border / Shadow（neo-brutalism 核心）—— */
  --jr-border-color:  #000000;
  --jr-border:        3px solid #000000;   /* 标准黑粗边 */
  --jr-border-sm:     2px solid #000000;   /* 小卡 / chip 边 */
  --jr-shadow-sm:     4px 4px 0 #000000;   /* 小卡偏移硬阴影 */
  --jr-shadow-md:     6px 6px 0 #000000;   /* 标准偏移硬阴影 */
  --jr-shadow-lg:     8px 8px 0 #000000;   /* 大区块 / 强调 */
  --jr-shadow-panel:  6px 6px 0 #000000;
  --jr-shadow-hard:   6px 6px 0 #000000;   /* 语义别名 */
  --jr-shadow-hard-sm:4px 4px 0 #000000;
  /* hover 位移量（配 box-shadow:0 0 0 + translate(Npx,Npx)）*/
  --jr-press-shift:   4px;

  /* —— Neutral (暖中性，配暖底)—— */
  --jr-neutral-900: #1a1a2e;  /* 主文字（近 deck darkBg）*/
  --jr-neutral-600: #5b5750;  /* 次正文（暖灰）*/
  --jr-neutral-300: #cfc6b8;  /* 次边框（暖，少用，主边一律黑）*/
  --jr-neutral-100: #f3ece2;  /* 浅暖 bg */
  --jr-neutral-50:  #fff8f0;  /* 页面浅暖 bg */

  /* —— Legacy alias（让旧代码不炸）—— */
  --jr-coral:      var(--jr-red);
  --jr-coral-deep: #E63946;
  --jr-ink:        var(--jr-black);
  --jr-mint:       var(--jr-green);
  --jr-ink-1:      var(--jr-neutral-900);
  --jr-ink-2:      var(--jr-neutral-600);
  --jr-slate:      var(--jr-neutral-600);
  --jr-mist:       var(--jr-neutral-300);
  --jr-fog:        var(--jr-neutral-300);
  --jr-canvas:     var(--jr-neutral-50);
  --jr-canvas-2:   var(--jr-neutral-100);
  --jr-white:      #FFFFFF;
  --jr-border-warm:        #000000;  /* v5：暖边一律收敛到黑粗边 */
  --jr-border-warm-strong: #000000;
  --jr-divider-warm:       #000000;
  --jr-glow-black:    var(--jr-shadow-lg);
  --jr-glow-red:      var(--jr-shadow-lg);
  --jr-glow-purple:   var(--jr-shadow-lg);

  /* —— Wash （浅色背景，chip / alert）—— */
  --jr-wash-red:    #FFE3E3;
  --jr-wash-purple: #F4E3FB;
  --jr-wash-yellow: #FFF6CC;
  --jr-wash-green:  #E6F9DC;
  --jr-wash-blue:   #DEF1FF;
  --jr-wash-gray:   #F1ECE3;
  --jr-wash-coral:  var(--jr-wash-red);
  --jr-wash-mint:   var(--jr-wash-green);

  /* —— Semantic —— */
  --jr-success: var(--jr-green);
  --jr-warning: var(--jr-yellow);
  --jr-danger:  var(--jr-red);
  --jr-info:    var(--jr-blue);

  /* —— Radius (neo-brutalism = 直角；圆形元素用 -full) —— */
  --jr-radius-0:    0;
  --jr-radius-xs:   0;
  --jr-radius-sm:   0;     /* Button / Input / Card 默认 = 直角 */
  --jr-radius-md:   0;
  --jr-radius-lg:   0;     /* 大区块也直角 */
  --jr-radius-xl:   0;
  --jr-radius-2xl:  0;
  --jr-radius-3xl:  0;
  --jr-radius-4xl:  0;
  --jr-radius-full: 9999px; /* 仅圆形：头像 / 状态点 / 胶囊标签 */
  --jr-radius:      0;      /* 通用别名 */

  /* —— Spacing (4pt · 13 档) —— */
  --jr-space-1:  4px;
  --jr-space-2:  8px;
  --jr-space-3:  12px;
  --jr-space-4:  16px;
  --jr-space-6:  24px;
  --jr-space-8:  32px;
  --jr-space-10: 40px;
  --jr-space-12: 48px;
  --jr-space-14: 56px;
  --jr-space-16: 64px;
  --jr-space-20: 80px;
  --jr-space-24: 96px;
  --jr-space-32: 128px;

  /* —— Layout 容器宽度 —— */
  --jr-w-mobile:  375px;
  --jr-w-tablet:  768px;
  --jr-w-desktop: 1200px;
  --jr-w-wide:    1440px;

  /* —— Component shortcuts —— */
  --jr-button-primary-bg:    var(--jr-black);
  --jr-button-primary-text:  #FFFFFF;
  --jr-button-primary-hover: #1d2547;
  --jr-button-accent-bg:     var(--jr-red);   /* 彩色 CTA：红底黑边黑阴影 */
  --jr-chip-ai-bg:     var(--jr-wash-purple);
  --jr-chip-ai-border: #000000;
  --jr-chip-ai-text:   #6b1f86;
  --jr-focus-ring:     rgba(56,182,255,0.45); /* 蓝色 focus，配直角描边 */

  /* —— Icon system —— */
  --jr-icon-size:    24px;
  --jr-icon-size-sm: 18px;
  --jr-icon-size-lg: 32px;
  --jr-icon-stroke:  2;
  --jr-icon-color:   currentColor;
  --jr-icon-radius:  0;

  /* —— Typography（v5：Bricolage Grotesque + DM Sans + Space Mono + Noto Sans SC）—— */
  /* 唯一字体真相。对齐 deck theme.ts：标题 Bricolage Grotesque，正文 DM Sans，
     数据/标签/代码 Space Mono，中文统一 fallback 思源黑体 Noto Sans SC。
     网页须引 Google Fonts:
     Bricolage+Grotesque:wght@400;600;700;800 / DM+Sans:wght@400;500;600;700
     / Space+Mono:wght@400;700 / Noto+Sans+SC:wght@400;500;700;900 */
  --jr-font-heading: 'Bricolage Grotesque', 'Noto Sans SC', 'PingFang SC',
                     'Microsoft YaHei', system-ui, sans-serif;
  --jr-font-sans:    'DM Sans', 'Noto Sans SC', 'PingFang SC',
                     'Microsoft YaHei', system-ui, -apple-system, sans-serif;
  --jr-font-mono:    'Space Mono', 'SF Mono', Menlo, Consolas, monospace;
  --jr-font-display: var(--jr-font-heading);  /* Hero 大字也走标题字体 */

  --jr-fs-display: clamp(40px, 6vw, 64px);  /* Display — Hero/Cover 大字 */
  --jr-fs-h1:      clamp(32px, 4vw, 48px);  /* 标题 1 */
  --jr-fs-h2:      24px;   /* 标题 2 */
  --jr-fs-h3:      18px;   /* 标题 3 */
  --jr-fs-body-1:  15px;   /* 正文 */
  --jr-fs-body-2:  14px;
  --jr-fs-caption: 12px;   /* 辅助 / mono 标签 */
  --jr-fs-btn-lg:  16px;
  --jr-fs-btn-md:  14px;
  --jr-fs-btn-text:14px;

  --jr-fw-regular:  400;
  --jr-fw-medium:   500;
  --jr-fw-semibold: 600;
  --jr-fw-bold:     700;
  --jr-fw-black:    800;   /* Bricolage 标题极粗 */

  --jr-lh-heading: 1.1;
  --jr-lh-body:    1.6;

  /* —— Motion —— */
  --jr-dur-fast: 120ms;
  --jr-dur-base: 200ms;
  --jr-dur-slow: 320ms;
  --jr-ease-standard: cubic-bezier(0.2, 0.8, 0.2, 1);
  --jr-ease-spring:   cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* —— Type presets —— */
.jr-display { font: var(--jr-fw-black) var(--jr-fs-display)/var(--jr-lh-heading) var(--jr-font-heading); color: var(--jr-ink); }
.jr-h1    { font: var(--jr-fw-black)    var(--jr-fs-h1)/var(--jr-lh-heading) var(--jr-font-heading); color: var(--jr-ink); }
.jr-h2    { font: var(--jr-fw-bold)     var(--jr-fs-h2)/var(--jr-lh-heading) var(--jr-font-heading); color: var(--jr-ink); }
.jr-h3    { font: var(--jr-fw-semibold) var(--jr-fs-h3)/var(--jr-lh-heading) var(--jr-font-heading); color: var(--jr-ink); }
.jr-body-1{ font: var(--jr-fw-regular)  var(--jr-fs-body-1)/var(--jr-lh-body) var(--jr-font-sans); color: var(--jr-ink-1); }
.jr-body-2{ font: var(--jr-fw-regular)  var(--jr-fs-body-2)/var(--jr-lh-body) var(--jr-font-sans); color: var(--jr-slate); }
.jr-caption{font: var(--jr-fw-medium)   var(--jr-fs-caption)/var(--jr-lh-body) var(--jr-font-mono); color: var(--jr-slate); }
.jr-mono   {font-family: var(--jr-font-mono); }