


:root {
  
  --bg:      oklch(0.162 0.004 256);   
  --bg-2:    oklch(0.150 0.005 256);   
  --bg-3:    oklch(0.198 0.006 256);   
  --line:    oklch(0.31 0.008 256);    
  --line-2:  oklch(0.42 0.011 256);    
  --text:    oklch(0.945 0.004 256);   
  --dim:     oklch(0.67 0.006 256);    
  --faint:   oklch(0.52 0.007 256);    
  --ghost:   oklch(0.39 0.007 256);    

  
  --red:      #BF4D28;
  --red-br:   #d55f36;                        
  --red-dp:   #8c3319;                        
  --red-glow: #BF4D2880;                      

  
  
  --sand:  #EEE6AB;    
  --green: #80BCA3;    
  --blue:  #80BCA3;    
  --cyan:  #80BCA3;    

  
  
  --accent: #80BCA3;   
  --good:   #80BCA3;   
  --warn:   #E6AC27;   
  
  --bad:    #b0453b;   
  
  --violet: #c5bc8e;   

  
  --glass:      rgba(255,255,255,.06);
  --glass-line: rgba(255,255,255,.12);
  --scrim:      rgba(8,8,12,.9);

  
  --c-d: #00A4FF;  --c-c: #FFAF00;  --c-b: #FF6D12;  --c-a: #EA4E14;
  --c-s1:#9D56FF;  --c-s2:#3460FC;  --c-r: #4C4C4C;  --c-x: #19A83C;

  
  --ff-head: 'Saira Condensed', 'Saira', sans-serif;      
  --ff-body: 'Saira Semi Condensed', 'Saira', sans-serif; 
  --ff-mono: 'Chivo Mono', ui-monospace, monospace;       
  --ff-time: 'Rubik', 'Saira', sans-serif;                
  --ff-ui:   'Saira', 'Segoe UI', sans-serif;             
  --ff-jp:   'Noto Sans JP', sans-serif;                  

  
  --fs-hero:  clamp(2.6rem, 1.4rem + 5.2vw, 5.5rem);
  --fs-h1:    clamp(2rem, 1.3rem + 3vw, 3.5rem);
  --fs-h2:    clamp(1.6rem, 1.2rem + 1.8vw, 2.5rem);
  --fs-h3:    clamp(1.15rem, 1rem + 0.7vw, 1.5rem);
  --fs-lead:  clamp(1.05rem, 0.98rem + 0.5vw, 1.3rem);
  --fs-body:  1rem;
  --fs-sm:    0.875rem;
  --fs-label: 0.72rem;
  --lh-tight: 1.02;
  --lh-snug:  1.2;
  --lh-body:  1.6;
  --track-label: 0.14em;   
  --track-wide:  0.06em;

  
  --space-1: 4px;  --space-2: 8px;  --space-3: 12px; --space-4: 16px;
  --space-5: 20px; --space-6: 24px; --space-8: 32px; --space-10: 40px;
  --space-12: 48px; --space-16: 64px; --space-20: 80px; --space-24: 96px;
  --container: 1200px;
  --container-narrow: 880px;
  --gutter: clamp(16px, 4vw, 40px);
  --section-y: clamp(56px, 8vw, 128px);
  --radius-xs: 3px; --radius-sm: 6px; --radius-md: 10px;
  --radius-lg: 14px; --radius-xl: 20px; --radius-pill: 999px;

  
  --shadow-sm: 0 1px 2px rgba(0,0,0,.5);
  --shadow-md: 0 6px 20px rgba(0,0,0,.45);
  --shadow-lg: 0 20px 60px rgba(0,0,0,.55);
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
  --dur: 160ms;
  --z-nav: 100; --z-overlay: 200;
}
