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

:root {
  /* Brand palette: private. Only the roles below may use these. */
  --_blue-brand:            #101C7E;
  --_blue-deep:             #1929A5;
  --_blue-medium:           #2343C9;
  --_blue-light:            #4AB8E0;
  --_blue-sky:              #E2F4FC;
  --_pink:                  #DF3069;
  --_pink-light:            #FFEAF2;
  --_purple:                #D3D8FF;
  --_black:                 #3A3742;
  --_slate:                 #4C4E5F;
  --_smallprint:            #7887BC;
  --_white:                 #FFFFFF;
  --_blue-light-hover:      #B4EBFF;

  /* fg */
  --fg-strong:              var(--_blue-brand);
  --fg-medium:              var(--_black);
  --fg-secondary:           var(--_slate);
  --fg-muted:               var(--_slate);
  --fg-on-dark:             var(--_white);
  --fg-on-dark-soft:        var(--_blue-sky);
  --fg-on-accent:           var(--_white);
  --fg-on-accent-soft:      var(--_blue-sky);
  --fg-eyebrow:             var(--_blue-medium);
  --fg-emphasis-on-dark:    var(--_blue-light);
  --fg-link:                var(--_blue-brand);
  --fg-link-on-dark:        var(--_blue-light);
  --fg-on-badge:            var(--_blue-brand);
  --fg-link-hover:          var(--_blue-medium);
  --fg-caption:             var(--_slate);
  --fg-cite:                var(--_slate);
  --fg-quote:               var(--_blue-brand);
  --fg-nav-current:         var(--_blue-brand);
  --fg-nav-ancestor:        var(--_blue-medium);
  --fg-label:               var(--_black);
  --fg-placeholder:         var(--_slate);

  /* field */
  --field-bg:               var(--_white);
  --field-fg:               var(--_black);
  --field-border:           var(--_smallprint);
  --field-border-focus:     var(--_blue-light);
  --field-radius:           4px;
  --field-height:           39px;

  /* link */
  --link-rule:              var(--_blue-brand);

  /* surface */
  --surface-page:           var(--_white);
  --surface-sunken:         var(--_blue-sky);
  --surface-inverse:        var(--_blue-brand);
  --surface-inverse-raised: var(--_blue-deep);
  --surface-accent:         var(--_blue-medium);
  --surface-marker:         var(--_blue-sky);
  --surface-badge:          var(--_blue-light);
  --surface-table-header:   var(--_blue-sky);
  --surface-tint:           var(--_pink-light);

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

  /* action */
  --action-primary-bg:      var(--_blue-light);
  --action-primary-fg:      var(--_blue-brand);
  --action-on-dark-bg:      var(--_blue-light);
  --action-on-dark-fg:      var(--_blue-brand);
  --action-on-accent-bg:    var(--_blue-brand);
  --action-on-accent-fg:    var(--_white);
  --action-ghost-border:    var(--_blue-light);
  --action-ghost-fg:        var(--_white);
  --action-primary-bg-hover: var(--_blue-light-hover);
  --action-on-dark-bg-hover: var(--_blue-light-hover);
  --action-on-accent-bg-hover: var(--_blue-deep);
  --action-radius:          var(--radius-md);
  --action-border-width:    0px;

  /* border */
  --border-faint:           var(--_purple);
  --border-card:            var(--_purple);
  --border-soft:            var(--_purple);
  --border-on-dark:         rgba(255, 255, 255, 0.2);
  --border-accent:          var(--_blue-light);
  --border-accent-on-dark:  var(--_blue-light);
  --border-quote:           var(--_blue-light);

  /* focus */
  --focus-ring:             var(--_blue-brand);
  --focus-ring-width:       2px;
  --focus-ring-offset:      2px;

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

  /* ease */
  --ease-standard:          cubic-bezier(0.4, 0, 0.2, 1);

  /* tracking */
  --tracking-tight:         -0.025em;

  /* font */
  --font-body:              Archivo, sans-serif;
  --font-heading:           Archivo, sans-serif;
  --font-heading-variation: "wdth" 114;

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

  /* radius */
  --radius-sm:              4px;
  --radius-md:              0.4rem;
  --radius-pill:            9999px;

  /* shadow */
  --shadow-card-tinted:     none;
  --shadow-card-sm:         none;
  --shadow-card-md:         none;
  --shadow-card-lg:         none;
  --shadow-image:           none;

  /* t */
  --t-hero:                 clamp(2.5rem, 0.5rem + 7.5vw, 4.0625rem);
  --t-section:              clamp(2.5rem, 2.28rem + 0.9vw, 3rem);
  --t-h3:                   1.5rem;
  --t-title:                1.75rem;
  --t-card-title:           1.25rem;
  --t-lead:                 1.25rem;
  --t-body:                 1rem;
  --t-small:                0.90625rem;
  --t-tag:                  0.75rem;

  /* lh */
  --lh-tight:               1;
  --lh-snug:                1.15;
  --lh-normal:              1.375;
  --lh-relaxed:             1.65;
  --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:               6rem;

  /* measure */
  --measure-site:           77rem;
  --measure-banner:         77rem;
  --measure-content:        calc(var(--measure-banner) - var(--gutter) - var(--measure-banner) * 0.27 - var(--sidebar-gap));
  --measure-prose:          36rem;

  /* gutter */
  --gutter:                 3rem;
  --gutter-page-edge:       1.5rem;

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

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

  /* banner */
  --banner-feature-height:  30rem;
  --banner-text-max:        50%;
  --banner-padding-start:   var(--space-12);
  --banner-padding-end:     var(--space-12);
  --banner-overlap:         var(--space-11);

  /* card */
  --card-radius:            var(--radius-md);

  /* list */
  --list-marker-size:       8px;

  /* image */
  --image-radius:           0;
}

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

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

