/* Neighborhood Blocks design tokens: the only place a raw color, font or size is written. Every stylesheet and
   script on the development site uses these names.

   Three layers (nb-89):
   - palette: every raw colour, in the generated palette block below (--pal-<hue>-<lightness>[-a<alpha>]), and the
     generated size, spacing and radius scales at the end of the file;
   - roles: what a colour is for (page background, surface, text, border, accent, ...), and the brand names (pine,
     lime, sage, the soft washes, ...), each pointing at the palette through var();
   - themes: a look or mode re-points roles, through var() only: dark mode and data-look="site" here, admin's
     look-admin.css, the landing's assets/look/10a.css.

   Two looks, both from the live site: the marketing pages (data-look="site" on <html>: home, hub, placeholders) use
   the landing page's slightly softer pine and ink; the app pages (portals) use the builder's. Dark mode is shared. */

:root{
  /* ── brand names ── */
  --pine:var(--pal-green-17);--lime:var(--pal-yellow-59);--sage:var(--pal-green-80);--sage2:var(--pal-green-84);--sagewash:var(--pal-green-89);
  --sky:var(--pal-sky-82);--lilac:var(--pal-sky-82);--skywash:var(--pal-sky-90);--skyink:var(--pal-sky-32);
  --rose:var(--pal-red-56);--rosewash:var(--pal-red-93);--pink:var(--pal-pink-91);
  --amber:var(--pal-amber-62);--amberwash:var(--pal-amber-85);
  --brick:var(--pal-red-38);--clay:var(--pal-orange-89);--peach:var(--pal-orange-74);--lilacwash:var(--pal-indigo-93);
  --cream:var(--pal-amber-95);

  /* ── roles ── */
  --bg:var(--pal-white);                     /* the page */
  --surface:var(--pal-white);                /* cards, inputs, buttons on the page */
  --surface-muted:var(--pal-amber-95);          /* quiet panels: stats, archived cards, notes */
  --nav-bg:var(--pal-white-a94);   /* the floating nav on marketing pages */
  --text:var(--pal-grey-32);                   /* body copy */
  --text-strong:var(--pal-grey-7);            /* headings, labels, values */
  --text-muted:var(--pal-grey-41);             /* hints, meta: 4.5:1 or better on white and cream */
  --border:var(--pal-grey-89);
  --border-hover:var(--pal-grey-7);
  --border-soft:var(--pal-grey-7-a08);
  --rule-soft:var(--pal-grey-7-a14);
  --accent:var(--pal-green-17);                 /* selected pills, primary buttons, switches */
  --on-accent:var(--pal-yellow-59);              /* text on --accent */
  --accent-text:var(--pal-green-17);            /* accent used as text on the page */
  --accent-border:var(--pal-green-17);          /* focus rings and selected outlines */
  --on-lime:var(--pal-green-17);                /* text on lime, in both modes */
  --on-color:var(--pal-white);               /* text on a strong palette color (rose, sky ink, danger) */
  --on-brick:var(--pal-orange-97);
  --danger:var(--pal-red-46);
  --danger-ring:var(--pal-red-46-a18);
  --danger-border:var(--pal-red-46-a40);
  --error-bg:var(--pal-pink-91);
  --error-text:var(--pal-pink-30);
  --banner-bg:var(--pal-amber-62);              /* the development banner stays amber in both modes */
  --on-banner:var(--pal-grey-7);
  --knob:var(--pal-white);                   /* switch knob */
  --qr-bg:var(--pal-white);                  /* QR codes always print dark on white */
  --qr-ink:var(--pal-black);                 /* the dark modules of a QR code, in both themes */
  /* the six QR looks a Plus building can pick, as on the live builder; print colors, the same in both themes */
  --qr-classic_block-ink:var(--pal-green-17);--qr-classic_block-bg:var(--pal-white);
  --qr-lime_pop-ink:var(--pal-green-17);--qr-lime_pop-bg:var(--pal-yellow-59);
  --qr-downtown_sky-ink:var(--pal-green-17);--qr-downtown_sky-bg:var(--pal-sky-82);
  --qr-neon_night-ink:var(--pal-yellow-59);--qr-neon_night-bg:var(--pal-green-17);
  --qr-sunset-ink:var(--pal-green-17);--qr-sunset-bg:var(--pal-pink-91);
  --qr-peach-ink:var(--pal-green-17);--qr-peach-bg:var(--pal-orange-74);
  --swatch-garden_courtyard:var(--pal-green-80);--swatch-route_66_neon:var(--pal-orange-74);--swatch-downtown_loft:var(--pal-sky-82);
  --swatch-midtown_sunset:var(--pal-pink-91);--swatch-brick_and_ivy:var(--pal-orange-89);--swatch-block_party:var(--pal-yellow-59);

  /* ── type ── */
  --font-display:'Bricolage Grotesque',system-ui,sans-serif;
  --font-body:'Inter',system-ui,sans-serif;
  --fs-display:clamp(46px,7.3vw,94px);
  --fs-display-short:clamp(42px,6.4vw,82px);
  --fs-section:clamp(27px,3.8vw,47px);
  --fs-page-title:clamp(28px,6vw,38px);
  --fs-auth-title:clamp(30px,7vw,38px);
  --fs-step-title:clamp(26px,6.4vw,34px);
  --fs-hero-title:clamp(24px,6vw,32px);
  --fs-card-title:clamp(20px,2.2vw,25px);
  --fs-card-title-sm:clamp(20px,2.2vw,24px);
  --fs-lede:clamp(15.5px,1.35vw,18px);
  --fs-lede-app:clamp(15.5px,1.4vw,18px);
  --fs-book-title:clamp(34px,7vw,52px);
  --fs-chapter-title:clamp(30px,6vw,44px);
  --fs-stat:clamp(34px,6vw,48px);

  /* ── radii ── */
  --r-xl:28px;--r-lg:18px;--r-sm:12px;--r-pill:999px;
  --r-blob:clamp(36px,6vmax,84px);

  /* ── motion ── */
  --ease-spring:cubic-bezier(.34,1.56,.64,1);
  --dur-fast:.15s;--dur-base:.18s;--dur-theme:.2s;
  --dur-enter:.45s;--dur-draw:1.1s;--ease-out:cubic-bezier(.2,.7,.2,1);--stagger:45ms;--rise:8px;

  /* ── layout ── */
  --w-site-nav:1240px;--w-cover:1140px;--w-band:1100px;--w-portal-nav:1180px;--w-landing:1040px;--w-list:960px;
  --w-overview:660px;--w-read:720px;--w-step:620px;--w-loading:620px;--w-foot:640px;--w-auth:440px;
  --foot:74px;

  /* ── layers ── */
  --z-nav:90;--z-top:70;--z-footbar:65;--z-progress:60;--z-popover:20;--z-toast:300;

  /* ── charts and admin ── */
  --chart-1:var(--pal-green-17);--chart-2:var(--pal-green-59);--chart-3:var(--pal-sky-32);--chart-4:var(--pal-amber-62);--chart-5:var(--pal-red-56);--chart-6:var(--pal-red-38);
  --chart-7:var(--pal-sky-53);--chart-8:var(--pal-orange-55);--chart-9:var(--pal-violet-53);--chart-10:var(--pal-cyan-42);
  --chart-grid:var(--pal-grey-7-a08);--chart-text:var(--pal-grey-45);
  --sample-stripe:var(--pal-amber-62-a14);--sample-edge:var(--pal-amber-62);
  --ok:var(--pal-green-29);--ok-soft:var(--pal-green-89);--warn:var(--pal-orange-27);--warn-soft:var(--pal-amber-85);
  --heat-0:var(--pal-pink-91);--heat-1:var(--pal-amber-85);--heat-2:var(--pal-green-89);--heat-3:var(--pal-green-80);
  --shadow-lift:0 10px 28px var(--pal-grey-7-a10);--scrim:var(--pal-grey-7-a50);
  --w-side:248px;--w-side-collapsed:68px;--w-admin:1180px;
  --z-side:75;

  color-scheme:light;
}

