@layer tokens,reset,base;@property --brand-hue{syntax: "<number>"; inherits: true; initial-value: 152;}@layer tokens{:root{color-scheme:light dark;--font-display: "DM Serif Display", Georgia, serif;--font-body: "DM Sans", system-ui, sans-serif;--brand-hue: 152;--brand-primary: light-dark( hsl(var(--brand-hue) 60% 32%), hsl(var(--brand-hue) 55% 55%) );--brand-subtle: light-dark( hsl(var(--brand-hue) 60% 95%), hsl(var(--brand-hue) 30% 15%) );--brand-border: light-dark( hsl(var(--brand-hue) 40% 80%), hsl(var(--brand-hue) 30% 30%) );--brand-active-text: light-dark( hsl(var(--brand-hue) 65% 22%), hsl(var(--brand-hue) 60% 75%) );--brand-dark: color-mix(in oklch, var(--brand-primary), black 25%);--brand-hover: color-mix(in oklch, var(--brand-primary), transparent 90%);--surface-base: light-dark(hsl(210 20% 98%), hsl(220 15% 10%));--surface-elevated: light-dark(hsl(0 0% 100%), hsl(220 15% 14%));--surface-hover: light-dark(hsl(210 20% 96%), hsl(220 15% 18%));--text-primary: light-dark(hsl(220 15% 12%), hsl(220 15% 94%));--text-secondary: light-dark(hsl(220 10% 40%), hsl(220 10% 65%));--text-tertiary: light-dark(hsl(220 12% 42%), hsl(220 10% 55%));--border-subtle: light-dark(hsl(220 15% 90%), hsl(220 15% 20%));--border-strong: light-dark(hsl(220 15% 75%), hsl(220 15% 35%));--success: light-dark(hsl(145 55% 35%), hsl(145 50% 55%));--success-text: light-dark(hsl(145 65% 22%), hsl(145 55% 80%));--success-subtle: light-dark(hsl(145 55% 93%), hsl(145 30% 16%));--warning: light-dark(hsl(38 90% 40%), hsl(38 85% 60%));--warning-subtle: light-dark(hsl(38 90% 93%), hsl(38 40% 16%));--danger: light-dark(hsl(0 70% 45%), hsl(0 65% 60%));--danger-text: light-dark(hsl(0 70% 35%), hsl(0 60% 80%));--danger-subtle: light-dark(hsl(0 70% 95%), hsl(0 35% 16%));--info: light-dark(hsl(210 80% 35%), hsl(210 85% 70%));--info-subtle: light-dark(hsl(210 60% 94%), hsl(210 40% 16%));--shadow-sm: light-dark( 0 1px 2px hsl(220 15% 12% / .06), 0 1px 2px hsl(0 0% 0% / .2) );--shadow-md: light-dark( 0 4px 12px hsl(220 15% 12% / .08), 0 4px 12px hsl(0 0% 0% / .3) );--shadow-lg: light-dark( 0 12px 32px hsl(220 15% 12% / .12), 0 12px 32px hsl(0 0% 0% / .4) );--space-1: .25rem;--space-2: .5rem;--space-3: .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;--radius-sm: .25rem;--radius-md: .5rem;--radius-lg: .875rem;--radius-xl: 1.25rem;--radius-full: 9999px;--duration-fast: .12s;--duration-base: .2s;--duration-slow: .35s;--ease-out: cubic-bezier(.16, 1, .3, 1);--z-header: 100;--z-overlay: 200;--z-modal: 300;--z-toast: 400;interpolate-size:allow-keywords;accent-color:var(--brand-primary)}}@layer reset{*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{block-size:100%;-webkit-text-size-adjust:none;text-size-adjust:none}body{block-size:100%;font-family:var(--font-body);background:var(--surface-base);color:var(--text-primary);line-height:1.6;-webkit-font-smoothing:antialiased}img,svg,video{display:block;max-inline-size:100%}button,input,select,textarea{font:inherit}textarea{field-sizing:content;min-block-size:3lh}h1,h2,h3,h4,h5,h6{text-wrap:balance;line-height:1.2}p,li{text-wrap:pretty}a{color:inherit}}@layer base{:focus-visible{outline:2px solid var(--brand-primary);outline-offset:2px;border-radius:var(--radius-sm)}::selection{background:var(--brand-subtle);color:var(--brand-primary)}*{scrollbar-width:thin;scrollbar-color:var(--border-strong) transparent}}
