@font-face {
  font-family: "Marcellus";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/ds/assets/fonts/marcellus-regular.woff2") format("woff2");
}

@font-face {
  font-family: "Hanken Grotesk";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("/ds/assets/fonts/hanken-grotesk-variable.woff2") format("woff2");
}

@font-face {
  font-family: "IBM Plex Mono";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/ds/assets/fonts/ibm-plex-mono-regular.woff2") format("woff2");
}

@font-face {
  font-family: "IBM Plex Mono";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/ds/assets/fonts/ibm-plex-mono-medium.woff2") format("woff2");
}

@font-face {
  font-family: "IBM Plex Mono";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/ds/assets/fonts/ibm-plex-mono-semibold.woff2") format("woff2");
}

:root {
  
  --ink: #1a1a18;

  
  --green-950: #0b2a21; 
  --green-900: #103a2e;
  --green-800: #154a3a;
  --green-700: #1b5e4a; 
  --green-600: #237356;
  --green-500: #2f8c68;
  --green-400: #4fa985;
  --green-300: #86c8ad;
  --green-200: #bce2d3;
  --green-100: #e2f2eb;
  --green-50:  #f0f8f4;

  
  --gold-800: #6f4e10;
  --gold-700: #8a6312;
  --gold-600: #a6791a;
  --gold-500: #c28f22; 
  --gold-400: #d9a93f;
  --gold-300: #e8c57a;
  --gold-200: #f1ddae;
  --gold-100: #f7edd4;

  
  --red-800: #7a1812;
  --red-700: #8f1d17;
  --red-600: #b3261e; 
  --red-500: #d14237;
  --red-300: #e9a39c;
  --red-200: #f3c8c3;
  --red-100: #fbe6e3;

  
  --blue-700: #1f476d;
  --blue-600: #2a5c8a;
  --blue-500: #3a72a8;
  --blue-200: #c2d8ea;
  --blue-100: #e4eef6;

  
  --neutral-0:   #ffffff;
  --neutral-50:  #faf8f3; 
  --neutral-100: #f4f1ea;
  --neutral-150: #ece8de;
  --neutral-200: #e3ded3;
  --neutral-300: #cfcabd;
  --neutral-400: #b0aa9a;
  --neutral-500: #8c8678;
  --neutral-600: #6f6a5d;
  --neutral-700: #565148;
  --neutral-800: #3c3933;
  --neutral-900: #26241f;
  --neutral-950: #1a1a18;

  

  
  --color-bg:             var(--neutral-50);
  --color-surface:        var(--neutral-0);
  --color-surface-sunken: var(--neutral-100);
  --color-surface-hover:  var(--neutral-100);
  --color-surface-active: var(--neutral-150);
  --color-surface-inverse: var(--neutral-900);
  --color-overlay:        rgba(26, 26, 24, 0.48);

  
  --text-strong:  var(--neutral-950);
  --text-body:    var(--neutral-800);
  --text-muted:   var(--neutral-600);
  --text-subtle:  var(--neutral-500);
  --text-inverse: var(--neutral-50);
  --text-link:    var(--blue-600);
  --text-on-primary: #ffffff;

  
  --border-subtle:  var(--neutral-150);
  --border-default: var(--neutral-300);
  --border-strong:  var(--neutral-400);
  --border-focus:   var(--green-600);

  
  --brand-ink: var(--ink);

  
  --primary:        var(--green-700);
  --primary-hover:  var(--green-800);
  --primary-active: var(--green-900);
  --primary-fg:     #ffffff;
  --primary-soft:     var(--green-100);
  --primary-soft-fg:  var(--green-800);
  --primary-border:   var(--green-200);

  
  --accent:        var(--gold-500);
  --accent-hover:  var(--gold-600);
  --accent-fg:     var(--ink);
  --accent-soft:   var(--gold-100);
  --accent-soft-fg: var(--gold-800);

  
  --success:       var(--green-600);
  --success-fg:    #ffffff;
  --success-soft:  var(--green-100);
  --success-soft-fg: var(--green-800);

  --danger:        var(--red-600);
  --danger-hover:  var(--red-700);
  --danger-fg:     #ffffff;
  --danger-soft:   var(--red-100);
  --danger-soft-fg: var(--red-700);

  --warning:       var(--gold-600);
  --warning-fg:    var(--ink);
  --warning-soft:  var(--gold-100);
  --warning-soft-fg: var(--gold-800);

  --info:          var(--blue-600);
  --info-fg:       #ffffff;
  --info-soft:     var(--blue-100);
  --info-soft-fg:  var(--blue-700);

  
  --paid:        var(--green-600);   
  --paid-soft:   var(--green-100);
  --due:         var(--red-600);     
  --due-soft:    var(--red-100);
  --pending:     var(--gold-600);    
  --pending-soft: var(--gold-100);

  
  --ring: 0 0 0 3px color-mix(in srgb, var(--green-600) 35%, transparent);
}

