@font-face { font-family: "fw-display"; src: url("fonts/abril-fatface-latin-400-normal.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "fw-read"; src: url("fonts/CrimsonPro-Regular.ttf") format("truetype"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "fw-read"; src: url("fonts/CrimsonPro-Italic.ttf") format("truetype"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "fw-read"; src: url("fonts/CrimsonPro-Bold.ttf") format("truetype"); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: "fw-ui"; src: url("fonts/InstrumentSans-Regular.ttf") format("truetype"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "fw-ui"; src: url("fonts/InstrumentSans-Italic.ttf") format("truetype"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "fw-ui"; src: url("fonts/InstrumentSans-Bold.ttf") format("truetype"); font-weight: 600 700; font-style: normal; font-display: swap; }
@font-face { font-family: "fw-mono"; src: url("fonts/IBMPlexMono-Regular.ttf") format("truetype"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "fw-mono"; src: url("fonts/IBMPlexMono-Bold.ttf") format("truetype"); font-weight: 700; font-style: normal; font-display: swap; }

:root, html[data-theme="dark"] {
  color-scheme: dark;
  
  --fw-surface-deepest: #040309;   
  --fw-surface: #070510;           
  --fw-surface-band: #0a0716;      
  --fw-surface-raised: #0c0818;    
  --fw-surface-hover: #130e22;     
  --fw-surface-selected: #1a1430;  
  --fw-surface-selected-2: #221a3a;
  --fw-light-from-above: radial-gradient(64% 110% at 80% -30%, rgba(118, 40, 220, .26), rgba(71, 23, 134, .10) 48%, rgba(10, 10, 11, 0) 78%);
                                   
  --fw-glass: rgba(255, 255, 255, .035);          
  --fw-glass-edge: rgba(255, 255, 255, .07);
  --fw-glass-blur: 22px;
  --fw-shadow-panel: 0 40px 80px -24px rgba(0, 0, 0, .7);
  --fw-lacquer: linear-gradient(140deg, rgba(85, 27, 162, .42), rgba(39, 14, 72, .4) 60%, rgba(20, 8, 10, .5));  
  --fw-lacquer-edge: rgba(185, 140, 255, .22);
  --fw-title-fill: linear-gradient(#f3ead2, #f3ead2);   
  --fw-mark-fill: linear-gradient(#b98cff, #b98cff);  
  --fw-sheen: rgba(255, 255, 255, .045);         

  
  --fw-depth-1: #221a3a;
  --fw-depth-2: #1a1430;
  --fw-depth-3: #110c20;
  --fw-depth-4: #070510;
  --fw-depth-5: #040309;

  
  --fw-ink-title: #f3ead2;         
  --fw-ink: #ece4d6;               
  --fw-ink-read: #e2dacb;          
  --fw-ink-soft: #cdbfe6;          
  --fw-ink-quiet: #8b7fa8;         
  --fw-ink-on-accent: #ffffff;     
  --fw-ink-on-pearl: #1c2340;      

  
  --fw-accent: #7a52c7;            
  --fw-accent-pressed: #63409f;
  --fw-accent-ink: #b98cff;        
  --fw-accent-light: #b98cff;      
  --fw-accent-soft: #d9c4ff;       
  --fw-accent-deep: #1c1236;       
  --fw-focus: #c9a6ff;
  --fw-accent-fill: linear-gradient(#7a52c7, #7a52c7);   
  --fw-accent-glow: 0 10px 30px -8px rgba(118, 40, 220, .7);

  
  --fw-line: rgba(255, 255, 255, .10);
  --fw-line-soft: rgba(255, 255, 255, .06);    
  --fw-line-strong: rgba(185, 140, 255, .55);

  
  --fw-safe: #f3eeee;
  --fw-safe-ink: #ffffff;
  --fw-safe-surface: #1b191c;
  --fw-safe-line: rgba(255, 255, 255, .62);
  --fw-safe-hair: rgba(255, 255, 255, .24);
  --fw-safe-wash: rgba(255, 255, 255, .07);

  
  --fw-danger: #e0435a;            
  --fw-danger-ink: #ff8a9a;
  --fw-danger-surface: #2a0a12;
  --fw-caution: #e8875f;           
  --fw-caution-ink: #f7b58f;
  --fw-caution-surface: #2b160e;

  
  --fw-cat-basics: #ece4d6;
  --fw-cat-variants: #d9c4ff;
  --fw-cat-kinks: #b98cff;
  --fw-cat-dom: #a47ae8;
  --fw-cat-subs: #cdbfe6;
  --fw-cat-safety: #f3ead2;
  --fw-cat-scams: #63409f;         
  --fw-cat-scams-ink: #d9c4ff;
  --fw-cat-code: #cdbfe6;
  --fw-cat-dictionary: #e2dacb;
  --fw-cat-sources: #cdbfe6;

  
  --fw-font-display: "fw-display", "Abril Fatface", Georgia, serif;   
  --fw-font-read: "fw-read", "Crimson Pro", Georgia, serif;           
  --fw-font-ui: "fw-ui", "Instrument Sans", system-ui, sans-serif;    
  --fw-font-mono: "fw-mono", "IBM Plex Mono", ui-monospace, monospace; 

  --fw-fs-display-xl: clamp(64px, 9vw, 150px);
  --fw-fs-display-l: clamp(38px, 4.6vw, 72px);
  --fw-fs-numeral: clamp(104px, 11vw, 168px);
  --fw-fs-heading: clamp(25px, 2vw, 30px);
  --fw-fs-section: clamp(32px, 3.6vw, 48px);    
  --fw-fs-read-lead: clamp(23px, 2vw, 28px);
  --fw-fs-read: clamp(20px, 1.5vw, 22px);
  --fw-fs-ui: 17px;
  --fw-fs-ui-small: 15px;
  --fw-fs-label: 15px;             
  --fw-fs-eyebrow: 11px;           
  --fw-track-eyebrow: .24em;
  --fw-fs-meta: 14px;              
  --fw-fs-mono: 14px;
  --fw-fs-code: 14.5px;

  --fw-weight-regular: 400;
  --fw-weight-label: 600;
  --fw-weight-strong: 700;

  --fw-lh-display: .9;
  --fw-lh-heading: 1.08;
  --fw-lh-read-lead: 1.42;
  --fw-lh-read: 1.6;
  --fw-lh-ui: 1.62;
  --fw-lh-label: 1.25;
  --fw-lh-code: 1.75;

  --fw-measure-read: 34em;         
  --fw-measure-lead: 30em;

  
  --fw-space-1: 4px;
  --fw-space-2: 8px;
  --fw-space-3: 12px;
  --fw-space-4: 16px;
  --fw-space-5: 24px;
  --fw-space-6: 32px;
  --fw-space-7: 48px;
  --fw-space-8: 64px;
  --fw-space-9: 96px;
  --fw-space-10: 128px;
  --fw-gutter: clamp(16px, 5vw, 64px);          
  --fw-wrap: 1312px;                            
  --fw-section: clamp(72px, 8vw, 128px);        
  --fw-block: clamp(80px, 8vw, 120px);          
  --fw-head-gap: clamp(26px, 2.8vw, 36px);      
  --fw-tap: 44px;                               

  
  --fw-radius-pill: 999px;         
  --fw-radius-card: 22px;          
  --fw-radius-panel: 22px;         
  --fw-radius-small: 12px;
  --fw-radius-mark: 2px;           

  
  
  --fw-ease-out: cubic-bezier(.23, 1, .32, 1);
  --fw-ease-in-out: cubic-bezier(.77, 0, .175, 1);
  --fw-ease-sink: cubic-bezier(.45, 0, .15, 1);
  --fw-ease-hover: ease;

  
  --fw-dur-press: 160ms;
  --fw-dur-hover: 200ms;
  --fw-dur-tip: 160ms;
  --fw-dur-ui: 240ms;
  --fw-dur-turn: 500ms;
  --fw-dur-explain: 1150ms;
  --fw-dur-settle: 1600ms;
  --fw-dur-draw: 1400ms;
  --fw-stagger: 50ms;
  --fw-press-scale: .97;
}

html[data-theme="light"] {
  color-scheme: light;
  --fw-surface-deepest: #efebf7;
  --fw-surface: #f8f6fc;
  --fw-surface-band: #f2eef9;
  --fw-surface-raised: #ffffff;
  --fw-surface-hover: #f3eefc;
  --fw-surface-selected: #e8defa;
  --fw-surface-selected-2: #dccff5;
  --fw-light-from-above: radial-gradient(64% 110% at 90% -30%, rgba(236, 225, 250, .95), rgba(236, 225, 250, .35) 48%, rgba(251, 249, 251, 0) 78%);
  --fw-glass: rgba(255, 255, 255, .82);
  --fw-glass-edge: rgba(28, 35, 64, .06);
  --fw-shadow-panel: 0 40px 80px -24px rgba(173, 147, 207, .35);
  --fw-lacquer: linear-gradient(140deg, #ece1fa, #f6f0fe 70%);
  --fw-lacquer-edge: rgba(118, 40, 220, .14);
  --fw-title-fill: linear-gradient(#160f2b, #160f2b);
  --fw-mark-fill: linear-gradient(#6a3fc0, #6a3fc0);
  --fw-sheen: rgba(255, 255, 255, .6);

  --fw-depth-1: #ffffff;
  --fw-depth-2: #f3eefc;
  --fw-depth-3: #ebe3f9;
  --fw-depth-4: #e2d6f6;
  --fw-depth-5: #d8c9f2;

  --fw-ink-title: #160f2b;
  --fw-ink: #1d1636;
  --fw-ink-read: #2a2440;
  --fw-ink-soft: #4b4466;
  --fw-ink-quiet: #645c7e;
  --fw-ink-on-accent: #ffffff;
  --fw-ink-on-pearl: #1d1636;

  --fw-accent: #6a3fc0;
  --fw-accent-pressed: #55309e;
  --fw-accent-ink: #5b34a8;
  --fw-accent-light: #6a3fc0;
  --fw-accent-soft: #7d58c9;
  --fw-accent-deep: #ece4fb;
  --fw-focus: #6a3fc0;
  --fw-accent-glow: 0 10px 30px -10px rgba(118, 40, 220, .55);

  --fw-line: rgba(29, 22, 54, .12);
  --fw-line-soft: rgba(29, 22, 54, .07);
  --fw-line-strong: rgba(106, 63, 192, .5);

  --fw-safe: #1c2340;
  --fw-safe-ink: #141a33;
  --fw-safe-surface: #eef0f6;
  --fw-safe-line: rgba(28, 35, 64, .5);
  --fw-safe-hair: rgba(28, 35, 64, .2);
  --fw-safe-wash: rgba(28, 35, 64, .05);

  --fw-danger: #c4223b;
  --fw-danger-ink: #a51c31;
  --fw-danger-surface: #fbe3e7;
  --fw-caution: #b5532d;
  --fw-caution-ink: #9a4422;
  --fw-caution-surface: #fbe7dc;

  --fw-cat-basics: #1d1636;
  --fw-cat-variants: #7d58c9;
  --fw-cat-kinks: #6a3fc0;
  --fw-cat-dom: #55309e;
  --fw-cat-subs: #4b2e86;
  --fw-cat-safety: #1d1636;
  --fw-cat-scams: #6a3fc0;
  --fw-cat-scams-ink: #55309e;
  --fw-cat-code: #4b4466;
  --fw-cat-dictionary: #2e2552;
  --fw-cat-sources: #4b4466;
}

@media (max-width: 600px) {
  :root {
    --fw-fs-read: 19px;
    --fw-fs-read-lead: 21px;
    --fw-fs-ui: 16px;
    --fw-fs-ui-small: 16px;
    --fw-fs-code: 13.5px;
  }
}


@media (prefers-reduced-motion: reduce) {
  :root {
    --fw-dur-press: 0ms;
    --fw-dur-hover: 0ms;
    --fw-dur-tip: 0ms;
    --fw-dur-ui: 0ms;
    --fw-dur-turn: 0ms;
    --fw-dur-explain: 0ms;
    --fw-dur-settle: 0ms;
    --fw-dur-draw: 0ms;
    --fw-stagger: 0ms;
    --fw-press-scale: 1;
  }
}