/* marketing pages: the live landing page's palette */
:root[data-look="site"]{
  --pine:var(--pal-teal-25);--sky:var(--pal-sky-77);--peach:var(--pal-orange-77);
  --text:var(--pal-grey-28);--text-strong:var(--pal-grey-11);--text-muted:var(--pal-grey-41-v2);--border:var(--pal-grey-90);--border-hover:var(--pal-grey-11);
  --accent:var(--pal-teal-25);--on-accent:var(--pal-green-80);--accent-text:var(--pal-teal-25);--accent-border:var(--pal-grey-11);
}

/* the main site's not-found page (apps/www/src/lib/NotFound.svelte), in the landing's hand: its ink, link blue and
   dawn washes (lib/blaine/index.css), its fonts, and the brand mark's navy and gold */
:root{
  --land-ink:var(--pal-blue-16);--land-ink-soft:var(--pal-blue-32);--land-link:var(--pal-blue-53);--land-focus:var(--pal-blue-61);--land-on-ink:var(--pal-white);
  --land-wash-a:var(--pal-blue-94);--land-wash-b:var(--pal-orange-93);--land-mark:var(--pal-blue-23);--land-mark-dot:var(--pal-orange-59);
  --font-land-display:'Fraunces',Georgia,serif;--font-land-body:'Plus Jakarta Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
}

