/* CoreTX semantic layer — px-ready aliases over the raw Figma Variables in fig/fig-tokens.css.
   Figma FLOAT variables are unitless; everything here carries units so components can use var() directly. */
:root{
  /* Brand */
  --ctx-lime:var(--color-limes-lime-500);            /* rgb(208,223,0) — primary action */
  --ctx-lime-100:var(--color-limes-lime-100);        /* rgb(250,252,229) */
  --ctx-lime-200:var(--color-limes-lime-200, rgb(246,249,204)); /* pale selected / pressed fill */
  --ctx-lime-300:var(--color-limes-lime-300);        /* rgb(241,245,178) */
  --ctx-lime-400:var(--color-limes-lime-400);        /* rgb(227,233,53) */
  --ctx-lime-600:var(--color-limes-lime-600);        /* rgb(181,189,0) — hover */
  --ctx-lime-700:var(--color-limes-lime-700);        /* rgb(125,134,0) — pressed */
  --ctx-lime-800:var(--color-limes-lime-800);
  --ctx-lime-900:var(--color-limes-lime-900);
  --ctx-teal:var(--color-teals-teal-500);            /* rgb(0,187,167) — secondary */
  --ctx-teal-50:var(--color-teals-50);
  --ctx-teal-100:var(--color-teals-teal-100);
  --ctx-teal-300:var(--color-teals-teal-300);
  --ctx-teal-400:var(--color-teals-teal-400);
  --ctx-teal-600:var(--color-teals-teal-600);
  --ctx-teal-700:var(--color-teals-teal-700);
  --ctx-teal-900:var(--color-teals-teal-900);
  --ctx-ink:rgb(25,25,25);                           /* header / menu / dark surfaces */
  --ctx-black:rgb(0,0,0);
  --ctx-white:rgb(255,255,255);

  /* Neutrals */
  --ctx-n-50:rgb(248,250,252);
  --ctx-n-100:rgb(245,245,245);
  --ctx-n-101:rgb(241,245,249);
  --ctx-n-200:rgb(228,228,228);
  --ctx-n-300:rgb(208,208,206);
  --ctx-n-400:rgb(151,153,155);
  --ctx-n-500:rgb(115,115,115);
  --ctx-n-600:rgb(99,102,106);
  --ctx-n-700:rgb(49,65,88);
  --ctx-n-800:rgb(15,23,43);
  --ctx-n-900:rgb(25,25,25);
  --ctx-n-950:rgb(9,9,9);

  /* Semantic ramps */
  --ctx-red:rgb(200,30,30);--ctx-red-100:rgb(253,232,232);--ctx-red-200:rgb(255,214,215);--ctx-red-300:rgb(239,187,187);--ctx-red-700:rgb(140,15,15);--ctx-red-900:rgb(98,11,11);
  --ctx-green:rgb(42,155,77);--ctx-green-100:rgb(236,250,226);--ctx-green-300:rgb(217,246,198);--ctx-green-700:rgb(32,116,58);--ctx-green-900:rgb(21,78,39);
  --ctx-amber:rgb(239,177,0);--ctx-amber-100:rgb(252,239,204);--ctx-amber-300:rgb(249,224,153);--ctx-amber-700:rgb(167,124,0);--ctx-amber-900:rgb(120,89,0);
  --ctx-info:rgb(0,179,230);--ctx-info-100:rgb(204,240,250);--ctx-info-300:rgb(102,209,240);--ctx-info-700:rgb(0,107,138);--ctx-info-900:rgb(0,54,69);
  --ctx-orange:rgb(255,105,0);--ctx-orange-100:rgb(255,240,229);--ctx-orange-300:rgb(255,180,128);--ctx-orange-700:rgb(191,79,0);
  --ctx-pink:rgb(225,42,251);--ctx-pink-100:rgb(250,232,255);--ctx-pink-300:rgb(244,168,255);--ctx-pink-700:rgb(168,0,183);
  --ctx-purple:rgb(142,81,255);--ctx-purple-100:rgb(237,233,254);--ctx-purple-300:rgb(196,180,255);--ctx-purple-700:rgb(112,8,231);
  --ctx-link:rgb(20,52,203);
  /* Brand gradients (Brand colors › Solistica ONE) */
  --gradient-solistica-one:linear-gradient(-26deg,#09257D 0%,#B5BD00 53%,#E3E935 100%); /* @kind color */
  --gradient-one-track:linear-gradient(180deg,#E3E935 0%,#B5BD00 100%); /* @kind color */
  --gradient-traxion:linear-gradient(135deg,#E3E935 0%,#7A7E1D 47%,#000000 100%); /* @kind color */

  /* Text */
  --text-color-headings:var(--ctx-n-950);
  --text-color-body:var(--ctx-n-800);
  --text-color-subtitle:var(--ctx-n-500);
  --text-color-subtle:var(--ctx-n-400);
  --text-color-disabled:var(--ctx-n-300);
  --text-color-on-action:var(--ctx-n-900);
  --text-color-on-dark:var(--ctx-white);

  /* Surfaces */
  --surface-color-page:var(--ctx-n-50);
  --surface-color-card:var(--ctx-white);
  --surface-color-sunken:var(--ctx-n-100);
  --surface-color-dark:var(--ctx-ink);
  --surface-color-hover:var(--ctx-lime-100);
  --surface-color-selected:var(--ctx-lime-300);
  --surface-color-overlay:rgba(0,0,0,0.65);

  /* Borders */
  --border-color-default:var(--ctx-n-200);
  --border-color-strong:var(--ctx-n-400);
  --border-color-focus:var(--ctx-n-500);
  --border-color-action:var(--ctx-lime);
  --border-color-action-hover:var(--ctx-lime-600);

  /* Type */
  --font-display:"Clan OT","ClanOT",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --font-body:"Roboto",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --font-condensed:"Roboto Condensed","Roboto",sans-serif;
  --font-label:"Inter Tight","Roboto",sans-serif;
  --type-d1:70px;--type-d1-lh:80px;
  --type-d2:56px;--type-d2-lh:64px;
  --type-d3:48px;--type-d3-lh:56px;
  --type-d4:32px;--type-d4-lh:40px;
  --type-d5:28px;--type-d5-lh:36px;
  --type-h1:24px;--type-h2:18px;--type-h3:16px;--type-h4:14px;
  --type-body-1:18px;--type-body-1-lh:28px;
  --type-body-2:16px;--type-body-2-lh:24px;
  --type-body-3:14px;--type-body-3-lh:20px;
  --type-caption:12px;--type-caption-lh:16px;
  --type-micro:10px;

  /* Spacing (4px base; odd steps exist — use them verbatim) */
  --space-2:2px;--space-4:4px;--space-6:6px;--space-8:8px;--space-10:10px;--space-12:12px;--space-14:14px;--space-16:16px;--space-20:20px;--space-24:24px;--space-32:32px;--space-36:36px;--space-40:40px;--space-44:44px;--space-48:48px;--space-56:56px;--space-64:64px;

  /* Radii */
  --radius-xs:2px;--radius-sm:4px;--radius-md:6px;--radius-lg:8px;--radius-xl:12px;--radius-xxl:16px;--radius-xxxl:24px;--radius-round:9999px;

  /* Control heights */
  --control-h-sm:28px;--control-h-md:32px;--control-h-lg:36px;--control-h-xl:53px;
  --field-h:32px;
  --header-h:60px;--menu-w-collapsed:54px;--menu-w-expanded:220px;--footer-h:40px;--banner-h:64px;

  /* Elevation (Effects › Shadows) */
  --shadow-xs:0 1px 2px 0 rgba(55,65,81,0.05);
  --shadow-sm:0 1px 3px 0 rgba(55,65,81,0.1),0 1px 2px -1px rgba(0,0,0,0.1);
  --shadow-md:0 4px 6px -1px rgba(55,65,81,0.1),0 2px 4px -2px rgba(0,0,0,0.1);
  --shadow-lg:0 10px 15px -3px rgba(55,65,81,0.1),0 4px 6px -4px rgba(0,0,0,0.1);
  --shadow-xl:0 20px 25px -5px rgba(55,65,81,0.1),0 8px 10px -6px rgba(0,0,0,0.1);
  --shadow-2xl:0 25px 50px -12px rgba(55,65,81,0.25);
  --shadow-left:-4px 0 4px -2px rgba(55,65,81,0.15);
  --shadow-right:4px 0 4px -2px rgba(55,65,81,0.15);
  --shadow-glow:0 0 9.2px 0 rgba(0,161,207,0.4);
  --shadow-field-focus:0 0 0 3px rgba(208,223,0,0.4);

  /* Motion */
  --ease-standard:cubic-bezier(.2,0,0,1); /* @kind other */
  
  --dur-fast:120ms; /* @kind other */
  --dur-base:200ms; /* @kind other */
  --dur-toast:5000ms; /* @kind other */
}
a{color:var(--ctx-lime-700)}a:hover{color:var(--ctx-lime-800)}