/* Design tokens. The only file allowed to contain raw colors, sizes, spacing, radii, shadows and breakpoints.
   Everything else references these custom properties. Don't add values here without asking. */

@custom-media --bp-xs (max-width: 420px);
@custom-media --bp-sm (max-width: 560px);
@custom-media --bp-md (max-width: 640px);
@custom-media --bp-lg (max-width: 760px);
@custom-media --bp-xl (max-width: 900px);
@custom-media --bp-2xl (max-width: 1020px);
@custom-media --bp-3xl (max-width: 1180px);

:root{
  /* color: brand, neutrals and semantics */
  --plum:#421F30;
  --plum-2:#612E47;
  --plum-ink:#1C0D14;
  --gold:#F4A940;
  --gold-hi:#F7B85E;
  --gold-tint:#FDF3E2;
  --gold-line:#F3D29C;
  --gold-text:#8A560B;
  --paper:#FFFFFF;
  --mist:#F2F2F2;
  --mist-2:#F8F7F8;
  --ink:#1C0D14;
  --ink-2:#5E4A55;
  --ink-3:#8F7D87;
  --line:#E8E3E6;
  --line-2:#DAD2D6;
  --on-dark:#FFFFFF;
  --on-dark-2:rgba(255,255,255,.74);
  --on-dark-3:rgba(255,255,255,.52);
  --line-dark:rgba(255,255,255,.12);
  --fill-dark:rgba(255,255,255,.06);
  --good:#1D7A4B;
  /* The DRAFT banner on unapproved pages (draft builds only). Not for site design. */
  --draft:#C4161C;
  --chat-blue:#0B72E7;
  --chat-gray:#E9E9EB;
  --plum-deep:#2C1422;
  --info:#0B5FC2;
  --info-tint:#E7F0FD;
  --good-tint:#E6F4EC;
  --warn:#9A5300;
  --warn-tint:#FFF0DB;
  /* color: one-offs, illustrations and alpha steps */
  --white:#FFFFFF;
  --black-a08:rgba(0,0,0,.08);
  --gold-a14:rgba(244,169,64,.14);
  --gold-a32:rgba(244,169,64,.32);
  --ink-a18:rgba(28,13,20,.18);
  --ink-a06:rgba(28,13,20,.06);
  --white-a72:rgba(255,255,255,.72);
  --white-a20:rgba(255,255,255,.2);
  --white-a40:rgba(255,255,255,.4);
  --live:#34C759;
  --live-a25:rgba(52,199,89,.25);
  --white-a10:rgba(255,255,255,.1);
  --white-a14:rgba(255,255,255,.14);
  --black:#000000;
  --chat-ink:#111111;
  --chat-meta:#8A8A8E;
  --chat-event:#5E5E63;
  --warn-line:#F4D3A3;
  --plum-tint:#F4EDF0;
  --plum-tint-line:#E4D4DB;
  --chat-typing:#8E8E93;
  --photo-bg:#2A1520;
  --black-a25:rgba(0,0,0,.25);
  --white-a28:rgba(255,255,255,.28);
  --gold-a20:rgba(244,169,64,.2);
  --gold-wash:#FFFBF4;
  --gold-a40:rgba(244,169,64,.4);
  --white-a60:rgba(255,255,255,.6);
  --white-a08:rgba(255,255,255,.08);
  --gold-a50:rgba(244,169,64,.5);
  --black-a30:rgba(0,0,0,.3);
  --white-a16:rgba(255,255,255,.16);
  --shade-a42:rgba(10,3,7,.42);
  --ink-a08:rgba(28,13,20,.08);
  --white-a70:rgba(255,255,255,.7);
  --steel-tint:#EEF1F4;
  --ink-a15:rgba(28,13,20,.15);
  --logo-gold-top:#F5B151;
  --logo-gold-bottom:#F29718;
  --chart-axis:#D3C8CD;
  --chart-muted:#86727C;
  --chart-label:#5B4651;
  --chart-muted-dark:#A88E9B;
  --map-water:#D3E3F3;
  --map-park:#DCEBD9;
  --rust:#8A3B12;
  --white-a18:rgba(255,255,255,.18);
  --shade-a26:rgba(10,3,7,.26);
  --shade-a10:rgba(10,3,7,.10);
  --ink-a07:rgba(28,13,20,.07);
  --ink-a03:rgba(28,13,20,.03);
  --ink-a05:rgba(28,13,20,.05);
  /* type */
  --font-display:"Eloquia Display","Avenir Next","Avenir","Segoe UI",system-ui,-apple-system,sans-serif;
  --font-text:"Eloquia Text","Avenir Next","Avenir","Segoe UI",system-ui,-apple-system,sans-serif;
  --font-mono:ui-monospace,"SF Mono",SFMono-Regular,Menlo,Consolas,monospace;
  --font-chat:-apple-system,BlinkMacSystemFont,"SF Pro Text","Helvetica Neue",system-ui,sans-serif;
  --text-3xs:10px;
  --text-2xs:11px;
  --text-xs:12px;
  --text-sm:13px;
  --text-md:14px;
  --text-base:15px;
  --text-lg:16px;
  --text-xl:18px;
  --text-2xl:20px;
  --text-3xl:22px;
  --text-4xl:24px;
  --text-5xl:32px;
  --text-6xl:40px;
  --text-lead:clamp(17px,1.35vw,19px);
  --text-quote-s:clamp(19px,1.7vw,22px);
  --text-quote-m:clamp(21px,2.1vw,27px);
  --text-quote-l:clamp(24px,2.6vw,34px);
  --text-display-m:clamp(26px,2.6vw,36px);
  --text-statement:clamp(28px,3vw,40px);
  --text-display-l:clamp(32px,3.7vw,50px);
  --text-stat-m:clamp(42px,4.2vw,58px);
  --text-stat-l:clamp(48px,5vw,68px);
  --text-display-xl:clamp(40px,5.3vw,72px);
  --text-stat-xl:clamp(60px,6vw,84px);
  --text-jumbo-s:clamp(80px,10vw,150px);
  --text-jumbo-m:clamp(96px,14vw,180px);
  --text-jumbo-l:clamp(120px,16vw,220px);
  /* spacing */
  --space-1:1px;
  --space-2:2px;
  --space-4:4px;
  --space-6:6px;
  --space-8:8px;
  --space-10:10px;
  --space-12:12px;
  --space-14:14px;
  --space-16:16px;
  --space-18:18px;
  --space-20:20px;
  --space-22:22px;
  --space-24:24px;
  --space-26:26px;
  --space-28:28px;
  --space-32:32px;
  --space-36:36px;
  --space-40:40px;
  --space-44:44px;
  --space-48:48px;
  --space-56:56px;
  --space-64:64px;
  --space-72:72px;
  --space-100:100px;
  --space-card:clamp(24px,3vw,36px);
  --space-card-l:clamp(28px,3.6vw,48px);
  --space-stack-l:clamp(40px,4.6vw,60px);
  --space-stack-xl:clamp(44px,5.5vw,72px);
  --space-cta-x:clamp(28px,5.5vw,72px);
  --space-gap-l:clamp(32px,5vw,80px);
  --space-cta-top:clamp(48px,7vw,88px);
  --space-gap-xl:clamp(36px,6vw,96px);
  --space-cta-bottom:clamp(72px,8vw,104px);
  --space-hero-top:clamp(56px,7.5vw,104px);
  --space-hero-bottom:clamp(64px,8vw,112px);
  --space-section:clamp(80px,9.5vw,136px);
  /* layout */
  --wrap:1200px; --gut:32px;
  /* radii */
  --radius-2xs:2px;
  --radius-xs:6px;
  --radius-sm:8px;
  --radius-md:10px;
  --radius:12px;
  --radius-lg:16px;
  --radius-xl:20px;
  --radius-2xl:24px;
  --radius-pill:999px; --radius-round:50%;
  /* shadows */
  --shadow-1:0 1px 2px var(--ink-a05),0 1px 1px var(--ink-a03);
  --shadow-2:0 1px 2px var(--ink-a05),0 10px 30px var(--ink-a07);
  --shadow-window:0 0 0 1px var(--ink-a08),0 2px 6px var(--shade-a10),0 30px 80px var(--shade-a26);
  --shadow-3:inset 0 -1px 0 var(--black-a08);
  --shadow-4:0 20px 50px var(--ink-a18),0 2px 6px var(--ink-a06);
  --shadow-5:0 0 0 3px var(--live-a25);
  --shadow-6:inset 0 0 0 1px var(--line);
  --shadow-7:0 0 0 4px var(--gold-tint);
  --shadow-8:inset 0 0 0 4px var(--plum-tint);
  --shadow-9:0 6px 20px var(--black-a25);
  --shadow-10:0 0 0 4px var(--gold-a20);
  --shadow-11:0 0 0 4px var(--paper);
  --shadow-12:0 0 0 3px var(--gold-tint);
  --shadow-13:0 14px 40px var(--black-a30);
  --shadow-14:0 0 0 1px var(--white-a16),0 30px 80px var(--shade-a42);
  --shadow-15:0 0 0 1px var(--line),0 12px 32px var(--ink-a08);
  --shadow-16:0 2px 8px var(--ink-a15);
  --shadow-17:0 0 0 1px var(--white-a20);
  --shadow-18:0 0 0 1px var(--white-a14);
  --shadow-19:0 0 0 1px var(--white-a08);
  color-scheme:light;
}
@media (--bp-xl){:root{--gut:24px}}
@media (--bp-md){:root{--gut:16px}}