/* ── dark: the same names, pine-ink surfaces and cream text. Not on Blaine's pages (data-pages="blaine"): his
   stylesheets use several of these names for his own brand colors, so his dark mode is its own (lib/blaine/dark.css) ── */
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]):not(.light):not([data-pages="blaine"]){
    --pine:var(--pal-green-27);--sage:var(--pal-green-22);--sage2:var(--pal-green-17-v2);--sagewash:var(--pal-green-16);
    --sky:var(--pal-sky-25);--lilac:var(--pal-sky-25);--skywash:var(--pal-sky-17);--skyink:var(--pal-sky-66);
    --rose:var(--pal-red-68);--rosewash:var(--pal-red-18);--pink:var(--pal-pink-21);
    --amberwash:var(--pal-orange-18);--brick:var(--pal-red-59);--clay:var(--pal-orange-18-v2);--peach:var(--pal-orange-25);--lilacwash:var(--pal-indigo-18);
    --cream:var(--pal-green-14);
    --bg:var(--pal-green-7);--surface:var(--pal-green-11);--surface-muted:var(--pal-green-14);--nav-bg:var(--pal-green-7-a92);
    --text:var(--pal-grey-80);--text-strong:var(--pal-amber-95);--text-muted:var(--pal-grey-62);
    --border:var(--pal-green-20);--border-hover:var(--pal-amber-95);--border-soft:var(--pal-amber-95-a10);--rule-soft:var(--pal-amber-95-a16);
    --accent:var(--pal-green-27);--on-accent:var(--pal-yellow-59);--accent-text:var(--pal-green-73);--accent-border:var(--pal-green-56);
    --danger:var(--pal-red-59-v2);--danger-ring:var(--pal-red-59-a25);--danger-border:var(--pal-red-59-a50);
    --error-bg:var(--pal-pink-21);--error-text:var(--pal-red-88);
    --swatch-garden_courtyard:var(--pal-green-33);--swatch-route_66_neon:var(--pal-orange-38);--swatch-downtown_loft:var(--pal-sky-33);
    --swatch-midtown_sunset:var(--pal-pink-38);--swatch-brick_and_ivy:var(--pal-orange-34);--swatch-block_party:var(--pal-yellow-38);
    --chart-1:var(--pal-green-73);--chart-2:var(--pal-green-49);--chart-3:var(--pal-sky-66);--chart-4:var(--pal-amber-62);--chart-5:var(--pal-red-68);--chart-6:var(--pal-red-59);--chart-7:var(--pal-blue-72);--chart-8:var(--pal-orange-65);--chart-9:var(--pal-violet-71);--chart-10:var(--pal-cyan-61);
    --chart-grid:var(--pal-amber-95-a10);--chart-text:var(--pal-grey-62);
    --sample-stripe:var(--pal-amber-62-a10);--sample-edge:var(--pal-amber-45);
    --ok:var(--pal-green-65);--ok-soft:var(--pal-green-16);--warn:var(--pal-amber-62);--warn-soft:var(--pal-orange-18);
    --heat-0:var(--pal-pink-21);--heat-1:var(--pal-orange-18);--heat-2:var(--pal-green-16);--heat-3:var(--pal-green-27);
    --shadow-lift:0 10px 28px var(--pal-black-a45);--scrim:var(--pal-grey-7-a50);
    color-scheme:dark;
  }
}
:root[data-theme="dark"]:not([data-pages="blaine"]),:root.dark:not([data-pages="blaine"]){
  --pine:var(--pal-green-27);--sage:var(--pal-green-22);--sage2:var(--pal-green-17-v2);--sagewash:var(--pal-green-16);
  --sky:var(--pal-sky-25);--lilac:var(--pal-sky-25);--skywash:var(--pal-sky-17);--skyink:var(--pal-sky-66);
  --rose:var(--pal-red-68);--rosewash:var(--pal-red-18);--pink:var(--pal-pink-21);
  --amberwash:var(--pal-orange-18);--brick:var(--pal-red-59);--clay:var(--pal-orange-18-v2);--peach:var(--pal-orange-25);--lilacwash:var(--pal-indigo-18);
  --cream:var(--pal-green-14);
  --bg:var(--pal-green-7);--surface:var(--pal-green-11);--surface-muted:var(--pal-green-14);--nav-bg:var(--pal-green-7-a92);
  --text:var(--pal-grey-80);--text-strong:var(--pal-amber-95);--text-muted:var(--pal-grey-62);
  --border:var(--pal-green-20);--border-hover:var(--pal-amber-95);--border-soft:var(--pal-amber-95-a10);--rule-soft:var(--pal-amber-95-a16);
  --accent:var(--pal-green-27);--on-accent:var(--pal-yellow-59);--accent-text:var(--pal-green-73);--accent-border:var(--pal-green-56);
  --danger:var(--pal-red-59-v2);--danger-ring:var(--pal-red-59-a25);--danger-border:var(--pal-red-59-a50);
  --error-bg:var(--pal-pink-21);--error-text:var(--pal-red-88);
  --swatch-garden_courtyard:var(--pal-green-33);--swatch-route_66_neon:var(--pal-orange-38);--swatch-downtown_loft:var(--pal-sky-33);
  --swatch-midtown_sunset:var(--pal-pink-38);--swatch-brick_and_ivy:var(--pal-orange-34);--swatch-block_party:var(--pal-yellow-38);
  --chart-1:var(--pal-green-73);--chart-2:var(--pal-green-49);--chart-3:var(--pal-sky-66);--chart-4:var(--pal-amber-62);--chart-5:var(--pal-red-68);--chart-6:var(--pal-red-59);--chart-7:var(--pal-blue-72);--chart-8:var(--pal-orange-65);--chart-9:var(--pal-violet-71);--chart-10:var(--pal-cyan-61);
  --chart-grid:var(--pal-amber-95-a10);--chart-text:var(--pal-grey-62);
  --sample-stripe:var(--pal-amber-62-a10);--sample-edge:var(--pal-amber-45);
  --ok:var(--pal-green-65);--ok-soft:var(--pal-green-16);--warn:var(--pal-amber-62);--warn-soft:var(--pal-orange-18);
  --heat-0:var(--pal-pink-21);--heat-1:var(--pal-orange-18);--heat-2:var(--pal-green-16);--heat-3:var(--pal-green-27);
  --shadow-lift:0 10px 28px var(--pal-black-a45);--scrim:var(--pal-grey-7-a50);
  color-scheme:dark;
}

