/*
 * sui.tokens.css
 * Shared design tokens for SILO suite.
 * Generated by silo-ui/scripts/build.sh
 */

/*
 * Token sources:
 * - silo-download/admin/css/tokens.css
 * - silo-scope/assets/css/tokens.css
 * - silo-download/public/css/silo-download-public.css (public UI, excluded)
 */

@layer tokens {
  * {
    outline: 10px solid pink;
  }

  :root {
    /* ==========================================
       Silo Download - Admin UI Tokens
       ========================================== */

    --silo-bg-page: #1a1d21;
    --silo-bg-card: #252a31;
    --silo-bg-elevated: #2d333b;
    --silo-bg-input: #1e2228;
    --silo-bg-hover: #353d47;

    --silo-border: #2d333b;
    --silo-border-light: #3d444d;
    --silo-border-focus: #4a90d9;

    --silo-text-primary: #e6edf3;
    --silo-text-secondary: #8b949e;
    --silo-text-muted: #6e7681;
    --silo-text-link: #58a6ff;
    --silo-text-link-hover: #79b8ff;

    --silo-success: #3fb950;
    --silo-success-bg: rgba(63, 185, 80, 0.15);
    --silo-success-border: rgba(63, 185, 80, 0.4);

    --silo-warning: #d29922;
    --silo-warning-bg: rgba(210, 153, 34, 0.15);
    --silo-warning-border: rgba(210, 153, 34, 0.4);

    --silo-error: #f85149;
    --silo-error-bg: rgba(248, 81, 73, 0.15);
    --silo-error-border: rgba(248, 81, 73, 0.4);

    --silo-info: #58a6ff;
    --silo-info-bg: rgba(88, 166, 255, 0.15);
    --silo-info-border: rgba(88, 166, 255, 0.4);

    --silo-accent: #58a6ff;
    --silo-accent-hover: #79b8ff;

    --silo-spacing-xs: 4px;
    --silo-spacing-sm: 8px;
    --silo-spacing-md: 16px;
    --silo-spacing-lg: 24px;
    --silo-spacing-xl: 32px;
    --silo-spacing-2xl: 48px;
    --silo-spacing-1em: 1em;
    --silo-spacing-2em: 2em;

    --silo-radius-sm: 4px;
    --silo-radius-md: 6px;
    --silo-radius-lg: 8px;
    --silo-radius-full: 9999px;

    --silo-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.2);
    --silo-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
    --silo-shadow-md: 0 4px 6px rgba(0, 0, 0, 0.35);
    --silo-shadow-lg: 0 4px 12px rgba(0, 0, 0, 0.4);

    --silo-font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
    --silo-font-mono: "SF Mono", Monaco, Consolas, "Liberation Mono", "Courier New", monospace;

    --silo-font-size-xs: 10px;
    --silo-font-size-sm: 12px;
    --silo-font-size-base: 13px;
    --silo-font-size-md: 14px;
    --silo-font-size-lg: 16px;
    --silo-font-size-xl: 18px;
    --silo-font-size-2xl: 20px;
    --silo-font-size-3xl: 24px;

    --silo-font-weight-normal: 400;
    --silo-font-weight-medium: 500;
    --silo-font-weight-semibold: 600;
    --silo-font-weight-bold: 700;

    --silo-transition-fast: 0.1s ease;
    --silo-transition: 0.15s ease;
    --silo-transition-slow: 0.25s ease;

    --silo-z-dropdown: 100;
    --silo-z-sticky: 200;
    --silo-z-modal: 300;
    --silo-z-popover: 400;
    --silo-z-tooltip: 500;

    /* ==========================================
       Silo Scope - Core Tokens
       ========================================== */

    --shadow-color: 0deg 0% 0%;
    --shadow-elevation-low:
      0.3px 0.5px 0.7px hsl(var(--shadow-color) / 0.34),
      0.4px 0.8px 1px -1.2px hsl(var(--shadow-color) / 0.34),
      1px 2px 2.5px -2.5px hsl(var(--shadow-color) / 0.34);
    --shadow-elevation-medium:
      1px 2px 3px hsl(var(--shadow-color) / 0.20),
      2px 5px 8px hsl(var(--shadow-color) / 0.16),
      3px 8px 14px hsl(var(--shadow-color) / 0.12),
      -1px 2px 3px hsl(var(--shadow-color) / 0.20),
      -2px 5px 8px hsl(var(--shadow-color) / 0.16),
      -3px 8px 14px hsl(var(--shadow-color) / 0.12);

    --shadow-elevation-high:
      0.3px 0.5px 0.7px hsl(var(--shadow-color) / 0.34),
      1.5px 2.9px 3.7px -0.4px hsl(var(--shadow-color) / 0.34),
      2.7px 5.4px 6.8px -0.7px hsl(var(--shadow-color) / 0.34),
      4.5px 8.9px 11.2px -1.1px hsl(var(--shadow-color) / 0.34),
      7.1px 14.3px 18px -1.4px hsl(var(--shadow-color) / 0.34),
      11.2px 22.3px 28.1px -1.8px hsl(var(--shadow-color) / 0.34),
      17px 33.9px 42.7px -2.1px hsl(var(--shadow-color) / 0.34),
      25px 50px 62.9px -2.5px hsl(var(--shadow-color) / 0.34);

    --brand: 34, 113, 177;
    --brand-50: 233, 243, 251;
    --brand-100: 212, 231, 247;
    --brand-200: 168, 207, 240;
    --brand-300: 125, 183, 232;
    --brand-400: 81, 159, 225;
    --brand-500: 38, 135, 217;
    --brand-600: 27, 91, 142;
    --brand-700: 19, 66, 100;
    --brand-800: 12, 43, 64;
    --brand-900: 6, 21, 37;
    --link: 144, 184, 216;
    --code: 222, 234, 243;

    --brand-fleet: #c2c3a3;
    --brand-fleet-rgb: 194, 195, 163;

    --good: #33821c;
    --good-soft: #f0fff4;
    --good-rgb: 51, 130, 28;
    --good-fg: #4fc92b;
    --warn: #d3910c;
    --warn-soft: #fffbea;
    --warn-rgb: 211, 145, 12;
    --warn-fg: #ffb728;
    --bad: #f2450b;
    --bad-soft: #fef2f2;
    --bad-rgb: 242, 69, 11;
    --bad-fg: #ff4a0d;
    --info: #2271b1;
    --info-soft: #eff6ff;
    --info-rgb: 34, 113, 177;

    --accuracy-direct: #1aa6a6;
    --accuracy-direct-soft: #e6f7f7;
    --accuracy-inferred: #4b6ad0;
    --accuracy-inferred-soft: #eef2fb;
    --accuracy-experimental: #64748b;
    --accuracy-experimental-rgb: rgb(100, 116, 139);
    --accuracy-experimental-soft: #f1f5f9;

    --ink: #1d2327;
    --ink-2: #2c3338;
    --muted: #999;
    --border-subtle: #dcdcde;

    --ui-0: #ffffff;
    --ui-1: #f6f7f7;
    --ui-2: #e9e9e9;
    --ui-3: #dcdcde;
    --ui-4: #16181a;

    --r-xs: 2px;
    --r-sm: 2px;
    --r-md: 2px;
    --r-lg: 2px;
    --r-xl: 2px;
    --r-pill: 999px;

    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-5: 20px;
    --space-6: 24px;
    --space-7: 32px;

    --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;

    --fs-11: 11px;
    --fs-12: 12px;
    --fs-13: 13px;
    --fs-14: 14px;
    --fs-16: 16px;
    --fs-20: 20px;

    --card-shadow: 0 5px 0 rgba(0, 0, 0, 0.05);

    --glass-06: rgba(255, 255, 255, 0.06);
    --glass-10: rgba(255, 255, 255, 0.1);
    --glass-15: rgba(255, 255, 255, 0.15);
    --glass-20: rgba(255, 255, 255, 0.2);
    --glass-25: rgba(255, 255, 255, 0.25);
    --glass-50: rgba(255, 255, 255, 0.5);

    --scrim-20: rgba(0, 0, 0, 0.2);
    --scrim-40: rgba(0, 0, 0, 0.4);

    --ink-inverse: #fff;
  }
}