:root {
  
  --font-display: "Marcellus", "Cormorant Garamond", Georgia, serif;
  --font-sans: "Hanken Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace;

  
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;

  
  --text-2xs: 0.6875rem;  
  --text-xs:  0.75rem;    
  --text-sm:  0.8125rem;  
  --text-base: 0.9375rem; 
  --text-md:  1rem;       
  --text-lg:  1.125rem;   
  --text-xl:  1.375rem;   
  --text-2xl: 1.75rem;    
  --text-3xl: 2.25rem;    
  --text-4xl: 3rem;       
  --text-5xl: 4rem;       

  
  --leading-tight: 1.1;
  --leading-snug: 1.25;
  --leading-normal: 1.5;
  --leading-relaxed: 1.65;

  
  --tracking-tight: -0.01em;
  --tracking-normal: 0;
  --tracking-wide: 0.04em;
  --tracking-wider: 0.08em;   
  --tracking-widest: 0.16em;  

  
  --fvn-tabular: tabular-nums; 
}

:root {
  
  --type-display-font: var(--font-display);
  --type-display-size: var(--text-4xl);
  --type-display-leading: var(--leading-tight);
  --type-display-tracking: var(--tracking-wide);

  
  --type-eyebrow-font: var(--font-sans);
  --type-eyebrow-size: var(--text-xs);
  --type-eyebrow-weight: var(--weight-semibold);
  --type-eyebrow-tracking: var(--tracking-wider);

  
  --type-body-font: var(--font-sans);
  --type-body-size: var(--text-base);
  --type-body-leading: var(--leading-normal);

  
  --type-numeric-font: var(--font-mono);
  --type-numeric-tracking: var(--tracking-normal);
}

:root {
  
  --space-0: 0;
  --space-px: 1px;
  --space-1: 0.25rem;  
  --space-2: 0.5rem;   
  --space-3: 0.75rem;  
  --space-4: 1rem;     
  --space-5: 1.25rem;  
  --space-6: 1.5rem;   
  --space-8: 2rem;     
  --space-10: 2.5rem;  
  --space-12: 3rem;    
  --space-16: 4rem;    
  --space-20: 5rem;    

  
  --layout-sidebar: 248px;
  --layout-topbar: 60px;
  --layout-max: 1280px;
  --layout-gutter: var(--space-6);

  
  --radius-xs: 3px;
  --radius-sm: 5px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-2xl: 22px;
  --radius-pill: 999px;
  --radius-circle: 50%;

  
  --border-width: 1px;
  --border-width-strong: 1.5px;
  --border-hairline: 1px solid var(--border-subtle);

  
  --shadow-xs: 0 1px 2px rgba(26, 26, 24, 0.05);
  --shadow-sm: 0 1px 3px rgba(26, 26, 24, 0.07), 0 1px 2px rgba(26, 26, 24, 0.04);
  --shadow-md: 0 4px 10px -2px rgba(26, 26, 24, 0.09), 0 2px 4px -2px rgba(26, 26, 24, 0.05);
  --shadow-lg: 0 12px 26px -6px rgba(26, 26, 24, 0.12), 0 4px 8px -4px rgba(26, 26, 24, 0.06);
  --shadow-xl: 0 24px 48px -12px rgba(26, 26, 24, 0.18);
  --shadow-inset: inset 0 1px 2px rgba(26, 26, 24, 0.06);

  
  --z-base: 1;        
  --z-sticky: 100;    
  --z-dropdown: 600;  
  --z-overlay: 900;   
  --z-modal: 1000;    
  --z-toast: 1100;    

  
  --ease-standard: cubic-bezier(0.2, 0, 0, 1); 
  --ease-emphatic: cubic-bezier(0.3, 0, 0, 1); 
  --ease-out: cubic-bezier(0, 0, 0, 1);        
  --duration-fast: 120ms;  
  --duration-base: 180ms;  
  --duration-slow: 280ms;  
  --transition-base: all var(--duration-base) var(--ease-standard); 
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body {
  margin: 0;
  background: var(--color-bg);
  color: var(--text-body);
  font-family: var(--font-sans);
  font-size: var(--text-base);
  line-height: var(--leading-normal);
  font-weight: var(--weight-regular);
}

h1, h2, h3, h4, h5, h6 {
  margin: 0;
  color: var(--text-strong);
  font-weight: var(--weight-semibold);
  line-height: var(--leading-snug);
}

p { margin: 0; }

a {
  color: var(--text-link);
  text-decoration: none;
}
a:hover { text-decoration: underline; }

input, td, th, output { font-variant-numeric: tabular-nums; }

.rt-figure {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  letter-spacing: var(--tracking-normal);
}

.rt-eyebrow {
  font-family: var(--font-sans);
  font-size: var(--text-xs);
  font-weight: var(--weight-semibold);
  letter-spacing: var(--tracking-wider);
  text-transform: uppercase;
  color: var(--text-muted);
}

.rt-display {
  font-family: var(--font-display);
  font-weight: var(--weight-regular);
  letter-spacing: var(--tracking-wide);
  color: var(--text-strong);
}

:focus-visible {
  outline: none;
  box-shadow: var(--ring);
  border-radius: var(--radius-xs);
}

::selection {
  background: var(--green-200);
  color: var(--green-900);
}