/**
 * SAN WebTechnology — Design Tokens V4
 * Premium Motion-First & Micro-Glass System
 */

:root {
  /* Brand Core Colors */
  --san-green: #45D483;
  --san-green-bright: #65F0A3;
  --san-green-deep: #168A55;
  --san-green-soft: #E9FFF2;
  --san-green-glow: rgba(69, 212, 131, 0.25);
  
  /* Meta-Inspired Blue */
  --san-blue: #0866FF;
  --san-blue-deep: #174EA6;
  --san-blue-soft: #EAF2FF;
  --san-blue-glow: rgba(8, 102, 255, 0.22);
  
  /* Gemini-Inspired Multicolor Accents */
  --san-yellow: #F9C846;
  --san-yellow-soft: #FFF9E6;
  --san-cyan: #45C9E8;
  --san-cyan-soft: #EBFBFF;
  --san-violet: #9275FF;
  --san-violet-soft: #F3EFFF;
  --san-coral: #F45D66;
  --san-coral-soft: #FFF0F1;
  
  /* Editorial Neutrals */
  --san-ink: #17221E;
  --san-ink-rich: #0B1310;
  --san-muted: #65716C;
  --san-muted-light: #8E9C96;
  --san-paper: #F8FAF8;
  --san-paper-alt: #F2F5F3;
  --san-white: #FFFFFF;
  --san-border: #E0E8E3;
  --san-border-light: #EDF3EF;
  --san-border-dark: #C6D4CC;
  --san-silver: #E9EDF0;
  --san-silver-sheen: rgba(233, 237, 240, 0.65);

  /* Glass Materials */
  --glass-bg-base: rgba(255, 255, 255, 0.72);
  --glass-bg-elevated: rgba(255, 255, 255, 0.85);
  --glass-bg-subtle: rgba(255, 255, 255, 0.45);
  --glass-bg-blue: rgba(234, 242, 255, 0.65);
  --glass-bg-green: rgba(233, 255, 242, 0.6);
  --glass-bg-violet: rgba(243, 239, 255, 0.6);
  --glass-border: rgba(255, 255, 255, 0.7);
  --glass-border-subtle: rgba(224, 232, 227, 0.55);
  --glass-blur-sm: blur(8px);
  --glass-blur-md: blur(14px);
  --glass-blur-lg: blur(22px);

  /* Elevation & Shadows */
  --shadow-micro: 0 1px 3px rgba(23, 34, 30, 0.05), 0 2px 6px rgba(23, 34, 30, 0.03);
  --shadow-card: 0 4px 20px -2px rgba(23, 34, 30, 0.06), 0 1px 4px rgba(23, 34, 30, 0.03);
  --shadow-hover: 0 12px 32px -4px rgba(23, 34, 30, 0.1), 0 4px 12px rgba(23, 34, 30, 0.04);
  --shadow-popover: 0 18px 48px -6px rgba(23, 34, 30, 0.16), 0 6px 18px rgba(23, 34, 30, 0.06);
  --shadow-glow-green: 0 0 24px rgba(69, 212, 131, 0.28);
  --shadow-glow-blue: 0 0 24px rgba(8, 102, 255, 0.25);
  --shadow-glow-multicolor: 0 0 30px rgba(69, 201, 232, 0.22);

  /* Typography Scale */
  --font-family-base: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-family-heading: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-family-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;

  /* Font Weights */
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  --fw-extrabold: 800;

  /* Spacing Scale */
  --space-2xs: 4px;
  --space-xs: 8px;
  --space-sm: 12px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;
  --space-2xl: 48px;
  --space-3xl: 64px;
  --space-4xl: 96px;

  /* Radii */
  --radius-xs: 4px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 22px;
  --radius-pill: 9999px;
  --radius-circle: 50%;

  /* Motion Timings */
  --motion-fast: 140ms cubic-bezier(0.16, 1, 0.3, 1);
  --motion-base: 220ms cubic-bezier(0.16, 1, 0.3, 1);
  --motion-smooth: 340ms cubic-bezier(0.16, 1, 0.3, 1);
  --motion-shimmer: 520ms cubic-bezier(0.2, 0, 0.2, 1);

  /* Layout Containers */
  --container-max: 1240px;
  --container-narrow: 880px;
  --container-padding: 24px;
  --container-padding-mobile: 16px;

  /* Z-Index Hierarchy */
  --z-base: 1;
  --z-decor: 2;
  --z-card: 5;
  --z-popover: 30;
  --z-navbar: 100;
  --z-drawer: 200;
  --z-modal: 300;
  --z-toast: 400;
}