/* Practeca prototype — legacy token bridge.

   `practeca.css` is now the design system and the only place values live.
   This file exists so the prototype's existing markup — ~200 inline
   `var(--teal-700)` / `var(--ink)` / `var(--sh-card)` references across seven
   pages — resolves onto the new system without a rewrite.

   Nothing here defines a value. Every line points at practeca.css.
   New work should use the practeca names directly; this file only keeps the
   old ones alive. Load order: fonts.css → practeca.css → tokens.css → base.css
*/

:root {
  /* ---- Neutrals: one warm ramp, renamed. The old scale was the same hexes
          one step up (old n-100 == new n-50), already renumbered in place. ---- */
  --slate-50:  var(--n-25);
  --slate-100: var(--n-50);
  --slate-200: var(--n-100);
  --slate-300: var(--n-200);
  --gray-100:  var(--n-50);
  --gray-300:  var(--n-200);
  --gray-400:  var(--n-400);
  --gray-500:  var(--n-500);
  --gray-600:  var(--n-600);
  --gray-700:  var(--n-700);
  --gray-800:  var(--n-800);

  /* ---- Teal. The system keeps four steps; the old ramp had ten. Anything
          that was a mid-tone resolves to the one action colour. ---- */
  --teal-50:  var(--n-25);
  --teal-300: var(--teal-200);
  --teal-400: var(--teal-quiet);
  --teal-500: var(--teal);
  --teal-600: var(--teal);
  --teal-700: var(--teal);
  --teal-800: var(--teal-hover);
  --teal-900: var(--teal-hover);

  /* ---- Rose: maternal indicator only (RULES.md #3) ---- */
  --rose-100: var(--rose-50);
  --rose-300: var(--rose-200);
  --rose-400: var(--rose);
  --rose-500: var(--rose);
  --rose-600: var(--rose);

  /* ---- Semantic hues ---- */
  --amber-300: var(--amber-200);
  --amber-500: var(--amber);
  --amber-800: var(--amber-700);
  --red-500: var(--red);
  --red-600: var(--red);
  --emerald-500: var(--emerald);
  --emerald-600: var(--emerald);

  /* ---- Blue is not in the system. It was carrying "Reception" chips and the
          read-only banner; both are neutral information, so they go neutral. ---- */
  --blue-50:  var(--n-50);
  --blue-200: var(--n-100);
  --blue-500: var(--n-400);
  --blue-600: var(--n-500);
  --blue-700: var(--n-600);
  --blue-800: var(--n-700);

  /* ---- Semantic ---- */
  --ground: var(--n-25);
  --surface: #FFFFFF;
  --surface-sunk: var(--n-50);
  --border: var(--n-100);
  --border-strong: var(--n-200);
  --border-input: var(--n-100);
  --ink: var(--n-800);
  --body: var(--n-700);
  --secondary: var(--n-500);
  --placeholder: var(--n-400);
  --action: var(--teal);
  --action-hover: var(--teal-hover);
  --warn: var(--amber);
  --danger: var(--red);
  --ok: var(--emerald);

  /* ---- Depth ---- */
  --sh-subtle:  var(--e-subtle);
  --sh-card:    var(--e-card);
  --sh-raised:  var(--e-raised);
  --sh-float:   var(--e-float);
  --sh-overlay: var(--e-overlay);
  --sh-primary: 0 1px 2px rgba(22,33,31,.12);

  /* ---- Type ---- */
  --font-sans: var(--font);
  --font-arabic: var(--font-ar);
  --font-mono: var(--font-mono-sys, 'IBM Plex Mono', ui-monospace, monospace);

  /* The curve now lives in the .t-* classes. These stay so that the handful of
     elements that set their own font-size still track correctly. */
  --tr-display: -0.03em;
  --tr-title:   -0.022em;
  --tr-card:    -0.012em;
  --tr-body:    -0.005em;
  --tr-meta:     0.002em;
  --tr-caps:     0.11em;

  /* ---- Radius ---- */
  --r-xs: 6px;
  --r-sm: 8px;
  --r-md: 10px;
  --r-btn: var(--r-input);
  --r-lg: 20px;
  --r-badge: var(--r-pill);

  /* ---- Motion ---- */
  --ease-smooth: var(--ease);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --dur-fast: var(--t-hover);
  --dur-normal: var(--t-panel);
  --dur-slow: var(--t-move);

  /* ---- Layout ---- */
  --sidebar-w: var(--w-sidebar);
  --sidebar-w-collapsed: 4rem;
  --topbar-h: var(--h-topbar);
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 24px; --s-6: 32px;
}

/* practeca.css already switches the face, kills tracking and opens the leading
   for RTL. The prototype's own line-height variable follows it. */
html[dir='rtl'] { --lh-body: 1.65; }
html[dir='ltr'] { --lh-body: 1.55; }
