/* Elena Bridge site · tokens.
 *
 * Copied by value, never linked. Colour, glass and motion from the Bridge's
 * glass tokens (~/elena/bridge/app/glass.css, dark set). Type scale, spacing
 * and page rhythm from the course landing (elena-course/site/public/v2/v2.css,
 * its dark weights). Background, accent and text match shared/brand.json.
 * table.js reads --t1..3, --tint*, --fill*, --card*, --glass*, --sans, --mono,
 * --spring and --d-state from here.
 */

:root {
  color-scheme: dark;

  /* ---- Bridge glass, dark set ---- */
  --wall: radial-gradient(1100px 760px at 12% 8%, rgba(94,92,230,.42), transparent 62%),
          radial-gradient(900px 700px at 88% 14%, rgba(64,200,224,.20), transparent 60%),
          radial-gradient(1000px 800px at 55% 108%, rgba(255,55,95,.18), transparent 60%),
          radial-gradient(700px 600px at 30% 80%, rgba(191,90,242,.14), transparent 60%),
          #08080D;
  --glass:      rgba(24,24,30,.62);
  --glass2:     rgba(44,44,52,.62);
  --glass-line: rgba(255,255,255,.09);
  --glass-hi:   rgba(255,255,255,.10);
  --blur:       blur(40px) saturate(180%);
  --blur-bar:   blur(30px) saturate(180%);
  --blur-pal:   blur(50px) saturate(190%);
  --sheet:      rgba(16,16,20,.58);

  --card:       rgba(255,255,255,.055);
  --card-line:  rgba(255,255,255,.07);
  --card-hover: rgba(255,255,255,.085);
  --card-solid: rgba(34,34,40,.85);
  --menu-solid: #1E1E24;

  --fill:  rgba(120,120,128,.28);
  --fill2: rgba(120,120,128,.18);
  --fill3: rgba(120,120,128,.11);
  --sep:   rgba(255,255,255,.08);

  --t1: #F5F5F7;
  --t2: rgba(235,235,245,.62);
  --t3: rgba(235,235,245,.52);

  --tint:      #0A84FF;
  --tint-soft: rgba(10,132,255,.20);
  --tint-line: rgba(10,132,255,.45);
  --tint-fill: #0071E3;
  --tint-ink:  color-mix(in srgb, var(--tint) 61%, white);
  --on-tint:   #FFFFFF;

  --red: #FF453A; --orange: #FF9F0A; --green: #30D158; --indigo: #5E5CE6; --purple: #BF5AF2;
  --green-ink:  color-mix(in srgb, var(--green) 90%, white);
  --orange-ink: color-mix(in srgb, var(--orange) 88%, white);
  --red-ink:    color-mix(in srgb, var(--red) 62%, white);
  --green-soft:  color-mix(in srgb, var(--green) 16%, transparent);
  --orange-soft: color-mix(in srgb, var(--orange) 16%, transparent);

  --shadow:      0 12px 34px rgba(0,0,0,.48), 0 1px 2px rgba(0,0,0,.5);
  --shadow-sm:   0 1px 3px rgba(0,0,0,.4);
  --shadow-lg:   0 30px 80px rgba(0,0,0,.6), 0 2px 6px rgba(0,0,0,.5);
  --shadow-tint: inset 0 1px 0 rgba(255,255,255,.25), 0 3px 10px rgba(10,132,255,.3);

  --sans: -apple-system, BlinkMacSystemFont, 'SF Pro Text', 'SF Pro Display', 'Inter Tight', 'Helvetica Neue', system-ui, sans-serif;
  --mono: 'SF Mono', ui-monospace, 'Fragment Mono', Menlo, monospace;

  --spring: cubic-bezier(.2,.8,.2,1);
  --d-state: 200ms;

  /* ---- page ---- */
  --bg: #0B0B0F;
  --bg-alt: #111117;
  --text: var(--t1);
  --text-2: var(--t2);
  --accent: var(--tint);
  --accent-text: var(--tint-ink);
  --focus: color-mix(in srgb, var(--tint) 70%, white);
  --danger: var(--red-ink);

  /* spacing, 4px unit */
  --sp-1: 0.25rem; --sp-2: 0.5rem; --sp-3: 0.75rem; --sp-4: 1rem;
  --sp-5: 1.5rem; --sp-6: 2rem; --sp-7: 3rem; --sp-8: 4rem; --sp-9: 6rem;
  --section: clamp(4rem, 2.8rem + 3.6vw, 6.5rem);
  --gap-card: 1rem;

  /* type: six steps and one figure size; line-height and tracking travel with the size */
  --t-xs: 0.75rem;
  --t-small: 0.875rem;
  --t-body: 1.0625rem;
  --t-lead: clamp(1.125rem, 1.04rem + 0.35vw, 1.3125rem);
  --t-card: clamp(1.1875rem, 1.08rem + 0.45vw, 1.5rem);
  --t-section: clamp(1.875rem, 1.4rem + 1.9vw, 2.75rem);
  --t-hero: clamp(2.375rem, 1.4rem + 4vw, 4.5rem);
  --t-figure: clamp(3.5rem, 2.2rem + 5.4vw, 7rem);
  --w-body: 350; --w-mid: 450; --w-strong: 560; --w-head: 580;

  --radius-sm: 6px; --radius-md: 10px; --radius-lg: 14px; --radius-card: 16px; --radius-full: 999px;
  --radius-control: 12px;
  --shadow-frame: 0 0 0 1px rgba(255,255,255,.07), 0 24px 64px rgba(0,0,0,.45);
  --shadow-sheet: 0 0 0 1px rgba(255,255,255,.08), 0 32px 96px rgba(0,0,0,.55);

  --dur: 150ms; --ease: cubic-bezier(0.2, 0, 0, 1);
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --ease-drawer: cubic-bezier(0.32, 0.72, 0, 1);
}
