.css-omoekg { display: flex; -webkit-box-align: center; align-items: center; flex-direction: column; gap: var(--gaydev-spacing-4); margin-top: var(--gaydev-spacing-4); }
@media screen and (min-width: 30rem) {
  .css-omoekg { gap: var(--gaydev-spacing-4); margin-top: var(--gaydev-spacing-4); }
}
@media screen and (min-width: 48rem) {
  .css-omoekg { gap: var(--gaydev-spacing-6); margin-top: var(--gaydev-spacing-8); }
}
.css-1qq6z7u { display: flex; -webkit-box-align: center; align-items: center; -webkit-box-pack: justify; justify-content: space-between; flex-direction: row; gap: var(--gaydev-spacing-4); z-index: 2; width: var(--gaydev-sizes-full); max-width: 1000px; padding-left: 0px; padding-right: 0px; }
@media screen and (min-width: 30rem) {
  .css-1qq6z7u { padding-left: 0px; padding-right: 0px; }
}
@media screen and (min-width: 48rem) {
  .css-1qq6z7u { padding-left: 76px; padding-right: 128px; }
}
.css-u0kcpx { display: flex; -webkit-box-align: center; align-items: center; flex-direction: row; gap: var(--gaydev-spacing-4); }
.css-vzthl9 { display: flex; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center; flex-shrink: 0; width: 36px; height: 36px; border-radius: var(--gaydev-radii-full); background: rgba(247, 249, 243, 0.05); --bg-currentcolor: rgba(247, 249, 243, 0.05); border: 1px solid rgba(180, 182, 175, 0.05); backdrop-filter: blur(16px); color: rgb(200, 203, 203); cursor: pointer; transition: opacity 0.15s, background 0.15s, border-color 0.15s; }
.css-vzthl9:is(:disabled, [disabled], [data-disabled], [aria-disabled="true"]) { opacity: 0.5; cursor: default; }
@media (hover: hover) {
  .css-vzthl9:is(:hover, [data-hover]):not(:disabled, [data-disabled]) { background: rgba(247, 249, 243, 0.12); --bg-currentcolor: rgba(247, 249, 243, 0.12); }
}
.css-x46cr6 { display: flex; flex-direction: row; gap: var(--gaydev-spacing-2); }
.css-1gfgr42, .css-r3tfnr, .css-zggv8r { display: flex; flex-direction: column; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center; padding-inline: var(--gaydev-spacing-4); padding-block: var(--gaydev-spacing-2); border-radius: 8px; cursor: pointer; transition: background 0.15s; }
.css-1gfgr42 { border: 1px solid rgb(104, 136, 54); background: radial-gradient(80% 90% at 50% 100%, rgba(182, 238, 95, 0.8) 0%, rgba(182, 238, 95, 0) 100%), linear-gradient(rgba(104, 136, 54, 0.6) 0%, rgba(182, 238, 95, 0.6) 100%); --bg-currentcolor: radial-gradient(80% 90% at 50% 100%, rgba(182, 238, 95, 0.8) 0%, rgba(182, 238, 95, 0) 100%),linear-gradient(180deg, rgba(104, 136, 54, 0.6) 0%, rgba(182, 238, 95, 0.6) 100%); }
.css-r3tfnr { border: 1px solid rgb(143, 75, 17); background: radial-gradient(80% 90% at 50% 100%, rgba(235, 127, 32, 0.8) 0%, rgba(235, 127, 32, 0) 100%), linear-gradient(rgba(143, 75, 17, 0.6) 0%, rgba(229, 144, 70, 0.6) 100%); --bg-currentcolor: radial-gradient(80% 90% at 50% 100%, rgba(235, 127, 32, 0.8) 0%, rgba(235, 127, 32, 0) 100%), linear-gradient(180deg, rgba(143, 75, 17, 0.6) 0%, rgba(229, 144, 70, 0.6) 100%); }
.css-zggv8r { border: 1px solid rgb(143, 17, 40); background: radial-gradient(80% 90% at 50% 100%, rgba(235, 32, 69, 0.8) 0%, rgba(235, 32, 69, 0) 100%), linear-gradient(rgba(143, 17, 40, 0.6) 0%, rgba(229, 70, 99, 0.6) 100%); --bg-currentcolor: radial-gradient(80% 90% at 50% 100%, rgba(235, 32, 69, 0.8) 0%, rgba(235, 32, 69, 0) 100%), linear-gradient(180deg, rgba(143, 17, 40, 0.6) 0%, rgba(229, 70, 99, 0.6) 100%); }
.css-ahd632 { font-size: 14px; font-weight: 600; color: rgba(255, 255, 255, 0.6); white-space: nowrap; }
.css-hx1uwf { font-family: "Santa Maria Sans", sans-serif; font-weight: 900; font-size: 18px; line-height: 1.1; color: var(--gaydev-colors-white); }
.css-hb60pm { display: flex; flex-direction: column; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center; padding-inline: var(--gaydev-spacing-4); padding-block: var(--gaydev-spacing-2); border-radius: 8px; border-width: 1px; border-style: solid; border-image: none; border-color: var(--gaydev-colors-transparent); background: var(--gaydev-colors-upgrade-islands-1); --bg-currentcolor: var(--gaydev-colors-upgrade-islands-1); cursor: pointer; transition: background 0.15s; }
@media (hover: hover) {
  .css-hb60pm:is(:hover, [data-hover]):not(:disabled, [data-disabled]) { background: rgba(247, 249, 243, 0.15); --bg-currentcolor: rgba(247, 249, 243, 0.15); }
}
.css-jtyvk4 { font-size: 14px; font-weight: 600; color: rgba(255, 255, 255, 0.4); white-space: nowrap; }
.css-ppbv85 { font-family: "Santa Maria Sans", sans-serif; font-weight: 900; font-size: 18px; line-height: 1.1; color: rgba(255, 255, 255, 0.4); }
.css-1yqr6l8 { display: flex; align-items: flex-end; -webkit-box-pack: justify; justify-content: space-between; flex-direction: column; gap: 0px; height: 48px; }
.css-1yjdm1g { font-size: 13px; font-weight: 600; color: var(--gaydev-colors-upgrade-secondary); white-space: nowrap; }
@media screen and (min-width: 30rem) {
  .css-1yjdm1g { font-size: 13px; }
}
@media screen and (min-width: 48rem) {
  .css-1yjdm1g { font-size: 16px; }
}
.css-kcs26x { color: var(--gaydev-colors-upgrade-accent); }
.css-zpd0pq { display: flex; -webkit-box-align: center; align-items: center; flex-direction: row; gap: 6px; }
.css-1ml5o9n { display: flex; -webkit-box-align: baseline; align-items: baseline; flex-direction: row; gap: 2px; }
.css-1yaczdw { font-size: 12px; font-weight: 700; background-image: var(--gaydev-colors-upgrade-silver_grad-50); --bg-currentcolor: var(--gaydev-colors-upgrade-silver_grad-50); color: transparent; -webkit-background-clip: text; background-clip: text; }
.css-lj64ws { font-weight: 700; }
@layer recipes {
  .css-lj64ws { font-family: var(--gaydev-fonts-heading); font-weight: var(--gaydev-font-weights-semibold); font-size: var(--gaydev-font-sizes-sm); line-height: 1.25rem; }
  @media screen and (min-width: 30rem) {
  .css-lj64ws { font-size: var(--gaydev-font-sizes-sm); line-height: 1.25rem; }
}
  @media screen and (min-width: 48rem) {
  .css-lj64ws { font-size: var(--gaydev-font-sizes-md); line-height: 1.5rem; }
}
}
.css-1gomreu { position: relative; display: inline-block; }
.css-h112mx { display: block; background-image: var(--gaydev-colors-upgrade-silver_grad-100); --bg-currentcolor: var(--gaydev-colors-upgrade-silver_grad-100); color: transparent; -webkit-background-clip: text; background-clip: text; }
.css-1dyit6a { align-self: center; display: inline-flex; }
.css-1w9qlfj { position: relative; z-index: 1; align-self: stretch; margin-inline: calc(var(--gaydev-spacing-4) * -1); margin-top: 0px; overflow: hidden; }
@media screen and (min-width: 30rem) {
  .css-1w9qlfj { margin-inline: calc(var(--gaydev-spacing-8) * -1); margin-top: 0px; overflow: hidden; }
}
@media screen and (min-width: 48rem) {
  .css-1w9qlfj { margin-inline: 0px; margin-top: -28px; overflow: visible; }
}
.css-1s5jchb { width: 132%; max-width: none; margin-left: -16%; margin-right: 0px; }
@media screen and (min-width: 30rem) {
  .css-1s5jchb { width: 132%; max-width: none; margin-left: -16%; margin-right: 0px; }
}
@media screen and (min-width: 48rem) {
  .css-1s5jchb { width: var(--gaydev-sizes-full); max-width: 1000px; margin-left: auto; margin-right: auto; }
}
.css-77hcw6 { position: relative; width: var(--gaydev-sizes-full); aspect-ratio: 1003 / 653; }
.css-1hrc1ke { position: absolute; inset: 0px; transform-origin: 50% 50%; will-change: transform; }
.css-1nbvkys { object-fit: cover; position: absolute; inset: 0px; width: var(--gaydev-sizes-full); height: var(--gaydev-sizes-full); }
.css-rc6hyh { display: grid; grid-template-rows: repeat(2, 1fr); grid-template-columns: repeat(5, 1fr); position: absolute; left: 17.95%; top: 20.5%; width: 64%; height: 48.1%; gap: 2.6% 1.25%; }
.css-2h612l { position: relative; }
.css-2h612l:hover .slot-remove { opacity: 1; }
.css-158b1mt { object-fit: cover; position: absolute; top: 2.58%; left: -5.33%; width: 113.1%; height: 110.3%; max-width: none; }
.css-9dfydv { position: absolute; inset: 0px; display: flex; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center; font-family: "Santa Maria Sans", sans-serif; font-weight: 900; font-size: clamp(14px, 3.6cqw, 40px); color: rgba(126, 127, 124, 0.45); user-select: none; }
.css-kxtgq8 { object-fit: cover; position: absolute; top: 0px; left: 0px; width: var(--gaydev-sizes-full); pointer-events: none; }
.css-z8dw9e { position: absolute; left: 0px; right: 0px; top: 13.32%; height: var(--gaydev-sizes-full); pointer-events: none; }
.css-t9kglg { display: flex; -webkit-box-align: center; align-items: center; flex-direction: row; gap: var(--gaydev-spacing-2); width: var(--gaydev-sizes-full); max-width: 1000px; padding: var(--gaydev-spacing-6); margin-top: -16px; z-index: 2; border-radius: 16px; border: 1px solid var(--gaydev-colors-upgrade-stroke-10); background: var(--gaydev-colors-upgrade-islands-1); --bg-currentcolor: var(--gaydev-colors-upgrade-islands-1); backdrop-filter: blur(16px); }
.css-1aar1om { display: flex; -webkit-box-align: center; align-items: center; flex-direction: row; gap: var(--gaydev-spacing-3); flex: 1 1 0%; }
.css-513gmy { display: flex; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center; width: 48px; height: 48px; flex-shrink: 0; border-radius: 8px; border: 1px solid var(--gaydev-colors-upgrade-stroke-10); background: var(--gaydev-colors-upgrade-islands-1); --bg-currentcolor: var(--gaydev-colors-upgrade-islands-1); color: var(--gaydev-colors-upgrade-secondary); cursor: pointer; transition: background 0.15s; }
@media (hover: hover) {
  .css-513gmy:is(:hover, [data-hover]):not(:disabled, [data-disabled]) { background: rgba(247, 249, 243, 0.15); --bg-currentcolor: rgba(247, 249, 243, 0.15); }
}
.css-1pey5tw { display: flex; -webkit-box-pack: justify; justify-content: space-between; flex-direction: column; gap: 0px; height: 48px; }
.css-e6xyeo { font-size: 16px; font-weight: 600; color: var(--gaydev-colors-upgrade-secondary); }
.css-1mlvmbj { display: flex; -webkit-box-align: center; align-items: center; flex-direction: row; gap: 4px; }
.css-133sul7 { font-weight: 700; }
@layer recipes {
  .css-133sul7 { font-family: var(--gaydev-fonts-heading); font-weight: var(--gaydev-font-weights-semibold); font-size: var(--gaydev-font-sizes-md); line-height: 1.5rem; }
}
.css-1c4mimo, .css-1hqmryg, .css-x00f7m { display: flex; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center; gap: 12px; height: 56px; padding-inline: var(--gaydev-spacing-8); border-radius: 12px; border: 2px solid rgba(15, 28, 3, 0.2); background: linear-gradient(rgb(176, 219, 62) 0%, rgb(101, 123, 42) 100%); --bg-currentcolor: linear-gradient(180deg, #B0DB3E 0%, #657B2A 100%); box-shadow: rgba(203, 216, 166, 0.2) 0px 2px 8px inset, rgba(0, 0, 0, 0.2) 0px -2px 8px inset; color: rgb(16, 29, 3); font-weight: 800; font-size: 18px; text-transform: uppercase; white-space: nowrap; transition: opacity 0.2s, filter 0.2s; }
.css-1c4mimo { cursor: not-allowed; opacity: 0.5; }
.css-1hqmryg, .css-x00f7m { cursor: pointer; opacity: 1; gap: 12px; }
.css-x00f7m { gap: 10px; }
@media screen and (min-width: 30rem) {
  .css-1c4mimo, .css-1hqmryg, .css-x00f7m { height: 56px; font-size: 18px; }
}
@media screen and (min-width: 48rem) {
  .css-1c4mimo, .css-1hqmryg, .css-x00f7m { height: 68px; font-size: 20px; }
}
@media (hover: hover) {
  .css-1hqmryg:is(:hover, [data-hover]):not(:disabled, [data-disabled]),
  .css-x00f7m:is(:hover, [data-hover]):not(:disabled, [data-disabled]) { filter: brightness(1.05); }
}
.css-19vtzv4 { display: flex; -webkit-box-align: center; align-items: center; flex-direction: row; gap: 4px; padding-inline: 10px; padding-block: 4px; border-radius: 8px; background: rgba(16, 29, 3, 0.6); --bg-currentcolor: rgba(16, 29, 3, 0.6); }
.css-g7m9oy { font-size: 16px; font-weight: 700; color: var(--gaydev-colors-upgrade-accent); }
.css-mytnjw { display: flex; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center; width: 56px; height: 56px; flex-shrink: 0; border-radius: 12px; border: 1px solid var(--gaydev-colors-upgrade-stroke-10); background: var(--gaydev-colors-upgrade-islands-1); --bg-currentcolor: var(--gaydev-colors-upgrade-islands-1); color: var(--gaydev-colors-upgrade-secondary); cursor: pointer; transition: background 0.15s; }
@media screen and (min-width: 30rem) {
  .css-mytnjw { width: 56px; height: 56px; }
}
@media screen and (min-width: 48rem) {
  .css-mytnjw { width: 68px; height: 68px; }
}
@media (hover: hover) {
  .css-mytnjw:is(:hover, [data-hover]):not(:disabled, [data-disabled]) { background: rgba(247, 249, 243, 0.15); --bg-currentcolor: rgba(247, 249, 243, 0.15); color: var(--gaydev-colors-upgrade-primary); }
}
.css-1opdcv4 { display: flex; -webkit-box-align: center; align-items: center; -webkit-box-pack: end; justify-content: flex-end; flex-direction: row; gap: var(--gaydev-spacing-2); flex: 1 1 0%; }
.css-11m8ycb { display: flex; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center; flex-shrink: 0; width: 36px; height: 36px; border-radius: var(--gaydev-radii-full); border-width: 1px; border-style: solid; border-image: none; border-color: var(--gaydev-colors-white-alpha-300); background: var(--gaydev-colors-white-alpha-100); --bg-currentcolor: var(--gaydev-colors-white-alpha-100); backdrop-filter: blur(8px); color: var(--gaydev-colors-white-alpha-800); opacity: 1; cursor: pointer; transition: opacity 0.15s, background 0.15s, border-color 0.15s; }
@media (hover: hover) {
  .css-11m8ycb:is(:hover, [data-hover]):not(:disabled, [data-disabled]) { background: var(--gaydev-colors-white-alpha-200); --bg-currentcolor: var(--gaydev-colors-white-alpha-200); border-color: var(--gaydev-colors-white-alpha-400); }
}
.css-3pfkfu { display: flex; flex-direction: column; gap: var(--gaydev-spacing-4); width: var(--gaydev-sizes-full); max-width: 1000px; padding: var(--gaydev-spacing-3); border-width: 1px; border-style: solid; border-image: none; border-color: var(--gaydev-colors-upgrade-stroke-10); background: var(--gaydev-colors-upgrade-skins-islands); --bg-currentcolor: var(--gaydev-colors-upgrade-skins-islands); backdrop-filter: blur(4px); border-radius: 16px; }
@media screen and (min-width: 30rem) {
  .css-3pfkfu { padding: var(--gaydev-spacing-3); }
}
@media screen and (min-width: 48rem) {
  .css-3pfkfu { padding: var(--gaydev-spacing-6); }
}
.css-9kqmtr { display: flex; -webkit-box-align: center; align-items: center; flex-direction: row; gap: var(--gaydev-spacing-3); }
.css-1gz8egc { background-image: var(--gaydev-colors-upgrade-silver_grad-100); --bg-currentcolor: var(--gaydev-colors-upgrade-silver_grad-100); color: transparent; -webkit-background-clip: text; background-clip: text; font-weight: 700; text-transform: uppercase; }
@layer recipes {
  .css-1gz8egc { font-family: var(--gaydev-fonts-heading); font-weight: var(--gaydev-font-weights-semibold); font-size: var(--gaydev-font-sizes-md); line-height: 1.5rem; }
  @media screen and (min-width: 30rem) {
  .css-1gz8egc { font-size: var(--gaydev-font-sizes-md); line-height: 1.5rem; }
}
  @media screen and (min-width: 48rem) {
  .css-1gz8egc { font-size: var(--gaydev-font-sizes-xl); line-height: 1.875rem; }
}
}
.css-1ig4hlk { display: flex; flex-direction: row; gap: var(--gaydev-spacing-2); align-self: stretch; }
.css-1fx9uib { -webkit-box-align: center; align-items: center; -webkit-box-pack: start; justify-content: flex-start; width: var(--gaydev-sizes-full); height: 48px; border-radius: 8px; }
@layer recipes {
  .css-1fx9uib { display: inline-flex; gap: var(--group-gap, 0.5rem); isolation: isolate; position: relative; flex-direction: row; }
  .css-1fx9uib [data-group-item]:is(:focus-visible, [data-focus-visible]) { z-index: 1; }
}
.css-1fx9uib :where(svg) { width: 24px; height: 24px; }
.css-l205fh { pointer-events: none; }
@layer recipes {
  .css-l205fh { display: flex; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center; position: absolute; z-index: 2; color: var(--gaydev-colors-fg-muted); height: var(--gaydev-sizes-full); font-size: var(--gaydev-font-sizes-sm); padding-inline: var(--gaydev-spacing-3); }
}
.css-1goi2xe { padding: 16px; height: 48px; border-radius: 8px; background: var(--gaydev-colors-upgrade-islands-1); --bg-currentcolor: var(--gaydev-colors-upgrade-islands-1); color: var(--gaydev-colors-white); font-size: var(--gaydev-font-sizes-lg); font-weight: 600; border-width: 1px; border-style: solid; border-image: none; border-color: var(--gaydev-colors-upgrade-stroke-10); padding-inline-start: calc(var(--input-height) - 0px); }
@layer recipes {
  .css-1goi2xe { width: 100%; min-width: var(--input-height); outline: 0px; position: relative; appearance: none; text-align: start; border-radius: var(--gaydev-radii-l2); height: var(--input-height); --focus-color: var(--gaydev-colors-color-palette-focus-ring); --error-color: var(--gaydev-colors-border-error); font-size: var(--gaydev-font-sizes-sm); line-height: 1.25rem; padding-inline: var(--gaydev-spacing-3); --input-height: var(--gaydev-sizes-10); background: var(--gaydev-colors-transparent); --bg-currentcolor: var(--gaydev-colors-transparent); border-width: 1px; border-color: var(--gaydev-colors-border); --focus-ring-color: var(--focus-color); }
  .css-1goi2xe:is(:disabled, [disabled], [data-disabled], [aria-disabled="true"]) { opacity: 0.5; cursor: not-allowed; }
  .css-1goi2xe:is([data-invalid], [aria-invalid="true"], [data-state="invalid"]) { --focus-ring-color: var(--error-color); border-color: var(--error-color); }
  .css-1goi2xe:is(:focus-visible, [data-focus-visible]) { outline-offset: 0px; outline-width: var(--focus-ring-width, 1px); outline-color: var(--focus-ring-color); outline-style: var(--focus-ring-style, solid); border-color: var(--focus-ring-color); }
}
.css-1goi2xe::-webkit-input-placeholder { color: var(--gaydev-colors-text-tretiary); }
.css-1goi2xe::placeholder, .css-1goi2xe[data-placeholder] { color: var(--gaydev-colors-text-tretiary); }
.css-ntdgz6 { display: flex; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center; flex-direction: row; gap: var(--gaydev-spacing-2); max-width: 120px; width: var(--gaydev-sizes-full); height: 48px; background: var(--gaydev-colors-upgrade-islands-1); --bg-currentcolor: var(--gaydev-colors-upgrade-islands-1); border-radius: 8px; border: 1px solid var(--gaydev-colors-upgrade-stroke-10); padding-inline: var(--gaydev-spacing-4); cursor: pointer; font-weight: 400; color: var(--gaydev-colors-upgrade-secondary); user-select: none; }
.css-ntdgz6 :where(svg) { width: 24px; height: 24px; }
@media screen and (min-width: 30rem) {
  .css-ntdgz6 { max-width: 120px; }
}
@media screen and (min-width: 48rem) {
  .css-ntdgz6 { max-width: 150px; }
}
.css-156hvjg { min-height: 200px; }
@layer recipes {
  .css-156hvjg { display: flex; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center; }
}
.css-s8q5db { display: flex; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center; flex-direction: column; gap: var(--gaydev-spacing-4); text-align: center; padding-block: var(--gaydev-spacing-16); }
.css-1kgu1w3 { object-fit: cover; width: 128px; height: 128px; }
.css-2h3gk4 { display: flex; -webkit-box-align: center; align-items: center; flex-direction: column; gap: 2px; max-width: 266px; }
.css-1bdslz { font-weight: 700; color: var(--gaydev-colors-upgrade-primary); }
@layer recipes {
  .css-1bdslz { font-family: var(--gaydev-fonts-heading); font-weight: var(--gaydev-font-weights-semibold); font-size: var(--gaydev-font-sizes-md); line-height: 1.5rem; }
}
.css-1gb5b2t { font-weight: 400; color: var(--gaydev-colors-upgrade-secondary); }
.css-1pieh41 { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: var(--gaydev-spacing-1); }
@media screen and (min-width: 30rem) {
  .css-1pieh41 { grid-template-columns: repeat(2, minmax(0px, 1fr)); }
}
@media screen and (min-width: 48rem) {
  .css-1pieh41 { grid-template-columns: repeat(3, minmax(0px, 1fr)); }
}
@media screen and (min-width: 64rem) {
  .css-1pieh41 { grid-template-columns: repeat(4, minmax(0px, 1fr)); }
}
@media screen and (min-width: 80rem) {
  .css-1pieh41 { grid-template-columns: repeat(5, minmax(0px, 1fr)); }
}
.css-dfpqc0 { position: relative; cursor: pointer; }
.css-1kanb0t { display: flex; -webkit-box-pack: justify; justify-content: space-between; flex-direction: column; gap: 0.5rem; height: 144px; padding-inline: var(--gaydev-spacing-4); padding-top: var(--gaydev-spacing-1); padding-bottom: var(--gaydev-spacing-3); user-select: none; border-radius: 10px; --backdrop-blur: blur(blur(16px)); border: 1px solid var(--gaydev-colors-upgrade-stroke-10); opacity: 1; transition: opacity 0.15s; background: radial-gradient(84.73% 50.69% at 51% 20.49%, rgba(103, 128, 216, 0.17) 0%, rgba(103, 128, 216, 0) 100%), rgba(247, 249, 243, 0.01); --bg-currentcolor: radial-gradient(84.73% 50.69% at 51% 20.49%, rgba(103, 128, 216, 0.17) 0%, rgba(103, 128, 216, 0.00) 100%),rgba(247, 249, 243, 0.01); }
@layer recipes {
  .css-d82rsv { display: flex; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center; }
}
.css-gfmpii { display: flex; flex-direction: column; gap: 0px; }
.css-1tdm5eo { font-size: var(--gaydev-font-sizes-xs); color: var(--gaydev-colors-upgrade-secondary); text-overflow: ellipsis; text-wrap: nowrap; overflow: hidden; font-weight: 400; }
.css-1322mbj { background: var(--gaydev-colors-upgrade-islands-1); --bg-currentcolor: var(--gaydev-colors-upgrade-islands-1); }
@layer recipes {
  .css-1322mbj { display: inline-flex; -webkit-box-align: center; align-items: center; border-radius: var(--gaydev-radii-l2); gap: var(--gaydev-spacing-1); font-weight: var(--gaydev-font-weights-medium); font-variant-numeric: tabular-nums; white-space: nowrap; user-select: none; background: var(--gaydev-colors-color-palette-subtle); --bg-currentcolor: var(--gaydev-colors-color-palette-subtle); color: var(--gaydev-colors-color-palette-fg); font-size: var(--gaydev-font-sizes-2xs); line-height: 0.75rem; padding-inline: var(--gaydev-spacing-1); min-height: var(--gaydev-sizes-4); }
}
.css-7cc9uc { font-size: var(--gaydev-font-sizes-xs); color: var(--gaydev-colors-upgrade-secondary_light); text-overflow: ellipsis; text-wrap: nowrap; overflow: hidden; font-weight: 400; }
.css-9hjtr8 { display: flex; -webkit-box-align: center; align-items: center; flex-direction: row; gap: 2px; }
.css-6p5vf6 { color: var(--gaydev-colors-upgrade-accent); font-weight: 600; }
@layer recipes {
  .css-6p5vf6 { font-family: var(--gaydev-fonts-heading); font-weight: var(--gaydev-font-weights-semibold); font-size: var(--gaydev-font-sizes-sm); line-height: 1.25rem; }
}

.css-1kanb0t[data-in="true"] { opacity: 0.4; }
.css-1kanb0t[data-rarity="common"] { background: radial-gradient(84.73% 50.69% at 51% 20.49%, rgba(182, 205, 250, 0.17) 0%, rgba(182, 205, 250, 0) 100%), rgba(247, 249, 243, 0.01); }
.css-1kanb0t[data-rarity="uncommon"], .css-1kanb0t[data-rarity="blue"] { background: radial-gradient(84.73% 50.69% at 51% 20.49%, rgba(103, 128, 216, 0.17) 0%, rgba(103, 128, 216, 0) 100%), rgba(247, 249, 243, 0.01); }
.css-1kanb0t[data-rarity="pink"], .css-1kanb0t[data-rarity="mythical"] { background: radial-gradient(84.73% 50.69% at 51% 20.49%, rgba(150, 93, 255, 0.17) 0%, rgba(150, 93, 255, 0) 100%), rgba(247, 249, 243, 0.01); }
.css-1kanb0t[data-rarity="purple"] { background: radial-gradient(84.73% 50.69% at 51% 20.49%, rgba(227, 82, 244, 0.17) 0%, rgba(227, 82, 244, 0) 100%), rgba(247, 249, 243, 0.01); }
.css-1kanb0t[data-rarity="red"], .css-1kanb0t[data-rarity="ancient"] { background: radial-gradient(84.73% 50.69% at 51% 20.49%, rgba(235, 84, 84, 0.17) 0%, rgba(235, 84, 84, 0) 100%), rgba(247, 249, 243, 0.01); }
.css-1kanb0t[data-rarity="gold"], .css-1kanb0t[data-rarity="legendary"] { background: radial-gradient(84.73% 50.69% at 51% 20.49%, rgba(235, 162, 84, 0.17) 0%, rgba(235, 162, 84, 0) 100%), rgba(247, 249, 243, 0.01); }
.css-dfpqc0 .css-in-tag { position: absolute; inset: 0; border-radius: 10px; display: flex; align-items: flex-start; padding: 8px 12px; pointer-events: none; }
.css-dfpqc0 .css-in-tag span { display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; border-radius: 8px; background: #1B1D1B; border: 1px solid var(--gaydev-colors-upgrade-stroke-10); color: var(--gaydev-colors-upgrade-primary); font-size: 13px; font-weight: 600; white-space: nowrap; }
.slot-remove { position: absolute; top: 6%; right: 6%; display: flex; align-items: center; justify-content: center; width: 22%; max-width: 24px; aspect-ratio: 1 / 1; border-radius: 6px; background: rgba(16, 17, 20, 0.7); color: var(--gaydev-colors-upgrade-secondary); opacity: 1; transition: opacity 0.15s; cursor: pointer; z-index: 2; }
@media (min-width: 48rem) { .slot-remove { opacity: 0; } }
.slot-remove:hover { color: var(--gaydev-colors-upgrade-primary); }
.css-slot-fill { position: absolute; inset: 0; }
.css-158b1mt[data-filled="true"] { left: -15.98%; width: 123.8%; }
.css-slot-skin { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 82%; pointer-events: none; }
.css-1hf6k5o { position: absolute; left: 31.4%; top: 23.6%; width: 37.2%; aspect-ratio: 389 / 272; }
.css-bdjy2k { position: absolute; inset: 5%; border-radius: 8% / 12%; overflow: hidden; pointer-events: none; }
.css-ef0cfl { position: absolute; inset: 0px; background: radial-gradient(62% 58% at 50% 100%, rgba(182, 238, 95, 0.55) 0%, rgba(182, 238, 95, 0) 100%); --bg-currentcolor: radial-gradient(62% 58% at 50% 100%, rgba(182, 238, 95, 0.55) 0%, rgba(182, 238, 95, 0) 100%); }
.css-56ylaa { object-fit: cover; position: absolute; left: 50%; top: 44%; transform: translate(-50%, -50%); width: 66%; }
.css-16tf50r { display: flex; flex-direction: column; gap: 0px; position: absolute; left: 12%; bottom: 17%; max-width: 78%; text-align: start; overflow: hidden; }
.css-1s1ifbf { font-size: clamp(8px, 1.5cqw, 16px); line-height: 1.25; font-weight: 500; color: rgba(255, 255, 255, 0.6); text-wrap: nowrap; text-overflow: ellipsis; overflow: hidden; }
.css-1oxh79j { font-size: clamp(10px, 1.9cqw, 20px); line-height: 1.25; font-weight: 700; color: var(--gaydev-colors-white); text-wrap: nowrap; text-overflow: ellipsis; overflow: hidden; }
.css-1xd2b7 { position: absolute; top: 12%; right: 9%; color: rgba(255, 255, 255, 0.6); cursor: pointer; transition: color 0.15s; background: none; border: 0; padding: 0; }
@media (hover: hover) {
  .css-1xd2b7:is(:hover, [data-hover]):not(:disabled, [data-disabled]) { color: var(--gaydev-colors-white); }
}
.css-513gmy:disabled, .css-mytnjw:disabled, .css-x00f7m:disabled { opacity: 0.5; cursor: default; }