/* ── building page themes: a Plus building's chosen colors (live site's six); a starter page stays plain ── */
[data-block-theme]{
  --bt-bg:var(--bg);--bt-txt:var(--text-strong);--bt-card:var(--surface);--bt-card-txt:var(--text-strong);
  --bt-av:var(--text-strong);--bt-av-txt:var(--bg);--bt-acc:var(--accent);--bt-acc-txt:var(--on-accent);
}
[data-block-theme="garden_courtyard"]{--bt-bg:var(--pal-lime-92);--bt-txt:var(--pal-green-17);--bt-card:var(--pal-white);--bt-card-txt:var(--pal-green-17);--bt-av:var(--pal-yellow-59);--bt-av-txt:var(--pal-green-17);--bt-acc:var(--pal-green-17);--bt-acc-txt:var(--pal-yellow-59)}
[data-block-theme="route_66_neon"]{--bt-bg:var(--pal-violet-18);--bt-txt:var(--pal-white);--bt-card:var(--pal-violet-25);--bt-card-txt:var(--pal-violet-96);--bt-av:var(--pal-red-67);--bt-av-txt:var(--pal-white);--bt-acc:var(--pal-amber-57);--bt-acc-txt:var(--pal-violet-18)}
[data-block-theme="downtown_loft"]{--bt-bg:var(--pal-grey-11-v2);--bt-txt:var(--pal-white);--bt-card:var(--pal-grey-18);--bt-card-txt:var(--pal-lime-92-v2);--bt-av:var(--pal-sky-82);--bt-av-txt:var(--pal-grey-11-v2);--bt-acc:var(--pal-white);--bt-acc-txt:var(--pal-grey-11-v2)}
[data-block-theme="midtown_sunset"]{--bt-bg:var(--pal-pink-91);--bt-txt:var(--pal-green-17);--bt-card:var(--pal-white);--bt-card-txt:var(--pal-green-17);--bt-av:var(--pal-orange-74);--bt-av-txt:var(--pal-green-17);--bt-acc:var(--pal-green-17);--bt-acc-txt:var(--pal-pink-91)}
[data-block-theme="brick_and_ivy"]{--bt-bg:var(--pal-red-45);--bt-txt:var(--pal-orange-97);--bt-card:var(--pal-red-35);--bt-card-txt:var(--pal-orange-94);--bt-av:var(--pal-amber-95);--bt-av-txt:var(--pal-red-45);--bt-acc:var(--pal-yellow-59);--bt-acc-txt:var(--pal-green-17)}
[data-block-theme="block_party"]{--bt-bg:var(--pal-indigo-36);--bt-txt:var(--pal-white);--bt-card:var(--pal-indigo-44);--bt-card-txt:var(--pal-indigo-96);--bt-av:var(--pal-red-67);--bt-av-txt:var(--pal-white);--bt-acc:var(--pal-yellow-59);--bt-acc-txt:var(--pal-indigo-36)}
/* the two light themes get a dark version; the dark themes already are */
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]):not(.light) [data-block-theme="garden_courtyard"]{--bt-bg:var(--pal-green-12);--bt-txt:var(--pal-lime-92);--bt-card:var(--pal-green-16);--bt-card-txt:var(--pal-lime-92);--bt-acc:var(--pal-yellow-59);--bt-acc-txt:var(--pal-green-17)}
  :root:not([data-theme="light"]):not(.light) [data-block-theme="midtown_sunset"]{--bt-bg:var(--pal-pink-14);--bt-txt:var(--pal-pink-95);--bt-card:var(--pal-pink-19);--bt-card-txt:var(--pal-pink-95);--bt-acc:var(--pal-orange-74);--bt-acc-txt:var(--pal-pink-14)}
}
:root[data-theme="dark"] [data-block-theme="garden_courtyard"],:root.dark [data-block-theme="garden_courtyard"]{--bt-bg:var(--pal-green-12);--bt-txt:var(--pal-lime-92);--bt-card:var(--pal-green-16);--bt-card-txt:var(--pal-lime-92);--bt-acc:var(--pal-yellow-59);--bt-acc-txt:var(--pal-green-17)}
:root[data-theme="dark"] [data-block-theme="midtown_sunset"],:root.dark [data-block-theme="midtown_sunset"]{--bt-bg:var(--pal-pink-14);--bt-txt:var(--pal-pink-95);--bt-card:var(--pal-pink-19);--bt-card-txt:var(--pal-pink-95);--bt-acc:var(--pal-orange-74);--bt-acc-txt:var(--pal-pink-14)}

