:root{
  --p-white:     #FFFFFF;
  --p-paper:     #F4F4F2;
  --p-n50:       #F2F2F3;
  --p-mist:      #E5E6E7;
  --p-n200:      #D5D7D9;
  --p-stone:     #C6C9CC;
  --p-n400:      #A6ABB0;
  --p-concrete:  #878D94;
  --p-n600:      #686F77;
  --p-slate:     #4A525B;
  --p-n800:      #363B42;
  --p-graphite:  #2C3036;
  --p-charcoal:  #17191C;
  --p-ink:       #0E0F11;
  --p-error:     #9B1C1C;
  --p-success:   #1F5132;
  --p-img-sky:     #C8D2DA;
  --p-img-concrete:#ADA79D;
  --p-img-lake:    #5E6E7B;
  --p-img-shadow:  #353F48;
  --p-img-stone:   #D8D3C9;
  --p-scrim-90: rgb(23 25 28 / .9);
  --p-scrim-80: rgb(23 25 28 / .8);
  --p-scrim-62: rgb(23 25 28 / .62);
  --p-scrim-82: rgb(23 25 28 / .82);
  --p-scrim-74: rgb(23 25 28 / .74);
  --p-scrim-45: rgb(23 25 28 / .45);
  --p-scrim-20: rgb(23 25 28 / .2);
  --p-scrim-03: rgb(23 25 28 / .03);
  --p-scrim-66: rgb(23 25 28 / .66);
  --p-scrim-50: rgb(23 25 28 / .5);
  --p-scrim-30: rgb(23 25 28 / .3);
  --p-scrim-0:  rgb(23 25 28 / 0);
  --p-scrim-55: rgb(23 25 28 / .55);
  --p-scrim-70: rgb(23 25 28 / .7);
  --p-scrim-85: rgb(23 25 28 / .85);
  --p-scrim-60: rgb(23 25 28 / .6);
  --p-scrim-35: rgb(23 25 28 / .35);
  --p-white-25: rgb(255 255 255 / .25);
  --p-white-60: rgb(255 255 255 / .6);
  --p-white-78: rgb(255 255 255 / .78);
}
:root{
  --text-primary:    var(--p-charcoal);
  --text-secondary:  var(--p-slate);
  --text-muted:      var(--p-n600);
  --text-placeholder:var(--p-n600);
  --text-on-dark:    var(--p-white);
  --text-on-dark-2:  var(--p-stone);
  --text-on-accent:  var(--p-white);
  --text-link:       var(--p-charcoal);
  --text-error:      var(--p-error);
  --text-success:    var(--p-success);
  --surface-page:    var(--p-white);
  --surface-raised:  var(--p-paper);
  --surface-quiet:   var(--p-mist);
  --surface-dark:    var(--p-charcoal);
  --surface-dark-2:  var(--p-graphite);
  --surface-accent:  var(--p-charcoal);
  --surface-accent-hover: var(--p-graphite);
  --surface-accent-press: var(--p-ink);
  --surface-ghost-hover:  var(--p-mist);
  --surface-ghost-press:  var(--p-stone);
  --surface-on-dark:      var(--p-white);
  --surface-on-dark-hover:var(--p-mist);
  --surface-disabled:     var(--p-mist);
  --text-disabled:        var(--p-n600);
  --line-hairline:   var(--p-stone);
  --line-strong:     var(--p-charcoal);
  --line-on-dark:    var(--p-graphite);
  --line-field:      var(--p-concrete);
  --line-field-hover:var(--p-slate);
  --line-on-photo:   var(--p-white-25);
  --line-ghost-dark: var(--p-white-60);
  --focus-ring:      var(--p-charcoal);
  --focus-ring-dark: var(--p-white);
  --img-placeholder: linear-gradient(180deg, var(--p-img-sky) 0%, var(--p-mist) 55%, var(--p-img-lake) 100%);
  --img-placeholder-concrete: linear-gradient(155deg, var(--p-img-stone) 0%, var(--p-img-concrete) 50%, var(--p-img-lake) 100%);
  --img-placeholder-dark: linear-gradient(160deg, var(--p-img-lake) 0%, var(--p-img-shadow) 55%, var(--p-charcoal) 100%);
  --surface-hero-daylight: radial-gradient(120% 160% at 100% 0%, var(--p-white) 0%, var(--p-paper) 50%, var(--p-mist) 100%);
  --surface-photo-ground: var(--p-scrim-90);
  --surface-header-on-photo: var(--p-scrim-03);
  --scrim-footer: linear-gradient(180deg, var(--p-scrim-70) 0%, var(--p-scrim-80) 45%, var(--p-scrim-90) 100%);
  --surface-glass:      var(--p-white-78);
  --surface-glass-dark: var(--p-scrim-74);
  --glass-blur: 16px;
  --surface-backdrop: var(--p-scrim-50);
  --scrim-hero: linear-gradient(180deg, var(--p-scrim-85) 0%, var(--p-scrim-60) 9%, var(--p-scrim-0) 22%), linear-gradient(0deg, var(--p-scrim-90) 0%, var(--p-scrim-85) 38%, var(--p-scrim-74) 52%, var(--p-scrim-30) 64%, var(--p-scrim-0) 74%);
  --scrim-hero-laptop: linear-gradient(180deg, var(--p-scrim-66) 0%, var(--p-scrim-30) 9%, var(--p-scrim-0) 18%), linear-gradient(0deg, var(--p-scrim-82) 0%, var(--p-scrim-60) 12%, var(--p-scrim-30) 30%, var(--p-scrim-0) 44%), linear-gradient(90deg, var(--p-scrim-60) 0%, var(--p-scrim-50) 50%, var(--p-scrim-0) 72%);
  --scrim-hero-wide: linear-gradient(180deg, var(--p-scrim-66) 0%, var(--p-scrim-30) 9%, var(--p-scrim-0) 18%), linear-gradient(0deg, var(--p-scrim-82) 0%, var(--p-scrim-60) 12%, var(--p-scrim-30) 30%, var(--p-scrim-0) 44%), linear-gradient(90deg, var(--p-scrim-60) 0%, var(--p-scrim-45) 42%, var(--p-scrim-0) 62%);
  --photo-grade: none;
  --photo-grade-open: none;
  --scrim-photohero: linear-gradient(180deg, var(--p-scrim-45) 0%, var(--p-scrim-0) 22%), linear-gradient(90deg, var(--p-scrim-70) 0%, var(--p-scrim-30) 55%, var(--p-scrim-0) 100%);
  --scrim-photohero-phone: linear-gradient(180deg, var(--p-scrim-45) 0%, var(--p-scrim-0) 20%), linear-gradient(0deg, var(--p-scrim-90) 0%, var(--p-scrim-85) 45%, var(--p-scrim-74) 56%, var(--p-scrim-30) 66%, var(--p-scrim-0) 74%);
  --scrim-statement: linear-gradient(90deg, var(--p-scrim-90) 0%, var(--p-scrim-82) 40%, var(--p-scrim-30) 72%, var(--p-scrim-20) 100%);
  --scrim-band: var(--p-scrim-85);
  --scrim-404: linear-gradient(180deg, var(--p-scrim-60) 0%, var(--p-scrim-74) 45%, var(--p-scrim-90) 100%);
  --scrim-404-narrow: linear-gradient(180deg, var(--p-scrim-60) 0%, var(--p-scrim-74) 22%, var(--p-scrim-90) 40%, var(--p-scrim-90) 100%);
  --photo-shade-open: var(--p-scrim-0);
  --scrim-side: linear-gradient(90deg, var(--p-scrim-80) 0%, var(--p-scrim-66) 40%, var(--p-scrim-0) 75%);
  --tonal-dark: linear-gradient(180deg, var(--p-graphite) 0%, var(--p-charcoal) 100%);
}
:root{
  --bp-xs: 520px;
  --bp-sm: 640px;
  --bp-lg: 1024px;
  --bp-xl: 1440px;
  --bp-2xl: 2560px;
  --bp-4k: 3840px;
  --bp-h-short: 700px;
  --bp-h-icon: 860px;
  --page-zoom: 1;
}
@media (min-width: 2560px){ :root{ --page-zoom: 1.3333; } }
@media (min-width: 3840px){ :root{ --page-zoom: 2; } }
:root{
  --space-0: 0;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 16px;
  --space-4: 24px;
  --space-5: 32px;
  --space-6: 48px;
  --space-7: 64px;
  --space-8: 96px;
  --space-9: 128px;
  --container-content: 1792px;
  --measure: 46ch;
  --margin: var(--space-7);
  --gutter: var(--space-4);
  --section: var(--space-9);
  --head-gap: var(--space-7);
  --item-gap: var(--space-6);
  --header-h: 76px;
  --grid-cols: 12;
}
@media (max-width: 1439px){ :root{ --section: var(--space-8); --head-gap: var(--space-6); } }
@media (max-width: 1023px){ :root{ --margin: var(--space-5); --section: var(--space-8); --grid-cols: 8; } }
@media (max-width: 639px){ :root{ --margin: var(--space-3); --gutter: var(--space-3); --section: var(--space-7); --head-gap: var(--space-5); --item-gap: var(--space-5); --header-h: 64px; --grid-cols: 4; } }
:root{
  --font-sans: "Geist", "Helvetica Neue", Arial, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Consolas, monospace;
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-bold: 600;
  --text-xs:  12px;
  --text-sm:  14px;
  --text-ui:  15px;
  --text-md:  17px;
  --text-lg:  clamp(18px, 1.6vw, 20px);
  --text-xl:  clamp(22px, 2.6vw, 28px);
  --text-2xl: clamp(30px, 4.2vw, 44px);
  --text-3xl: clamp(36px, 5vw, 64px);
  --text-4xl: clamp(44px, 7vw, 88px);
  --text-numeral: 176px;
  --leading-body: 1.55;
  --leading-tight: 1.05;
  --tracking-display: -0.03em;
  --tracking-h1: -0.025em;
  --tracking-h2: -0.02em;
  --tracking-h3: -0.01em;
  --tracking-label: 0.14em;
}
@media (max-width: 639px){ :root{ --text-numeral: 88px; } }
@media (min-width: 1440px){
  :root{
    --text-md:  min(calc(14px + 0.2083vw), 18px);
    --text-lg:  min(calc(14px + 0.4167vw), 22px);
    --text-xl:  min(calc(16px + 0.8333vw), 32px);
    --text-2xl: min(calc(20px + 1.6667vw), 52px);
    --text-3xl: min(calc(28px + 2.5vw), 76px);
    --text-4xl: min(calc(40px + 3.3333vw), 104px);
  }
}
:root{
  --border-hairline: 1px;
  --rule-strong: 2px;
  --radius-none: 0;
  --shadow-none: none;
  --focus-width: 2px;
  --focus-offset: 2px;
  --tap-min: 44px;
  --control-height: 48px;
  --control-height-sm: 44px;
  --control-pad-x: var(--space-4);
  --icon-sm: 16px;
  --icon-md: 20px;
  --icon-lg: 24px;
  --duration-base: 200ms;
  --duration-slow: 320ms;
  --duration-draw: 1800ms;
  --duration-reveal: 600ms;
  --duration-settle: 1800ms;
  --stagger: 120ms;
  --ease-standard: cubic-bezier(.2, .6, .2, 1);
  --ease-soft: cubic-bezier(.22, 1, .36, 1);
  --z-base: 0;
  --z-raised: 10;
  --z-sticky: 100;
  --z-header: 200;
  --z-drawer: 300;
  --z-modal: 400;
  --z-toast: 500;
}
@media (prefers-reduced-motion: reduce){ :root{ --duration-base: 0ms; --duration-slow: 0ms; --duration-draw: 0ms; --duration-reveal: 0ms; --duration-settle: 0ms; --stagger: 0ms; } }
