.css-midst3 { position: fixed; bottom: var(--chakra-spacing-4); right: var(--chakra-spacing-5); z-index: 60; display: flex; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center; width: var(--chakra-sizes-14); height: var(--chakra-sizes-14); border-radius: var(--chakra-radii-full); background: rgb(37, 211, 102); --bg-currentcolor: #25D366; color: var(--chakra-colors-white); box-shadow: rgba(37, 211, 102, 0.5) 0px 10px 30px -8px; transition: 0.2s; }
@media screen and (min-width: 48rem) {
  .css-midst3 { display: none; }
}
@media (hover: hover) {
  .css-midst3:is(:hover, [data-hover]):not(:disabled, [data-disabled]) { transform: scale(1.08); box-shadow: rgba(37, 211, 102, 0.65) 0px 14px 36px -8px; }
}
.css-5g8omz { min-height: 100vh; background: var(--chakra-colors-bg-subtle); --bg-currentcolor: var(--chakra-colors-bg-subtle); }
.css-he808z { position: fixed; inset-inline: 0px; bottom: 0px; z-index: 1500; padding-inline: var(--chakra-spacing-3); padding-bottom: var(--chakra-spacing-3); }
@media screen and (min-width: 48rem) {
  .css-he808z { padding-inline: var(--chakra-spacing-6); padding-bottom: var(--chakra-spacing-5); }
}
.css-s1to0l { max-width: var(--chakra-sizes-6xl); padding-inline: 0px; }
@layer recipes {
  .css-s1to0l { position: relative; max-width: var(--chakra-sizes-8xl); width: 100%; margin-inline: auto; padding-inline: var(--chakra-spacing-4); }
  @media screen and (min-width: 48rem) {
  .css-s1to0l { padding-inline: var(--chakra-spacing-6); }
}
  @media screen and (min-width: 64rem) {
  .css-s1to0l { padding-inline: var(--chakra-spacing-8); }
}
}
.css-e5i9nq { background: var(--chakra-colors-bg\.canvas); --bg-currentcolor: var(--chakra-colors-bg\.canvas); border-width: 1px; border-style: solid; border-image: none; border-color: var(--chakra-colors-border\.default); border-radius: var(--chakra-radii-xl); overflow: hidden; }
.css-1pm1kf0 { display: flex; flex-direction: column; -webkit-box-align: stretch; align-items: stretch; -webkit-box-pack: justify; justify-content: space-between; gap: var(--chakra-spacing-5); padding: var(--chakra-spacing-5); }
@media screen and (min-width: 48rem) {
  .css-1pm1kf0 { padding: var(--chakra-spacing-6); }
}
@media screen and (min-width: 64rem) {
  .css-1pm1kf0 { flex-direction: row; -webkit-box-align: center; align-items: center; gap: var(--chakra-spacing-8); }
}
.css-eiqqgx { display: flex; -webkit-box-align: start; align-items: start; flex-direction: column; gap: var(--chakra-spacing-3); flex: 1 1 0%; min-width: 0px; }
.css-yg7nqa { font-size: var(--chakra-font-sizes-md); font-weight: 700; color: var(--chakra-colors-fg\.default); letter-spacing: -0.01em; }
.css-il3ox9 { font-size: var(--chakra-font-sizes-sm); color: var(--chakra-colors-fg-muted); line-height: 1.6; }
.css-145qs88 { color: var(--chakra-colors-fg\.default); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
@layer recipes {
  .css-145qs88 { display: inline-flex; -webkit-box-align: center; align-items: center; outline: none; gap: var(--chakra-spacing-1\.5); cursor: pointer; border-radius: var(--chakra-radii-l1); --focus-ring-color: var(--chakra-colors-color-palette-focus-ring); color: var(--chakra-colors-color-palette-fg); }
  .css-145qs88:is(:focus, [data-focus]) { outline-width: var(--focus-ring-width, 2px); outline-offset: var(--focus-ring-offset, 2px); outline-style: var(--focus-ring-style, solid); outline-color: var(--focus-ring-color); }
  @media (hover: hover) {
  .css-145qs88:is(:hover, [data-hover]):not(:disabled, [data-disabled]) { text-decoration-line: underline; text-decoration-thickness: initial; text-decoration-style: initial; text-underline-offset: 3px; --mix-textDecorationColor: color-mix(in srgb, currentColor 20%, transparent); text-decoration-color: var(--mix-textDecorationColor, currentColor); }
}
}
@media (hover: hover) {
  .css-145qs88:is(:hover, [data-hover]):not(:disabled, [data-disabled]) { color: var(--chakra-colors-accent-700); }
}
.css-177z6ei { display: flex; flex-direction: column; -webkit-box-align: center; align-items: center; gap: var(--chakra-spacing-2); width: var(--chakra-sizes-full); }
@media screen and (min-width: 30rem) {
  .css-177z6ei { flex-direction: row; }
}
@media screen and (min-width: 48rem) {
  .css-177z6ei { gap: var(--chakra-spacing-2); }
}
@media screen and (min-width: 64rem) {
  .css-177z6ei { flex-direction: row; width: auto; min-width: auto; }
}
.css-1s6y45o { background: var(--chakra-colors-fg\.default); --bg-currentcolor: var(--chakra-colors-fg\.default); color: var(--chakra-colors-white); border-radius: var(--chakra-radii-lg); font-weight: 600; width: var(--chakra-sizes-full); }
@layer recipes {
  .css-1s6y45o { display: inline-flex; appearance: none; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center; user-select: none; position: relative; border-radius: var(--chakra-radii-full); white-space: nowrap; vertical-align: middle; border-width: 1px; border-color: var(--chakra-colors-transparent); cursor: pointer; flex-shrink: 0; outline: 0px; line-height: 1.25rem; isolation: isolate; font-weight: 600; --focus-ring-color: var(--chakra-colors-color-palette-focus-ring); font-family: var(--chakra-fonts-body); letter-spacing: -0.01em; transition: 0.2s cubic-bezier(0.4, 0, 0.2, 1); height: 44px; min-width: var(--chakra-sizes-10); font-size: 15px; padding-inline: var(--chakra-spacing-5); gap: var(--chakra-spacing-2); background: var(--chakra-colors-bg\.accent); --bg-currentcolor: var(--chakra-colors-bg\.accent); color: var(--chakra-colors-fg\.inverse); }
  .css-1s6y45o:is(:focus-visible, [data-focus-visible]) { outline-offset: 3px; outline: solid 2px; }
  .css-1s6y45o:is(:disabled, [disabled], [data-disabled], [aria-disabled="true"]) { opacity: 0.5; cursor: not-allowed; }
  .css-1s6y45o :where(svg) { flex-shrink: 0; width: var(--chakra-sizes-5); height: var(--chakra-sizes-5); }
  .css-1s6y45o:is([aria-expanded="true"], [data-expanded], [data-state="expanded"]) { --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent); background: var(--mix-background, var(--chakra-colors-color-palette-solid)); --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid)); }
  .css-1s6y45o:is(:active, [data-active]):not(:disabled, [data-disabled], [data-state="open"]) { transform: translateY(0px); }
  @media (hover: hover) {
  .css-1s6y45o:is(:hover, [data-hover]):not(:disabled, [data-disabled]) { background: var(--chakra-colors-bg\.accent-hover); --bg-currentcolor: var(--chakra-colors-bg\.accent-hover); transform: translateY(-1px); }
  .css-1s6y45o:is(:hover, [data-hover]):not(:disabled, [data-disabled]):is(:disabled, [disabled], [data-disabled], [aria-disabled="true"]) { transform: none; }
}
}
@media screen and (min-width: 30rem) {
  .css-1s6y45o { width: auto; }
}
@media (hover: hover) {
  .css-1s6y45o:is(:hover, [data-hover]):not(:disabled, [data-disabled]) { background: var(--chakra-colors-slate-800); --bg-currentcolor: var(--chakra-colors-slate-800); }
}
.css-gv2zke { border-radius: var(--chakra-radii-lg); font-weight: 600; border-color: var(--chakra-colors-border\.default); color: var(--chakra-colors-fg\.default); width: var(--chakra-sizes-full); }
@layer recipes {
  .css-gv2zke { display: inline-flex; appearance: none; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center; user-select: none; position: relative; border-radius: var(--chakra-radii-full); white-space: nowrap; vertical-align: middle; border-width: 1px; border-color: var(--chakra-colors-border\.strong); cursor: pointer; flex-shrink: 0; outline: 0px; line-height: 1.25rem; isolation: isolate; font-weight: 600; --focus-ring-color: var(--chakra-colors-color-palette-focus-ring); font-family: var(--chakra-fonts-body); letter-spacing: -0.01em; transition: 0.2s cubic-bezier(0.4, 0, 0.2, 1); height: 44px; min-width: var(--chakra-sizes-10); font-size: 15px; padding-inline: var(--chakra-spacing-5); gap: var(--chakra-spacing-2); --outline-color-legacy: var(--chakra-colors-color-palette-muted); --outline-color: var(--chakra-colors-color-palette-border); color: var(--chakra-colors-fg\.default); background: var(--chakra-colors-transparent); --bg-currentcolor: var(--chakra-colors-transparent); }
  .css-gv2zke:is(:focus-visible, [data-focus-visible]) { outline-offset: 3px; outline: solid 2px; }
  .css-gv2zke:is(:disabled, [disabled], [data-disabled], [aria-disabled="true"]) { opacity: 0.5; cursor: not-allowed; }
  .css-gv2zke :where(svg) { flex-shrink: 0; width: var(--chakra-sizes-5); height: var(--chakra-sizes-5); }
  .css-gv2zke:is([aria-expanded="true"], [data-expanded], [data-state="expanded"]) { background: var(--chakra-colors-color-palette-subtle); --bg-currentcolor: var(--chakra-colors-color-palette-subtle); }
  @media (hover: hover) {
  .css-gv2zke:is(:hover, [data-hover]):not(:disabled, [data-disabled]) { background: var(--chakra-colors-bg-subtle); --bg-currentcolor: var(--chakra-colors-bg-subtle); border-color: var(--chakra-colors-fg\.default); }
  .css-gv2zke:is(:hover, [data-hover]):not(:disabled, [data-disabled]):is(:disabled, [disabled], [data-disabled], [aria-disabled="true"]) { transform: none; }
}
}
@media screen and (min-width: 30rem) {
  .css-gv2zke { width: auto; }
}
@media (hover: hover) {
  .css-gv2zke:is(:hover, [data-hover]):not(:disabled, [data-disabled]) { background: var(--chakra-colors-bg-subtle); --bg-currentcolor: var(--chakra-colors-bg-subtle); }
}
.css-1fp3pz4 { border-radius: var(--chakra-radii-lg); font-weight: 600; color: var(--chakra-colors-fg-muted); width: var(--chakra-sizes-full); }
@layer recipes {
  .css-1fp3pz4 { display: inline-flex; appearance: none; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center; user-select: none; position: relative; border-radius: var(--chakra-radii-full); white-space: nowrap; vertical-align: middle; border-width: 1px; border-color: var(--chakra-colors-transparent); cursor: pointer; flex-shrink: 0; outline: 0px; line-height: 1.25rem; isolation: isolate; font-weight: 600; --focus-ring-color: var(--chakra-colors-color-palette-focus-ring); font-family: var(--chakra-fonts-body); letter-spacing: -0.01em; transition: 0.2s cubic-bezier(0.4, 0, 0.2, 1); height: 44px; min-width: var(--chakra-sizes-10); font-size: 15px; padding-inline: var(--chakra-spacing-5); gap: var(--chakra-spacing-2); background: var(--chakra-colors-transparent); --bg-currentcolor: var(--chakra-colors-transparent); color: var(--chakra-colors-fg\.default); }
  .css-1fp3pz4:is(:focus-visible, [data-focus-visible]) { outline-offset: 3px; outline: solid 2px; }
  .css-1fp3pz4:is(:disabled, [disabled], [data-disabled], [aria-disabled="true"]) { opacity: 0.5; cursor: not-allowed; }
  .css-1fp3pz4 :where(svg) { flex-shrink: 0; width: var(--chakra-sizes-5); height: var(--chakra-sizes-5); }
  .css-1fp3pz4:is([aria-expanded="true"], [data-expanded], [data-state="expanded"]) { background: var(--chakra-colors-color-palette-subtle); --bg-currentcolor: var(--chakra-colors-color-palette-subtle); }
  @media (hover: hover) {
  .css-1fp3pz4:is(:hover, [data-hover]):not(:disabled, [data-disabled]) { background: var(--chakra-colors-bg-subtle); --bg-currentcolor: var(--chakra-colors-bg-subtle); }
}
}
@media screen and (min-width: 30rem) {
  .css-1fp3pz4 { width: auto; }
}
@media (hover: hover) {
  .css-1fp3pz4:is(:hover, [data-hover]):not(:disabled, [data-disabled]) { background: var(--chakra-colors-bg-subtle); --bg-currentcolor: var(--chakra-colors-bg-subtle); color: var(--chakra-colors-fg\.default); }
}