/* GENERATED by @ej/core tokens — do not edit by hand.
   Source: packages/core/src/tokens/  ·  rebuild: npm run tokens:build
   RFC-0004 design tokens. Additive only (pixel-parity); the 8 runtime themes
   still live in ej/app style.css and migrate in here page-by-page. */
:root {
  /* spacing — 4px grid */
  --space-0: 0px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;

  /* type scale (px) */
  --text-xs: 12px;
  --text-sm: 13px;
  --text-base: 14px;
  --text-md: 15px;
  --text-lg: 17px;
  --text-xl: 20px;
  --text-2xl: 26px;

  /* radius */
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-full: 9999px;

  /* z-index ladder */
  --z-dropdown: 50;
  --z-sticky: 60;
  --z-header: 70;
  --z-overlay: 80;
  --z-modal: 100;
  --z-toast: 200;
  --z-splash: 900;

  /* motion */
  --dur-fast: 120ms;
  --dur-base: 200ms;
  --dur-slow: 320ms;
  --ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --ease-emphasized: cubic-bezier(0.05, 0.7, 0.1, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);

  /* semantic status colors (--danger reconciled in P1) */
  --success: #34C759;
  --warn: #FF9F0A;
  --info: #0A84FF;
}

/* GENERATED-SOURCE canonical themes — RFC-0004 app↔ej color parity (task #7).
   The 8 runtime themes as the SINGLE SOURCE, extracted verbatim from ej/style.css
   (ej is the agreed canonical look). Folded into tokens.css by tools/build-tokens.ts
   and loaded by BOTH ej and app. While ej/app still keep their own [data-theme]
   blocks in style.css (loaded after tokens.css) they shadow these with identical
   (ej) / their own (app) values — so adding this is inert until a surface opts in.
   --site-color carries a #34C759 fallback so forest's accent resolves even before
   the async visionos-space.css (which defines --site-color) loads. */
/* ── Themes ──────────────────────────────────────────────────────────── */

