/* flinder — generated by tools/generate-tokens.mjs from
   clients/flinder/contract.tokens.json. DO NOT EDIT: change the contract
   and regenerate. `node tools/generate-tokens.mjs flinder --check` fails
   when this file and the contract disagree. */

:root {
  /* Brand palette: private. Only the roles below may use these. */
  --_space-blue:            #2F455C;
  --_space-blue-dark:       #233243;
  --_space-blue-mid:        #577EA8;
  --_space-blue-soft:       #9AB2CB;
  --_space-blue-pale:       #EEF2F6;
  --_raspberry:             #F82A72;
  --_raspberry-dark:        #C60649;
  --_raspberry-deep:        #940537;
  --_raspberry-soft:        #FDB5CE;
  --_raspberry-pale:        #FEE6EF;
  --_mango:                 #FFC548;
  --_mango-light:           #FFD780;
  --_mango-pale:            #FFF7E6;
  --_jellyfish:             #27BEC4;
  --_jellyfish-dark:        #15686A;
  --_jellyfish-pale:        #EAFAFB;
  --_ink:                   #333333;
  --_grey:                  #616161;
  --_rule:                  #CCCCCC;
  --_off-white:             #F7F7F7;
  --_white:                 #FFFFFF;

  /* fg */
  --fg-strong:              var(--_space-blue);
  --fg-medium:              var(--_ink);
  --fg-secondary:           var(--_grey);
  --fg-muted:               var(--_grey);
  --fg-on-dark:             var(--_white);
  --fg-on-dark-soft:        var(--_space-blue-pale);
  --fg-on-accent:           var(--_space-blue);
  --fg-on-accent-soft:      var(--_space-blue-dark);
  --fg-eyebrow:             var(--_jellyfish-dark);
  --fg-emphasis-on-dark:    var(--_mango);
  --fg-link:                var(--_space-blue);
  --fg-link-on-dark:        var(--_mango);
  --fg-on-badge:            var(--_space-blue);
  --fg-link-hover:          var(--_raspberry-dark);
  --fg-caption:             var(--_grey);
  --fg-cite:                var(--_grey);
  --fg-quote:               var(--_space-blue);
  --fg-nav-current:         var(--_space-blue);
  --fg-nav-ancestor:        var(--_space-blue);
  --fg-label:               var(--_ink);
  --fg-placeholder:         var(--_grey);

  /* field */
  --field-bg:               var(--_white);
  --field-fg:               var(--_ink);
  --field-border:           var(--_space-blue-mid);
  --field-border-focus:     var(--_space-blue);
  --field-radius:           7px;

  /* link */
  --link-rule:              var(--_space-blue);

  /* surface */
  --surface-page:           var(--_white);
  --surface-raised:         var(--_white);
  --surface-sunken:         var(--_space-blue-pale);
  --surface-inverse:        var(--_space-blue);
  --surface-inverse-raised: var(--_space-blue-dark);
  --surface-accent:         var(--_mango-light);
  --surface-marker:         var(--_space-blue-pale);
  --surface-badge:          var(--_mango-light);
  --surface-table-header:   var(--_space-blue-pale);
  --surface-selected:       var(--_space-blue-pale);
  --surface-code:           var(--_off-white);
  --surface-tint:           var(--_raspberry-pale);

  /* ground */
  --ground-text:            var(--fg-medium);

  /* action */
  --action-primary-bg:      var(--_raspberry-dark);
  --action-primary-fg:      var(--_white);
  --action-on-dark-bg:      var(--_raspberry-dark);
  --action-on-dark-fg:      var(--_white);
  --action-on-accent-bg:    var(--_raspberry-dark);
  --action-on-accent-fg:    var(--_white);
  --action-ghost-border:    var(--_mango);
  --action-ghost-fg:        var(--_white);
  --action-primary-bg-hover: var(--_raspberry-deep);
  --action-primary-fg-hover: var(--_white);
  --action-on-dark-bg-hover: var(--_raspberry-deep);
  --action-on-accent-bg-hover: var(--_raspberry-deep);
  --action-radius:          var(--radius-sm);
  --action-border-width:    1px;

  /* border */
  --border-faint:           var(--_space-blue-pale);
  --border-card:            var(--_rule);
  --border-soft:            var(--_rule);
  --border-on-dark:         rgba(255, 255, 255, 0.2);
  --border-accent:          var(--_raspberry);
  --border-accent-on-dark:  var(--_mango);
  --border-quote:           var(--_raspberry);
  --border-table:           var(--_space-blue-mid);
  --border-selected:        var(--_space-blue);

  /* focus */
  --focus-ring:             var(--_space-blue);
  --focus-ring-width:       3px;
  --focus-ring-offset:      0px;

  /* motion */
  --motion-base:            200ms;

  /* ease */
  --ease-standard:          cubic-bezier(0.25, 0.1, 0.25, 1);

  /* tracking */
  --tracking-tight:         -0.03em;
  --tracking-wide:          0.07em;

  /* font */
  --font-body:              "Avenir Next", Avenir, "Helvetica Neue", Arial, sans-serif;
  --font-heading:           "Avenir Next", Avenir, "Helvetica Neue", Arial, sans-serif;

  /* hairline */
  --hairline:               1px;

  /* radius */
  --radius-sm:              5px;
  --radius-md:              7px;
  --radius-lg:              15px;
  --radius-pill:            9999px;
  --radius-xs:              4px;

  /* shadow */
  --shadow-card-tinted:     0 0 5px rgba(47, 69, 92, 0.15);
  --shadow-card-sm:         0 0 5px rgba(47, 69, 92, 0.15);
  --shadow-card-md:         0 3px 7px rgba(47, 69, 92, 0.1);
  --shadow-card-lg:         0 3px 7px rgba(47, 69, 92, 0.1);
  --shadow-image:           none;

  /* t */
  --t-hero:                 clamp(2.5rem, 2rem + 2vw, 3rem);
  --t-section:              clamp(2rem, 1.85rem + 0.6vw, 2.25rem);
  --t-h3:                   clamp(1rem, 0.6rem + 1.4vw, 1.6rem);
  --t-title:                1.75rem;
  --t-card-title:           1.3rem;
  --t-lead:                 1.25rem;
  --t-body:                 1rem;
  --t-small:                0.875rem;
  --t-eyebrow:              0.875rem;
  --t-label:                0.875rem;
  --t-tag:                  0.75rem;

  /* lh */
  --lh-tight:               1;
  --lh-snug:                1.2;
  --lh-normal:              1.4;
  --lh-relaxed:             1.6;
  --lh-flush:               1;

  /* fw */
  --fw-regular:             400;
  --fw-semi:                600;
  --fw-bold:                700;
  --fw-medium:              500;

  /* space */
  --space-0:                0;
  --space-1:                0.25rem;
  --space-2:                0.5rem;
  --space-3:                0.75rem;
  --space-4:                1rem;
  --space-5:                1.25rem;
  --space-6:                1.5rem;
  --space-7:                2rem;
  --space-8:                2.5rem;
  --space-9:                3rem;
  --space-10:               4rem;
  --space-11:               5rem;
  --space-12:               7rem;

  /* measure */
  --measure-site:           80rem;
  --measure-banner:         64rem;
  --measure-content:        calc(var(--measure-banner) - var(--gutter) - var(--measure-banner) * 0.27 - var(--sidebar-gap));
  --measure-prose:          48rem;

  /* gutter */
  --gutter:                 2.5rem;
  --gutter-page-edge:       1.25rem;

  /* breakpoint */
  --breakpoint-mobile:      48em;
  --breakpoint-sidebar:     62em;

  /* sidebar */
  --sidebar-width:          27%;
  --sidebar-gap:            2.5rem;

  /* banner */
  --banner-padding-start:   var(--space-4);
  --banner-padding-end:     var(--space-4);

  /* card */
  --card-radius:            var(--radius-lg);
  --card-border-width:      0px;

  /* image */
  --image-radius:           12px;

  /* header */
  --header-height:          80px;
}

