/* =====================================================================
   АрхиМед / ArtVision — Design Tokens
   Single source of truth for colour, type, spacing, radius, shadow,
   border, motion and z-index. Entry point — import this in any artefact:
     <link rel="stylesheet" href="/colors_and_type.css">

   Token modules are split for readability and merged here via @import:
     _tokens-color.css    — brand, neutrals, semantic, surfaces, dark
     _tokens-type.css     — @font-face, type scale, typography classes
     _tokens-spacing.css  — 4 px base spacing scale
   The remainders (radius, shadow, motion, z-index, base reset) live
   below — they are small and tightly coupled to the global stylesheet.
   ===================================================================== */

@import url('./_tokens-color.css');
@import url('./_tokens-type.css');
@import url('./_tokens-spacing.css');

:root {
  /* ====================================================================
     RADIUS
     ==================================================================== */
  --radius-0:    0;
  --radius-sm:   4px;
  --radius-md:   8px;
  --radius-lg:   12px;
  --radius-pill: 999px;

  /* ====================================================================
     SHADOW (three steps only)
     ==================================================================== */
  --shadow-sm: 0 1px 2px rgba(8, 15, 40, .08);
  --shadow-md: 0 4px 12px rgba(8, 15, 40, .10);
  --shadow-lg: 0 12px 40px rgba(8, 15, 40, .18);

  /* ====================================================================
     MOTION
     ==================================================================== */
  --ease-out: cubic-bezier(.2, .8, .2, 1);
  --dur-fast: 120ms;
  --dur-med:  200ms;
  --dur-slow: 320ms;

  /* ====================================================================
     Z-INDEX
     One scale for the whole system. Steps of 100 leave room for ±10
     nudges without colliding. Toasts intentionally sit above modals so
     a "saved" confirmation can appear over an open dialog.
     ==================================================================== */
  --z-base:     0;
  --z-dropdown: 1000;   /* select panels, autocomplete */
  --z-sticky:   1100;   /* sticky toolbars, sticky nav */
  --z-popover:  1200;   /* tooltips, popovers, context menus */
  --z-modal:    1300;   /* modal scrim + dialog */
  --z-toast:    1400;   /* notifications — must beat modal */
}

/* ---------- Base reset ---------- */
* {
  box-sizing: border-box;
}
html, body {
  margin: 0;
  padding: 0;
  font-family: var(--font-sans);
  color: var(--fg-1);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}