/* 沙丘 — matte rose-gold + amber + burnt umber desert */
[data-theme="eastern"] {
  --bg-base:      #3D2A1A;
  --surface:      #4A3424;
  --surface-alt:  #382418;
  --border:       #6B5040;
  --ink:          #FFF4E8;
  --soft:         #E8C8A0;
  --muted:        #C8A880;
  --accent:       #E0A050;
  --accent-subtle: rgba(224,160,80,0.18);
  --accent-hover:  rgba(224,160,80,0.28);
  --accent-ring:   rgba(224,160,80,0.30);
  --header-bg:    rgba(50,32,20,0.90);
  --glass:        rgba(50,32,20,0.85);
  --glass-heavy:  rgba(50,32,20,0.92);
  --tag-color:    #E8B870;
  --tag-border:   rgba(232,184,112,0.45);
  --tag-bg:       rgba(232,184,112,0.16);
  --progress:     #E0A050;
  --danger-name:  #E07030;
  --tip-bg:       rgba(50,32,20,0.92);
  --shadow-sm:    0 1px 4px rgba(0,0,0,0.30);
  --shadow-md:    0 4px 20px rgba(0,0,0,0.40);
  --shadow-lg:    0 12px 48px rgba(0,0,0,0.60);
  --font-heading: 'Playfair Display', 'Noto Serif SC', Georgia, serif;
  --font-body:    'DM Sans', 'Inter', -apple-system, system-ui, sans-serif;
  --globe-bg:
    radial-gradient(ellipse at 50% 78%, rgba(224,160,64,0.40) 0%, transparent 35%),
    radial-gradient(ellipse at 50% 72%, rgba(200,130,50,0.25) 0%, transparent 50%),
    radial-gradient(ellipse at 35% 80%, rgba(180,120,60,0.15) 0%, transparent 35%),
    radial-gradient(ellipse at 65% 82%, rgba(190,110,50,0.15) 0%, transparent 35%),
    linear-gradient(180deg, #0A0E1A 0%, #101828 30%, #1A2238 55%, #2A2030 72%, #3A2818 88%, #2A1E14 100%);
}

/* 夜空 — pure black bg, muted gold, sans-serif */
[data-theme="luxe"] {
  --bg-base:      #000000;
  --surface:      #0A0A0A;
  --surface-alt:  #141414;
  --border:       #222222;
  --ink:          #F0ECE4;
  --soft:         #C0B8AE;
  --muted:        #908880;
  --accent:       #C9A86C;
  --accent-subtle: rgba(201,168,108,0.08);
  --accent-hover:  rgba(201,168,108,0.14);
  --accent-ring:   rgba(201,168,108,0.18);
  --header-bg:    rgba(0,0,0,0.92);
  --glass:        rgba(10,10,10,0.94);
  --glass-heavy:  rgba(10,10,10,0.98);
  --tag-color:    #C9A86C;
  --tag-border:   rgba(201,168,108,0.35);
  --tag-bg:       rgba(201,168,108,0.15);
  --progress:     #C9A86C;
  --danger-name:  #E8C040;
  --tip-bg:       rgba(26,26,26,0.96);
  --shadow-sm:    0 1px 4px rgba(0,0,0,0.30);
  --shadow-md:    0 4px 20px rgba(0,0,0,0.40);
  --shadow-lg:    0 12px 48px rgba(0,0,0,0.50);
  --font-heading: 'Cormorant Garamond', 'Playfair Display', Georgia, serif;
  --font-body:    'DM Sans', 'Inter', -apple-system, system-ui, sans-serif;
  --globe-bg: #000000;
}

/* 草地 — French estate picnic, dappled shade + straw hat + sage */
[data-theme="natural"] {
  --bg-base:      #F6F4EE;
  --surface:      #FCFBF6;
  --surface-alt:  #EEEcE2;
  --border:       #DCD6C6;
  --ink:          #2E3028;
  --soft:         #4E5238;
  --muted:        #636555;
  --accent:       #7A8E50;
  --accent-subtle: rgba(122,142,80,0.07);
  --accent-hover:  rgba(122,142,80,0.12);
  --accent-ring:   rgba(122,142,80,0.14);
  --header-bg:    rgba(246,244,238,0.88);
  --glass:        rgba(252,251,246,0.92);
  --glass-heavy:  rgba(252,251,246,0.97);
  --tag-color:    #6B7D44;
  --tag-border:   rgba(107,125,68,0.35);
  --tag-bg:       rgba(107,125,68,0.12);
  --progress:     #7A8E50;
  --danger-name:  #D4712A;
  --tip-bg:       rgba(246,244,238,0.96);
  --shadow-sm:    0 1px 4px rgba(46,48,40,0.06);
  --shadow-md:    0 4px 16px rgba(46,48,40,0.08);
  --shadow-lg:    0 12px 40px rgba(46,48,40,0.10);
  --font-heading: 'Lora', Georgia, serif;
  --font-body:    'DM Sans', 'Inter', -apple-system, system-ui, sans-serif;
  --globe-bg:
    radial-gradient(ellipse at 35% 40%, rgba(200,190,130,0.16) 0%, transparent 40%),
    radial-gradient(ellipse at 65% 60%, rgba(122,142,80,0.12) 0%, transparent 45%),
    radial-gradient(ellipse at 50% 20%, rgba(220,210,160,0.14) 0%, transparent 38%),
    radial-gradient(ellipse at 80% 80%, rgba(140,160,100,0.08) 0%, transparent 35%),
    linear-gradient(155deg, #F6F4EE 0%, #F0EDE4 40%, #EAE6DA 100%);
}

/* 晴空 — uses --site-color (apple green) */
[data-theme="forest"] {
  --bg-base:      #F8F5F0;
  --surface:      #FFFFFF;
  --surface-alt:  #F0EDE5;
  --border:       #E2D9CF;
  --ink:          #1A3A28;
  --soft:         #3A5E48;
  --muted:        #547066;
  --accent:       var(--site-color, #34C759);
  --accent-subtle: rgba(52,199,89,0.07);
  --accent-hover:  rgba(52,199,89,0.12);
  --accent-ring:   rgba(52,199,89,0.10);
  --header-bg:    rgba(245,252,248,0.85);
  --glass:        rgba(255,255,255,0.92);
  --glass-heavy:  rgba(255,255,255,0.97);
  --tag-color:    var(--site-color, #34C759);
  --tag-border:   rgba(52,199,89,0.40);
  --tag-bg:       rgba(52,199,89,0.14);
  --progress:     var(--site-color, #34C759);
  --danger-name:  #D4A020;
  --tip-bg:       rgba(245,252,248,0.95);
  --shadow-sm:    0 1px 4px rgba(26,58,40,0.06);
  --shadow-md:    0 4px 16px rgba(26,58,40,0.08);
  --shadow-lg:    0 12px 40px rgba(26,58,40,0.10);
  --font-heading: 'Inter', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  --font-body:    'Inter', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  --globe-bg:
    radial-gradient(ellipse at 14% 22%, rgba(148,183,238,0.30) 0%, transparent 42%),
    radial-gradient(ellipse at 86% 76%, rgba(178,150,232,0.22) 0%, transparent 36%),
    radial-gradient(ellipse at 52% 6%,  rgba(132,198,250,0.18) 0%, transparent 30%),
    radial-gradient(ellipse at 30% 85%, rgba(160,220,200,0.16) 0%, transparent 35%),
    linear-gradient(152deg, #EEF4FB 0%, #EAF1F8 40%, #F0ECF8 72%, #F5F1EC 100%);
}

/* 花海 — tulip fields, vibrant pink-red + yellow + green bands */
[data-theme="spring"] {
  --bg-base:      #FDF6F8;
  --surface:      #FFFAFC;
  --surface-alt:  #F8ECF0;
  --border:       #ECD0DA;
  --ink:          #3A1828;
  --soft:         #6A3048;
  --muted:        #986070;
  --accent:       #D63068;
  --accent-subtle: rgba(214,48,104,0.07);
  --accent-hover:  rgba(214,48,104,0.12);
  --accent-ring:   rgba(214,48,104,0.12);
  --header-bg:    rgba(253,246,248,0.88);
  --glass:        rgba(255,250,252,0.92);
  --glass-heavy:  rgba(255,250,252,0.97);
  --tag-color:    #D63068;
  --tag-border:   rgba(214,48,104,0.30);
  --tag-bg:       rgba(214,48,104,0.07);
  --progress:     #D63068;
  --danger-name:  #CC3366;
  --tip-bg:       rgba(253,246,248,0.96);
  --shadow-sm:    0 1px 4px rgba(58,24,40,0.06);
  --shadow-md:    0 4px 16px rgba(58,24,40,0.08);
  --shadow-lg:    0 12px 40px rgba(58,24,40,0.10);
  --font-heading: 'Lora', Georgia, serif;
  --font-body:    'DM Sans', 'Inter', -apple-system, system-ui, sans-serif;
  --globe-bg:
    radial-gradient(ellipse at 15% 75%, rgba(214,48,104,0.14) 0%, transparent 42%),
    radial-gradient(ellipse at 85% 25%, rgba(255,180,40,0.16) 0%, transparent 40%),
    radial-gradient(ellipse at 50% 50%, rgba(100,180,80,0.10) 0%, transparent 45%),
    radial-gradient(ellipse at 70% 80%, rgba(220,60,120,0.10) 0%, transparent 35%),
    linear-gradient(150deg, #FDF0F4 0%, #FDF6F8 30%, #FFFAE8 60%, #F0F8F0 100%);
}

/* 初雪 — minimal black & white */
[data-theme="snow"] {
  --bg-base:      #FAFAFA;
  --surface:      #FFFFFF;
  --surface-alt:  #F2F2F2;
  --border:       #E8E8E8;
  --ink:          #111111;
  --soft:         #444444;
  --muted:        #767676;
  --accent:       #111111;
  --accent-subtle: rgba(0,0,0,0.04);
  --accent-hover:  rgba(0,0,0,0.08);
  --accent-ring:   rgba(0,0,0,0.08);
  --header-bg:    rgba(255,255,255,0.88);
  --glass:        rgba(255,255,255,0.92);
  --glass-heavy:  rgba(255,255,255,0.97);
  --tag-color:    #333333;
  --tag-border:   rgba(0,0,0,0.28);
  --tag-bg:       rgba(0,0,0,0.08);
  --progress:     #111111;
  --danger-name:  #CC3333;
  --tip-bg:       rgba(255,255,255,0.96);
  --shadow-sm:    0 1px 4px rgba(0,0,0,0.06);
  --shadow-md:    0 4px 16px rgba(0,0,0,0.08);
  --shadow-lg:    0 12px 40px rgba(0,0,0,0.10);
  --font-heading: -apple-system, BlinkMacSystemFont, 'SF Pro Display', system-ui, sans-serif;
  --font-body:    -apple-system, BlinkMacSystemFont, 'SF Pro Text', system-ui, sans-serif;
  --globe-bg:
    radial-gradient(ellipse at 50% 50%, rgba(220,230,240,0.25) 0%, transparent 60%),
    linear-gradient(160deg, #F8F9FB 0%, #F2F4F7 50%, #ECEEF2 100%);
}

/* 朝露 — gentle dawn, pale sky + soft apricot glow.
   Accent unified to the 添加美食 button's orange-red (#C4501A) so every orange
   UI surface (login, edit profile, 探店, tags, progress…) matches it. */
[data-theme="fusion"] {
  --bg-base:      #F8F6F2;
  --surface:      #FDFCFA;
  --surface-alt:  #F2EEEA;
  --border:       #E4DAD0;
  --ink:          #3A2E24;
  --soft:         #6A5440;
  --muted:        #7A6450;
  --accent:       #C4501A;
  --accent-subtle: rgba(196,80,26,0.07);
  --accent-hover:  rgba(196,80,26,0.12);
  --accent-ring:   rgba(196,80,26,0.14);
  --header-bg:    rgba(248,246,242,0.88);
  --glass:        rgba(253,252,250,0.92);
  --glass-heavy:  rgba(253,252,250,0.97);
  --tag-color:    #C4501A;
  --tag-border:   rgba(196,80,26,0.30);
  --tag-bg:       rgba(196,80,26,0.07);
  --progress:     #C4501A;
  --danger-name:  #C04030;
  --tip-bg:       rgba(248,246,242,0.96);
  --shadow-sm:    0 1px 4px rgba(58,46,36,0.06);
  --shadow-md:    0 4px 16px rgba(58,46,36,0.08);
  --shadow-lg:    0 12px 40px rgba(58,46,36,0.10);
  --font-heading: 'Noto Serif SC', 'Playfair Display', Georgia, serif;
  --font-body:    'DM Sans', 'Inter', -apple-system, system-ui, sans-serif;
  --globe-bg:
    radial-gradient(ellipse at 50% 82%, rgba(200,120,80,0.16) 0%, transparent 55%),
    radial-gradient(ellipse at 70% 78%, rgba(220,160,100,0.14) 0%, transparent 50%),
    radial-gradient(ellipse at 30% 75%, rgba(200,140,90,0.10) 0%, transparent 45%),
    radial-gradient(ellipse at 50% 12%, rgba(210,210,210,0.08) 0%, transparent 40%),
    linear-gradient(180deg, #F0F0EE 0%, #F4F0EA 35%, #F8E8DA 70%, #F5DCCA 100%);
}

/* 返航 — deep navy + sunset orange (v2) */
[data-theme="homebound"] {
  --bg-base:      #1B2838;
  --surface:      #223248;
  --surface-alt:  #1A2535;
  --border:       #2E4058;
  --ink:          #F5EDE0;
  --soft:         #D0C4B0;
  --muted:        #90A8B8;
  --accent:       #E8923A;
  --accent-subtle: rgba(232,146,58,0.10);
  --accent-hover:  rgba(232,146,58,0.16);
  --accent-ring:   rgba(232,146,58,0.18);
  --header-bg:    rgba(22,34,50,0.92);
  --glass:        rgba(27,40,56,0.93);
  --glass-heavy:  rgba(27,40,56,0.97);
  --tag-color:    #E8923A;
  --tag-border:   rgba(232,146,58,0.35);
  --tag-bg:       rgba(232,146,58,0.10);
  --progress:     #E8923A;
  --danger-name:  #E06040;
  --tip-bg:       rgba(27,40,56,0.96);
  --shadow-sm:    0 1px 4px rgba(0,0,0,0.30);
  --shadow-md:    0 4px 20px rgba(0,0,0,0.35);
  --shadow-lg:    0 12px 48px rgba(0,0,0,0.45);
  --font-heading: 'Playfair Display', 'Noto Serif SC', Georgia, serif;
  --font-body:    'DM Sans', 'Inter', -apple-system, system-ui, sans-serif;
  --globe-bg:
    radial-gradient(ellipse at 50% 85%, rgba(232,146,58,0.18) 0%, transparent 50%),
    radial-gradient(ellipse at 80% 90%, rgba(200,80,40,0.12) 0%, transparent 40%),
    radial-gradient(ellipse at 20% 20%, rgba(40,80,140,0.15) 0%, transparent 45%),
    linear-gradient(180deg, #0F1A28 0%, #1B2838 40%, #2A1E18 100%);
}
