




















@import url("scaling.css");

:root {
  
  --brand:        #2fbf45;
  --brand-strong: #27a93b;
  --brand-tint:   rgba(74, 208, 83, 0.14);

  


  --ai:        #585ed0;
  --ai-tint:   rgba(91, 97, 214, 0.10);
  --ai-border: rgba(91, 97, 214, 0.28);

  
  --r-xs:   0.3125rem; 
  --r-sm:   0.4375rem; 
  --r-md:   0.5625rem; 
  --r-lg:   0.75rem;   
  --r-xl:   1rem;      
  --r-pill: 999px;

  
  --sp-1:  0.25rem;  
  --sp-2:  0.5rem;   
  --sp-3:  0.75rem;  
  --sp-4:  1rem;     
  --sp-5:  1.25rem;  
  --sp-6:  1.5rem;   
  --sp-8:  2rem;     
  --sp-10: 2.5rem;   
  --sp-12: 3rem;     
  --sp-16: 4rem;     

  
  --font-body:    system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-display: "Diatype Rounded", system-ui, -apple-system, sans-serif;
  --font-mono:    "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;

  

  --fs-label:   .75em;    
  --fs-xs:      .8125em;  
  --fs-sm:      .875em;   
  --fs-md:      .9375em;  
  --fs-body:    1em;      
  --fs-h3:      1.5em;    
  --fs-lg:      1.5em;    
  --fs-xl:      1.875em;  
  --fs-display: 2.625em;  

  --lh-tight: 1.1;
  --lh-body:  1.5;

  



  --track-display: -0.03em;  
  --track-heading: -0.02em;  
  --track-body:    -0.01em;  
  --track-label:    0.08em;  

  





  --ease: cubic-bezier(0.625, 0.05, 0, 1);
  --dur:    0.2s;
  --dur-md: 0.3s;
  --dur-lg: 0.6s;

  


  --z-sidebar: 60;   
  --z-strip:   65;   
  --z-dim:     85;   
  --z-sheet:   100;  
  --z-popover: 200;  
  --z-chat:    240;  
  --z-preview: 380;  
  --z-modal:   400;  
  --z-toast:   600;  
  --z-cursor:  700;  

  






  --touch: 44px;

  









  --fill-hover:      rgb(var(--tint) / 0.055);
  --fill-active:     rgb(var(--tint) / 0.06);
  --fill-strong:     rgb(var(--tint) / 0.09);
  --hairline:        rgb(var(--tint) / 0.10);
  --hairline-strong: rgb(var(--tint) / 0.12);

  


  --ring-w:      max(2px, 0.125rem);
  --ring-offset: 0.125rem;

  


  --field-control: color-mix(in srgb, var(--field) 97%, var(--text));
}












:root,
[data-theme="light"] {
  --bg:       #f1efe9;
  --bg-2:     #eae8e0;
  --surface:  #fcfbf8;  
  --surface-bright: #ffffff; 
  --surface-1:#f6f5ef;  
  --surface-2:#eeece4;
  --surface-warm:#e5e2d9; 
  --surface-3:#e5e3d9;
  

  --inlay:    #f3f1ea;
  --field:    #fcfbf8;  
  


  --field-focus: var(--field);
  



  --input-fill: #f3f1ea;
  

  --input-focus-fill: color-mix(in srgb, var(--text) 7%, var(--input-fill));

  

  --tint: 20 20 15;

  --border:        #e0ded2;
  --border-strong: #d2d0c2;

  --text:       #1a1a16;
  





  --text-soft:  #5c5b52;
  --text-faint: #66655c;

  --primary:       #1b1b1a;  
  --primary-text:  #ffffff;
  --primary-hover: #000000;

  --shadow-sm: 0 0.0625rem 0.0625rem rgba(20, 20, 15, 0.04);
  --shadow-md: 0 0.125rem 0.5rem rgba(20, 20, 15, 0.06);
  --shadow-lg: 0 0.75rem 2.125rem rgba(20, 20, 15, 0.11);

  

  --scrim: rgba(14, 14, 10, 0.58);
  

  --scrim-edge: color-mix(in srgb, rgb(14 14 10) 58%, var(--bg));

  



  --focus-ring: color-mix(in srgb, var(--text) 50%, transparent);
  --ring:       color-mix(in srgb, var(--text) 70%, transparent);

  --avatar: linear-gradient(135deg, #e7e7e2, #d7d7d0);

  
  --selected-bg:     color-mix(in srgb, var(--text) 8%, var(--surface));
  --selected-border: color-mix(in srgb, var(--text) 26%, var(--border));

  
  --pos: #1d9b37;
  --neg: #cf463c;
  

  --warn: #914e0f;
  --warn-tint: rgba(180, 100, 20, 0.10);

  





  --ok-fg:  #2c6f3d; --ok-bg:  color-mix(in srgb, var(--brand) 15%, transparent);
  --warn-fg:#885c13; --warn-bg:rgba(214, 160, 70, 0.18);
  --bad-fg: #b0372e; --bad-bg: rgba(207, 70, 60, 0.12);
  


  --err-solid: #c8433a;
}




[data-theme="dark"] {
  












  




  --bg:       #181616;  
  --bg-2:     #1e1c1c;  
  --surface:  #242121;  
  --surface-1:#2a2727;  
  --surface-2:#312e2e;  
  --surface-warm:#312e2e; 
  --surface-3:#393636;  
  

  --inlay:    #1d1b1b;
  
  --surface-bright: #423f3f; 
  --field:    #232020;  
  --field-focus: var(--field); 
  --input-fill: var(--surface-2); 

  




  
  --tint: 255 255 255;
  


  --seg-on: rgb(var(--tint) / 0.18);

  --border:        rgba(255, 255, 255, 0.09);
  --border-strong: rgba(255, 255, 255, 0.17);

  

  --text:       #f4f4f4;
  



  --text-soft:  #adaaaa;
  --text-faint: #a19e9e;

  

  --ai:        #979cf2;
  --ai-tint:   rgba(122, 127, 238, 0.14);
  --ai-border: rgba(151, 156, 242, 0.38);

  --primary:       #f0f0f0;  
  --primary-text:  #161616;
  --primary-hover: #ffffff;

  



  --edge: rgba(255, 255, 255, 0.07);
  --shadow-sm: 0 0.0625rem 0.125rem rgba(0, 0, 0, 0.40),
               0 0 0 0.0625rem var(--edge);
  --shadow-md: 0 0.1875rem 0.75rem rgba(0, 0, 0, 0.45),
               0 0 0 0.0625rem var(--edge);
  --shadow-lg: 0 1rem 2.625rem rgba(0, 0, 0, 0.60),
               0 0 0 0.0625rem rgba(255, 255, 255, 0.09);

  

  --scrim: rgba(0, 0, 0, 0.76);
  --scrim-edge: color-mix(in srgb, black 76%, var(--bg)); 

  --focus-ring: color-mix(in srgb, var(--text) 45%, transparent); 
  --ring:       color-mix(in srgb, var(--text) 60%, transparent);

  --avatar: linear-gradient(135deg, #383838, #2a2a2a);

  --pos: #43c95a;
  --neg: #ef6a60;
  --warn: #e9a766;
  --warn-tint: rgba(233, 167, 102, 0.12);

  --ok-fg:  #6fd47f; --ok-bg:  rgba(74, 208, 83, 0.16);
  --warn-fg:#e0aa5a; --warn-bg:rgba(214, 160, 70, 0.16);
  

  --bad-fg: #f0766d; --bad-bg: rgba(239, 106, 96, 0.16);
  --err-solid: #c8433a;
}


.theme-switching * { transition: none !important; }