.c-ground--inverse {
  background: var(--surface-inverse);
  --ground-text:        var(--_white);
  --fg-strong:          var(--_white);
  --fg-medium:          var(--_white);
  --fg-secondary:       var(--_blue-sky);
  --fg-muted:           var(--_blue-sky);
  --fg-eyebrow:         var(--_blue-light);
  --fg-link:            var(--_blue-light);
  --surface-raised:     var(--surface-inverse-raised);
  --focus-ring:         var(--_blue-light);
  --shadow-card-tinted: none;
  color: var(--ground-text);
}

.c-ground--accent {
  background: var(--surface-accent);
  --ground-text:        var(--_white);
  --fg-strong:          var(--_white);
  --fg-medium:          var(--_white);
  --fg-secondary:       var(--_blue-sky);
  --fg-muted:           var(--_blue-sky);
  --fg-eyebrow:         var(--_blue-sky);
  --fg-link:            var(--_white);
  --focus-ring:         var(--_white);
  --shadow-card-tinted: none;
  color: var(--ground-text);
}

.c-ground--tint {
  background: var(--surface-tint);
  --ground-text:        var(--_black);
  --fg-strong:          var(--_pink);
  --fg-medium:          var(--_black);
  --fg-muted:           var(--_slate);
  --fg-eyebrow:         var(--_pink);
  --fg-link:            var(--_blue-brand);
  color: var(--ground-text);
}

.c-ground--page {
  background: var(--surface-page);
  --ground-text:        var(--_black);
  --fg-strong:          var(--_blue-brand);
  --fg-medium:          var(--_black);
  --fg-secondary:       var(--_slate);
  --fg-muted:           var(--_slate);
  --fg-eyebrow:         var(--_blue-medium);
  --fg-link:            var(--_blue-brand);
  --focus-ring:         var(--_blue-brand);
  --shadow-card-tinted: none;
  --border-faint:       var(--_purple);
  --border-card:        var(--_purple);
  color: var(--ground-text);
}