@property --brand {
  syntax: "<color>";
  inherits: true;
  initial-value: oklch(73.58% .2376 322.4);
}

@property --con-hue-opacity {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 0%;
}

@property --bg-stop-1 {
  syntax: "<color>";
  inherits: false;
  initial-value: #0000;
}

@property --bg-stop-2 {
  syntax: "<color>";
  inherits: false;
  initial-value: #0000;
}

@property --bg-stop-3 {
  syntax: "<color>";
  inherits: false;
  initial-value: #0000;
}

@property --bg-stop-4 {
  syntax: "<color>";
  inherits: false;
  initial-value: #0000;
}

@layer _.a {
  .lKPT0c {
    background: linear-gradient(to bottom,
      var(--lightningcss-light, #ffffffbf) var(--lightningcss-dark, #0006) 0% 37%,
      var(--lightningcss-light, #ffffff26) var(--lightningcss-dark, #0000001f) 83% 100%),
    radial-gradient(50% 50% at -20% 100%,
      rgb(from var(--lightningcss-light, oklch(from var(--brand) .9517 .0271 calc(h + 32.1))) var(--lightningcss-dark, oklch(from var(--brand) .5012 .1912 calc(h + -313.3))) r g b / var(--con-hue-opacity)),
      transparent),
    radial-gradient(70% 60% at 5% 80%,
      rgb(from var(--lightningcss-light, #fef6ff) var(--lightningcss-dark, oklch(from var(--brand) .4418 .1934 calc(h + -1.8))) r g b / var(--con-hue-opacity)),
      transparent),
    radial-gradient(70% 50% at 40% 80%,
      rgb(from var(--lightningcss-light, oklch(from var(--brand) .9564 .036 calc(h + .6))) var(--lightningcss-dark, oklch(from var(--brand) .3155 .1704 calc(h + -24.5))) r g b / var(--con-hue-opacity)),
      transparent),
    radial-gradient(circle at right bottom,
      var(--bg-stop-1) 0%,
      var(--bg-stop-2) 35%,
      var(--bg-stop-3) 82%,
      var(--bg-stop-4) 100%);
    --border-color: var(--lightningcss-light, oklch(from var(--brand) .7358 .2376 h / .1)) var(--lightningcss-dark, #ffffff0d);
    --inset-shadow-color: #ffffff0a;
    --drop-shadow-color: var(--lightningcss-light, oklch(from var(--brand) .5826 .2265 calc(h + -.4) / .05)) var(--lightningcss-dark, oklch(from var(--brand) .6617 .2508 calc(h + -.5) / .05));
    --prominent-outline-glow: ;
    box-shadow: var(--prominent-outline-glow)
    inset 0 0 0 1px var(--border-color),
    inset 0 6px 15px 0 var(--inset-shadow-color),
    inset 0 0 0 0 transparent, /* placeholder for generating state so transition is smooth */
    inset 0 -5px 21.6px 0 #ffffff0a,
    inset 0 24px 32px 0 #ffffff0a,
    0 -3px 10px 1px var(--drop-shadow-color);
    transition: --con-hue-opacity .7s cubic-bezier(.32, .72, 0, 1), --bg-stop-1 .7s cubic-bezier(.32, .72, 0, 1), --bg-stop-2 .7s cubic-bezier(.32, .72, 0, 1), --bg-stop-3 .7s cubic-bezier(.32, .72, 0, 1), --bg-stop-4 .7s cubic-bezier(.32, .72, 0, 1), box-shadow .7s cubic-bezier(.32, .72, 0, 1);

    &[data-variant="prominent"] {
      --prominent-outline-glow: 0 20px 20px -24px var(--lightningcss-light, oklch(from var(--brand) .8578 .1222 calc(h + .4))) var(--lightningcss-dark, oklch(from var(--brand) .3757 .1726 calc(h + -2.6))),
      inset 0 -20px 20px -24px var(--lightningcss-light, oklch(from var(--brand) .8578 .1222 calc(h + .4))) var(--lightningcss-dark, oklch(from var(--brand) .3757 .1726 calc(h + -2.6))),;

      &[data-focused] {
        --prominent-outline-glow: 0 20px 20px -24px transparent, inset 0 -20px 20px -24px transparent,;
      }
    }

    &[data-state="idle"] {
      &[data-variant="balanced"] {
        --con-hue-opacity: 12.5%;
        --bg-stop-1: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .9518 .0231 calc(h + -44.5)) 12.5%)) var(--lightningcss-dark, var(--lightningcss-light, #c2c2c2) var(--lightningcss-dark, #1b1b1b));
        --bg-stop-2: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .9132 .0721 calc(h + .1)) 12.5%)) var(--lightningcss-dark, color-mix(in srgb, var(--lightningcss-light, #f3f3f3) var(--lightningcss-dark, #222), oklch(from var(--brand) .2387 .1407 calc(h + -38.8)) 20%));
        --bg-stop-3: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .9552 .0222 calc(h + -294.6)) 12.5%)) var(--lightningcss-dark, color-mix(in srgb, var(--lightningcss-light, #f3f3f3) var(--lightningcss-dark, #222), oklch(from var(--brand) .2318 .1116 calc(h + -3.1)) 20%));
        --bg-stop-4: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .9508 .0433 calc(h + -243.9)) 12.5%)) var(--lightningcss-dark, color-mix(in srgb, var(--lightningcss-light, #f3f3f3) var(--lightningcss-dark, #222), oklch(from var(--brand) .2242 .072 calc(h + -288.8)) 20%));

        &[data-hovered] {
          --con-hue-opacity: 20%;
          --bg-stop-1: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .9518 .0231 calc(h + -44.5)) 30%)) var(--lightningcss-dark, var(--lightningcss-light, #929292) var(--lightningcss-dark, #141414));
          --bg-stop-2: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .9132 .0721 calc(h + .1)) 30%)) var(--lightningcss-dark, color-mix(in srgb, var(--lightningcss-light, #f3f3f3) var(--lightningcss-dark, #222), oklch(from var(--brand) .2387 .1407 calc(h + -38.8)) 40%));
          --bg-stop-3: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .9552 .0222 calc(h + -294.6)) 30%)) var(--lightningcss-dark, color-mix(in srgb, var(--lightningcss-light, #f3f3f3) var(--lightningcss-dark, #222), oklch(from var(--brand) .2318 .1116 calc(h + -3.1)) 40%));
          --bg-stop-4: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .9508 .0433 calc(h + -243.9)) 30%)) var(--lightningcss-dark, color-mix(in srgb, var(--lightningcss-light, #f3f3f3) var(--lightningcss-dark, #222), oklch(from var(--brand) .2242 .072 calc(h + -288.8)) 40%));
        }
      }

      &[data-variant="prominent"] {
        --con-hue-opacity: 75%;
        --bg-stop-1: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .9518 .0231 calc(h + -44.5)) 30%)) var(--lightningcss-dark, var(--lightningcss-light, #c2c2c2) var(--lightningcss-dark, #1b1b1b));
        --bg-stop-2: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .9132 .0721 calc(h + .1)) 30%)) var(--lightningcss-dark, color-mix(in srgb, var(--lightningcss-light, #f3f3f3) var(--lightningcss-dark, #222), oklch(from var(--brand) .2387 .1407 calc(h + -38.8)) 20%));
        --bg-stop-3: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .9552 .0222 calc(h + -294.6)) 30%)) var(--lightningcss-dark, color-mix(in srgb, var(--lightningcss-light, #f3f3f3) var(--lightningcss-dark, #222), oklch(from var(--brand) .2318 .1116 calc(h + -3.1)) 20%));
        --bg-stop-4: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .9508 .0433 calc(h + -243.9)) 30%)) var(--lightningcss-dark, color-mix(in srgb, var(--lightningcss-light, #f3f3f3) var(--lightningcss-dark, #222), oklch(from var(--brand) .2242 .072 calc(h + -288.8)) 20%));

        &[data-hovered] {
          --con-hue-opacity: 100%;
          --bg-stop-1: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .9518 .0231 calc(h + -44.5)) 30%)) var(--lightningcss-dark, var(--lightningcss-light, #929292) var(--lightningcss-dark, #141414));
          --bg-stop-2: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .9132 .0721 calc(h + .1)) 30%)) var(--lightningcss-dark, color-mix(in srgb, var(--lightningcss-light, #f3f3f3) var(--lightningcss-dark, #222), oklch(from var(--brand) .2387 .1407 calc(h + -38.8)) 40%));
          --bg-stop-3: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .9552 .0222 calc(h + -294.6)) 30%)) var(--lightningcss-dark, color-mix(in srgb, var(--lightningcss-light, #f3f3f3) var(--lightningcss-dark, #222), oklch(from var(--brand) .2318 .1116 calc(h + -3.1)) 40%));
          --bg-stop-4: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .9508 .0433 calc(h + -243.9)) 30%)) var(--lightningcss-dark, color-mix(in srgb, var(--lightningcss-light, #f3f3f3) var(--lightningcss-dark, #222), oklch(from var(--brand) .2242 .072 calc(h + -288.8)) 40%));
        }
      }

      &[data-variant="subtle"] {
        --con-hue-opacity: 0%;
        --bg-stop-1: var(--lightningcss-light, #fff) var(--lightningcss-dark, #222);
        --bg-stop-2: var(--lightningcss-light, #fff) var(--lightningcss-dark, #222);
        --bg-stop-3: var(--lightningcss-light, #fff) var(--lightningcss-dark, #222);
        --bg-stop-4: var(--lightningcss-light, #fff) var(--lightningcss-dark, #222);
        --border-color: var(--lightningcss-light, #0000000d) var(--lightningcss-dark, #ffffff0d);
        --drop-shadow-color: transparent;

        &[data-hovered] {
          --con-hue-opacity: 12.5%;
          --bg-stop-1: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .9518 .0231 calc(h + -44.5)) 30%)) var(--lightningcss-dark, var(--lightningcss-light, #929292) var(--lightningcss-dark, #141414));
          --bg-stop-2: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .9132 .0721 calc(h + .1)) 30%)) var(--lightningcss-dark, color-mix(in srgb, var(--lightningcss-light, #f3f3f3) var(--lightningcss-dark, #222), oklch(from var(--brand) .2387 .1407 calc(h + -38.8)) 40%));
          --bg-stop-3: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .9552 .0222 calc(h + -294.6)) 30%)) var(--lightningcss-dark, color-mix(in srgb, var(--lightningcss-light, #f3f3f3) var(--lightningcss-dark, #222), oklch(from var(--brand) .2318 .1116 calc(h + -3.1)) 40%));
          --bg-stop-4: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .9508 .0433 calc(h + -243.9)) 30%)) var(--lightningcss-dark, color-mix(in srgb, var(--lightningcss-light, #f3f3f3) var(--lightningcss-dark, #222), oklch(from var(--brand) .2242 .072 calc(h + -288.8)) 40%));
          --border-color: var(--lightningcss-light, oklch(from var(--brand) .7358 .2376 h / .1)) var(--lightningcss-dark, #ffffff0d);
          --drop-shadow-color: var(--lightningcss-light, oklch(from var(--brand) .5826 .2265 calc(h + -.4) / .05)) var(--lightningcss-dark, oklch(from var(--brand) .6617 .2508 calc(h + -.5) / .05));
        }
      }

      &[data-focused][data-focused] {
        --con-hue-opacity: 0%;
        --bg-stop-1: var(--lightningcss-light, #fff) var(--lightningcss-dark, #222);
        --bg-stop-2: var(--lightningcss-light, #fff) var(--lightningcss-dark, #222);
        --bg-stop-3: var(--lightningcss-light, #fff) var(--lightningcss-dark, #222);
        --bg-stop-4: var(--lightningcss-light, #fff) var(--lightningcss-dark, #222);
        --border-color: var(--lightningcss-light, #0000000d) var(--lightningcss-dark, #ffffff0d);
        --inset-shadow-color: transparent;
        --drop-shadow-color: transparent;
      }
    }

    &[data-state="generating"] {
      box-shadow: var(--prominent-outline-glow)
      inset 0 0 0 1px var(--border-color),
      inset 0 6px 15px 0 var(--inset-shadow-color),
      inset 0 -32px 100px -50px var(--lightningcss-light, #fef6ff) var(--lightningcss-dark, oklch(from var(--brand) .4418 .1934 calc(h + -1.8))),
      inset 0 -5px 21.6px 0 #ffffff0a,
      inset 0 24px 32px 0 #ffffff0a,
      0 -3px 10px 1px var(--drop-shadow-color),
      0 6px 83px rgb(from var(--lightningcss-light, oklch(from var(--brand) .8568 .0856 calc(h + 35.2))) var(--lightningcss-dark, oklch(from var(--brand) .2622 .105 calc(h + -314.8))) r g b / var(--spread-shadow-opacity));

      &[data-variant="balanced"] {
        --spread-shadow-opacity: 50%;
        --con-hue-opacity: 50%;
        --bg-stop-1: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .9063 .0456 calc(h + -45.1)) 50%)) var(--lightningcss-dark, var(--lightningcss-light, #7a7a7a) var(--lightningcss-dark, #111));
        --bg-stop-2: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .9564 .036 calc(h + .6)) 50%)) var(--lightningcss-dark, color-mix(in srgb, var(--lightningcss-light, #f3f3f3) var(--lightningcss-dark, #222), oklch(from var(--brand) .2665 .1587 calc(h + -40.2)) 50%));
        --bg-stop-3: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .9508 .0433 calc(h + -243.9)) 50%)) var(--lightningcss-dark, color-mix(in srgb, var(--lightningcss-light, #f3f3f3) var(--lightningcss-dark, #222), oklch(from var(--brand) .258 .0855 calc(h + -290.4)) 50%));
        --bg-stop-4: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .8578 .1222 calc(h + .4)) 50%)) var(--lightningcss-dark, color-mix(in srgb, var(--lightningcss-light, #f3f3f3) var(--lightningcss-dark, #222), oklch(from var(--brand) .3757 .1726 calc(h + -2.6)) 50%));

        &[data-hovered] {
          --con-hue-opacity: 100%;
          --bg-stop-1: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .9063 .0456 calc(h + -45.1)) 75%)) var(--lightningcss-dark, var(--lightningcss-light, #3d3d3d) var(--lightningcss-dark, #090909));
          --bg-stop-2: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .9564 .036 calc(h + .6)) 75%)) var(--lightningcss-dark, color-mix(in srgb, var(--lightningcss-light, #f3f3f3) var(--lightningcss-dark, #222), oklch(from var(--brand) .2665 .1587 calc(h + -40.2)) 75%));
          --bg-stop-3: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .9508 .0433 calc(h + -243.9)) 75%)) var(--lightningcss-dark, color-mix(in srgb, var(--lightningcss-light, #f3f3f3) var(--lightningcss-dark, #222), oklch(from var(--brand) .258 .0855 calc(h + -290.4)) 75%));
          --bg-stop-4: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .8578 .1222 calc(h + .4)) 75%)) var(--lightningcss-dark, color-mix(in srgb, var(--lightningcss-light, #f3f3f3) var(--lightningcss-dark, #222), oklch(from var(--brand) .3757 .1726 calc(h + -2.6)) 75%));
        }
      }

      &[data-variant="prominent"] {
        --spread-shadow-opacity: 50%;
        --con-hue-opacity: 75%;
        --bg-stop-1: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .9063 .0456 calc(h + -45.1)) 100%)) var(--lightningcss-dark, var(--lightningcss-light, #3d3d3d) var(--lightningcss-dark, #090909));
        --bg-stop-2: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .9564 .036 calc(h + .6)) 100%)) var(--lightningcss-dark, color-mix(in srgb, var(--lightningcss-light, #f3f3f3) var(--lightningcss-dark, #222), oklch(from var(--brand) .2665 .1587 calc(h + -40.2)) 75%));
        --bg-stop-3: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .9508 .0433 calc(h + -243.9)) 100%)) var(--lightningcss-dark, color-mix(in srgb, var(--lightningcss-light, #f3f3f3) var(--lightningcss-dark, #222), oklch(from var(--brand) .258 .0855 calc(h + -290.4)) 75%));
        --bg-stop-4: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .8578 .1222 calc(h + .4)) 100%)) var(--lightningcss-dark, color-mix(in srgb, var(--lightningcss-light, #f3f3f3) var(--lightningcss-dark, #222), oklch(from var(--brand) .3757 .1726 calc(h + -2.6)) 75%));

        &[data-hovered] {
          --con-hue-opacity: 100%;
          --bg-stop-1: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .9063 .0456 calc(h + -45.1)) 100%)) var(--lightningcss-dark, var(--lightningcss-light, #000) var(--lightningcss-dark, #000));
          --bg-stop-2: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .9564 .036 calc(h + .6)) 100%)) var(--lightningcss-dark, color-mix(in srgb, var(--lightningcss-light, #f3f3f3) var(--lightningcss-dark, #222), oklch(from var(--brand) .2665 .1587 calc(h + -40.2)) 100%));
          --bg-stop-3: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .9508 .0433 calc(h + -243.9)) 100%)) var(--lightningcss-dark, color-mix(in srgb, var(--lightningcss-light, #f3f3f3) var(--lightningcss-dark, #222), oklch(from var(--brand) .258 .0855 calc(h + -290.4)) 100%));
          --bg-stop-4: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .8578 .1222 calc(h + .4)) 100%)) var(--lightningcss-dark, color-mix(in srgb, var(--lightningcss-light, #f3f3f3) var(--lightningcss-dark, #222), oklch(from var(--brand) .3757 .1726 calc(h + -2.6)) 100%));
        }
      }

      &[data-variant="subtle"] {
        --spread-shadow-opacity: 30%;
        --con-hue-opacity: 20%;
        --bg-stop-1: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .9063 .0456 calc(h + -45.1)) 20%)) var(--lightningcss-dark, var(--lightningcss-light, #c2c2c2) var(--lightningcss-dark, #1b1b1b));
        --bg-stop-2: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .9564 .036 calc(h + .6)) 20%)) var(--lightningcss-dark, color-mix(in srgb, var(--lightningcss-light, #f3f3f3) var(--lightningcss-dark, #222), oklch(from var(--brand) .2665 .1587 calc(h + -40.2)) 20%));
        --bg-stop-3: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .9508 .0433 calc(h + -243.9)) 20%)) var(--lightningcss-dark, color-mix(in srgb, var(--lightningcss-light, #f3f3f3) var(--lightningcss-dark, #222), oklch(from var(--brand) .258 .0855 calc(h + -290.4)) 20%));
        --bg-stop-4: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .8578 .1222 calc(h + .4)) 20%)) var(--lightningcss-dark, color-mix(in srgb, var(--lightningcss-light, #f3f3f3) var(--lightningcss-dark, #222), oklch(from var(--brand) .3757 .1726 calc(h + -2.6)) 20%));

        &[data-hovered] {
          --con-hue-opacity: 75%;
          --bg-stop-1: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .9063 .0456 calc(h + -45.1)) 20%)) var(--lightningcss-dark, var(--lightningcss-light, #c2c2c2) var(--lightningcss-dark, #1b1b1b));
          --bg-stop-2: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .9564 .036 calc(h + .6)) 20%)) var(--lightningcss-dark, color-mix(in srgb, var(--lightningcss-light, #f3f3f3) var(--lightningcss-dark, #222), oklch(from var(--brand) .2665 .1587 calc(h + -40.2)) 20%));
          --bg-stop-3: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .9508 .0433 calc(h + -243.9)) 20%)) var(--lightningcss-dark, color-mix(in srgb, var(--lightningcss-light, #f3f3f3) var(--lightningcss-dark, #222), oklch(from var(--brand) .258 .0855 calc(h + -290.4)) 20%));
          --bg-stop-4: var(--lightningcss-light, color-mix(in srgb, white, oklch(from var(--brand) .8578 .1222 calc(h + .4)) 20%)) var(--lightningcss-dark, color-mix(in srgb, var(--lightningcss-light, #f3f3f3) var(--lightningcss-dark, #222), oklch(from var(--brand) .3757 .1726 calc(h + -2.6)) 20%));
        }
      }
    }
  }

  ._0FXKed {
    --outer-drop-shadow-color: var(--lightningcss-light, oklch(from var(--brand) .7358 .2376 h / .1)) var(--lightningcss-dark, oklch(from var(--brand) .6617 .2508 calc(h + -.5) / 0));
    background: linear-gradient(to right,
    var(--bg-stop-1) 0%,
    var(--bg-stop-2) 37%,
    var(--bg-stop-3) 77%);
    box-shadow: 0 2px 4px var(--outer-drop-shadow-color),
    0 6px 16px -10px var(--outer-border-hue);
    border-radius: 30px;
    padding: 6px;
    transition: --bg-stop-1 .7s cubic-bezier(.32, .72, 0, 1), --bg-stop-2 .7s cubic-bezier(.32, .72, 0, 1), --bg-stop-3 .7s cubic-bezier(.32, .72, 0, 1), box-shadow .7s cubic-bezier(.32, .72, 0, 1);

    &[data-variant="balanced"] {
      --outer-border-hue: var(--lightningcss-light, rgb(from oklch(from var(--brand) .675 .2134 calc(h + -292.3) / .5) r g b / 30%)) var(--lightningcss-dark, rgb(from oklch(from var(--brand) .2387 .1407 calc(h + -38.8)) r g b / 0%));
      --bg-stop-1: var(--lightningcss-light, rgb(from oklch(from var(--brand) .7358 .2376 h / .6) r g b / 3%)) var(--lightningcss-dark, var(--lightningcss-light, #fff) var(--lightningcss-dark, #ffffff05));
      --bg-stop-2: var(--lightningcss-light, rgb(from oklch(from var(--brand) .675 .2134 calc(h + -292.3) / .5) r g b / 3%)) var(--lightningcss-dark, var(--lightningcss-light, #fff) var(--lightningcss-dark, #ffffff05));
      --bg-stop-3: var(--lightningcss-light, rgb(from oklch(from var(--brand) .7878 .1692 calc(h + -254) / .4) r g b / 3%)) var(--lightningcss-dark, var(--lightningcss-light, #fff) var(--lightningcss-dark, #ffffff05));
    }

    &[data-variant="prominent"] {
      --outer-border-hue: var(--lightningcss-light, rgb(from oklch(from var(--brand) .675 .2134 calc(h + -292.3) / .5) r g b / 40%)) var(--lightningcss-dark, rgb(from oklch(from var(--brand) .2387 .1407 calc(h + -38.8)) r g b / 40%));
      --bg-stop-1: var(--lightningcss-light, rgb(from oklch(from var(--brand) .7358 .2376 h / .6) r g b / 4%)) var(--lightningcss-dark, rgb(from oklch(from var(--brand) .2318 .1116 calc(h + -3.1)) r g b / 40%));
      --bg-stop-2: var(--lightningcss-light, rgb(from oklch(from var(--brand) .675 .2134 calc(h + -292.3) / .5) r g b / 4%)) var(--lightningcss-dark, rgb(from oklch(from var(--brand) .2387 .1407 calc(h + -38.8)) r g b / 40%));
      --bg-stop-3: var(--lightningcss-light, rgb(from oklch(from var(--brand) .7878 .1692 calc(h + -254) / .4) r g b / 4%)) var(--lightningcss-dark, rgb(from oklch(from var(--brand) .2387 .1407 calc(h + -38.8)) r g b / 40%));

      &[data-state="idle"][data-focused] {
        --bg-stop-1: var(--lightningcss-light, #fff) var(--lightningcss-dark, #ffffff05);
        --bg-stop-2: var(--lightningcss-light, #fff) var(--lightningcss-dark, #ffffff05);
        --bg-stop-3: var(--lightningcss-light, #fff) var(--lightningcss-dark, #ffffff05);
      }
    }

    &[data-variant="subtle"] {
      --outer-drop-shadow-color: var(--lightningcss-light, #0000000d) var(--lightningcss-dark, #0000001a);
      --outer-border-hue: transparent;
      --bg-stop-1: var(--lightningcss-light, #fff) var(--lightningcss-dark, #ffffff05);
      --bg-stop-2: var(--lightningcss-light, #fff) var(--lightningcss-dark, #ffffff05);
      --bg-stop-3: var(--lightningcss-light, #fff) var(--lightningcss-dark, #ffffff05);

      &[data-hovered] {
        --outer-drop-shadow-color: var(--lightningcss-light, oklch(from var(--brand) .7358 .2376 h / .1)) var(--lightningcss-dark, oklch(from var(--brand) .6617 .2508 calc(h + -.5) / 0));
        --outer-border-hue: var(--lightningcss-light, rgb(from oklch(from var(--brand) .675 .2134 calc(h + -292.3) / .5) r g b / 20%)) var(--lightningcss-dark, rgb(from oklch(from var(--brand) .2387 .1407 calc(h + -38.8)) r g b / 0%));
        --bg-stop-1: var(--lightningcss-light, rgb(from oklch(from var(--brand) .7358 .2376 h / .6) r g b / 2%)) var(--lightningcss-dark, var(--lightningcss-light, #fff) var(--lightningcss-dark, #ffffff05));
        --bg-stop-2: var(--lightningcss-light, rgb(from oklch(from var(--brand) .675 .2134 calc(h + -292.3) / .5) r g b / 2%)) var(--lightningcss-dark, var(--lightningcss-light, #fff) var(--lightningcss-dark, #ffffff05));
        --bg-stop-3: var(--lightningcss-light, rgb(from oklch(from var(--brand) .7878 .1692 calc(h + -254) / .4) r g b / 2%)) var(--lightningcss-dark, var(--lightningcss-light, #fff) var(--lightningcss-dark, #ffffff05));
      }
    }

    &[data-state="idle"][data-focused] {
      --bg-stop-1: var(--lightningcss-light, #fff) var(--lightningcss-dark, #ffffff05);
      --bg-stop-2: var(--lightningcss-light, #fff) var(--lightningcss-dark, #ffffff05);
      --bg-stop-3: var(--lightningcss-light, #fff) var(--lightningcss-dark, #ffffff05);
      --outer-border-hue: transparent;
      --outer-drop-shadow-color: var(--lightningcss-light, #0000000d) var(--lightningcss-dark, #00000008);
    }
  }

  .sd16 {
    display: flex;
  }

  ._ta16 {
    flex-direction: column;
  }

  .Ul16 {
    row-gap: 1rem;
  }

  .ql16 {
    column-gap: 1rem;
  }

  .Tf16 {
    padding-top: 16px;
  }

  .Qf16 {
    padding-bottom: 16px;
  }

  .Sf16 {
    padding-inline-start: 16px;
  }

  .Rf16 {
    padding-inline-end: 16px;
  }

  .rD16 {
    cursor: text;
  }

  .oBqAurc16 {
    border-start-start-radius: 24px;
  }

  .nBqAurc16 {
    border-start-end-radius: 24px;
  }

  .kBqAurc16 {
    border-end-start-radius: 24px;
  }

  .jBqAurc16 {
    border-end-end-radius: 24px;
  }

  ._Pc16 {
    position: relative;
  }

  ._Ob16 {
    pointer-events: none;
  }

  ._Pa16 {
    position: absolute;
  }

  .Wr16 {
    top: 0;
  }

  ._Er16 {
    left: 0;
  }

  .Za16 {
    width: 100%;
  }

  .Fb16 {
    height: 100%;
  }

  ._oa16 {
    box-sizing: border-box;
  }

  .oi16 {
    border-start-start-radius: inherit;
  }

  .ni16 {
    border-start-end-radius: inherit;
  }

  .ki16 {
    border-end-start-radius: inherit;
  }

  .ji16 {
    border-end-end-radius: inherit;
  }

  .gC8EC8d16 {
    background-color: var(--lightningcss-light, #4b75ff1a) var(--lightningcss-dark, #4069fd1a);
  }

  ._jf16 {
    border-style: solid;
  }

  ._kc16 {
    border-top-width: 2px;
  }

  .hc16 {
    border-bottom-width: 2px;
  }

  .mc16 {
    border-inline-start-width: 2px;
  }

  .lc16 {
    border-inline-end-width: 2px;
  }

  .ix16 {
    border-color: var(--lightningcss-light, #4b75ff) var(--lightningcss-dark, #4069fd);
  }
}

@layer _.prose;
/*# sourceMappingURL=PromptFieldContainer.css.map */
