:root{
  --paper:#f4ead6;
  --card:#fbf4e4;
  --field:#fffaf0;
  --ink:#4a3c2f;
  --ink-soft:#54453a;
  --muted:#7a6856;
  --pencil:#6b5a49;
  --hero-back:url("/assets/hero/back-light.webp");
  --hero-front:url("/assets/hero/front-light.webp");
  --sun-img:url("/assets/hero/sun.webp");
  --card-ol:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath d='M4.5 1.2 C30 .6 62 1.6 95.6 .9 C98.4 1 99.2 2.4 99.1 5 C98.6 34 99.4 66 98.9 95.3 C98.8 98 97.6 99.1 94.8 99 C66 98.5 34 99.4 4.6 98.8 C2 98.7 .9 97.4 1 94.6 C1.5 66 .7 34 1.1 5.2 C1.2 2.4 2.2 1.3 4.5 1.2Z' fill='none' stroke='%236b5a49' stroke-opacity='.7' stroke-width='1.8' vector-effect='non-scaling-stroke' stroke-linejoin='round'/%3E%3Cpath d='M6 2.6 C34 2 66 3 94.4 2.2 C97 2.3 98 3.6 97.8 6.4 C97.5 36 98.2 64 97.6 93.8 C97.5 96.6 96.3 97.7 93.6 97.6 C64 97.2 36 98 6.4 97.5 C3.7 97.4 2.6 96.2 2.7 93.4 C3 64 2.3 36 2.7 6.6 C2.8 3.9 3.8 2.8 6 2.6Z' fill='none' stroke='%236b5a49' stroke-opacity='.35' stroke-width='1.2' vector-effect='non-scaling-stroke' stroke-linejoin='round'/%3E%3C/svg%3E");
  --outline:#2e2419;
  --art-line:#6b5a49;
  --line:#b8a68c;

  --ochre:#e3a845;
  --coral:#d6674a;
  --sage:#93b06f;
  --frog:#4c7a37;
  --sky:#a8c7cc;
  --rose:#e7a19a;

  --btn-bg:#4c7a37;
  --btn-ink:#fbf5e9;
  --btn-hover:#3d6a2b;
  --link:#9a3f26;
  --err:#a63a1f;

  --sun:#f2c46b;
  --ripple:#f2f7f2;

  --logo-a1:#f2ad46; --logo-a2:#e4683d; --logo-a3:#b4432b;
  --logo-f1:#9cc45e; --logo-f2:#5f9440; --logo-f3:#355f27;
  --lede-1:#b7dcea; --lede-2:#93c4dc; --lede-3:#80b2d2;
  --lede-mint:#c6e6ec; --lede-sky:#a7c8e6;
  --lede-solid:#d1e0eb;
  --card-head:#4a3c2f; --card-text:#6b5a49;
  --fo-lift:1.12;
  --fo-accent:#f4efe6;

  --grain:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='p'><feTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .35  0 0 0 0 .25  0 0 0 0 .15  0 0 0 .55 -.18'/></filter><rect width='100%25' height='100%25' filter='url(%23p)'/></svg>");
  --shadow:0 1px 0 rgba(90,60,30,.08), 0 18px 30px -18px rgba(90,60,30,.35);
  color-scheme:light;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --paper:#1b1f2a;
    --card:#232838;
    --field:#191c26;
    --ink:#f1e8d6;
    --ink-soft:#d4c9b6;
    --muted:#a99e8b;
    --pencil:#b9ab92;
    --hero-back:url("/assets/hero/back-dark.webp");
    --hero-front:url("/assets/hero/front-dark.webp");
    --sun-img:url("/assets/hero/moon.webp");
    --card-ol:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath d='M4.5 1.2 C30 .6 62 1.6 95.6 .9 C98.4 1 99.2 2.4 99.1 5 C98.6 34 99.4 66 98.9 95.3 C98.8 98 97.6 99.1 94.8 99 C66 98.5 34 99.4 4.6 98.8 C2 98.7 .9 97.4 1 94.6 C1.5 66 .7 34 1.1 5.2 C1.2 2.4 2.2 1.3 4.5 1.2Z' fill='none' stroke='%23b9ab92' stroke-opacity='.7' stroke-width='1.8' vector-effect='non-scaling-stroke' stroke-linejoin='round'/%3E%3Cpath d='M6 2.6 C34 2 66 3 94.4 2.2 C97 2.3 98 3.6 97.8 6.4 C97.5 36 98.2 64 97.6 93.8 C97.5 96.6 96.3 97.7 93.6 97.6 C64 97.2 36 98 6.4 97.5 C3.7 97.4 2.6 96.2 2.7 93.4 C3 64 2.3 36 2.7 6.6 C2.8 3.9 3.8 2.8 6 2.6Z' fill='none' stroke='%23b9ab92' stroke-opacity='.35' stroke-width='1.2' vector-effect='non-scaling-stroke' stroke-linejoin='round'/%3E%3C/svg%3E");
    --outline:#373739;
    --art-line:#373739;
    --line:#5d5a5a;
    --ochre:#e9b75a;
    --coral:#ef8a6a;
    --sage:#9dbb7c;
    --frog:#a6cf7f;
    --sky:#5b7896;
    --rose:#d98f8a;
    --btn-bg:#a6cf7f;
    --btn-ink:#16210f;
    --btn-hover:#bde09a;
    --link:#f0a283;
    --err:#ff9c80;
    --sun:#f1e3b8;
    --ripple:#9cc3d6;
    --logo-a1:#ffcf78; --logo-a2:#ff8f6b; --logo-a3:#dd5e47;
    --logo-f1:#d6efa8; --logo-f2:#a6d27a; --logo-f3:#6aa94f;
    --lede-1:#d3ecf5; --lede-2:#b6d9ec; --lede-3:#a3cbe6;
    --lede-mint:#dcf1f4; --lede-sky:#c4dcf3; --lede-solid:#d1e0eb; --card-head:var(--ink); --card-text:var(--ink-soft);
  --fo-lift:1.04;
  --fo-accent:#f4efe6;
    --fo-lift:1.04;
    --fo-accent:#f4efe6;
    --grain:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='p'><feTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 .97  0 0 0 0 .9  0 0 0 .22 -.08'/></filter><rect width='100%25' height='100%25' filter='url(%23p)'/></svg>");
    --shadow:0 1px 0 rgba(0,0,0,.2), 0 20px 34px -18px rgba(0,0,0,.6);
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --paper:#1b1f2a;
  --card:#232838;
  --field:#191c26;
  --ink:#f1e8d6;
  --ink-soft:#d4c9b6;
  --muted:#a99e8b;
  --pencil:#b9ab92;
  --hero-back:url("/assets/hero/back-dark.webp");
  --hero-front:url("/assets/hero/front-dark.webp");
  --sun-img:url("/assets/hero/moon.webp");
  --card-ol:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath d='M4.5 1.2 C30 .6 62 1.6 95.6 .9 C98.4 1 99.2 2.4 99.1 5 C98.6 34 99.4 66 98.9 95.3 C98.8 98 97.6 99.1 94.8 99 C66 98.5 34 99.4 4.6 98.8 C2 98.7 .9 97.4 1 94.6 C1.5 66 .7 34 1.1 5.2 C1.2 2.4 2.2 1.3 4.5 1.2Z' fill='none' stroke='%23b9ab92' stroke-opacity='.7' stroke-width='1.8' vector-effect='non-scaling-stroke' stroke-linejoin='round'/%3E%3Cpath d='M6 2.6 C34 2 66 3 94.4 2.2 C97 2.3 98 3.6 97.8 6.4 C97.5 36 98.2 64 97.6 93.8 C97.5 96.6 96.3 97.7 93.6 97.6 C64 97.2 36 98 6.4 97.5 C3.7 97.4 2.6 96.2 2.7 93.4 C3 64 2.3 36 2.7 6.6 C2.8 3.9 3.8 2.8 6 2.6Z' fill='none' stroke='%23b9ab92' stroke-opacity='.35' stroke-width='1.2' vector-effect='non-scaling-stroke' stroke-linejoin='round'/%3E%3C/svg%3E");
  --outline:#373739;
  --art-line:#373739;
  --line:#5d5a5a;
  --ochre:#e9b75a;
  --coral:#ef8a6a;
  --sage:#9dbb7c;
  --frog:#a6cf7f;
  --sky:#5b7896;
  --rose:#d98f8a;
  --btn-bg:#a6cf7f;
  --btn-ink:#16210f;
  --btn-hover:#bde09a;
  --link:#f0a283;
  --err:#ff9c80;
  --sun:#f1e3b8;
  --ripple:#9cc3d6;
  --logo-a1:#ffcf78; --logo-a2:#ff8f6b; --logo-a3:#dd5e47;
  --logo-f1:#d6efa8; --logo-f2:#a6d27a; --logo-f3:#6aa94f;
  --lede-1:#d3ecf5; --lede-2:#b6d9ec; --lede-3:#a3cbe6;
  --lede-mint:#dcf1f4; --lede-sky:#c4dcf3; --lede-solid:#d1e0eb; --card-head:var(--ink); --card-text:var(--ink-soft);
  --grain:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='p'><feTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 .97  0 0 0 0 .9  0 0 0 .22 -.08'/></filter><rect width='100%25' height='100%25' filter='url(%23p)'/></svg>");
  --shadow:0 1px 0 rgba(0,0,0,.2), 0 20px 34px -18px rgba(0,0,0,.6);
  color-scheme:dark;
}