/* ── map pins and the Deco letter blocks ── */
:root{--deco-d:var(--pal-green-17);--deco-e:var(--pal-yellow-59);--deco-c:var(--pal-sky-82);--deco-o:var(--pal-orange-74);--deco-ink:var(--pal-grey-7);--deco-on-d:var(--pal-yellow-59)}

:root{
  /* the QR magnet admin draws on a canvas (apps/admin/src/lib/magnet.ts): each vibe's two colours and ink, the white
     magnet's ink, its paper, the vibe square's hairline and the code plate's shadow */
  --magnet-loft-a:var(--pal-blue-59);--magnet-loft-b:var(--pal-violet-65);--magnet-loft-ink:var(--pal-blue-16);
  --magnet-garden-a:var(--pal-teal-38);--magnet-garden-b:var(--pal-lime-58);--magnet-garden-ink:var(--pal-teal-11);
  --magnet-route66-a:var(--pal-pink-59);--magnet-route66-b:var(--pal-cyan-50);--magnet-route66-ink:var(--pal-red-12);
  --magnet-brick-a:var(--pal-red-61);--magnet-brick-b:var(--pal-teal-44);--magnet-brick-ink:var(--pal-red-12-v2);
  --magnet-sunset-a:var(--pal-orange-50);--magnet-sunset-b:var(--pal-pink-62);--magnet-sunset-ink:var(--pal-purple-11);
  --magnet-party-a:var(--pal-amber-50-v2);--magnet-party-b:var(--pal-indigo-62);--magnet-party-ink:var(--pal-indigo-16);
  --magnet-ink:var(--pal-orange-9);--magnet-paper:var(--pal-white);--magnet-hairline:var(--pal-orange-9-a06);--magnet-shadow:var(--pal-black-a20);
}

:root{
  /* the map's home pin (assets/blocks/places.js) and the share code's modules (assets/blocks/qr.js) */
  --map-home-pin:var(--pal-blue-16);--map-home-mark:var(--pal-white);--qr-dark:var(--pal-black);--qr-light:var(--pal-white);
}

/* ── generated palette: begin ── */
/* colours with no brand name, named by hue family and lightness (-a = alpha); themes and stylesheets point at
   these through var(), never at a raw value */