body:not(.has-sidebar) { --measure-content: 48rem; }

.c-ground--sunken { background: var(--surface-sunken); }

.c-ground--raised {
  background: var(--surface-raised);
  --ground-text:        var(--_ink);
  color: var(--ground-text);
}

.c-ground--inverse {
  background: var(--surface-inverse);
  --ground-text:        var(--_white);
  --fg-strong:          var(--_white);
  --fg-medium:          var(--_white);
  --fg-secondary:       var(--_space-blue-pale);
  --fg-muted:           var(--_space-blue-pale);
  --fg-eyebrow:         var(--_mango);
  --fg-link:            var(--_mango);
  --border-faint:       rgba(255, 255, 255, 0.2);
  --border-card:        rgba(255, 255, 255, 0.2);
  --surface-raised:     var(--surface-inverse-raised);
  --focus-ring:         var(--_mango);
  --shadow-card-tinted: none;
  color: var(--ground-text);
}

.c-ground--accent {
  background: var(--surface-accent);
  --ground-text:        var(--_ink);
  --fg-strong:          var(--_space-blue);
  --fg-medium:          var(--_ink);
  --fg-secondary:       var(--_space-blue-dark);
  --fg-muted:           var(--_space-blue-dark);
  --fg-eyebrow:         var(--_raspberry-deep);
  --fg-link:            var(--_space-blue);
  --focus-ring:         var(--_space-blue);
  --shadow-card-tinted: none;
  color: var(--ground-text);
}

.c-ground--tint {
  background: var(--surface-tint);
  --ground-text:        var(--_ink);
  --fg-strong:          var(--_space-blue);
  --fg-medium:          var(--_ink);
  --fg-muted:           var(--_grey);
  --fg-eyebrow:         var(--_raspberry-deep);
  --fg-link:            var(--_space-blue);
  --border-faint:       var(--_raspberry-soft);
  color: var(--ground-text);
}

.c-ground--page {
  background: var(--surface-page);
  --ground-text:        var(--_ink);
  --fg-strong:          var(--_space-blue);
  --fg-medium:          var(--_ink);
  --fg-secondary:       var(--_grey);
  --fg-muted:           var(--_grey);
  --fg-eyebrow:         var(--_jellyfish-dark);
  --fg-link:            var(--_space-blue);
  --border-faint:       var(--_space-blue-pale);
  --border-card:        var(--_rule);
  --surface-raised:     var(--_white);
  --focus-ring:         var(--_space-blue);
  --shadow-card-tinted: 0 0 5px rgba(47, 69, 92, 0.15);
  color: var(--ground-text);
}