/* ============================================
   KongAI Platform - Premium Design Tokens v4.0
   Modern Gaming Theme (Stake/BC.Game inspired)
   ============================================ */
:root {
    /* === Core Dark Palette === */
    --kong-bg-deep:      #050510;
    --kong-bg:           #0a0b1a;
    --kong-bg-elevated:  #111228;
    --kong-bg-surface:   #171836;
    --kong-bg-card:      #1a1c3a;
    --kong-bg-input:     rgba(0,0,0,0.4);
    --kong-bg-hover:     rgba(255,255,255,0.04);

    /* === Primary Accent: Gold === */
    --kong-gold:         #FFD700;
    --kong-gold-light:   #FFE44D;
    --kong-gold-dim:     #C5A200;
    --kong-gold-deep:    #8B7300;
    --kong-gold-glow:    rgba(255,215,0,0.4);
    --kong-gold-subtle:  rgba(255,215,0,0.08);

    /* === Secondary Accent: Red === */
    --kong-accent:       #E94560;
    --kong-accent-hover: #FF2D55;
    --kong-accent-dim:   #B8243E;
    --kong-accent-glow:  rgba(233,69,96,0.4);
    --kong-accent-subtle:rgba(233,69,96,0.08);

    /* === Semantic Colors === */
    --kong-success:      #00E676;
    --kong-success-glow: rgba(0,230,118,0.3);
    --kong-danger:       #FF1744;
    --kong-danger-glow:  rgba(255,23,68,0.3);
    --kong-warning:      #FFD600;
    --kong-warning-glow: rgba(255,214,0,0.3);
    --kong-info:         #00B0FF;
    --kong-info-glow:    rgba(0,176,255,0.3);

    /* === Text === */
    --kong-text:         #F0F0F5;
    --kong-text-secondary:#9DA3B4;
    --kong-text-muted:   #5A6070;
    --kong-text-dim:     #3A3F50;

    /* === Borders === */
    --kong-border:       rgba(255,255,255,0.06);
    --kong-border-hover: rgba(255,255,255,0.12);
    --kong-border-gold:  rgba(255,215,0,0.2);
    --kong-border-accent:rgba(233,69,96,0.2);

    /* === Radius === */
    --kong-radius-xs:    4px;
    --kong-radius-sm:    8px;
    --kong-radius-md:    12px;
    --kong-radius-lg:    16px;
    --kong-radius-xl:    24px;
    --kong-radius-full:  9999px;

    /* === Shadows & Glows === */
    --kong-shadow-sm:    0 2px 8px rgba(0,0,0,0.3);
    --kong-shadow-md:    0 4px 20px rgba(0,0,0,0.4);
    --kong-shadow-lg:    0 8px 40px rgba(0,0,0,0.5);
    --kong-shadow-xl:    0 20px 60px rgba(0,0,0,0.6);
    --kong-shadow-glow-gold:   0 0 20px rgba(255,215,0,0.3);
    --kong-shadow-glow-accent: 0 0 20px rgba(233,69,96,0.3);
    --kong-shadow-neon-gold:   0 0 10px rgba(255,215,0,0.5), 0 0 40px rgba(255,215,0,0.15);
    --kong-shadow-neon-accent: 0 0 10px rgba(233,69,96,0.5), 0 0 40px rgba(233,69,96,0.15);

    /* === Glassmorphism === */
    --kong-glass-bg:       rgba(17,18,40,0.75);
    --kong-glass-bg-heavy: rgba(10,11,26,0.88);
    --kong-glass-blur:     blur(20px);
    --kong-glass-blur-heavy: blur(40px);
    --kong-glass-border:   1px solid rgba(255,255,255,0.08);
    --kong-glass-border-gold: 1px solid rgba(255,215,0,0.12);

    /* === Gradients === */
    --kong-gradient-gold:    linear-gradient(135deg, #FFD700, #FF8C00);
    --kong-gradient-accent:  linear-gradient(135deg, #E94560, #C81E4E);
    --kong-gradient-premium: linear-gradient(135deg, #FFD700, #E94560);
    --kong-gradient-dark:    linear-gradient(180deg, #0a0b1a 0%, #111228 100%);
    --kong-gradient-sidebar: linear-gradient(180deg, #050510 0%, #0a0b1a 50%, #111228 100%);
    --kong-gradient-header:  linear-gradient(135deg, rgba(17,18,40,0.95), rgba(10,11,26,0.95));
    --kong-gradient-card-shine: linear-gradient(135deg, rgba(255,215,0,0.08) 0%, transparent 50%, rgba(233,69,96,0.04) 100%);

    /* === Typography === */
    --kong-font:       'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --kong-font-mono:  'JetBrains Mono', 'Fira Code', 'Courier New', monospace;

    /* === Animation === */
    --kong-ease:           cubic-bezier(0.4, 0, 0.2, 1);
    --kong-ease-bounce:    cubic-bezier(0.34, 1.56, 0.64, 1);
    --kong-ease-smooth:    cubic-bezier(0.25, 0.1, 0.25, 1);
    --kong-ease-out:       cubic-bezier(0, 0, 0.2, 1);
    --kong-duration-fast:  150ms;
    --kong-duration:       250ms;
    --kong-duration-slow:  400ms;
    --kong-duration-slower:600ms;

    /* === Layout === */
    --kong-sidebar-width:     240px;
    --kong-sidebar-collapsed: 68px;
    --kong-header-height:     56px;
    --kong-bottom-nav-height: 64px;
    --kong-content-max:       1400px;
}