:root{
  --pal-amber-44:#e0a100;
  --pal-amber-45:#A8853F;
  --pal-amber-45-v2:#E8A400;
  --pal-amber-50:#ffb800;
  --pal-amber-50-a10:rgba(255, 184, 0, 0.1);
  --pal-amber-50-a14:rgba(255, 184, 0, 0.14);
  --pal-amber-50-v2:#FFD400;
  --pal-amber-57:#F7B32B;
  --pal-amber-62:#E3B75A;
  --pal-amber-62-a10:rgba(227,183,90,.10);
  --pal-amber-62-a14:rgba(227,183,90,.14);
  --pal-amber-63:#F3C64D;
  --pal-amber-65:#ffd54a;
  --pal-amber-68:#ffd45c;
  --pal-amber-85:#F5E4BF;
  --pal-amber-90:#fbf0cf;
  --pal-amber-90-v2:#fff1cc;
  --pal-amber-95:#F7F4EC;
  --pal-amber-95-a10:rgba(247,244,236,.10);
  --pal-amber-95-a16:rgba(247,244,236,.16);
  --pal-black:#000000;
  --pal-black-a08:rgba(0,0,0,.08);
  --pal-black-a20:rgba(0,0,0,.2);
  --pal-black-a45:rgba(0,0,0,.45);
  --pal-black-a60:rgba(0, 0, 0, 0.6);
  --pal-black-a70:rgba(0, 0, 0, 0.7);
  --pal-black-a75:rgba(0, 0, 0, 0.75);
  --pal-blue-8:#060c22;
  --pal-blue-8-a88:rgba(6, 12, 34, 0.88);
  --pal-blue-11:#0a1230;
  --pal-blue-14:#0d1638;
  --pal-blue-14-a72:rgba(13, 22, 56, 0.72);
  --pal-blue-15:#151839;
  --pal-blue-16:#161A3A;
  --pal-blue-16-a04:rgba(22, 26, 58, 0.04);
  --pal-blue-16-a12:rgba(20, 24, 60, 0.12);
  --pal-blue-16-a16:rgba(20, 24, 60, 0.16);
  --pal-blue-16-a28:rgba(20, 24, 60, 0.28);
  --pal-blue-16-a30:rgba(22, 26, 58, 0.3);
  --pal-blue-16-a35:rgba(22, 26, 58, 0.35);
  --pal-blue-16-a45:rgba(20, 24, 60, 0.45);
  --pal-blue-16-a50:rgba(20, 24, 60, 0.5);
  --pal-blue-16-a60:rgba(20, 24, 60, 0.6);
  --pal-blue-21:#13205a;
  --pal-blue-23:#1E2259;
  --pal-blue-23-v2:#272c50;
  --pal-blue-25:#1a2a66;
  --pal-blue-26:#1e2b66;
  --pal-blue-32:#3D4266;
  --pal-blue-41:#3A4196;
  --pal-blue-45:#5c6289;
  --pal-blue-48:#1e3fd6;
  --pal-blue-52:#2a4fe0;
  --pal-blue-53:#2C62E0;
  --pal-blue-59:#2F5BFF;
  --pal-blue-60:#3d63f5;
  --pal-blue-61:#3F7BF6;
  --pal-blue-72:#7FAEF0;
  --pal-blue-72-v2:#6e8fff;
  --pal-blue-74:#a4aad6;
  --pal-blue-78:#8fb3ff;
  --pal-blue-89:#c9d4ff;
  --pal-blue-91:#e3e6ef;
  --pal-blue-92:#d6deff;
  --pal-blue-92-v2:#e1e5f4;
  --pal-blue-92-v3:#dce0fa;
  --pal-blue-94:#E2E9FC;
  --pal-blue-94-v2:#e2e8ff;
  --pal-blue-97:#f4f6fd;
  --pal-blue-97-a05:rgba(238, 240, 255, 0.05);
  --pal-blue-97-a09:rgba(238, 240, 255, 0.09);
  --pal-blue-97-a10:rgba(238, 240, 255, 0.1);
  --pal-blue-97-a12:rgba(238, 240, 255, 0.12);
  --pal-blue-97-a30:rgba(238, 240, 255, 0.3);
  --pal-blue-97-a78:rgba(244, 246, 253, 0.78);
  --pal-blue-97-a88:rgba(244, 246, 253, 0.88);
  --pal-blue-97-v2:#eef1ff;
  --pal-blue-97-v3:#eef0ff;
  --pal-cyan-42:#2FA4A9;
  --pal-cyan-43:#00a3d9;
  --pal-cyan-44:#0AA9D6;
  --pal-cyan-50:#00D4FF;
  --pal-cyan-61:#6CCBCB;
  --pal-green-7:#0F1712;
  --pal-green-7-a92:rgba(15,23,18,.92);
  --pal-green-11:#17221B;
  --pal-green-12:#16261C;
  --pal-green-14:#1E2B23;
  --pal-green-16:#1F3327;
  --pal-green-17:#1E3B2C;
  --pal-green-17-v2:#22362A;
  --pal-green-20:#2C3A31;
  --pal-green-22:#2A4535;
  --pal-green-27:#2F5A44;
  --pal-green-29:#2A6B45;
  --pal-green-33:#3E6B51;
  --pal-green-49:#5C9C74;
  --pal-green-56:#6FAE8C;
  --pal-green-59:#7BB38F;
  --pal-green-65:#7FCB9A;
  --pal-green-73:#9FD3B4;
  --pal-green-80:#B8DEC3;
  --pal-green-82:#b5ebcb;
  --pal-green-84:#CDE0D3;
  --pal-green-89:#DCEBE0;
  --pal-green-92:#e1f6ea;
  --pal-green-92-v2:#dff6e8;
  --pal-grey-7:#101310;
  --pal-grey-7-a08:rgba(16,19,16,.08);
  --pal-grey-7-a10:rgba(16,19,16,.10);
  --pal-grey-7-a14:rgba(16,19,16,.14);
  --pal-grey-7-a50:rgba(16,19,16,.5);
  --pal-grey-9:#15161a;
  --pal-grey-9-a04:rgba(21, 22, 26, 0.04);
  --pal-grey-9-a06:rgba(21, 22, 26, 0.06);
  --pal-grey-9-a07:rgba(21, 22, 26, 0.07);
  --pal-grey-9-a08:rgba(21, 22, 26, 0.08);
  --pal-grey-9-a22:rgba(21, 22, 26, 0.22);
  --pal-grey-9-a42:rgba(21, 22, 26, 0.42);
  --pal-grey-11:#1A1F1B;
  --pal-grey-11-v2:#1A1E1A;
  --pal-grey-18:#2B302B;
  --pal-grey-19:#2C332C;
  --pal-grey-25:#3a3c44;
  --pal-grey-26:#4A433B;
  --pal-grey-28:#454C46;
  --pal-grey-32:#4F554F;
  --pal-grey-39:#6B645B;
  --pal-grey-41:#646B64;
  --pal-grey-41-v2:#666D66;
  --pal-grey-41-v3:#5f6270;
  --pal-grey-45:#6F766F;
  --pal-grey-57:#8a8d99;
  --pal-grey-62:#9AA39B;
  --pal-grey-80:#C9CFC8;
  --pal-grey-89:#E6E5E0;
  --pal-grey-90:#E8E7E2;
  --pal-indigo-16:#1A1240;
  --pal-indigo-18:#2A2638;
  --pal-indigo-19:#24184a;
  --pal-indigo-36:#3D2E8C;
  --pal-indigo-44:#4C3BA6;
  --pal-indigo-46:#5a2bc2;
  --pal-indigo-62:#7B3DFF;
  --pal-indigo-65:#6a5cf0;
  --pal-indigo-75:#8e7dff;
  --pal-indigo-93:#E8E2F6;
  --pal-indigo-96:#EDEAFF;
  --pal-lime-58:#C6F432;
  --pal-lime-92:#EAF3E2;
  --pal-lime-92-v2:#EDEFE8;
  --pal-lime-95:#F3F5F1;
  --pal-orange-9:#1B1714;
  --pal-orange-9-a06:rgba(27,23,20,.06);
  --pal-orange-9-a35:rgba(27, 23, 20, 0.35);
  --pal-orange-18:#3A3020;
  --pal-orange-18-v2:#3A2A24;
  --pal-orange-25:#5A3A26;
  --pal-orange-27:#7E4F0A;
  --pal-orange-30:#9a5200;
  --pal-orange-34:#6E4A3E;
  --pal-orange-38:#8A5A36;
  --pal-orange-48:#F57A00;
  --pal-orange-50:#ff8a00;
  --pal-orange-55:#E8862F;
  --pal-orange-59:#F2B33D;
  --pal-orange-65:#F0A25A;
  --pal-orange-65-v2:#ffa94d;
  --pal-orange-71:#ffc76b;
  --pal-orange-74:#FFB27A;
  --pal-orange-77:#F0B79A;
  --pal-orange-88:#E6E1D9;
  --pal-orange-89:#F3DCD2;
  --pal-orange-93:#FFE7DC;
  --pal-orange-94:#FFE8DE;
  --pal-orange-95:#fff7e8;
  --pal-orange-97:#FFF6EE;
  --pal-pink-14:#2E1A24;
  --pal-pink-19:#3E2330;
  --pal-pink-21:#4A2032;
  --pal-pink-30:#7A1F44;
  --pal-pink-36:#a3164f;
  --pal-pink-38:#7A4A5E;
  --pal-pink-51:#DB2777;
  --pal-pink-54:#F0247F;
  --pal-pink-59:#ff2e93;
  --pal-pink-59-a16:rgba(255, 46, 147, 0.16);
  --pal-pink-60:#e8489a;
  --pal-pink-62:#FF3D7F;
  --pal-pink-72:#ff6fb5;
  --pal-pink-81:#ff9cc8;
  --pal-pink-91:#FFCFE3;
  --pal-pink-91-v2:#f9d8e8;
  --pal-pink-93:#ffdcec;
  --pal-pink-94:#FCE4EF;
  --pal-pink-94-v2:#ffe0ec;
  --pal-pink-95:#FFE3EF;
  --pal-purple-11:#2A1028;
  --pal-purple-16:#3a1636;
  --pal-red-12:#2A1218;
  --pal-red-12-v2:#2B1610;
  --pal-red-18:#3A2229;
  --pal-red-35:#8E3A27;
  --pal-red-38:#96412E;
  --pal-red-45:#B34A32;
  --pal-red-46:#C2402A;
  --pal-red-46-a18:rgba(194,64,42,.18);
  --pal-red-46-a40:rgba(194,64,42,.4);
  --pal-red-56:#C4586C;
  --pal-red-57:#F2502F;
  --pal-red-58:#F2346F;
  --pal-red-59:#D0765F;
  --pal-red-59-a25:rgba(224,99,77,.25);
  --pal-red-59-a50:rgba(224,99,77,.5);
  --pal-red-59-v2:#E0634D;
  --pal-red-61:#ff5b3a;
  --pal-red-67:#FC5C72;
  --pal-red-68:#E07A8C;
  --pal-red-71:#ff8a6b;
  --pal-red-88:#FFC2D6;
  --pal-red-93:#FFD9E2;
  --pal-red-94:#ffe6de;
  --pal-sky-17:#1D2E38;
  --pal-sky-25:#24485A;
  --pal-sky-32:#2C5F78;
  --pal-sky-33:#2F6078;
  --pal-sky-53:#3F7FD0;
  --pal-sky-65:#4fd3ff;
  --pal-sky-66:#7FB6D1;
  --pal-sky-77:#A6CDE4;
  --pal-sky-82:#AEE1F5;
  --pal-sky-82-v2:#a6d8fa;
  --pal-sky-87:#BFE3FB;
  --pal-sky-90:#D9E8F2;
  --pal-sky-91:#d6edfc;
  --pal-sky-96:#EEF6FD;
  --pal-teal-11:#0F2A20;
  --pal-teal-25:#2D5140;
  --pal-teal-26:#0a7a45;
  --pal-teal-33:#00A85A;
  --pal-teal-36:#00b864;
  --pal-teal-37:#14A97C;
  --pal-teal-38:#00C46A;
  --pal-teal-38-a16:rgba(0, 196, 106, 0.16);
  --pal-teal-40:#16B88C;
  --pal-teal-44:#1fbf8f;
  --pal-teal-55:#3ddc97;
  --pal-teal-63:#5fe0a0;
  --pal-teal-63-v2:#5fe0c0;
  --pal-violet-18:#2B1E3F;
  --pal-violet-25:#3A2B54;
  --pal-violet-51:#6a2fd6;
  --pal-violet-53:#7B5BB5;
  --pal-violet-62:#8A45F5;
  --pal-violet-65:#9B4DFF;
  --pal-violet-71:#A98BE0;
  --pal-violet-77:#b88bff;
  --pal-violet-95:#efe6ff;
  --pal-violet-96:#F3E9FF;
  --pal-white:#FFFFFF;
  --pal-white-a08:rgba(255, 255, 255, 0.08);
  --pal-white-a25:rgba(255, 255, 255, 0.25);
  --pal-white-a32:rgba(255,255,255,.32);
  --pal-white-a72:rgba(255, 255, 255, 0.72);
  --pal-white-a90:rgba(255, 255, 255, 0.9);
  --pal-white-a94:rgba(255,255,255,.94);
  --pal-yellow-38:#8C9A2A;
  --pal-yellow-59:#D6EC3F;
}
/* ── generated palette: end ── */

