@import url('https://fonts.googleapis.com/css2?family=Fredoka:wght@400;500;600;700&family=Nunito:wght@400;600;700&family=DM+Mono:wght@400;500&display=swap');
.bloom-21{ margin: 0; }
@font-face{ font-family: "styley hand"; src: url(/assets/bloom-2-1/styley-hand.ttf) format("truetype"); font-display: swap; }
.bloom-21{
  color-scheme: light;
  --paper: #fffaf1;
  --ink: #3b2b5e;
  --ink-soft: #6c5c8a;
  --lav: #d9ccf4; --lav-deep: #b9a2ee;
  --pink: #f9c4d6; --peach: #fbd2ae; --butter: #fbe8a0; --mint: #c3ead0; --sky: #bfdff7; --coral: #f4998d;
  --display: "Fredoka", "Arial Rounded MT Bold", "Trebuchet MS", sans-serif;
  --body: "Nunito", "Avenir Next", "Segoe UI", sans-serif;
  --mono: "DM Mono", ui-monospace, Menlo, monospace;
  --hand: "styley hand", "Comic Sans MS", "Chalkboard SE", cursive;
}
.bloom-21{ background: var(--paper); color: var(--ink); font-family: var(--body); font-size: 16px; line-height: 1.55; overflow-x: hidden; }
.bloom-21 .b21-in{ max-width: 1120px; margin: 0 auto; padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); }
.bloom-21 h1,.bloom-21 h2,.bloom-21 h3{ font-family: var(--display); font-weight: 600; margin: 0; text-wrap: balance; }
.bloom-21 p{ margin: 0; }
.bloom-21 .b21-hand{ font-family: var(--hand); }
.bloom-21 .b21-label{ font-family: var(--mono); font-size: 0.72rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-soft); }
.bloom-21 svg.b21-doodle{ position: absolute; pointer-events: none; overflow: visible; }
.bloom-21 .b21-ribbon{ background: var(--ink); color: var(--paper); font-family: var(--mono); font-size: 0.72rem; letter-spacing: 0.06em; }
.bloom-21 .b21-ribbon .b21-in{ display: flex; flex-wrap: wrap; gap: 6px 16px; justify-content: space-between; padding-block: 8px; }
.bloom-21 .b21-ribbon a{ color: var(--butter); }
.bloom-21 .b21-announce{ background: repeating-linear-gradient(90deg, var(--pink) 0 14%, var(--peach) 14% 28%, var(--butter) 28% 42%, var(--mint) 42% 56%, var(--sky) 56% 70%, var(--lav) 70% 84%, var(--pink) 84% 100%); border-bottom: 2px solid var(--ink); }
.bloom-21 .b21-announce .b21-in{ display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 6px 14px; padding-block: 9px; font-weight: 700; font-size: 0.92rem; text-align: center; }
.bloom-21 .b21-announce .b21-pill{ background: var(--paper); border: 2px solid var(--ink); border-radius: 999px; padding: 1px 10px; font-family: var(--mono); font-size: 0.72rem; font-weight: 500; }
.bloom-21 .b21-nav{ border-bottom: 2px solid var(--ink); background: var(--paper); }
.bloom-21 .b21-nav .b21-in{ display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 10px; padding-block: 12px; }
.bloom-21 .b21-nav .b21-links,.bloom-21 .b21-nav .b21-right{ font-family: var(--mono); font-size: 0.68rem; letter-spacing: 0.08em; text-transform: uppercase; display: flex; gap: 12px; flex-wrap: wrap; }
.bloom-21 .b21-nav .b21-right{ justify-content: flex-end; }
.bloom-21 .b21-nav .b21-logo{ font-family: var(--display); font-weight: 600; font-size: 1.35rem; }
@media (max-width: 640px){.bloom-21 .b21-nav .b21-links{ display: none; }
.bloom-21 .b21-nav .b21-in{ grid-template-columns: 1fr auto; }
}
.bloom-21 .b21-bubble{ display: inline-flex; font-family: var(--display); font-weight: 700; line-height: 0.9; letter-spacing: 0.01em; }
.bloom-21 .b21-bubble span{ -webkit-text-stroke: 0.09em var(--ink); paint-order: stroke fill; text-shadow: 0.06em 0.07em 0 var(--ink); position: relative; display: inline-block; }
.bloom-21 .b21-bubble span:nth-child(1){ color: var(--pink); transform: rotate(-4deg); }
.bloom-21 .b21-bubble span:nth-child(2){ color: var(--mint); transform: translateY(-0.04em) rotate(3deg); }
.bloom-21 .b21-bubble span:nth-child(3){ color: var(--sky); transform: rotate(-2deg); }
.bloom-21 .b21-bubble span:nth-child(4){ color: var(--butter); transform: translateY(0.03em) rotate(4deg); }
.bloom-21 .b21-bubble span:nth-child(5){ color: var(--lav-deep); transform: rotate(-3deg); }
.bloom-21 .b21-sticker{ background: var(--surface, #fff); border: 2.5px solid var(--ink); border-radius: 22px; box-shadow: 5px 6px 0 var(--ink); }
.bloom-21 .b21-btn{ display: inline-flex; align-items: center; gap: 8px; font-family: var(--display); font-weight: 600; font-size: 1.05rem; padding: 11px 20px; border: 2.5px solid var(--ink); border-radius: 999px; box-shadow: 3px 4px 0 var(--ink); color: var(--ink); text-decoration: none; cursor: pointer; background: var(--paper); }
.bloom-21 .b21-btn.b21-go{ background: var(--mint); }
.bloom-21 .b21-btn.b21-buy{ background: var(--butter); }
.bloom-21 .b21-btn:hover{ transform: translate(-1px, -1px); box-shadow: 4px 5px 0 var(--ink); }
.bloom-21 .b21-btn:focus-visible,.bloom-21 .b21-chip:focus-visible{ outline: 3px solid var(--coral); outline-offset: 3px; }
.bloom-21 .b21-hero{ position: relative; padding-block: 44px 64px; overflow: hidden; background:
  radial-gradient(circle at 12% 18%, rgba(249,196,214,.55) 0 120px, transparent 121px),
  radial-gradient(circle at 92% 12%, rgba(191,223,247,.6) 0 140px, transparent 141px),
  radial-gradient(circle at 70% 95%, rgba(195,234,208,.55) 0 170px, transparent 171px); }
.bloom-21 .b21-hero .b21-in{ display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 40px; align-items: center; position: relative; }
@media (max-width: 860px){.bloom-21 .b21-hero .b21-in{ grid-template-columns: 1fr; }
}
.bloom-21 .b21-hero .b21-copy{ display: grid; gap: 18px; position: relative; z-index: 1; }
.bloom-21 .b21-hero .b21-bubble{ font-size: clamp(4.4rem, 13vw, 8.4rem); }
.bloom-21 .b21-hero .b21-ver{ display: inline-flex; align-items: center; gap: 8px; }
.bloom-21 .b21-ver .b21-badge{ font-family: var(--display); font-weight: 700; font-size: 1.3rem; background: var(--coral); border: 2.5px solid var(--ink); border-radius: 14px; padding: 2px 12px; transform: rotate(-6deg); box-shadow: 3px 3px 0 var(--ink); }
.bloom-21 .b21-theme-line{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; container-type:inline-size; }
.bloom-21 .b21-theme-line span{ font-family: var(--display); font-weight: 600; font-size: clamp(.65rem, 3.7cqw, 1.5rem); min-width:0; white-space:nowrap; text-align:center; border: 2.5px solid var(--ink); border-radius: 16px; padding: 7px 4px; box-shadow: 3px 4px 0 var(--ink); }
.bloom-21 .b21-theme-line span:nth-child(1){ background: var(--pink); transform: rotate(-2deg); }
.bloom-21 .b21-theme-line span:nth-child(2){ background: var(--sky); transform: rotate(1.5deg); }
.bloom-21 .b21-theme-line span:nth-child(3){ background: var(--butter); transform: rotate(-1deg); }
.bloom-21 .b21-hero .b21-lede{ font-size: 1.12rem; max-width: 46ch; }
.bloom-21 .b21-ctas{ display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.bloom-21 .b21-ctas .b21-free{ font-size: 0.9rem; color: var(--ink-soft); }
.bloom-21 .b21-stats{ display: flex; flex-wrap: wrap; gap: 12px; }
.bloom-21 .b21-stat{ display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; text-align: center; width: 104px; aspect-ratio: 1; border: 2.5px solid var(--ink); border-radius: 50%; box-shadow: 3px 4px 0 var(--ink); }
.bloom-21 .b21-stat b{ font-family: var(--display); font-weight: 700; font-size: 1.85rem; line-height: 1; font-variant-numeric: tabular-nums; }
.bloom-21 .b21-stat small{ font-size: 0.72rem; font-weight: 700; line-height: 1.1; max-width: 76px; }
.bloom-21 .b21-stat:nth-child(1){ background: var(--lav); }
.bloom-21 .b21-stat:nth-child(2){ background: var(--peach); }
.bloom-21 .b21-stat:nth-child(3){ background: var(--mint); }
.bloom-21 .b21-window{ position: relative; display: grid; gap: 14px; }
.bloom-21 .b21-frame{ background: #fff; border: 3px solid var(--ink); border-radius: 18px; box-shadow: 8px 9px 0 var(--ink); padding: 10px; transform: rotate(1deg); position: relative; }
.bloom-21 .b21-frame img{ display: block; width: 100%; height: auto; border-radius: 10px; max-width: 100%; }
.bloom-21 .b21-picker{ display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.bloom-21 .b21-chip{ font-family: var(--display); font-weight: 600; font-size: 0.92rem; border: 2.5px solid var(--ink); border-radius: 999px; padding: 4px 13px 4px 6px; display: inline-flex; align-items: center; gap: 7px; cursor: pointer; background: #fff; color: var(--ink); box-shadow: 2px 3px 0 var(--ink); }
.bloom-21 .b21-chip i{ width: 20px; height: 20px; border-radius: 50%; border: 2px solid var(--ink); display: inline-block; }
.bloom-21 .b21-chip[aria-pressed="true"]{ background: var(--butter); transform: translateY(-2px); box-shadow: 3px 5px 0 var(--ink); }
.bloom-21 .b21-note{ font-family: var(--hand); font-size: 1.6rem; line-height: 1.2; color: var(--ink); position: absolute; white-space: nowrap; }
.bloom-21 .b21-window{ margin-bottom: 2.4rem; }
.bloom-21 .b21-band{ padding-block: 64px; position: relative; overflow: hidden; }
.bloom-21 .b21-band.b21-lav{ background: var(--lav); border-block: 2.5px solid var(--ink); }
.bloom-21 .b21-band.b21-mint{ background: #e4f5e9; border-block: 2.5px solid var(--ink); }
.bloom-21 .b21-band.b21-butter{ background: #fdf3cf; border-block: 2.5px solid var(--ink); }
.bloom-21 .b21-head{ display: grid; gap: 10px; margin-bottom: 30px; max-width: 760px; position: relative; z-index: 1; }
.bloom-21 .b21-head h2{ font-size: clamp(2.2rem, 6vw, 3.4rem); line-height: 1; }
.bloom-21 .b21-head h2 em{ font-style: normal; display: inline-block; padding: 0 10px; border: 2.5px solid var(--ink); border-radius: 14px; box-shadow: 3px 4px 0 var(--ink); transform: rotate(-2deg); }
.bloom-21 .b21-head p{ font-size: 1.08rem; max-width: 58ch; }
.bloom-21 .b21-palettes{ display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 18px; position: relative; z-index: 1; }
.bloom-21 .b21-pal{ padding: 10px; display: grid; gap: 10px; align-content: start; border-radius: 18px; border: 2.5px solid var(--ink); box-shadow: 4px 5px 0 var(--ink); }
.bloom-21 .b21-pal img{ border-radius: 10px; border: 2px solid var(--ink); display: block; width: 100%; height: auto; }
.bloom-21 .b21-pal h3{ font-size: 1.3rem; }
.bloom-21 .b21-pal p{ font-size: 0.9rem; }
.bloom-21 .b21-pal:nth-child(odd){ transform: rotate(-1.2deg); }
.bloom-21 .b21-pal:nth-child(even){ transform: rotate(1deg); }
.bloom-21 .b21-handwriting{ margin-top: 28px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: 26px; align-items: center; position: relative; z-index: 1; }
@media (max-width: 760px){.bloom-21 .b21-handwriting{ grid-template-columns: 1fr; }
}
.bloom-21 .b21-handwriting .b21-big{ font-family: var(--hand); font-size: clamp(2rem, 6vw, 3.4rem); line-height: 1.2; white-space: nowrap; padding-bottom: 1.15em; }
.bloom-21 .b21-hand{ line-height: 1.2; }
.bloom-21 .b21-signature{ display: block; width: min(240px, 60%); height: auto; aspect-ratio: 1248 / 318; color: var(--ink); }
.bloom-21 .b21-hand.b21-tails{ padding-bottom: 1.15em; }
.bloom-21 .b21-folders{ display: flex; flex-wrap: wrap; gap: 12px; position: relative; z-index: 1; }
.bloom-21 .b21-folder{ display: inline-flex; align-items: baseline; gap: 8px; border: 2.5px solid var(--ink); border-radius: 16px; padding: 8px 14px; box-shadow: 3px 4px 0 var(--ink); font-family: var(--display); font-weight: 600; font-size: 1.1rem; }
.bloom-21 .b21-folder b{ font-size: 1.6rem; font-variant-numeric: tabular-nums; }
.bloom-21 .b21-split{ display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 28px; align-items: center; margin-top: 34px; position: relative; z-index: 1; }
@media (max-width: 860px){.bloom-21 .b21-split{ grid-template-columns: 1fr; }
}
.bloom-21 .b21-split .b21-text{ display: grid; gap: 12px; }
.bloom-21 .b21-split h3{ font-size: 1.9rem; line-height: 1.05; }
.bloom-21 .b21-keys{ display: flex; height: 54px; border: 2.5px solid var(--ink); border-radius: 10px; overflow: hidden; background: #fff; max-width: 360px; position: relative; }
.bloom-21 .b21-keys i{ flex: 1; border-right: 2px solid var(--ink); }
.bloom-21 .b21-keys i:last-child{ border-right: 0; }
.bloom-21 .b21-keys b{ position: absolute; top: 0; width: 7%; height: 58%; background: var(--ink); border-radius: 0 0 4px 4px; }
.bloom-21 .b21-tracks{ display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 12px; margin-top: 30px; position: relative; z-index: 1; }
.bloom-21 .b21-track{ display: grid; grid-template-columns: 46px 1fr; gap: 12px; align-items: center; background: #fff; border: 2.5px solid var(--ink); border-radius: 16px; padding: 10px 12px; box-shadow: 3px 4px 0 var(--ink); font: inherit; color: inherit; text-align: left; cursor: pointer; position: relative; overflow: hidden; }
.bloom-21 .b21-track .b21-bar{ position: absolute; left: 0; bottom: 0; height: 5px; width: 0; background: var(--coral); }
.bloom-21 .b21-track.b21-playing{ background: #fffbe6; transform: translateY(-2px); box-shadow: 4px 6px 0 var(--ink); }
.bloom-21 .b21-track:focus-visible,.bloom-21 .b21-roll:focus-visible,.bloom-21 .b21-stop:focus-visible{ outline: 3px solid var(--coral); outline-offset: 3px; }
.bloom-21 .b21-track .b21-play{ width: 46px; height: 46px; border-radius: 50%; border: 2.5px solid var(--ink); display: grid; place-items: center; font-size: 0.9rem; }
.bloom-21 .b21-track div{ min-width: 0; display: grid; }
.bloom-21 .b21-track b{ font-family: var(--display); font-weight: 600; font-size: 1.08rem; }
.bloom-21 .b21-track small{ color: var(--ink-soft); font-size: 0.85rem; }
.bloom-21 .b21-features{ display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 22px; position: relative; z-index: 1; }
.bloom-21 .b21-feat{ padding: 18px; display: grid; gap: 10px; align-content: start; border: 2.5px solid var(--ink); border-radius: 22px; box-shadow: 5px 6px 0 var(--ink); }
.bloom-21 .b21-feat:nth-child(3n+1){ transform: rotate(-1deg); }
.bloom-21 .b21-feat:nth-child(3n+2){ transform: rotate(0.8deg); }
.bloom-21 .b21-feat:nth-child(3n){ transform: rotate(-0.4deg); }
.bloom-21 .b21-feat h3{ font-size: 1.55rem; line-height: 1.05; }
.bloom-21 .b21-feat p{ font-size: 0.96rem; }
.bloom-21 .b21-feat img{ border: 2px solid var(--ink); border-radius: 10px; display: block; width: 100%; height: auto; }
.bloom-21 .b21-icon{ width: 64px; height: 64px; }
.bloom-21 .b21-die{ width: 58px; height: 58px; background: #fff; border: 3px solid var(--ink); border-radius: 14px; display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(3, 1fr); padding: 6px; transform: rotate(-10deg); box-shadow: 3px 3px 0 var(--ink); }
.bloom-21 .b21-die i{ width: 9px; height: 9px; border-radius: 50%; background: var(--ink); place-self: center; }
.bloom-21 .b21-prices{ display: grid; grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); gap: 24px; position: relative; z-index: 1; }
.bloom-21 .b21-price{ padding: 22px; display: grid; grid-row: span 5; grid-template-rows: subgrid; gap: 12px; border: 2.5px solid var(--ink); border-radius: 24px; box-shadow: 6px 7px 0 var(--ink); }
.bloom-21 .b21-price .b21-amt{ font-family: var(--display); font-weight: 700; font-size: 3rem; line-height: 1; }
.bloom-21 .b21-price ul{ margin: 0; padding-left: 1.1em; display: grid; gap: 6px; align-content: start; }
.bloom-21 .b21-small{ font-size: 0.88rem; color: var(--ink-soft); }
.bloom-21 .b21-taskbar{ border-top: 2.5px solid var(--ink); background: var(--lav); position: sticky; bottom: 0; z-index: 5; padding-bottom: env(safe-area-inset-bottom, 0px); }
.bloom-21 .b21-taskbar .b21-stop{ font-family: var(--mono); font-size: 0.75rem; background: var(--coral); border: 2px solid var(--ink); border-radius: 8px; padding: 3px 10px; cursor: pointer; color: var(--ink); }
.bloom-21 .b21-taskbar .b21-in{ display: flex; flex-wrap: wrap; gap: 8px; padding-block: 8px; font-family: var(--mono); font-size: 0.75rem; }
.bloom-21 .b21-taskbar span{ background: #fff; border: 2px solid var(--ink); border-radius: 8px; padding: 3px 10px; }
.bloom-21 .b21-kit{ padding-block: 64px 80px; background: #fff; border-top: 3px dashed var(--ink); }
.bloom-21 .b21-kit .b21-in{ display: grid; gap: 52px; }
.bloom-21 .b21-kit section{ display: grid; gap: 18px; }
.bloom-21 .b21-kit h2{ font-size: clamp(1.8rem, 4.5vw, 2.5rem); }
.bloom-21 .b21-kit .b21-lead{ max-width: 64ch; }
.bloom-21 .b21-copybox{ background: var(--paper); border: 2.5px solid var(--ink); border-radius: 16px; padding: 14px 16px; display: grid; gap: 6px; box-shadow: 3px 4px 0 var(--ink); }
.bloom-21 .b21-copybox .b21-k{ font-family: var(--mono); font-size: 0.72rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-soft); }
.bloom-21 .b21-tl{ display: grid; grid-template-columns: repeat(60, minmax(0, 1fr)); height: 26px; border: 2.5px solid var(--ink); border-radius: 10px; overflow: hidden; }
.bloom-21 .b21-shots{ display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; }
.bloom-21 .b21-shot{ border: 2.5px solid var(--ink); border-radius: 16px; padding: 12px; display: grid; gap: 4px; align-content: start; box-shadow: 3px 4px 0 var(--ink); }
.bloom-21 .b21-shot .b21-t{ font-family: var(--mono); font-size: 0.75rem; font-variant-numeric: tabular-nums; }
.bloom-21 .b21-shot b{ font-family: var(--display); font-weight: 600; font-size: 1.1rem; }
.bloom-21 .b21-shot small{ color: var(--ink-soft); font-size: 0.85rem; }
.bloom-21 .b21-post{ background: var(--paper); border: 2.5px solid var(--ink); border-radius: 22px; padding: 24px clamp(16px, 4vw, 34px); display: grid; gap: 12px; box-shadow: 5px 6px 0 var(--ink); max-width: 760px; }
.bloom-21 .b21-post h3{ font-size: 1.25rem; margin-top: 6px; }
.bloom-21 .b21-post .b21-title{ font-size: clamp(1.6rem, 4vw, 2.1rem); line-height: 1.1; }
.bloom-21 .b21-copybtn{ justify-self: start; }
.bloom-21 .b21-decide{ margin: 0; padding: 0; list-style: none; display: grid; gap: 12px; }
.bloom-21 .b21-decide li{ border: 2.5px solid var(--ink); border-radius: 16px; padding: 12px 16px; display: grid; gap: 4px; box-shadow: 3px 4px 0 var(--ink); }
.bloom-21 .b21-decide li.b21-done{ background: var(--mint); }
.bloom-21 .b21-decide li b{ font-family: var(--display); font-weight: 600; font-size: 1.1rem; }
@media (prefers-reduced-motion: reduce){.bloom-21 .b21-btn:hover,.bloom-21 .b21-chip[aria-pressed="true"]{ transform: none; }
}

.bloom-21 .b21-inline-0 {position:absolute}
.bloom-21 .b21-inline-1 {left:3%;top:22px;width:34px;height:34px}
.bloom-21 .b21-inline-2 {left:41%;top:40px;width:26px;height:26px}
.bloom-21 .b21-inline-3 {left:34%;bottom:46px;width:82px;height:48px}
.bloom-21 .b21-inline-4 {right:4%;bottom:24px;width:30px;height:28px}
.bloom-21 .b21-inline-5 {background:#d9ccf4}
.bloom-21 .b21-inline-6 {background:#c3ead0}
.bloom-21 .b21-inline-7 {background:#bfdff7}
.bloom-21 .b21-inline-8 {background:#fbd2ae}
.bloom-21 .b21-inline-9 {background:#fbe8a0}
.bloom-21 .b21-inline-10 {background:#3b2b5e}
.bloom-21 .b21-inline-11 {right:-6px;bottom:-46px;transform:rotate(-4deg)}
.bloom-21 .b21-inline-12 {right:6%;top:30px;width:150px;height:80px}
.bloom-21 .b21-inline-13 {left:2%;bottom:30px;width:30px;height:30px}
.bloom-21 .b21-inline-14 {background:var(--pink)}
.bloom-21 .b21-inline-15 {background:#f3edfd}
.bloom-21 .b21-inline-16 {background:#eaf7ee}
.bloom-21 .b21-inline-17 {background:#e9f4fd}
.bloom-21 .b21-inline-18 {background:#fdeee1}
.bloom-21 .b21-inline-19 {background:#fdf6d4}
.bloom-21 .b21-inline-20 {margin-top:10px;max-width:42ch}
.bloom-21 .b21-inline-21 {margin-top:14px}
.bloom-21 .b21-inline-22 {transform:rotate(-1.5deg)}
.bloom-21 .b21-inline-23 {left:4%;top:34px;width:40px;height:40px}
.bloom-21 .b21-inline-24 {right:5%;top:46px;width:56px;height:56px}
.bloom-21 .b21-inline-25 {background:var(--mint)}
.bloom-21 .b21-inline-26 {background:var(--lav)}
.bloom-21 .b21-inline-27 {background:var(--pink)}
.bloom-21 .b21-inline-28 {background:var(--sky)}
.bloom-21 .b21-inline-29 {background:var(--butter)}
.bloom-21 .b21-inline-30 {background:var(--mint)}
.bloom-21 .b21-inline-31 {background:var(--peach)}
.bloom-21 .b21-inline-32 {background:#fff}
.bloom-21 .b21-inline-33 {left:10%}
.bloom-21 .b21-inline-34 {left:24%}
.bloom-21 .b21-inline-35 {left:53%}
.bloom-21 .b21-inline-36 {left:67%}
.bloom-21 .b21-inline-37 {left:81%}
.bloom-21 .b21-inline-38 {transform:rotate(1.2deg)}
.bloom-21 .b21-inline-39 {background:var(--pink)}
.bloom-21 .b21-inline-40 {background:var(--lav)}
.bloom-21 .b21-inline-41 {background:var(--butter)}
.bloom-21 .b21-inline-42 {background:var(--mint)}
.bloom-21 .b21-inline-43 {background:var(--sky)}
.bloom-21 .b21-inline-44 {background:var(--peach)}
.bloom-21 .b21-inline-45 {background:var(--lav)}
.bloom-21 .b21-inline-46 {background:var(--pink)}
.bloom-21 .b21-inline-47 {background:var(--sky)}
.bloom-21 .b21-inline-48 {background:var(--butter)}
.bloom-21 .b21-inline-49 {background:var(--mint)}
.bloom-21 .b21-inline-50 {background:var(--peach)}
.bloom-21 .b21-inline-51 {background:var(--sky)}
.bloom-21 .b21-inline-52 {background:var(--pink)}
.bloom-21 .b21-inline-53 {background:var(--mint)}
.bloom-21 .b21-inline-54 {background:var(--butter)}
.bloom-21 .b21-inline-55 {background:var(--lav)}
.bloom-21 .b21-inline-56 {right:3%;bottom:20px;width:88px;height:82px}
.bloom-21 .b21-inline-57 {left:46%;top:24px;width:28px;height:28px}
.bloom-21 .b21-inline-58 {background:var(--sky)}
.bloom-21 .b21-inline-59 {background:#eaf4fd}
.bloom-21 .b21-inline-60 {background:#fde9f0}
.bloom-21 .b21-inline-61 {background:#eaf7ee}
.bloom-21 .b21-inline-62 {background:#fdeee1}
.bloom-21 .b21-inline-63 {left:6%;top:40px;width:88px;height:52px}
.bloom-21 .b21-inline-64 {background:var(--butter)}
.bloom-21 .b21-inline-65 {background:#eaf7ee}
.bloom-21 .b21-inline-66 {background:#fdf3cf}
.bloom-21{width:100%;overflow:clip;isolation:isolate;letter-spacing:normal}
.bloom-21 h1,.bloom-21 h2,.bloom-21 h3{color:var(--ink);letter-spacing:normal;text-transform:none}
.bloom-21 .b21-label{text-transform:none}
.bloom-21 .b21-bubble{font-family:var(--display);font-weight:700;line-height:.9}
.bloom-21 .b21-hero{padding-inline:0;border-bottom:0}
.bloom-21 .b21-btn{justify-content:center;min-height:48px;text-transform:none;line-height:1.3}
.bloom-21 .b21-ctas{align-items:stretch}.bloom-21 .b21-ctas>.b21-btn{flex:1;min-width:160px}.bloom-21 .b21-ctas>.b21-btn{font-size:1rem;padding-inline:12px}
.bloom-21 .b21-price{grid-row:span 3;grid-template-rows:subgrid}
.bloom-21 .b21-price .b21-amt{font-size:clamp(2rem,5vw,3rem)}
.bloom-21 .b21-purchase{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:24px}
.bloom-21 .b21-purchase-note{margin-top:18px}
.bloom-21 .b21-resources{display:flex;flex-wrap:wrap;gap:12px 24px;margin-top:20px;font-weight:700}
.bloom-21 .b21-resources a{color:var(--ink);text-decoration:underline}
.bloom-21 .b21-audio-controls{display:flex;align-items:center;flex-wrap:wrap;gap:14px;margin-top:24px}
.bloom-21 .b21-audio-controls p{flex:1;min-width:200px}
.bloom-21 .b21-audio-controls audio{width:100%}
.bloom-21 .b21-track .b21-bar{width:100%;transform:scaleX(0);transform-origin:left}
.bloom-21 .plugin-updates{margin:0}
.bloom-21 .plugin-update-item h3{font-size:1.1rem}
@media(max-width:420px){.bloom-21 .b21-in{padding-inline:18px}.bloom-21 .b21-hero .b21-bubble{font-size:clamp(3.4rem,17vw,4.4rem)}.bloom-21 .b21-ver .b21-badge{font-size:1.1rem;padding:2px 9px}.bloom-21 .b21-stat{width:94px}.bloom-21 .b21-purchase{gap:12px}.bloom-21 .b21-purchase .b21-btn{padding:12px 8px;font-size:.94rem}.bloom-21 .b21-handwriting .b21-big{font-size:clamp(1.6rem,7.5vw,2rem)}}

.bloom-21 .b21-handwriting-title{margin:12px 0 22px;max-width:480px;width:100%;line-height:1;}
.bloom-21 .b21-handwriting-title img{display:block;width:100%;height:auto;}

@font-face{font-family:BloomYoungSerif;src:url('/bloom/fonts/YoungSerif.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:BloomArchivo;src:url('/bloom/fonts/Archivo.ttf') format('truetype');font-weight:100 900;font-display:swap}
.bloom-21 .b21-hero{--display:BloomArchivo,Arial,sans-serif;font-family:BloomArchivo,Arial,sans-serif}
.bloom-21 .b21-hero .b21-copy{container-type:inline-size}
.bloom-21 .b21-hero .b21-app-wordmark{font-family:BloomYoungSerif,Georgia,serif;font-weight:400;font-size:clamp(3rem,24cqw,8rem);line-height:1.08;letter-spacing:-.05em;color:var(--ink);margin:0}

/* Match the Young Serif lettering in the approved home previews. */
.bloom-21 .b21-theme-line span,
.bloom-21 .b21-chip,
.bloom-21 .b21-pal h3,
.bloom-21 .b21-badge,
.bloom-21 .b21-stat b,
.bloom-21 .b21-stat small,
.bloom-21 .b21-btn{
  font-family:BloomYoungSerif,Georgia,serif;
  font-weight:400;
  font-synthesis:none;
}
.bloom-21 .b21-hero .b21-app-wordmark{letter-spacing:-.055em;line-height:1}
.bloom-21 .b21-theme-line span{font-size:clamp(.6rem,3.15cqw,1.2rem)}