:root {
  
  --qf-primary:        #2B5CFF;   
  --qf-primary-hover:  #1E50E8;   
  --qf-primary-soft:   rgba(43, 92, 255, 0.10);
  --qf-primary-ring:   rgba(43, 92, 255, 0.35);
  --qf-primary-border: rgba(43, 92, 255, 0.42);
  --qf-on-primary:     #ffffff;

  
  --qf-accent:         #00C2FF;

  
  --qf-brand-grad:      linear-gradient(135deg, #2B5CFF 0%, #00C2FF 100%);
  --qf-brand-grad-soft: linear-gradient(135deg, rgba(43,92,255,.10) 0%, rgba(0,194,255,.10) 100%);
  --qf-brand-glow:      rgba(43, 92, 255, .28);

  
  --qf-success:        #0E9F5B;
  --qf-success-soft:   rgba(14, 159, 91, .12);
  --qf-success-border: rgba(14, 159, 91, .38);
  --qf-success-faint:  rgba(14, 159, 91, .07);
  --qf-on-success:     #ffffff;

  --qf-warning:        #B26A00;
  --qf-warning-soft:   rgba(178, 106, 0, .13);
  --qf-warning-border: rgba(178, 106, 0, .38);
  --qf-warning-faint:  rgba(178, 106, 0, .07);
  --qf-on-warning:     #ffffff;

  --qf-danger:         #D92D20;
  --qf-danger-soft:    rgba(217, 45, 32, .12);
  --qf-danger-border:  rgba(217, 45, 32, .38);
  --qf-danger-faint:   rgba(217, 45, 32, .07);
  --qf-on-danger:      #ffffff;

  --qf-info:           #2B5CFF;     
  --qf-info-soft:      rgba(43, 92, 255, .10);
  --qf-info-border:    rgba(43, 92, 255, .38);
  --qf-info-faint:     rgba(43, 92, 255, .07);
  --qf-on-info:        #ffffff;

  
  --qf-bg:             #F6F7FA;
  --qf-bg-elevated:    #FFFFFF;
  --qf-surface:        #FFFFFF;
  --qf-surface-hover:  #F0F2F7;
  --qf-surface-active: #E7EBF3;
  --qf-text:           #101828;
  --qf-text-muted:     #5A6478;
  --qf-text-inverse:   #FFFFFF;
  --qf-border:         #E3E7EF;
  --qf-border-soft:    #EEF1F6;
  --qf-border-strong:  #C6CFDD;

  
  --qf-font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
                   "Hiragino Sans GB", "Microsoft YaHei", system-ui, sans-serif;
  --qf-font-mono: "SF Mono", "JetBrains Mono", "Cascadia Mono",
                   "Roboto Mono", Menlo, Consolas, monospace;
  --qf-font-serif: "Iowan Old Style", "Palatino Linotype", Palatino,
                   "Book Antiqua", Georgia, "Songti SC", "Source Han Serif SC", serif;

  
  --qf-font-size-xs:   11px;
  --qf-font-size-sm:   12px;
  --qf-font-size-md:   13px;
  --qf-font-size-base: 14px;
  --qf-font-size-lg:   15px;
  --qf-font-size-xl:   16px;
  --qf-font-size-2xl:  18px;
  --qf-font-size-3xl:  20px;
  --qf-font-size-4xl:  24px;
  --qf-font-size-5xl:  30px;

  
  --qf-line-height-tight: 1.3;
  --qf-line-height-snug:  1.5;
  --qf-line-height-base:  1.6;
  --qf-line-height-loose: 1.8;

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

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

  
  --qf-radius-sm:   8px;
  --qf-radius-md:   12px;
  --qf-radius-lg:   16px;
  --qf-radius-full: 999px;

  
  --qf-shadow-sm: 0 1px 2px rgba(16, 24, 40, .06), 0 1px 3px rgba(16, 24, 40, .08);
  --qf-shadow-md: 0 4px 12px rgba(16, 24, 40, .08), 0 2px 4px rgba(16, 24, 40, .05);
  --qf-shadow-lg: 0 18px 44px rgba(16, 24, 40, .16), 0 4px 12px rgba(16, 24, 40, .08);

  
  --qf-duration-fast: 120ms;
  --qf-duration-base: 200ms;
  --qf-duration-slow: 320ms;
  --qf-ease-standard: cubic-bezier(.4, 0, .2, 1);
  --qf-ease-out:      cubic-bezier(0, 0, .2, 1);

  
  --qf-z-base:     0;
  --qf-z-raised:   10;
  --qf-z-sticky:   100;
  --qf-z-header:   200;
  --qf-z-dropdown: 400;
  --qf-z-overlay:  800;
  --qf-z-modal:    900;
  --qf-z-toast:    1000;
  --qf-z-tooltip:  1100;

  
  --qf-bp-sm: 640px;
  --qf-bp-md: 768px;
  --qf-bp-lg: 1024px;
  --qf-bp-xl: 1280px;
  
  --qf-touch-target: 44px;

  
  --qf-info-note:        rgba(43, 92, 255, .07);
  --qf-info-note-ic:     var(--qf-primary);
  --qf-info-note-title:  #1E50E8;
  --qf-info-note-text:   var(--qf-text);

  --qf-success-note:      rgba(14, 159, 91, .08);
  --qf-success-note-ic:   var(--qf-success);
  --qf-success-note-title:#046C4E;
  --qf-success-note-text: var(--qf-text);

  --qf-warning-note:      rgba(178, 106, 0, .09);
  --qf-warning-note-ic:   var(--qf-warning);
  --qf-warning-note-title:#8A4B00;
  --qf-warning-note-text: var(--qf-text);

  --qf-danger-note:       rgba(217, 45, 32, .07);
  --qf-danger-note-ic:    var(--qf-danger);
  --qf-danger-note-title: #A81E14;
  --qf-danger-note-text:  var(--qf-text);

  --qf-note-neutral:      rgba(16, 24, 40, .035);

  
  --qf-focus-ring:    0 0 0 3px var(--qf-primary-ring);
  --qf-focus-outline: 2px solid var(--qf-primary);
  --qf-focus-offset:  2px;

  color-scheme: light;
}


[data-theme="dark"] {
  --qf-primary:        #6C8FFF;          
  --qf-primary-hover:  #9FB5FF;          
  --qf-primary-soft:   rgba(108, 143, 255, .16);
  --qf-primary-ring:   rgba(108, 143, 255, .42);
  --qf-primary-border: rgba(108, 143, 255, .52);
  --qf-on-primary:     #0B1220;          

  --qf-accent:         #4FD8FF;
  --qf-brand-grad:      linear-gradient(135deg, #6C8FFF 0%, #4FD8FF 100%);
  --qf-brand-grad-soft: linear-gradient(135deg, rgba(108,143,255,.16) 0%, rgba(79,216,255,.16) 100%);
  --qf-brand-glow:      rgba(108, 143, 255, .32);

  --qf-success:        #34D399;
  --qf-success-soft:   rgba(52, 211, 153, .16);
  --qf-success-border: rgba(52, 211, 153, .38);
  --qf-success-faint:  rgba(52, 211, 153, .08);
  --qf-on-success:     #0B1220;

  --qf-warning:        #FBBF24;
  --qf-warning-soft:   rgba(251, 191, 36, .16);
  --qf-warning-border: rgba(251, 191, 36, .38);
  --qf-warning-faint:  rgba(251, 191, 36, .08);

  --qf-danger:         #F87171;
  --qf-danger-soft:    rgba(248, 113, 113, .16);
  --qf-danger-border:  rgba(248, 113, 113, .38);
  --qf-danger-faint:   rgba(248, 113, 113, .08);
  --qf-on-danger:      #0B1220;

  --qf-info:           #6C8FFF;          
  --qf-info-soft:      rgba(108, 143, 255, .16);
  --qf-info-border:    rgba(108, 143, 255, .52);
  --qf-info-faint:     rgba(108, 143, 255, .08);

  --qf-bg:             #0B1220;
  --qf-bg-elevated:    #111A2B;
  --qf-surface:        #111A2B;
  --qf-surface-hover:  #1A2540;
  --qf-surface-active: #243052;
  --qf-text:           #E9EDF6;
  --qf-text-muted:     #97A4B8;
  --qf-text-inverse:   #0B1220;
  --qf-border:         rgba(233, 237, 246, .14);
  --qf-border-soft:    rgba(233, 237, 246, .08);
  --qf-border-strong:  rgba(233, 237, 246, .24);

  --qf-shadow-sm: 0 1px 2px rgba(0, 0, 0, .40);
  --qf-shadow-md: 0 6px 18px rgba(0, 0, 0, .45);
  --qf-shadow-lg: 0 22px 54px rgba(0, 0, 0, .55);

  --qf-info-note:        rgba(108, 143, 255, .10);
  --qf-info-note-title:  #D2DDFF;
  --qf-success-note:     rgba(52, 211, 153, .10);
  --qf-success-note-title: #86EFAC;
  --qf-warning-note:     rgba(251, 191, 36, .09);
  --qf-warning-note-title: #FDE68A;
  --qf-danger-note:      rgba(248, 113, 113, .09);
  --qf-danger-note-title:  #FECACA;
  --qf-note-neutral:     rgba(255, 255, 255, .045);

  --qf-focus-ring: 0 0 0 3px var(--qf-primary-ring);

  color-scheme: dark;
}


:root {
  --brand:        var(--qf-primary);
  --brand-deep:   var(--qf-primary-hover);
  --brand-soft:   var(--qf-primary-soft);
  --brand-grad:   var(--qf-brand-grad);
  --brand-glow:   var(--qf-brand-glow);
}