/* ── generated scales: begin ── */
:root{
  /* font sizes */
  --fs-10:10px;--fs-10-5:10.5px;--fs-11:11px;--fs-11-5:11.5px;--fs-12:12px;--fs-12-5:12.5px;--fs-13:13px;--fs-13-5:13.5px;--fs-14:14px;--fs-14-5:14.5px;--fs-15:15px;--fs-15-5:15.5px;--fs-16:16px;--fs-16-5:16.5px;--fs-17:17px;--fs-17-5:17.5px;--fs-18:18px;--fs-19:19px;--fs-20:20px;--fs-22:22px;--fs-24:24px;--fs-25:25px;--fs-26:26px;--fs-28:28px;--fs-30:30px;--fs-32:32px;--fs-36:36px;--fs-40:40px;--fs-56:56px;--fs-72:72px;
  /* spacing */
  --sp-2:2px;--sp-3:3px;--sp-4:4px;--sp-5:5px;--sp-6:6px;--sp-7:7px;--sp-8:8px;--sp-9:9px;--sp-10:10px;--sp-11:11px;--sp-12:12px;--sp-13:13px;--sp-14:14px;--sp-15:15px;--sp-16:16px;--sp-17:17px;--sp-18:18px;--sp-20:20px;--sp-22:22px;--sp-24:24px;--sp-26:26px;--sp-28:28px;--sp-30:30px;--sp-32:32px;--sp-34:34px;--sp-36:36px;--sp-40:40px;--sp-44:44px;--sp-48:48px;--sp-52:52px;--sp-56:56px;--sp-60:60px;--sp-64:64px;--sp-70:70px;--sp-72:72px;--sp-80:80px;--sp-86:86px;--sp-88:88px;--sp-96:96px;--sp-100:100px;--sp-104:104px;--sp-112:112px;--sp-120:120px;--sp-132:132px;
  /* radii */
  --radius-3:3px;--radius-5:5px;--radius-6:6px;--radius-10:10px;--radius-14:14px;--radius-16:16px;--radius-20:20px;--radius-22:22px;--radius-24:24px;--radius-28:28px;--radius-30:30px;--radius-44:44px;--radius-99:99px;
}
/* ── generated scales: end ── */