::view-transition-old(root), ::view-transition-new(root){animation-duration:.4s;}

*,*::before,*::after{box-sizing:border-box;}
[hidden]{display:none !important;}
input, select, textarea, button{font-variation-settings:inherit;}
html{-webkit-text-size-adjust:100%; text-size-adjust:100%;}

body{
  margin:0;
  min-height:100vh;
  background:var(--paper);
  color:var(--ink);
  font-family:'Shantell Sans', 'Segoe Print', system-ui, sans-serif;
  font-size:17px;
  line-height:1.65;
  font-variation-settings:"INFM" 55, "BNCE" 35;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  overflow-x:clip;
  padding-bottom:env(safe-area-inset-bottom, 0px);
}
body::before{content:""; position:fixed; inset:0; pointer-events:none; z-index:-1; background:var(--grain) 0 0 / 240px 240px; will-change:transform;}
body::after{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-1;
}
body::after{
  background:radial-gradient(120% 90% at 50% 40%, transparent 55%, rgba(120,80,40,.10) 100%);
}

a{color:var(--link); text-underline-offset:.18em; text-decoration-thickness:1.5px;}
:focus-visible{outline:3px dashed var(--coral); outline-offset:4px; border-radius:6px;}
[data-focus]:focus{outline:none;}

.wrap{
  width:100%;
  max-width:1120px;
  margin:0 auto;
  padding:0 16px;
  padding-left:max(16px, env(safe-area-inset-left, 0px));
  padding-right:max(16px, env(safe-area-inset-right, 0px));
}
.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

.pencil{fill:none; stroke:var(--pencil); stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round;}
.art .pencil{stroke:var(--art-line);}
.pencil.faint{stroke-width:1.4; opacity:.45;}
.pencil.ghost{opacity:.35;}

