@layer tokens, base, components, pages, utilities;

@layer tokens {
    :root {
        --tr-canvas: #020303;
        --tr-header: #000000;
        --tr-surface: #0d0d0d;
        --tr-surface-raised: #18191f;
        --tr-surface-hover: #1a1a1a;
        --tr-surface-soft: #171717;
        --tr-card-border: #171717;
        --tr-card-border-hover: #242424;
        --tr-border: #1e1e1e;
        --tr-border-strong: #313131;
        --tr-text: #f3f3f5;
        --tr-text-secondary: #a7a8b2;
        --tr-text-muted: #777985;
        --tr-control-surface: #292929;
        --tr-control-accent: #a78bfa;
        --tr-selection-surface: rgba(103, 152, 255, .12);
        --tr-accent: #269a9b;
        --tr-accent-hover: #31a8a9;
        --tr-link: #6798ff;
        --tr-positive: #0ad2a6;
        --tr-negative: #ea364f;
        --tr-warning: #f5c84b;
        --tr-radius-card: 16px;
        --tr-radius-control: 8px;
        --tr-radius-pill: 9999px;
        --tr-content: min(1510px, 80vw);
        --tr-section-top: 56px;
        --tr-section-bottom: 24px;
        --tr-section-last-bottom: 64px;
        --tr-grid-gap: 18px;
        --tr-card-pad: 22px;
        --tr-list-row-space: 12px;
        --tr-motion-reveal-distance: 30px;
        --tr-motion-reveal-duration: 800ms;
        --tr-motion-count-duration: 1400ms;
        --tr-motion-glint-duration: 900ms;
        --tr-motion-glint-lag: 160ms;
        --tr-motion-ease-out: cubic-bezier(.16, 1, .3, 1);
        --tr-motion-ease-glint: cubic-bezier(.2, .7, .2, 1);
        --tr-motion-delay-1: 100ms;
        --tr-motion-delay-2: 200ms;
        --tr-motion-delay-3: 300ms;
        --tr-motion-delay-4: 400ms;
        --tr-motion-delay-5: 500ms;
        --tr-motion-delay-6: 600ms;
        --tr-glint-neutral: rgba(255, 255, 255, .08);
        --tr-glint-accent: rgba(103, 152, 255, .06);
        --tr-font: 'Inter', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    }
}