.boil{filter:url(#boil-s);}
.wf{will-change:opacity; animation:wob .5s step-end infinite;}
.wf2, .wf3{opacity:0;}
.wf2{animation-delay:-.3333s;}
.wf3{animation-delay:-.1667s;}
@keyframes wob{0%{opacity:1;} 33.333%, 100%{opacity:0;}}
.card .art{position:relative;}
.card .art > svg{position:absolute; inset:0; width:100%; height:100%; overflow:visible;}
.foot .squig{position:relative; width:140px; height:22px; margin:0 auto 6px;}
.foot .squig svg{position:absolute; inset:0; width:100%; height:100%; overflow:visible;}
@media (max-width: 899px), (pointer: coarse){
  .fo-ink .puff:nth-child(n+5), .fo-ink .glow{display:none;}
}

.theme-toggle{
  position:absolute;
  top:calc(12px + env(safe-area-inset-top, 0px));
  right:max(12px, env(safe-area-inset-right, 0px));
  z-index:5;
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  padding:0;
  border:0;
  border-radius:50%;
  background:transparent;
  color:var(--ink);
  cursor:pointer;
  transition:transform .3s cubic-bezier(.34,1.56,.64,1);
}
.theme-toggle::before{
  content:"";
  position:absolute;
  inset:4px;
  border-radius:52% 48% 55% 45% / 48% 55% 45% 52%;
  background:var(--card);
  box-shadow:var(--shadow);
}
.theme-toggle::after{
  content:"";
  position:absolute;
  inset:3px;
  border:1.6px solid var(--pencil);
  border-radius:45% 55% 48% 52% / 55% 45% 52% 48%;
  opacity:.7;
}
.theme-toggle svg{position:relative; z-index:1;}
.theme-toggle:hover{transform:rotate(-14deg) scale(1.06);}

.btn{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.5em;
  min-height:52px;
  padding:12px 26px;
  font:700 17px/1.2 'Shantell Sans', 'Segoe Print', system-ui, sans-serif;
  letter-spacing:.01em;
  color:var(--btn-ink);
  background:var(--btn-bg);
  border:0;
  border-radius:255px 18px 225px 18px / 18px 225px 18px 255px;
  text-decoration:none;
  cursor:pointer;
  box-shadow:0 3px 0 rgba(40,30,15,.25);
  transition:transform .25s cubic-bezier(.34,1.56,.64,1), background-color .2s ease, box-shadow .2s ease;
  -webkit-tap-highlight-color:transparent;
}
.btn::after{
  content:"";
  position:absolute;
  inset:-4px -3px -3px -5px;
  border:1.6px solid var(--pencil);
  border-radius:18px 225px 18px 255px / 255px 18px 225px 18px;
  opacity:.55;
  pointer-events:none;
}
.btn:hover{background:var(--btn-hover); transform:translateY(-3px) rotate(-1.2deg) scale(1.03); box-shadow:0 5px 0 rgba(40,30,15,.25);}
.btn:active{transform:translateY(2px) scale(.97); box-shadow:0 0 0 rgba(40,30,15,.25); transition-duration:.06s;}
.btn:disabled{opacity:.7; cursor:progress; transform:none;}
.btn.big{width:100%; min-height:60px; font-size:19px;}

.hero{
  position:relative;
  isolation:isolate;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-end;
  min-height:clamp(320px, 56svh, 560px);
  padding:calc(24px + env(safe-area-inset-top, 0px)) 0 0;
  text-align:center;
}
.hero-art{position:absolute; inset:0; z-index:-1; pointer-events:none; background:var(--hero-back) 50% 100% / cover no-repeat;}
.hero-art.back{-webkit-mask-image:linear-gradient(to bottom, #000 0, rgba(0,0,0,1.000) 62%, rgba(0,0,0,0.926) 66.2%, rgba(0,0,0,0.847) 70.5%, rgba(0,0,0,0.758) 74.8%, rgba(0,0,0,0.656) 79%, rgba(0,0,0,0.535) 83.2%, rgba(0,0,0,0.390) 87.5%, rgba(0,0,0,0.214) 91.8%, rgba(0,0,0,0.000) 96%); mask-image:linear-gradient(to bottom, #000 0, rgba(0,0,0,1.000) 62%, rgba(0,0,0,0.926) 66.2%, rgba(0,0,0,0.847) 70.5%, rgba(0,0,0,0.758) 74.8%, rgba(0,0,0,0.656) 79%, rgba(0,0,0,0.535) 83.2%, rgba(0,0,0,0.390) 87.5%, rgba(0,0,0,0.214) 91.8%, rgba(0,0,0,0.000) 96%);}
.hero-art.front{background-image:var(--hero-front);}
/* pond ripples: hand-drawn rings, each its own composited layer, animated smoothly (not frame-stepped) */
.hero-rip{position:absolute; inset:0; z-index:-1; pointer-events:none; overflow:hidden; container-type:size;}
.hero-rip .rip{
  --s:max(100cqw / 1200, 100cqh / 640);   /* same mapping as the header art: cover, anchored bottom-center */
  position:absolute; left:calc(50cqw + (var(--x) - 600) * var(--s)); top:calc(100cqh - (640 - var(--y)) * var(--s));
  width:calc(var(--w) * var(--s)); height:calc(var(--h) * var(--s)); margin:calc(var(--h) * var(--s) / -2) 0 0 calc(var(--w) * var(--s) / -2);
  opacity:0; will-change:transform, opacity; animation:rip 3.6s linear infinite;
}
.hero-rip svg{display:block; width:100%; height:100%; overflow:visible;}
.hero-rip path{fill:none; stroke:var(--ripple); stroke-width:1.7; vector-effect:non-scaling-stroke;}
@media (max-width:899px){.hero-rip path{stroke-width:2.1;}}
@keyframes rip{
  0%{transform:scale(.26); opacity:0; animation-timing-function:cubic-bezier(.2,.6,.35,1);}
  14%{opacity:.85;}
  100%{transform:scale(1); opacity:0;}
}
.sun-img{aspect-ratio:1 / 1; background:var(--sun-img) center / contain no-repeat;}
.sun{display:block; width:clamp(120px, 30vw, 200px); height:auto; margin:0 auto clamp(14px, 3vh, 28px); overflow:visible;}


.logo{
  position:relative;
  margin:0 0 5vh;
  display:flex;
  justify-content:center;
  font-family:'Fraunces', Georgia, serif;
  font-weight:900;
  font-variation-settings:"SOFT" 100, "WONK" 1, "opsz" 144;
  font-size:clamp(56px, 18.5vw, 176px);
  line-height:1;
  letter-spacing:-.025em;
}
.logo .l{
  position:relative;
  display:inline-block;
}
.logo .l{
  --paint:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1000' height='1000'><filter id='t' x='0' y='0' width='100%25' height='100%25'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' seed='4' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 .97  0 0 0 0 .88  0 0 0 3 -2.25'/></filter><rect width='100%25' height='100%25' filter='url(%23t)'/></svg>"),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1100' height='1100'><filter id='t' x='0' y='0' width='100%25' height='100%25'><feTurbulence type='fractalNoise' baseFrequency='0.009 0.034' numOctaves='4' seed='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 .97  0 0 0 0 .88  0 0 0 1.1 -.5'/></filter><rect width='100%25' height='100%25' filter='url(%23t)'/></svg>"),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1100' height='1100'><filter id='t' x='0' y='0' width='100%25' height='100%25'><feTurbulence type='fractalNoise' baseFrequency='0.008 0.03' numOctaves='4' seed='8' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .18  0 0 0 0 .09  0 0 0 0 .03  0 0 0 -1.1 .5'/></filter><rect width='100%25' height='100%25' filter='url(%23t)'/></svg>"),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1200' height='1200'><filter id='t' x='0' y='0' width='100%25' height='100%25'><feTurbulence type='fractalNoise' baseFrequency='0.011' numOctaves='3' seed='21' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .18  0 0 0 0 .09  0 0 0 0 .03  0 0 0 -1.3 .62'/></filter><rect width='100%25' height='100%25' filter='url(%23t)'/></svg>"),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1200' height='1200'><filter id='t' x='0' y='0' width='100%25' height='100%25'><feTurbulence type='fractalNoise' baseFrequency='0.013' numOctaves='3' seed='33' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 .97  0 0 0 0 .88  0 0 0 1.2 -.56'/></filter><rect width='100%25' height='100%25' filter='url(%23t)'/></svg>"),
    linear-gradient(172deg, var(--c1) 0%, var(--c2) 52%, var(--c3) 100%);
}
.logo .a{--c1:var(--logo-a1); --c2:var(--logo-a2); --c3:var(--logo-a3);}
.logo .g{--c1:var(--logo-f1); --c2:var(--logo-f2); --c3:var(--logo-f3);}
.logo .f{
  display:inline-block;
  padding:0 .02em;
  color:transparent;
  -webkit-background-clip:text;
  background-clip:text;
  background-image:var(--paint);
  background-size:1000px 1000px, 1100px 1100px, 1100px 1100px, 1200px 1200px, 1200px 1200px, 100% 100%;
  background-position:calc(var(--i) * -97px) 0, calc(var(--i) * -97px) 0, calc(var(--i) * -97px) 0, calc(var(--i) * -97px) 0, calc(var(--i) * -97px) 0, 0 0;
}

.fo-fill{
  position:absolute;
  inset:0;
  background-image:var(--paint);
  background-size:1000px 1000px, 1100px 1100px, 1100px 1100px, 1200px 1200px, 1200px 1200px, 100% 100%;
  background-position:calc(var(--i) * -97px) 0, calc(var(--i) * -97px) 0, calc(var(--i) * -97px) 0, calc(var(--i) * -97px) 0, calc(var(--i) * -97px) 0, 0 0;
  filter:brightness(var(--fo-lift, 1.22));
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 58 100' preserveAspectRatio='none'><path d='M3.5 64 C3 55 5 49 7 46 C4.5 38 9 31.5 15 31.5 C21 31.5 25.5 36 25.5 42.5 C27.8 43.3 30.2 43.3 32.5 42.5 C32.5 36 37 31.5 43 31.5 C49 31.5 53.5 38 51 46 C53 49 55 55 54.5 64 C55 77 46 86 29 86 C12 86 3 77 3.5 64Z'/></svg>") center / 100% 100% no-repeat;
  mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 58 100' preserveAspectRatio='none'><path d='M3.5 64 C3 55 5 49 7 46 C4.5 38 9 31.5 15 31.5 C21 31.5 25.5 36 25.5 42.5 C27.8 43.3 30.2 43.3 32.5 42.5 C32.5 36 37 31.5 43 31.5 C49 31.5 53.5 38 51 46 C53 49 55 55 54.5 64 C55 77 46 86 29 86 C12 86 3 77 3.5 64Z'/></svg>") center / 100% 100% no-repeat;
}
.fo-ink{position:absolute; inset:0; width:100%; height:100%; overflow:visible;}
.fo-ink .ln{fill:none; stroke:var(--outline); stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round;}
.fo-ink .dot{fill:#2a211a;}
.fo-ink .eye{fill:#fffaf0; stroke:var(--outline); stroke-width:1.5;}
.fo-ink .shine{fill:#fffaf0;}
.fo-ink .cheek{fill:var(--coral); opacity:.35;}
.fo-ink .lid{fill:var(--logo-f1); stroke:var(--outline); stroke-width:1.5; stroke-linejoin:round; vector-effect:non-scaling-stroke;
  transform-box:fill-box; transform-origin:50% 0; animation:fo-blink 7s ease-in-out infinite;}
.fo-ink .pupils{animation:fo-look 7s ease-in-out infinite;}
@keyframes fo-look{0%,28%{transform:translateX(3px);} 38%,64%{transform:translateX(-3px);} 74%,100%{transform:translateX(3px);}}
@keyframes fo-blink{0%,82%,88%,92%,100%{transform:scaleY(1);} 85%,90%{transform:scaleY(1.9);}}
.fo-ink .cig{fill:none; stroke:#f4ecdf; stroke-width:2.6;}
.fo-ink .ember{fill:none; stroke:#e0603a; stroke-width:2.6;}
.fo-ink .hatband{fill:none; stroke:var(--fo-accent); stroke-width:2.2;}
.fo-ink .bow{fill:#1d1813; stroke:var(--outline); stroke-width:1.1; stroke-linejoin:round;}
.fo-ink .knot{fill:#2e2620; stroke:var(--outline); stroke-width:1;}
.fo-ink .crease{fill:none; stroke:var(--fo-accent); stroke-width:.9; stroke-linecap:round;}
.fo-ink .bowtie{transform-box:fill-box; transform-origin:50% 50%; animation:bowtie 3.4s ease-in-out infinite alternate;}
@keyframes bowtie{from{transform:rotate(-5deg);} to{transform:rotate(5deg);}}
.fo-ink .hat{fill:#2a211a; stroke:var(--outline); stroke-width:1.3; stroke-linejoin:round;}
.fo-ink .bagshade{fill:#5b4a7a; opacity:.28;}
.fo-ink .bag{fill:none; stroke:var(--outline); stroke-width:1.1; stroke-linecap:round; opacity:.75;}
.fo-ink .puff{fill:none; stroke:var(--pencil); stroke-width:.9; opacity:0; transform-box:fill-box; transform-origin:50% 50%; animation:fo-puff 4.2s ease-out infinite;}
@keyframes fo-puff{0%{transform:translate(0,0) scale(.5); opacity:0;} 12%{opacity:.75;}
  50%{transform:translate(calc(var(--dx) * .35 - 1.5px), calc(var(--dy) * .5)) scale(calc(var(--s) * .6));}
  100%{transform:translate(var(--dx), var(--dy)) scale(var(--s)); opacity:0;}}
.fo-ink .cigarette{animation:fo-cig 3.6s ease-in-out infinite;}
@keyframes fo-cig{0%,100%{transform:translateY(0) rotate(0);} 30%{transform:translateY(-.6px) rotate(-2deg);} 55%{transform:translateY(.4px) rotate(1deg);}}
.fo-ink .cigarette{transform-box:fill-box; transform-origin:0 50%;}
.fo-ink .glow{fill:url(#ember-glow); opacity:.12; animation:fo-ember 3.6s ease-in-out infinite;}
.fo-ink .ember{animation:fo-ember-c 3.6s ease-in-out infinite;}
@keyframes fo-ember{0%,100%{opacity:.12;} 25%,35%{opacity:.85;}}
@keyframes fo-ember-c{0%,100%{stroke:#c9502f;} 25%,35%{stroke:#ffb36b;}}

/* --tz is set by site.js when a browser enlarges the letters but not the drawings (e.g. Instagram's in-app
   browser with a bigger phone font size), so the outlines and the frog grow with the letters. */
.logo .fo{width:calc(.58em * var(--tz, 1)); height:calc(1em * var(--tz, 1));}
.logo .ol{position:absolute; left:calc(.02em * var(--tz, 1)); top:0; height:1em; overflow:visible; pointer-events:none; transform-origin:0 0; transform:scale(var(--tz, 1)) translate(-.035em, -.025em);}
.logo .ol path{fill:none; stroke:var(--outline); stroke-opacity:.85; stroke-width:max(1.5px, .018em); vector-effect:non-scaling-stroke; stroke-linejoin:round; stroke-linecap:round;}
.logo-swash{
  position:absolute;
  left:50%;
  bottom:-.3em;
  width:min(118%, 92vw);
  height:.48em;
  transform:translateX(-50%);
  z-index:-1;
  overflow:visible;
}

.lede{
  position:relative;
  margin:0;
  padding:0 8px;
  font-family:'Grandstander', 'Segoe Print', cursive;
  font-weight:800;
  font-variation-settings:normal;
  font-size:clamp(23px, 6vw, 36px);
  line-height:1.3;
  letter-spacing:0;
  color:var(--lede-2);
  --c1:var(--lede-1); --c2:var(--lede-2); --c3:var(--lede-3); --ca:var(--lede-mint); --cb:var(--lede-sky);
  text-wrap:balance;
}
.lede-fill, .pfill{
  color:transparent;
  -webkit-background-clip:text;
  background-clip:text;
  background-image:var(--paint-light);
  background-size:1100px 1100px, 1100px 1100px, 1200px 1200px, 1200px 1200px, 100% 100%, 100% 100%, 100% 100%, 100% 100%;
  -webkit-box-decoration-break:clone;
  box-decoration-break:clone;
}
.lede::after, .ptitle::after{
  content:attr(data-text);
  position:absolute;
  inset:0;
  padding:inherit;
  color:transparent;
  -webkit-text-stroke:max(1.2px, .03em) var(--outline);
  opacity:.85;
  transform:translate(-.035em, -.025em);
  pointer-events:none;
}
.lede, .ptitle{
  --paint-light:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1100' height='1100'><filter id='t' x='0' y='0' width='100%25' height='100%25'><feTurbulence type='fractalNoise' baseFrequency='0.009 0.034' numOctaves='4' seed='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 .97  0 0 0 0 .88  0 0 0 1.1 -.5'/></filter><rect width='100%25' height='100%25' filter='url(%23t)'/></svg>"),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1100' height='1100'><filter id='t' x='0' y='0' width='100%25' height='100%25'><feTurbulence type='fractalNoise' baseFrequency='0.008 0.03' numOctaves='4' seed='8' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .18  0 0 0 0 .09  0 0 0 0 .03  0 0 0 -1.1 .5'/></filter><rect width='100%25' height='100%25' filter='url(%23t)'/></svg>"),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1200' height='1200'><filter id='t' x='0' y='0' width='100%25' height='100%25'><feTurbulence type='fractalNoise' baseFrequency='0.011' numOctaves='3' seed='21' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .18  0 0 0 0 .09  0 0 0 0 .03  0 0 0 -1.3 .62'/></filter><rect width='100%25' height='100%25' filter='url(%23t)'/></svg>"),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1200' height='1200'><filter id='t' x='0' y='0' width='100%25' height='100%25'><feTurbulence type='fractalNoise' baseFrequency='0.013' numOctaves='3' seed='33' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 .97  0 0 0 0 .88  0 0 0 1.2 -.56'/></filter><rect width='100%25' height='100%25' filter='url(%23t)'/></svg>"),
    radial-gradient(38% 140% at 18% 40%, var(--ca), transparent 70%),
    radial-gradient(34% 140% at 58% 60%, var(--cb), transparent 70%),
    radial-gradient(30% 140% at 88% 35%, var(--ca), transparent 70%),
    linear-gradient(175deg, var(--c1) 0%, var(--c2) 60%, var(--c3) 100%);
}
.ptitle{
  position:relative;
  font-family:'Grandstander', 'Segoe Print', cursive !important;
  font-weight:800 !important;
  font-variation-settings:normal !important;
  letter-spacing:0 !important;
  color:var(--c2);
}
/* lede + Official Links title: one flat blue, outline kept */
.socials h2.t-lede{font-size:clamp(23px, 6vw, 36px);}
.lede .lede-fill, .t-lede .pfill{color:var(--lede-solid); background:none; -webkit-background-clip:border-box; background-clip:border-box;}
.t-lede{--c1:var(--lede-1); --c2:var(--lede-2); --c3:var(--lede-3); --ca:var(--lede-mint); --cb:var(--lede-sky);}
.lede-arrow{display:block; width:44px; height:48px; margin:calc(6px + 1vh) auto 8px; overflow:visible;}
.lede-arrow{position:relative;}
.lede-arrow svg{position:absolute; inset:0; width:100%; height:100%; overflow:visible;}

.paths{
  list-style:none;
  margin:28px auto 0;
  padding:0;
  display:grid;
  gap:26px;
  max-width:560px;
}
.paths > li{display:flex;}
.card{
  position:relative;
  isolation:isolate;
  display:flex;
  flex-direction:column;
  width:100%;
  padding:16px 20px 22px;
  color:var(--ink);
  text-decoration:none;
  background:var(--card);
  border-radius:22px 8px 26px 10px / 10px 24px 8px 22px;
  box-shadow:var(--shadow);
  transition:transform .45s cubic-bezier(.34,1.56,.64,1), box-shadow .3s ease;
  -webkit-tap-highlight-color:transparent;
}
.card::before{
  content:"";
  position:absolute;
  inset:-3px -4px -4px -3px;
  pointer-events:none;
  background:var(--card-ol) center / 100% 100% no-repeat;
}
.card:hover{transform:translateY(-6px) rotate(-.7deg);}
.paths > li:nth-child(2) .card:hover{transform:translateY(-6px) rotate(.6deg);}
.card:active{transform:translateY(-1px) scale(.985);}
.card:focus-visible{outline-offset:8px; border-radius:22px;}

.card .art{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:200 / 140;
  max-height:180px;
  margin:0 auto 4px;
  overflow:visible;
  transform-origin:50% 90%;
}
.card:hover .art{animation:boing .7s cubic-bezier(.34,1.56,.64,1);}
@keyframes boing{
  0%{transform:scale(1,1);}
  25%{transform:scale(1.07,.9);}
  50%{transform:scale(.95,1.08) translateY(-6px);}
  75%{transform:scale(1.02,.98);}
  100%{transform:scale(1,1);}
}
.card .kicker{
  position:absolute;
  top:14px;
  left:18px;
  z-index:1;
  font-family:'Caveat', cursive;
  font-size:21px;
  font-weight:700;
  line-height:1;
  color:var(--muted);
}
.card h2, .card h3{
  margin:4px 0 8px;
  font-family:'Shantell Sans', 'Segoe Print', system-ui, sans-serif;
  font-weight:700;
  font-variation-settings:"INFM" 55, "BNCE" 35;
  font-size:23px;
  line-height:1.25;
  letter-spacing:0;
  color:var(--card-head);
}
.card p{margin:0 0 18px; color:var(--card-text); font-size:17px;}
.card .go{
  margin-top:auto;
  align-self:flex-end;
  justify-self:end;
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  padding:10px 22px;
  font-weight:700;
  font-size:16.5px;
  line-height:1.2;
  color:#2a211a;
  background:var(--hl, var(--ochre));
  filter:brightness(1.1) saturate(1.05);
  border-radius:255px 16px 225px 16px / 16px 225px 16px 255px;
  box-shadow:0 3px 0 rgba(40,30,15,.25);
  transition:transform .3s cubic-bezier(.34,1.56,.64,1), filter .2s ease;
}
.card .go::after{
  content:"";
  position:absolute;
  inset:-4px -3px -3px -5px;
  border:1.6px solid var(--pencil);
  border-radius:16px 225px 16px 255px / 255px 16px 225px 16px;
  opacity:.6;
  pointer-events:none;
}
.card:hover .go, .card:focus-visible .go{transform:translateY(-2px) rotate(-1.5deg); filter:brightness(.97) saturate(1.1);}
.card:active .go{transform:translateY(1px);}

.news{
  position:relative;
  isolation:isolate;
  width:calc(100vw - var(--sbw, 0px));
  max-width:none;
  margin:84px 0 0 calc(50% - 50vw + var(--sbw, 0px) / 2);
  padding:46px 22px 40px;
  text-align:center;
}
.news-wash{position:absolute; inset:0; width:100%; height:100%; z-index:-1; overflow:visible;}
.news .kicker{
  display:block;
  font-family:'Caveat', cursive;
  font-weight:700;
  font-size:24px;
  line-height:1;
  color:var(--link);
  transform:rotate(-3deg);
}
.news h2{
  margin:8px auto 6px;
  max-width:52ch;
  font-family:'Shantell Sans', 'Segoe Print', system-ui, sans-serif;
  font-weight:700;
  font-variation-settings:"INFM" 55, "BNCE" 35;
  font-size:clamp(19px, 4.6vw, 23px);
  line-height:1.4;
  letter-spacing:0;
  text-wrap:balance;
}
.news h2 .line{display:block;}
.news h2 .l1{font-size:clamp(24px, 6.2vw, 31px); line-height:1.15; color:var(--btn-bg);}
.news h2 .l2{margin-top:6px; font-size:clamp(17px, 4.2vw, 20px); font-weight:600; color:var(--ink-soft);}
@media (min-width: 600px){ .news h2 .line{white-space:nowrap;} }
.news > p{margin:0 auto; max-width:40ch; color:var(--ink-soft);}
.news form{max-width:500px; margin:22px auto 0;}
.news .fine{margin-top:12px; font-size:15px; color:var(--muted);}
.news .done{
  margin:22px auto 0;
  font-family:'Caveat', cursive;
  font-weight:700;
  font-size:28px;
  color:var(--link);
}
.news .done:empty{display:none;}

.socials{margin:72px auto 0; text-align:center;}
.socials h2{
  margin:0 0 18px;
  font-family:'Grandstander', 'Segoe Print', cursive;
  font-weight:800;
  font-size:clamp(23px, 6vw, 32px);
  line-height:1.1;
  color:var(--ink);
}
.socials ul{
  list-style:none;
  margin:0 auto;
  padding:0;
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:6px 4px;
  max-width:360px;
}
.socials li{flex:0 0 78px; min-width:0;}
.socials a{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:6px;
  padding:10px 4px;
  min-height:44px;
  font-size:14px;
  font-weight:600;
  color:var(--ink-soft);
  text-decoration:none;
  border-radius:16px;
  -webkit-tap-highlight-color:transparent;
}
.socials .blob{
  position:relative;
  display:grid;
  place-items:center;
  width:54px;
  height:54px;
  transition:transform .35s cubic-bezier(.34,1.56,.64,1);
}
.socials .blob::before{
  content:"";
  position:absolute;
  inset:0;
  background:var(--w);
  opacity:1;
  border-radius:58% 42% 52% 48% / 45% 55% 45% 55%;
  transition:opacity .2s ease;
}
.socials .blob::after{
  content:"";
  position:absolute;
  inset:-2px 1px 2px -1px;
  border:1.4px solid var(--pencil);
  border-radius:45% 55% 48% 52% / 55% 48% 52% 45%;
  opacity:.5;
}
.socials a[href*="instagram"] .blob{--w:radial-gradient(circle at 30% 107%, #f8e3a6 0%, #f4b19f 40%, #e4a6cf 65%, #b3b3ea 95%);}
.socials a[href*="x.com"] .blob{--w:linear-gradient(135deg, #d0d6de 0%, #b5bdc9 100%);}
.socials a[href*="tiktok"] .blob{--w:linear-gradient(135deg, #a8e4e6 0%, #d8d4d6 50%, #f3b3c3 100%);}
.socials a[href^="mailto:"] .blob{--w:#c9e0b4;}
.socials .blob{--i-ink:#4a3c2f;}
.socials .blob > .grain{position:absolute; inset:0; border-radius:58% 42% 52% 48% / 45% 55% 45% 55%; pointer-events:none; opacity:.35; mix-blend-mode:overlay;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='120' height='120'><filter id='g'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/></filter><rect width='100%25' height='100%25' filter='url(%23g)'/></svg>");}
.sico{position:relative; width:27px; height:27px; overflow:visible;}
.sico path, .sico circle{fill:none; stroke:var(--i-ink); stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round;}
.sico .dot{fill:var(--i-ink); stroke:none;}
.socials a:hover{color:var(--ink);}
.socials a:hover .blob{transform:rotate(-10deg) scale(1.1);}
.socials a:hover .blob::before{filter:brightness(1.05);}

.foot{
  margin:64px auto 0;
  padding:0 0 36px;
  text-align:center;
  font-size:15px;
  color:var(--muted);
}
.foot .sig{
  display:block;
  font-family:'Caveat', cursive;
  font-weight:700;
  font-size:30px;
  line-height:1.1;
  color:var(--ink);
}

.form{display:flex; flex-direction:column; gap:18px;}
.field{display:flex; flex-direction:column; gap:6px;}
.field label, legend{
  font-weight:700;
  font-size:16px;
  color:var(--ink);
}
.count{align-self:flex-end; margin-top:-2px; font-size:13px; color:var(--muted); font-variant-numeric:tabular-nums;}
.count.near{color:var(--err); font-weight:700;}
.opt{font-weight:400; font-style:italic; color:var(--muted); font-size:14px;}
.req{color:var(--err);}
input:not([type="checkbox"]):not([type="radio"]), select, textarea{
  width:100%;
  min-height:52px;
  padding:12px 16px;
  font:17px/1.4 'Shantell Sans', 'Segoe Print', system-ui, sans-serif;
  color:var(--ink);
  background-color:var(--field);
  border:2px solid var(--line);
  border-radius:14px 18px 12px 20px / 18px 12px 20px 14px;
  transition:border-color .15s ease, box-shadow .15s ease;
  -webkit-appearance:none;
  appearance:none;
}
select{
  padding-right:44px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 9 C9 13 10 14 12 16 C14 13 16 12 19 8' fill='none' stroke='%237a6856' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 14px center;
  background-size:20px;
  cursor:pointer;
}
input:not([type="checkbox"]):not([type="radio"]):hover, select:hover, textarea:hover{border-color:var(--pencil);}
input:not([type="checkbox"]):not([type="radio"]):focus, select:focus, textarea:focus{
  outline:none;
  border-color:var(--frog);
  box-shadow:0 0 0 4px color-mix(in srgb, var(--ochre) 40%, transparent);
}
input[aria-invalid="true"], select[aria-invalid="true"], textarea[aria-invalid="true"]{border-color:var(--err);}
textarea{min-height:130px; max-height:420px; resize:vertical; line-height:1.5;}
input::placeholder, textarea::placeholder{color:var(--muted); opacity:.85;}
input[type="date"]{min-width:0;}
.row{display:flex; flex-wrap:wrap; gap:12px;}
.row input{flex:1 1 220px; min-width:0;}
.row .btn{flex:1 0 auto;}
.hp{position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden;}
.ts{margin-top:12px;}
.ts:empty{display:none;}
.form-error{margin:12px 0 0; font-weight:700; color:var(--err);}
.form-error:empty{display:none;}

fieldset{border:0; margin:0; padding:0; min-width:0;}
legend{padding:0; margin-bottom:4px;}
.choices{display:flex; flex-direction:column;}
.choices.two{display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); column-gap:12px;}
.choice{
  display:flex;
  align-items:center;
  gap:10px;
  min-height:44px;
  font-size:16px;
  line-height:1.3;
  color:var(--ink-soft);
  cursor:pointer;
}
.choice input{width:22px; height:22px; margin:0; flex-shrink:0; accent-color:var(--frog);}
fieldset[aria-invalid="true"] legend{color:var(--err);}

/* date picker (forms.js swaps it in for input[type="date"]) */
.dp{position:relative;}
.dp-toggle{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  width:100%;
  min-height:52px;
  padding:12px 14px 12px 16px;
  font:17px/1.4 'Shantell Sans', 'Segoe Print', system-ui, sans-serif;
  color:var(--ink);
  text-align:left;
  background:var(--field);
  border:2px solid var(--line);
  border-radius:14px 18px 12px 20px / 18px 12px 20px 14px;
  cursor:pointer;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.dp-toggle:hover{border-color:var(--pencil);}
.dp-toggle:focus-visible, .dp-toggle[aria-expanded="true"]{
  outline:none;
  border-color:var(--frog);
  box-shadow:0 0 0 4px color-mix(in srgb, var(--ochre) 40%, transparent);
}
.dp-toggle[aria-invalid="true"]{border-color:var(--err);}
.dp-value.empty{color:var(--muted);}
.dp-toggle svg{width:24px; height:24px; flex-shrink:0; color:var(--muted);}
.dp-pop{
  position:absolute;
  top:calc(100% + 10px);
  left:0;
  z-index:30;
  width:100%;
  padding:14px 14px 10px;
  background:var(--card);
  border:2px solid var(--line);
  border-radius:20px 12px 22px 14px / 14px 20px 12px 22px;
  box-shadow:var(--shadow), 0 24px 40px -20px rgba(40,30,15,.45);
  animation:dp-in .18s cubic-bezier(.34,1.56,.64,1);
  transform-origin:24px 0;
}
.dp-pop[hidden]{display:none;}
@keyframes dp-in{from{opacity:0; transform:translateY(-6px) scale(.96);}}
.dp-head{display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:8px;}
.dp-month{font-family:'Caveat', cursive; font-weight:700; font-size:26px; line-height:1; color:var(--ink);}
.dp-nav, .dp-day, .dp-clear{
  font:inherit;
  color:var(--ink);
  background:none;
  border:0;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.dp-nav{
  display:grid;
  place-items:center;
  width:40px;
  height:40px;
  border-radius:50% 45% 52% 48% / 48% 52% 45% 50%;
  transition:background-color .15s ease, transform .2s cubic-bezier(.34,1.56,.64,1);
}
.dp-nav svg{width:24px; height:16px;}
.dp-nav.next svg{transform:scaleX(-1);}
.dp-nav:hover:not(:disabled){background:color-mix(in srgb, var(--sage) 28%, transparent); transform:scale(1.08);}
.dp-nav:disabled{opacity:.3; cursor:default;}
.dp-grid{display:grid; grid-template-columns:repeat(7, minmax(0, 1fr)); gap:2px;}
.dp-wd{
  padding:4px 0 6px;
  font-size:13px;
  font-weight:700;
  text-align:center;
  color:var(--muted);
}
.dp-day{
  justify-self:center;
  width:min(44px, 100%);
  height:44px;
  font-size:15px;
  border-radius:48% 52% 45% 55% / 52% 46% 54% 48%;
  transition:background-color .15s ease, transform .2s cubic-bezier(.34,1.56,.64,1);
}
.dp-day:hover:not(:disabled){background:color-mix(in srgb, var(--sage) 30%, transparent); transform:scale(1.08);}
.dp-day:focus-visible, .dp-nav:focus-visible, .dp-clear:focus-visible{outline:2.5px solid var(--frog); outline-offset:1px;}
.dp-day.today{font-weight:800; box-shadow:inset 0 0 0 1.6px var(--pencil);}
.dp-day[aria-pressed="true"]{
  font-weight:800;
  color:var(--btn-ink);
  background:var(--btn-bg);
  box-shadow:0 2px 0 rgba(40,30,15,.25);
  transform:rotate(-4deg);
}
.dp-day:disabled{color:var(--muted); opacity:.4; cursor:default;}
.dp-foot{display:flex; justify-content:flex-end; margin-top:6px;}
.dp-clear{
  min-height:40px;
  padding:0 10px;
  font-size:15px;
  font-weight:700;
  color:var(--link);
  border-radius:10px;
}
.dp-clear:hover{text-decoration:underline; text-underline-offset:3px;}

/* custom selects (forms.js) reuse the date picker's field and popup */
.dp-native{position:absolute; inset:0; height:100%; opacity:0; pointer-events:none;}
.dp-toggle.sel svg{width:20px; height:20px; transition:transform .2s ease;}
.dp-toggle.sel[aria-expanded="true"] svg{transform:rotate(180deg);}
.dp-pop.sel{padding:8px;}
.dp-list{list-style:none; margin:0; padding:0; max-height:300px; overflow-y:auto;}
.dp-list:focus{outline:none;}
.dp-opt{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  min-height:46px;
  padding:8px 12px;
  font-size:17px;
  color:var(--ink);
  border-radius:12px 16px 10px 18px / 16px 10px 18px 12px;
  cursor:pointer;
}
.dp-opt.active{background:color-mix(in srgb, var(--sage) 30%, transparent);}
.dp-opt svg{width:22px; height:22px; flex-shrink:0; color:var(--frog); visibility:hidden;}
.dp-opt[aria-selected="true"]{font-weight:800;}
.dp-opt[aria-selected="true"] svg{visibility:visible;}
@media (prefers-reduced-motion: reduce){ .dp-pop{animation:none;} .dp-day, .dp-nav, .dp-toggle.sel svg{transition:none;} }

.subhead{
  display:flex;
  align-items:center;
  min-height:72px;
  padding-top:calc(12px + env(safe-area-inset-top, 0px));
  padding-right:60px;
}
.back{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:48px;
  padding:0 14px 0 4px;
  font-weight:800;
  color:var(--ink);
  text-decoration:none;
}
.back svg{width:30px; height:20px; overflow:visible;}
.back:hover{color:var(--link);}
.page-head{position:relative; padding:18px 0 4px;}
.page-head .kicker{
  display:block;
  font-family:'Caveat', cursive;
  font-weight:700;
  font-size:24px;
  line-height:1;
  color:var(--link);
}
.page-title{
  margin:6px 0 0;
  font-family:'Shantell Sans', 'Segoe Print', system-ui, sans-serif;
  font-weight:700;
  font-variation-settings:"INFM" 55, "BNCE" 35;
  font-size:clamp(32px, 8.5vw, 52px);
  line-height:1.12;
  letter-spacing:0;
  text-wrap:balance;
}
.page-intro{
  margin:16px 0 0;
  max-width:44ch;
  font-size:18.5px;
  color:var(--ink-soft);
}

.choose{
  list-style:none;
  margin:30px 0 0;
  padding:0;
  display:grid;
  gap:26px;
}
.choose > li{display:flex;}
.direct{max-width:420px; margin:56px auto 48px; text-align:center;}
.direct p{margin:0 0 12px; font-size:17.5px; color:var(--ink-soft);}
.copy-box{
  display:flex; align-items:center; gap:10px;
  padding:6px 6px 6px 18px;
  background:var(--field);
  border:2px solid var(--line);
  border-radius:14px 18px 12px 20px / 18px 12px 20px 14px;
}
.copy-text{flex:1; min-width:0; text-align:left; font-size:17px; font-weight:600; color:var(--ink); overflow-wrap:anywhere; user-select:all;}
.copy-btn.btn{flex-shrink:0; min-height:44px; min-width:92px; padding:8px 18px; font-size:15.5px; color:#2a211a; background:var(--ochre);}
.copy-btn.btn:hover{background:var(--ochre); filter:brightness(1.06);}

.scenes{display:flex; flex-direction:column; gap:22px; margin-top:28px;}
.scene-card{
  position:relative;
  padding:22px 18px 24px;
  background:var(--card);
  border-radius:22px 10px 24px 12px / 12px 22px 10px 24px;
  box-shadow:var(--shadow);
}
.scene-card::before{
  content:"";
  position:absolute;
  inset:-2px;
  border:1.5px solid var(--pencil);
  border-radius:20px 12px 22px 14px / 14px 20px 12px 22px;
  opacity:.45;
  pointer-events:none;
}
.scene-card .kicker{
  display:block;
  font-family:'Caveat', cursive;
  font-weight:700;
  font-size:21px;
  line-height:1;
  color:var(--muted);
}
.scene-card h2{
  margin:4px 0 16px;
  font-family:'Shantell Sans', 'Segoe Print', system-ui, sans-serif;
  font-weight:700;
  font-variation-settings:"INFM" 55, "BNCE" 35;
  font-size:23px;
  line-height:1.25;
}
.lost{display:flex; flex-direction:column; align-items:center; text-align:center; padding:6vh 0 10px;}
.lost-art{position:relative; width:min(400px, 94%); aspect-ratio:300 / 190;}
.lost-art svg{position:absolute; inset:0; width:100%; height:100%; overflow:visible;}
.lost .kicker{margin-top:6px; font-family:'Caveat', cursive; font-weight:700; font-size:24px; color:var(--link);}
.lost .page-intro{margin:14px auto 0;}
.lost .btn{margin-top:28px;}
.lost-prints{fill:var(--pencil); stroke:var(--pencil); stroke-width:1.3; stroke-linecap:round;}
/* a walk: one footprint at a time, left and right taking turns, each fading a moment later in the same order;
   after the last step a short pause, then it walks off again */
.lost-step{opacity:0; animation:lost-step 5.6s linear infinite; animation-delay:calc(var(--n) * .32s);}
@keyframes lost-step{0%, 26%{opacity:.6;} 32%, 100%{opacity:0;}}
@media (prefers-reduced-motion: reduce){ .lost-step{opacity:.6;} }
/* the cigarette left on the pad: the same stick, ember, glow and smoke as the home page frog's */
.lost-cig path{fill:none; stroke-width:3.2;}
.lost-cig .cig{stroke:#f4ecdf;}
.lost-cig .ember{stroke:#e0603a; animation:fo-ember-c 3.6s ease-in-out infinite;}
.lost-glow{fill:url(#lost-glow); opacity:.12; animation:fo-ember 3.6s ease-in-out infinite;}
.lost-puff{fill:none; stroke:var(--pencil); stroke-width:1.1; opacity:0; transform-box:fill-box; transform-origin:50% 50%; animation:fo-puff 4.2s ease-out infinite;}
.after-link{margin:26px 0 0; text-align:center; font-weight:700;}
.after-link a{display:inline-flex; align-items:center; min-height:44px;}
.sent{margin-top:28px;}
.sent h2{color:var(--link);}
.sent p{margin:0 0 20px; color:var(--ink-soft);}

.learn-block{margin-top:44px;}
.learn-block > h2{
  margin:0 0 18px;
  font-family:'Shantell Sans', 'Segoe Print', system-ui, sans-serif;
  font-weight:700;
  font-variation-settings:"INFM" 55, "BNCE" 35;
  font-size:clamp(24px, 6vw, 31px);
  line-height:1.2;
}
.gets{list-style:none; margin:0; padding:0; display:grid; gap:14px;}
.gets li{
  position:relative;
  padding:16px 18px 16px 64px;
  background:var(--card);
  border-radius:18px 8px 20px 10px / 10px 18px 8px 20px;
  box-shadow:var(--shadow);
}
.gets li::before{
  content:"";
  position:absolute;
  left:16px;
  top:16px;
  width:34px;
  height:34px;
  background:var(--w, var(--ochre));
  opacity:.6;
  border-radius:58% 42% 52% 48% / 45% 55% 45% 55%;
}
.gets li:nth-child(3n+2){--w:var(--sage);}
.gets li:nth-child(3n+3){--w:var(--rose);}
.gets li svg{position:absolute; left:20px; top:18px; width:28px; height:28px; overflow:visible;}
.gets strong{display:block; font-size:17.5px; line-height:1.35;}
.gets span{display:block; margin-top:2px; color:var(--ink-soft); font-size:16px;}
.gets span + span{margin-top:8px;}
.page-intro + .page-intro{margin-top:12px;}
.prose > p{margin:0 0 12px; max-width:60ch; color:var(--ink-soft);}
.steps{list-style:none; margin:0; padding:0; display:grid; gap:18px; counter-reset:s;}
.steps > li{display:grid; grid-template-columns:52px 1fr; gap:14px; align-items:start; counter-increment:s;}
.steps > li::before{
  content:counter(s);
  display:grid;
  place-items:center;
  width:52px;
  height:52px;
  font-family:'Caveat', cursive;
  font-weight:700;
  font-size:30px;
  line-height:1;
  color:var(--ink);
  background:var(--card);
  border:1.8px solid var(--pencil);
  border-radius:52% 48% 55% 45% / 48% 55% 45% 52%;
}
.steps strong{display:block; font-size:17.5px; line-height:1.35; padding-top:4px;}
.steps span{display:block; color:var(--ink-soft);}
.steps.simple > li > div{padding-top:13px; font-size:17.5px; line-height:1.4;}
.book{
  position:relative;
  isolation:isolate;
  margin:84px 0 24px;
  padding:76px 22px 70px;
  text-align:center;
}
/* phones: bleed into the page gutter like the waitlist box on the home page */
@media (max-width: 599px){ .book{margin-left:-16px; margin-right:-16px;} }
.book h2{
  margin:0 0 6px;
  font-family:'Shantell Sans', 'Segoe Print', system-ui, sans-serif;
  font-weight:700;
  font-variation-settings:"INFM" 55, "BNCE" 35;
  font-size:clamp(24px, 6.2vw, 31px);
  line-height:1.15;
  color:var(--btn-bg);
  text-wrap:balance;
}
.book > p{margin:0 auto 22px; max-width:38ch; color:var(--ink-soft);}
.book .pitch{
  margin:6px auto 14px;
  max-width:40ch;
  font-family:'Shantell Sans', 'Segoe Print', system-ui, sans-serif;
  font-weight:600;
  font-size:clamp(17px, 4.2vw, 20px);
  line-height:1.35;
  color:var(--ink-soft);
  text-wrap:balance;
}
.book .avail{margin:0 auto 26px; max-width:40ch; color:var(--ink-soft);}
.book .fine{margin:12px auto 0; max-width:34ch; font-size:15px; color:var(--muted);}
.book .btn{width:100%; max-width:380px;}
@media (min-width: 600px){
  .book{padding-left:64px; padding-right:64px;}
  .book .pitch, .book .avail{max-width:56ch; text-wrap:pretty;}
}

@media (min-width: 600px){
  .wrap{padding-left:max(28px, env(safe-area-inset-left, 0px)); padding-right:max(28px, env(safe-area-inset-right, 0px));}
  .theme-toggle{top:calc(20px + env(safe-area-inset-top, 0px)); right:24px;}
}

@media (min-width: 900px){
  body{font-size:18px;}
  .wrap{padding-left:40px; padding-right:40px;}
  .theme-toggle{top:28px; right:36px;}
  .hero{min-height:clamp(400px, 60vh, 600px);}
  .paths{grid-template-columns:repeat(3, minmax(0, 1fr)); max-width:none; gap:34px;}
  .card{padding:18px 24px 26px;}
  .card p{font-size:17.5px;}
  .socials ul{max-width:none;}
  .news{margin-top:110px;}

  .choose{grid-template-columns:repeat(2, minmax(0, 1fr)); gap:34px; max-width:880px;}
  .page-grid{
    display:grid;
    grid-template-columns:minmax(0, .85fr) minmax(0, 1.15fr);
    gap:72px;
    align-items:start;
  }
  .page-grid .page-head{position:sticky; top:36px; padding-top:40px;}
  .page-grid .scenes, .page-grid .sent{margin-top:58px;}
  .after-link{text-align:left;}
  .direct{margin-left:0; text-align:left;}
  .learn-layout{max-width:880px;}
}

@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .art [filter]{opacity:.92;}
  :root:not([data-theme="light"]) .news-wash [filter]{opacity:.7;}
  :root:not([data-theme="light"]) .socials .blob::before{opacity:1;}
  :root:not([data-theme="light"]) .gets li::before{opacity:.9;}
}
:root[data-theme="dark"] .art [filter]{opacity:.92;}
:root[data-theme="dark"] .news-wash [filter]{opacity:.7;}
:root[data-theme="dark"] .socials .blob::before{opacity:1;}
:root[data-theme="dark"] .gets li::before{opacity:.9;}

.offscreen, .offscreen *, .offscreen *::before, .offscreen *::after{animation-play-state:paused !important;}
.news, .socials, .foot{content-visibility:auto; contain-intrinsic-size:auto 420px;}

@media (hover: none){
  .theme-toggle:hover, .btn:hover, .card:hover, .paths > li:nth-child(2) .card:hover,
  .card:hover .go, .socials a:hover .blob{transform:none;}
  .btn:hover{background:var(--btn-bg); box-shadow:0 3px 0 rgba(40,30,15,.25);}
  .card:hover .art{animation:none;}
  .card:hover .go{filter:brightness(1.1) saturate(1.05);}
  .card:active{transform:translateY(-1px) scale(.985);}
  .btn:active{transform:translateY(1px) scale(.98);}
}
html{-webkit-tap-highlight-color:transparent;}

.loader{
  position:fixed; inset:0; z-index:1000;
  display:grid; place-items:center;
  background:var(--paper);
  transition:opacity .45s ease, visibility .45s;
}
.loader.done{opacity:0; visibility:hidden;}
.loader-art{width:96px; height:96px; overflow:visible;}
.loader .sp{fill:none; stroke:var(--pencil); stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round;
  stroke-dasharray:100; stroke-dashoffset:100; animation:ld-draw 2.4s ease-in-out infinite;}
.loader .ghost{stroke-width:1.2; opacity:.4; animation-delay:.12s;}
.loader .ld-boil{animation:ld-boil .5s steps(1) infinite;}
.loader .ld-turn{transform-origin:50px 50px; animation:ld-turn 6s linear infinite;}
@keyframes ld-draw{0%{stroke-dashoffset:100;} 45%,60%{stroke-dashoffset:0;} 100%{stroke-dashoffset:-100;}}
@keyframes ld-boil{0%{filter:url(#ld-boil-1);} 33.3%{filter:url(#ld-boil-2);} 66.6%{filter:url(#ld-boil-3);}}
@keyframes ld-turn{to{transform:rotate(360deg);}}
@media (prefers-reduced-motion: reduce){ .loader .sp{stroke-dashoffset:0;} }

@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{animation:none !important; transition-duration:.01ms !important;}
}
.wash-paint{filter:url(#wc-soft);}
.book .price{margin:-10px auto 18px; font-size:17px; color:var(--ink-soft);}
.book .price strong{font-size:24px; color:var(--ink);}

/* learn hub: the lesson as one big card */
.card.feature{margin-top:30px;}
.feature .art{max-height:210px; margin-bottom:8px;}
.feature .badge{
  align-self:flex-start;
  font-family:'Caveat', cursive;
  font-weight:700;
  font-size:23px;
  line-height:1;
  color:var(--link);
}
.feature-body{display:flex; flex-direction:column; flex:1;}
.card.feature h2{font-size:clamp(26px, 6.4vw, 34px); margin:6px 0 10px;}
.tags{list-style:none; margin:0 0 22px; padding:0; display:flex; flex-wrap:wrap; gap:8px;}
.tags li{
  padding:6px 12px;
  font-size:15px;
  font-weight:700;
  line-height:1.3;
  color:var(--ink-soft);
  background:var(--field);
  border:1.5px solid var(--line);
  border-radius:255px 14px 225px 14px / 14px 225px 14px 255px;
}
.feature-foot{margin-top:auto; display:flex; align-items:center; justify-content:space-between; gap:12px 16px; flex-wrap:wrap;}
.feature-foot .go{margin-top:0; align-self:center;}
.cost{
  font-family:'Shantell Sans', 'Segoe Print', system-ui, sans-serif;
  font-weight:700;
  font-size:30px;
  line-height:1;
  color:var(--ink);
  white-space:nowrap;
}
.card .go.go-main{color:var(--btn-ink); background:var(--btn-bg); filter:none;}
.card:hover .go.go-main, .card:focus-visible .go.go-main{background:var(--btn-hover); filter:none;}

@media (min-width: 900px){
  .card.feature{display:grid; grid-template-columns:minmax(0, .9fr) minmax(0, 1.1fr); gap:28px; align-items:center; padding:26px 30px 30px;}
  .feature .art{max-height:none; margin:0;}
}