/*!*********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[13].oneOf[2].use[1]!../../node_modules/next/dist/build/webpack/loaders/next-font-loader/index.js??ruleSet[1].rules[13].oneOf[2].use[2]!../../node_modules/next/font/google/target.css?{"path":"app/layout.tsx","import":"Inter","arguments":[{"subsets":["latin","cyrillic"],"display":"swap","variable":"--font-sans"}],"variableName":"inter"} ***!
  \*********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/* cyrillic-ext */
@font-face {
  font-family: '__Inter_fcbcbf';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/_next/static/media/ba9851c3c22cd980-s.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: '__Inter_fcbcbf';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/_next/static/media/21350d82a1f187e9-s.p.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: '__Inter_fcbcbf';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/_next/static/media/c5fe6dc8356a8c31-s.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: '__Inter_fcbcbf';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/_next/static/media/19cfc7226ec3afaa-s.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: '__Inter_fcbcbf';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/_next/static/media/df0a9ae256c0569c-s.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: '__Inter_fcbcbf';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/_next/static/media/8e9860b6e62d6359-s.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: '__Inter_fcbcbf';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/_next/static/media/e4af272ccee01ff0-s.p.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}@font-face {font-family: '__Inter_Fallback_fcbcbf';src: local("Arial");ascent-override: 90.49%;descent-override: 22.56%;line-gap-override: 0.00%;size-adjust: 107.06%
}.__className_fcbcbf {font-family: '__Inter_fcbcbf', '__Inter_Fallback_fcbcbf';font-style: normal
}.__variable_fcbcbf {--font-sans: '__Inter_fcbcbf', '__Inter_Fallback_fcbcbf'
}

/*!****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[13].oneOf[2].use[1]!../../node_modules/next/dist/build/webpack/loaders/next-font-loader/index.js??ruleSet[1].rules[13].oneOf[2].use[2]!../../node_modules/next/font/google/target.css?{"path":"app/layout.tsx","import":"Manrope","arguments":[{"subsets":["latin","cyrillic"],"display":"swap","variable":"--font-display"}],"variableName":"manrope"} ***!
  \****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/* cyrillic-ext */
@font-face {
  font-family: '__Manrope_fe7774';
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url(/_next/static/media/438aa629764e75f3-s.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: '__Manrope_fe7774';
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url(/_next/static/media/875ae681bfde4580-s.p.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: '__Manrope_fe7774';
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url(/_next/static/media/51251f8b9793cdb3-s.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: '__Manrope_fe7774';
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url(/_next/static/media/e857b654a2caa584-s.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: '__Manrope_fe7774';
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url(/_next/static/media/cc978ac5ee68c2b6-s.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: '__Manrope_fe7774';
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url(/_next/static/media/4c9affa5bc8f420e-s.p.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}@font-face {font-family: '__Manrope_Fallback_fe7774';src: local("Arial");ascent-override: 103.31%;descent-override: 29.07%;line-gap-override: 0.00%;size-adjust: 103.19%
}.__className_fe7774 {font-family: '__Manrope_fe7774', '__Manrope_Fallback_fe7774';font-style: normal
}.__variable_fe7774 {--font-display: '__Manrope_fe7774', '__Manrope_Fallback_fe7774'
}

/*!*********************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[13].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[13].oneOf[12].use[3]!./app/globals.css ***!
  \*********************************************************************************************************************************************************************************************************************************************************************/
*, ::before, ::after {
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
  --tw-contain-size:  ;
  --tw-contain-layout:  ;
  --tw-contain-paint:  ;
  --tw-contain-style:  ;
}

::backdrop {
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
  --tw-contain-size:  ;
  --tw-contain-layout:  ;
  --tw-contain-paint:  ;
  --tw-contain-style:  ;
}/*
! tailwindcss v3.4.13 | MIT License | https://tailwindcss.com
*//*
1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
*/

*,
::before,
::after {
  box-sizing: border-box; /* 1 */
  border-width: 0; /* 2 */
  border-style: solid; /* 2 */
  border-color: #e5e7eb; /* 2 */
}

::before,
::after {
  --tw-content: '';
}

/*
1. Use a consistent sensible line-height in all browsers.
2. Prevent adjustments of font size after orientation changes in iOS.
3. Use a more readable tab size.
4. Use the user's configured `sans` font-family by default.
5. Use the user's configured `sans` font-feature-settings by default.
6. Use the user's configured `sans` font-variation-settings by default.
7. Disable tap highlights on iOS
*/

html,
:host {
  line-height: 1.5; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
  -moz-tab-size: 4; /* 3 */
  -o-tab-size: 4;
     tab-size: 4; /* 3 */
  font-family: var(--font-sans), ui-sans-serif, system-ui, -apple-system, SF Pro Text, Segoe UI, sans-serif; /* 4 */
  font-feature-settings: normal; /* 5 */
  font-variation-settings: normal; /* 6 */
  -webkit-tap-highlight-color: transparent; /* 7 */
}

/*
1. Remove the margin in all browsers.
2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
*/

body {
  margin: 0; /* 1 */
  line-height: inherit; /* 2 */
}

/*
1. Add the correct height in Firefox.
2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
3. Ensure horizontal rules are visible by default.
*/

hr {
  height: 0; /* 1 */
  color: inherit; /* 2 */
  border-top-width: 1px; /* 3 */
}

/*
Add the correct text decoration in Chrome, Edge, and Safari.
*/

abbr:where([title]) {
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted;
}

/*
Remove the default font size and weight for headings.
*/

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  font-weight: inherit;
}

/*
Reset links to optimize for opt-in styling instead of opt-out.
*/

a {
  color: inherit;
  text-decoration: inherit;
}

/*
Add the correct font weight in Edge and Safari.
*/

b,
strong {
  font-weight: bolder;
}

/*
1. Use the user's configured `mono` font-family by default.
2. Use the user's configured `mono` font-feature-settings by default.
3. Use the user's configured `mono` font-variation-settings by default.
4. Correct the odd `em` font sizing in all browsers.
*/

code,
kbd,
samp,
pre {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; /* 1 */
  font-feature-settings: normal; /* 2 */
  font-variation-settings: normal; /* 3 */
  font-size: 1em; /* 4 */
}

/*
Add the correct font size in all browsers.
*/

small {
  font-size: 80%;
}

/*
Prevent `sub` and `sup` elements from affecting the line height in all browsers.
*/

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/*
1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
3. Remove gaps between table borders by default.
*/

table {
  text-indent: 0; /* 1 */
  border-color: inherit; /* 2 */
  border-collapse: collapse; /* 3 */
}

/*
1. Change the font styles in all browsers.
2. Remove the margin in Firefox and Safari.
3. Remove default padding in all browsers.
*/

button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-feature-settings: inherit; /* 1 */
  font-variation-settings: inherit; /* 1 */
  font-size: 100%; /* 1 */
  font-weight: inherit; /* 1 */
  line-height: inherit; /* 1 */
  letter-spacing: inherit; /* 1 */
  color: inherit; /* 1 */
  margin: 0; /* 2 */
  padding: 0; /* 3 */
}

/*
Remove the inheritance of text transform in Edge and Firefox.
*/

button,
select {
  text-transform: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Remove default button styles.
*/

button,
input:where([type='button']),
input:where([type='reset']),
input:where([type='submit']) {
  -webkit-appearance: button; /* 1 */
  background-color: transparent; /* 2 */
  background-image: none; /* 2 */
}

/*
Use the modern Firefox focus style for all focusable elements.
*/

:-moz-focusring {
  outline: auto;
}

/*
Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
*/

:-moz-ui-invalid {
  box-shadow: none;
}

/*
Add the correct vertical alignment in Chrome and Firefox.
*/

progress {
  vertical-align: baseline;
}

/*
Correct the cursor style of increment and decrement buttons in Safari.
*/

::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
  height: auto;
}

/*
1. Correct the odd appearance in Chrome and Safari.
2. Correct the outline style in Safari.
*/

[type='search'] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/*
Remove the inner padding in Chrome and Safari on macOS.
*/

::-webkit-search-decoration {
  -webkit-appearance: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Change font properties to `inherit` in Safari.
*/

::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/*
Add the correct display in Chrome and Safari.
*/

summary {
  display: list-item;
}

/*
Removes the default spacing and border for appropriate elements.
*/

blockquote,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
figure,
p,
pre {
  margin: 0;
}

fieldset {
  margin: 0;
  padding: 0;
}

legend {
  padding: 0;
}

ol,
ul,
menu {
  list-style: none;
  margin: 0;
  padding: 0;
}

/*
Reset default styling for dialogs.
*/
dialog {
  padding: 0;
}

/*
Prevent resizing textareas horizontally by default.
*/

textarea {
  resize: vertical;
}

/*
1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
2. Set the default placeholder color to the user's configured gray 400 color.
*/

input::-moz-placeholder, textarea::-moz-placeholder {
  opacity: 1; /* 1 */
  color: #9ca3af; /* 2 */
}

input::placeholder,
textarea::placeholder {
  opacity: 1; /* 1 */
  color: #9ca3af; /* 2 */
}

/*
Set the default cursor for buttons.
*/

button,
[role="button"] {
  cursor: pointer;
}

/*
Make sure disabled buttons don't get the pointer cursor.
*/
:disabled {
  cursor: default;
}

/*
1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
   This can trigger a poorly considered lint error in some tools but is included by design.
*/

img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
  display: block; /* 1 */
  vertical-align: middle; /* 2 */
}

/*
Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
*/

img,
video {
  max-width: 100%;
  height: auto;
}

/* Make elements with the HTML hidden attribute stay hidden by default */
[hidden] {
  display: none;
}
.container {
  width: 100%;
}
@media (min-width: 640px) {

  .container {
    max-width: 640px;
  }
}
@media (min-width: 768px) {

  .container {
    max-width: 768px;
  }
}
@media (min-width: 1024px) {

  .container {
    max-width: 1024px;
  }
}
@media (min-width: 1280px) {

  .container {
    max-width: 1280px;
  }
}
@media (min-width: 1536px) {

  .container {
    max-width: 1536px;
  }
}
/* Primary surface. Translucent, blurred, inner highlight + outer hairline. */
.glass-card {
  position: relative;
  overflow: hidden;
  border-radius: 1.5rem;
  border-width: 1px;
  border-color: rgb(255 255 255 / 0.4);
  background-color: rgb(255 255 255 / 0.55);
  --tw-shadow: 0 1px 1px rgba(10, 15, 40, 0.04), 0 12px 28px -12px rgba(112, 97, 255, 0.25), 0 28px 60px -24px rgba(245, 99, 141, 0.18);
  --tw-shadow-colored: 0 1px 1px var(--tw-shadow-color), 0 12px 28px -12px var(--tw-shadow-color), 0 28px 60px -24px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.dark .glass-card { background-color: rgba(255, 255, 255, 0.07); border-color: rgba(255, 255, 255, 0.07); }
.glass-card {
    backdrop-filter: saturate(140%) blur(24px);
    -webkit-backdrop-filter: saturate(140%) blur(24px);
  }
.glass-card::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    border-radius: inherit;
    /* Inner top highlight ring ≈ 1px, plus the subtle outer hairline. */
    box-shadow:
      inset 0 1px 0 var(--hairline-top),
      inset 0 0 0 1px rgba(255, 255, 255, 0.12);
  }
.glass-card-tight {
  position: relative;
  overflow: hidden;
  border-radius: 1.5rem;
  border-width: 1px;
  border-color: rgb(255 255 255 / 0.4);
  background-color: rgb(255 255 255 / 0.55);
  --tw-shadow: 0 1px 1px rgba(10, 15, 40, 0.04), 0 12px 28px -12px rgba(112, 97, 255, 0.25), 0 28px 60px -24px rgba(245, 99, 141, 0.18);
  --tw-shadow-colored: 0 1px 1px var(--tw-shadow-color), 0 12px 28px -12px var(--tw-shadow-color), 0 28px 60px -24px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.dark .glass-card-tight { background-color: rgba(255, 255, 255, 0.07); border-color: rgba(255, 255, 255, 0.07); }
.glass-card-tight {
    backdrop-filter: saturate(140%) blur(24px);
    -webkit-backdrop-filter: saturate(140%) blur(24px);
  }
.glass-card-tight::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    border-radius: inherit;
    /* Inner top highlight ring ≈ 1px, plus the subtle outer hairline. */
    box-shadow:
      inset 0 1px 0 var(--hairline-top),
      inset 0 0 0 1px rgba(255, 255, 255, 0.12);
  }
.glass-card-tight {
  border-radius: 1rem;
}
.dark .glass-card-tight {
  background-color: rgba(255, 255, 255, 0.045);
  border-color: rgba(255, 255, 255, 0.08);
}
.dark .glass-card-tight::before {
  box-shadow:
    inset 0 1px 0 var(--hairline-top),
    inset 0 0 0 1px rgba(255, 255, 255, 0.04);
}
/* Tinted variant — the slightly warmer / sunrise card (e.g. FeedCard). */
.glass-card-warm {
  position: relative;
  overflow: hidden;
  border-radius: 1.5rem;
  border-width: 1px;
  border-color: rgb(255 255 255 / 0.4);
  background-color: rgb(255 255 255 / 0.55);
  --tw-shadow: 0 1px 1px rgba(10, 15, 40, 0.04), 0 12px 28px -12px rgba(112, 97, 255, 0.25), 0 28px 60px -24px rgba(245, 99, 141, 0.18);
  --tw-shadow-colored: 0 1px 1px var(--tw-shadow-color), 0 12px 28px -12px var(--tw-shadow-color), 0 28px 60px -24px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.dark .glass-card-warm { background-color: rgba(255, 255, 255, 0.07); border-color: rgba(255, 255, 255, 0.07); }
.glass-card-warm {
    backdrop-filter: saturate(140%) blur(24px);
    -webkit-backdrop-filter: saturate(140%) blur(24px);
  }
.glass-card-warm::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    border-radius: inherit;
    /* Inner top highlight ring ≈ 1px, plus the subtle outer hairline. */
    box-shadow:
      inset 0 1px 0 var(--hairline-top),
      inset 0 0 0 1px rgba(255, 255, 255, 0.12);
  }
.dark .glass-card-warm {
  background-color: rgba(255, 255, 255, 0.045);
  border-color: rgba(255, 255, 255, 0.08);
}
.dark .glass-card-warm::before {
  box-shadow:
    inset 0 1px 0 var(--hairline-top),
    inset 0 0 0 1px rgba(255, 255, 255, 0.04);
}
.glass-card-warm {
    background:
      linear-gradient(
        180deg,
        rgba(255, 242, 236, 0.7),
        rgba(255, 230, 240, 0.55)
      );
  }
/* Header / navbar surface — sits on top, needs stronger blur. */
.glass-nav {
  border-bottom-width: 1px;
  border-color: rgb(255 255 255 / 0.4);
  background-color: rgb(255 255 255 / 0.55);
}
.dark .glass-nav { background-color: rgba(255, 255, 255, 0.07); border-color: rgba(255, 255, 255, 0.07); }
.glass-nav {
    backdrop-filter: saturate(180%) blur(28px);
    -webkit-backdrop-filter: saturate(180%) blur(28px);
    box-shadow:
      inset 0 1px 0 var(--hairline-top),
      0 1px 0 rgba(11, 16, 38, 0.04);
  }
/* Small inline pill (used for child name, counters, filter segments). */
.glass-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  border-radius: 9999px;
  border-width: 1px;
  border-color: rgb(255 255 255 / 0.5);
  background-color: rgb(255 255 255 / 0.55);
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 500;
  --tw-text-opacity: 1;
  color: rgb(45 51 82 / var(--tw-text-opacity));
}
.dark .glass-chip { color: var(--ink-soft); background-color: rgba(255, 255, 255, 0.07); border-color: rgba(255, 255, 255, 0.09); }
.glass-chip {
    backdrop-filter: saturate(140%) blur(16px);
    -webkit-backdrop-filter: saturate(140%) blur(16px);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.6);
  }
/* Segmented tab inside a glass container (e.g. nav tabs, day-range selector). */
.glass-seg {
  display: inline-flex;
  border-radius: 9999px;
  border-width: 1px;
  border-color: rgb(255 255 255 / 0.5);
  background-color: rgb(255 255 255 / 0.45);
  padding: 0.25rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
}
.dark .glass-seg { background-color: rgba(255, 255, 255, 0.05); border-color: rgba(255, 255, 255, 0.09); }
.glass-seg {
    backdrop-filter: saturate(140%) blur(18px);
    -webkit-backdrop-filter: saturate(140%) blur(18px);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55);
  }
.glass-seg-item {
  cursor: pointer;
  border-radius: 9999px;
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  padding-top: 0.375rem;
  padding-bottom: 0.375rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 500;
  --tw-text-opacity: 1;
  color: rgb(95 102 132 / var(--tw-text-opacity));
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.dark .glass-seg-item { color: var(--ink-muted); }
/* Only apply the darkening hover on devices that actually have a hover
     pointer — prevents the mobile "sticky tap" state from swapping the
     active pill's white text for dark ink, which made the label disappear
     against the gradient background after every tap. */
@media (hover: hover) {
    .glass-seg-item:hover {
      color: var(--ink);
    }
  }
.glass-seg-item-active,
  .glass-seg-item-active:hover {
    color: #fff;
    background: linear-gradient(135deg, #8a80ff 0%, #7061ff 55%, #f5638d 130%);
    box-shadow:
      0 6px 14px -6px rgba(112, 97, 255, 0.5),
      0 2px 6px -2px rgba(245, 99, 141, 0.35),
      inset 0 1px 0 rgba(255, 255, 255, 0.3);
    text-shadow: 0 1px 0 rgba(10, 15, 40, 0.08);
  }
/* Buttons. */
.glass-btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  border-radius: 1rem;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 500;
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.glass-btn-primary:disabled {
  cursor: not-allowed;
  opacity: 0.6;
}
.glass-btn-primary {
    background: linear-gradient(135deg, #8a80ff 0%, #7061ff 55%, #f5638d 130%);
    box-shadow:
      0 10px 24px -10px rgba(112, 97, 255, 0.55),
      0 6px 16px -8px rgba(245, 99, 141, 0.45),
      inset 0 1px 0 rgba(255, 255, 255, 0.35);
  }
.glass-btn-primary:hover:not(:disabled) {
    filter: brightness(1.05);
    transform: translateY(-1px);
  }
.glass-btn-primary:active:not(:disabled) {
    transform: translateY(0);
    filter: brightness(0.98);
  }
.glass-btn-dark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  border-radius: 1rem;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 500;
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.glass-btn-dark:disabled {
  cursor: not-allowed;
  opacity: 0.6;
}
.glass-btn-dark {
    /* Deep "night → twilight" gradient, not flat black. Still reads as a
       dark button, but carries the brand undertone so it lives on the
       soft-baby canvas instead of sitting on top of it. */
    background: linear-gradient(135deg, #2a2256 0%, #151a3a 55%, #453ab3 130%);
    box-shadow:
      0 10px 24px -12px rgba(11, 16, 38, 0.55),
      0 6px 14px -6px rgba(112, 97, 255, 0.35),
      inset 0 1px 0 rgba(255, 255, 255, 0.18);
  }
.glass-btn-dark:hover:not(:disabled) {
    filter: brightness(1.08);
    transform: translateY(-1px);
  }
.glass-btn-dark:active:not(:disabled) {
    transform: translateY(0);
    filter: brightness(0.98);
  }
.glass-btn-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  border-radius: 1rem;
  border-width: 1px;
  border-color: rgb(255 255 255 / 0.6);
  background-color: rgb(255 255 255 / 0.7);
  padding-left: 1rem;
  padding-right: 1rem;
  padding-top: 0.625rem;
  padding-bottom: 0.625rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 500;
  --tw-text-opacity: 1;
  color: rgb(11 16 38 / var(--tw-text-opacity));
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.dark .glass-btn-secondary { color: var(--ink); background-color: rgba(255, 255, 255, 0.10); }
.dark .glass-btn-secondary:hover { background-color: rgba(255, 255, 255, 0.14); }
.dark .glass-btn-secondary { border-color: rgba(255, 255, 255, 0.12); }
.glass-btn-secondary:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
}
.glass-btn-secondary:disabled {
  cursor: not-allowed;
  opacity: 0.6;
}
.glass-btn-secondary {
    backdrop-filter: saturate(140%) blur(16px);
    -webkit-backdrop-filter: saturate(140%) blur(16px);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
  }
.glass-btn-ghost {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  border-radius: 0.75rem;
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  --tw-text-opacity: 1;
  color: rgb(95 102 132 / var(--tw-text-opacity));
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.dark .glass-btn-ghost { color: var(--ink-muted); }
.dark .glass-btn-ghost:hover { color: var(--ink); background-color: rgba(255, 255, 255, 0.07); }
.glass-btn-ghost:hover {
  background-color: rgb(255 255 255 / 0.5);
  --tw-text-opacity: 1;
  color: rgb(11 16 38 / var(--tw-text-opacity));
}
.glass-btn-danger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  border-radius: 1rem;
  border-width: 1px;
  border-color: rgb(255 184 207 / 0.8);
  background-color: rgb(255 241 246 / 0.8);
  padding-left: 1rem;
  padding-right: 1rem;
  padding-top: 0.625rem;
  padding-bottom: 0.625rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 500;
  --tw-text-opacity: 1;
  color: rgb(212 73 111 / var(--tw-text-opacity));
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.glass-btn-danger:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(255 220 232 / var(--tw-bg-opacity));
}
.glass-btn-danger:disabled {
  cursor: not-allowed;
  opacity: 0.6;
}
.glass-btn-danger {
    backdrop-filter: saturate(140%) blur(16px);
    -webkit-backdrop-filter: saturate(140%) blur(16px);
  }
/* Form control — inputs, selects, textareas. */
.glass-input {
  width: 100%;
  border-radius: 0.75rem;
  border-width: 1px;
  border-color: rgb(255 255 255 / 0.6);
  background-color: rgb(255 255 255 / 0.6);
  padding-left: 0.875rem;
  padding-right: 0.875rem;
  padding-top: 0.625rem;
  padding-bottom: 0.625rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  --tw-text-opacity: 1;
  color: rgb(11 16 38 / var(--tw-text-opacity));
  outline: 2px solid transparent;
  outline-offset: 2px;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.dark .glass-input { color: var(--ink); background-color: rgba(255, 255, 255, 0.08); border-color: rgba(255, 255, 255, 0.12); }
.glass-input::-moz-placeholder {
  --tw-text-opacity: 1;
  color: rgb(138 144 168 / var(--tw-text-opacity));
}
.glass-input::placeholder {
  --tw-text-opacity: 1;
  color: rgb(138 144 168 / var(--tw-text-opacity));
}
.glass-input {
    backdrop-filter: saturate(140%) blur(14px);
    -webkit-backdrop-filter: saturate(140%) blur(14px);
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.55),
      inset 0 0 0 1px rgba(11, 16, 38, 0.04);
  }
.glass-input:focus {
    border-color: rgb(138 128 255 / 0.65);
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.65),
      0 0 0 4px rgba(112, 97, 255, 0.18);
  }
.glass-label {
  margin-bottom: 0.375rem;
  display: block;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  --tw-text-opacity: 1;
  color: rgb(95 102 132 / var(--tw-text-opacity));
}
.dark .glass-label { color: var(--ink-muted); }
/* Tiny dashed/outlined "empty state" variant. */
.glass-card-dashed {
  position: relative;
  overflow: hidden;
  border-radius: 1.5rem;
  border-width: 1px;
  border-style: dashed;
  border-color: rgb(95 102 132 / 0.3);
  background-color: rgb(255 255 255 / 0.35);
  padding: 1.5rem;
}
.dark .glass-card-dashed { background-color: rgba(255, 255, 255, 0.035); }
.glass-card-dashed {
    backdrop-filter: saturate(140%) blur(18px);
    -webkit-backdrop-filter: saturate(140%) blur(18px);
  }
.pointer-events-none {
  pointer-events: none;
}
.pointer-events-auto {
  pointer-events: auto;
}
.invisible {
  visibility: hidden;
}
.fixed {
  position: fixed;
}
.absolute {
  position: absolute;
}
.relative {
  position: relative;
}
.sticky {
  position: sticky;
}
.inset-0 {
  inset: 0px;
}
.-right-16 {
  right: -4rem;
}
.-right-8 {
  right: -2rem;
}
.-top-16 {
  top: -4rem;
}
.-top-8 {
  top: -2rem;
}
.bottom-4 {
  bottom: 1rem;
}
.bottom-\[-6px\] {
  bottom: -6px;
}
.left-0 {
  left: 0px;
}
.left-1\/2 {
  left: 50%;
}
.left-\[74px\] {
  left: 74px;
}
.right-0 {
  right: 0px;
}
.right-4 {
  right: 1rem;
}
.right-6 {
  right: 1.5rem;
}
.top-0 {
  top: 0px;
}
.top-4 {
  top: 1rem;
}
.top-6 {
  top: 1.5rem;
}
.top-7 {
  top: 1.75rem;
}
.top-full {
  top: 100%;
}
.z-10 {
  z-index: 10;
}
.z-20 {
  z-index: 20;
}
.z-50 {
  z-index: 50;
}
.order-3 {
  order: 3;
}
.-mx-1 {
  margin-left: -0.25rem;
  margin-right: -0.25rem;
}
.mx-auto {
  margin-left: auto;
  margin-right: auto;
}
.my-6 {
  margin-top: 1.5rem;
  margin-bottom: 1.5rem;
}
.mb-2 {
  margin-bottom: 0.5rem;
}
.mb-3 {
  margin-bottom: 0.75rem;
}
.mb-4 {
  margin-bottom: 1rem;
}
.mb-5 {
  margin-bottom: 1.25rem;
}
.ml-1 {
  margin-left: 0.25rem;
}
.ml-2 {
  margin-left: 0.5rem;
}
.ml-auto {
  margin-left: auto;
}
.mr-1 {
  margin-right: 0.25rem;
}
.mt-0\.5 {
  margin-top: 0.125rem;
}
.mt-1 {
  margin-top: 0.25rem;
}
.mt-1\.5 {
  margin-top: 0.375rem;
}
.mt-10 {
  margin-top: 2.5rem;
}
.mt-16 {
  margin-top: 4rem;
}
.mt-2 {
  margin-top: 0.5rem;
}
.mt-20 {
  margin-top: 5rem;
}
.mt-24 {
  margin-top: 6rem;
}
.mt-3 {
  margin-top: 0.75rem;
}
.mt-4 {
  margin-top: 1rem;
}
.mt-5 {
  margin-top: 1.25rem;
}
.mt-6 {
  margin-top: 1.5rem;
}
.mt-8 {
  margin-top: 2rem;
}
.block {
  display: block;
}
.inline-block {
  display: inline-block;
}
.inline {
  display: inline;
}
.flex {
  display: flex;
}
.inline-flex {
  display: inline-flex;
}
.table {
  display: table;
}
.grid {
  display: grid;
}
.contents {
  display: contents;
}
.hidden {
  display: none;
}
.\!h-10 {
  height: 2.5rem !important;
}
.\!h-2\.5 {
  height: 0.625rem !important;
}
.\!h-3 {
  height: 0.75rem !important;
}
.\!h-5 {
  height: 1.25rem !important;
}
.\!h-6 {
  height: 1.5rem !important;
}
.\!h-8 {
  height: 2rem !important;
}
.\!h-\[160px\] {
  height: 160px !important;
}
.\!h-\[200px\] {
  height: 200px !important;
}
.h-1\.5 {
  height: 0.375rem;
}
.h-10 {
  height: 2.5rem;
}
.h-11 {
  height: 2.75rem;
}
.h-14 {
  height: 3.5rem;
}
.h-2\.5 {
  height: 0.625rem;
}
.h-3 {
  height: 0.75rem;
}
.h-4 {
  height: 1rem;
}
.h-40 {
  height: 10rem;
}
.h-48 {
  height: 12rem;
}
.h-5 {
  height: 1.25rem;
}
.h-52 {
  height: 13rem;
}
.h-6 {
  height: 1.5rem;
}
.h-7 {
  height: 1.75rem;
}
.h-9 {
  height: 2.25rem;
}
.h-px {
  height: 1px;
}
.max-h-48 {
  max-height: 12rem;
}
.max-h-72 {
  max-height: 18rem;
}
.min-h-16 {
  min-height: 4rem;
}
.min-h-24 {
  min-height: 6rem;
}
.min-h-\[calc\(100vh-8rem\)\] {
  min-height: calc(100vh - 8rem);
}
.min-h-screen {
  min-height: 100vh;
}
.w-1\.5 {
  width: 0.375rem;
}
.w-1\/3 {
  width: 33.333333%;
}
.w-10 {
  width: 2.5rem;
}
.w-11 {
  width: 2.75rem;
}
.w-14 {
  width: 3.5rem;
}
.w-16 {
  width: 4rem;
}
.w-2\.5 {
  width: 0.625rem;
}
.w-2\/3 {
  width: 66.666667%;
}
.w-20 {
  width: 5rem;
}
.w-24 {
  width: 6rem;
}
.w-28 {
  width: 7rem;
}
.w-3 {
  width: 0.75rem;
}
.w-32 {
  width: 8rem;
}
.w-4 {
  width: 1rem;
}
.w-40 {
  width: 10rem;
}
.w-5 {
  width: 1.25rem;
}
.w-52 {
  width: 13rem;
}
.w-56 {
  width: 14rem;
}
.w-6 {
  width: 1.5rem;
}
.w-7 {
  width: 1.75rem;
}
.w-9 {
  width: 2.25rem;
}
.w-\[28rem\] {
  width: 28rem;
}
.w-full {
  width: 100%;
}
.w-px {
  width: 1px;
}
.min-w-0 {
  min-width: 0px;
}
.min-w-full {
  min-width: 100%;
}
.max-w-2xl {
  max-width: 42rem;
}
.max-w-3xl {
  max-width: 48rem;
}
.max-w-4xl {
  max-width: 56rem;
}
.max-w-5xl {
  max-width: 64rem;
}
.max-w-\[120px\] {
  max-width: 120px;
}
.max-w-\[140px\] {
  max-width: 140px;
}
.max-w-\[85\%\] {
  max-width: 85%;
}
.max-w-\[calc\(100vw-2rem\)\] {
  max-width: calc(100vw - 2rem);
}
.max-w-lg {
  max-width: 32rem;
}
.max-w-md {
  max-width: 28rem;
}
.max-w-none {
  max-width: none;
}
.max-w-sm {
  max-width: 24rem;
}
.max-w-xl {
  max-width: 36rem;
}
.max-w-xs {
  max-width: 20rem;
}
.flex-1 {
  flex: 1 1 0%;
}
.flex-shrink-0 {
  flex-shrink: 0;
}
.shrink-0 {
  flex-shrink: 0;
}
.basis-full {
  flex-basis: 100%;
}
.-translate-x-1\/2 {
  --tw-translate-x: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.-rotate-90 {
  --tw-rotate: -90deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.rotate-180 {
  --tw-rotate: 180deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
@keyframes bounce {

  0%, 100% {
    transform: translateY(-25%);
    animation-timing-function: cubic-bezier(0.8,0,1,1);
  }

  50% {
    transform: none;
    animation-timing-function: cubic-bezier(0,0,0.2,1);
  }
}
.animate-bounce {
  animation: bounce 1s infinite;
}
@keyframes fade-in {

  0% {
    opacity: 0;
    transform: translateY(4px);
  }

  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
.animate-fade-in {
  animation: fade-in 240ms cubic-bezier(0.22, 1, 0.36, 1) both;
}
@keyframes pulse {

  50% {
    opacity: .5;
  }
}
.animate-pulse {
  animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}
@keyframes pulse-soft {

  0%, 100% {
    opacity: 1;
  }

  50% {
    opacity: 0.55;
  }
}
.animate-pulse-soft {
  animation: pulse-soft 2.4s ease-in-out infinite;
}
@keyframes scale-in {

  0% {
    opacity: 0;
    transform: scale(0.96);
  }

  100% {
    opacity: 1;
    transform: scale(1);
  }
}
.animate-scale-in {
  animation: scale-in 220ms cubic-bezier(0.22, 1, 0.36, 1) both;
}
@keyframes slide-in-left {

  0% {
    opacity: 0;
    transform: translateX(-16px);
  }

  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
.animate-slide-in-left {
  animation: slide-in-left 320ms cubic-bezier(0.22, 1, 0.36, 1) both;
}
@keyframes slide-in-right {

  0% {
    opacity: 0;
    transform: translateX(16px);
  }

  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
.animate-slide-in-right {
  animation: slide-in-right 320ms cubic-bezier(0.22, 1, 0.36, 1) both;
}
@keyframes toast-in {

  0% {
    opacity: 0;
    transform: translateY(12px) scale(0.96);
  }

  100% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}
.animate-toast-in {
  animation: toast-in 220ms cubic-bezier(0.22, 1, 0.36, 1) both;
}
@keyframes toast-out {

  0% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }

  100% {
    opacity: 0;
    transform: translateY(-8px) scale(0.96);
  }
}
.animate-toast-out {
  animation: toast-out 160ms ease-in both;
}
.cursor-default {
  cursor: default;
}
.cursor-not-allowed {
  cursor: not-allowed;
}
.cursor-pointer {
  cursor: pointer;
}
.resize-none {
  resize: none;
}
.scroll-mt-20 {
  scroll-margin-top: 5rem;
}
.list-none {
  list-style-type: none;
}
.grid-cols-1 {
  grid-template-columns: repeat(1, minmax(0, 1fr));
}
.grid-cols-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.grid-cols-3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.grid-cols-\[62px_1fr\] {
  grid-template-columns: 62px 1fr;
}
.flex-col {
  flex-direction: column;
}
.flex-col-reverse {
  flex-direction: column-reverse;
}
.flex-wrap {
  flex-wrap: wrap;
}
.items-start {
  align-items: flex-start;
}
.items-end {
  align-items: flex-end;
}
.items-center {
  align-items: center;
}
.items-baseline {
  align-items: baseline;
}
.justify-start {
  justify-content: flex-start;
}
.justify-end {
  justify-content: flex-end;
}
.justify-center {
  justify-content: center;
}
.justify-between {
  justify-content: space-between;
}
.gap-0\.5 {
  gap: 0.125rem;
}
.gap-1 {
  gap: 0.25rem;
}
.gap-1\.5 {
  gap: 0.375rem;
}
.gap-2 {
  gap: 0.5rem;
}
.gap-2\.5 {
  gap: 0.625rem;
}
.gap-3 {
  gap: 0.75rem;
}
.gap-4 {
  gap: 1rem;
}
.gap-5 {
  gap: 1.25rem;
}
.gap-x-4 {
  -moz-column-gap: 1rem;
       column-gap: 1rem;
}
.gap-x-6 {
  -moz-column-gap: 1.5rem;
       column-gap: 1.5rem;
}
.gap-y-1 {
  row-gap: 0.25rem;
}
.gap-y-2 {
  row-gap: 0.5rem;
}
.space-y-0 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0px * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0px * var(--tw-space-y-reverse));
}
.space-y-2 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
}
.space-y-3 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.75rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.75rem * var(--tw-space-y-reverse));
}
.space-y-4 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(1rem * var(--tw-space-y-reverse));
}
.space-y-5 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(1.25rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(1.25rem * var(--tw-space-y-reverse));
}
.space-y-6 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(1.5rem * var(--tw-space-y-reverse));
}
.divide-y > :not([hidden]) ~ :not([hidden]) {
  --tw-divide-y-reverse: 0;
  border-top-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
  border-bottom-width: calc(1px * var(--tw-divide-y-reverse));
}
.divide-ink\/5 > :not([hidden]) ~ :not([hidden]) {
  border-color: rgb(11 16 38 / 0.05);
}
.overflow-auto {
  overflow: auto;
}
.overflow-hidden {
  overflow: hidden;
}
.overflow-x-auto {
  overflow-x: auto;
}
.overflow-y-auto {
  overflow-y: auto;
}
.truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.whitespace-pre-line {
  white-space: pre-line;
}
.whitespace-pre-wrap {
  white-space: pre-wrap;
}
.rounded {
  border-radius: 0.25rem;
}
.rounded-2xl {
  border-radius: 1rem;
}
.rounded-3xl {
  border-radius: 1.5rem;
}
.rounded-full {
  border-radius: 9999px;
}
.rounded-xl {
  border-radius: 0.75rem;
}
.border {
  border-width: 1px;
}
.border-b {
  border-bottom-width: 1px;
}
.border-l-2 {
  border-left-width: 2px;
}
.border-t {
  border-top-width: 1px;
}
.border-amber-200\/70 {
  border-color: rgb(253 230 138 / 0.7);
}
.border-amber-300\/80 {
  border-color: rgb(252 211 77 / 0.8);
}
.border-amber-400\/40 {
  border-color: rgb(251 191 36 / 0.4);
}
.border-blush-200\/70 {
  border-color: rgb(255 184 207 / 0.7);
}
.border-blush-200\/80 {
  border-color: rgb(255 184 207 / 0.8);
}
.border-brand-400\/70 {
  border-color: rgb(138 128 255 / 0.7);
}
.border-brand-500 {
  --tw-border-opacity: 1;
  border-color: rgb(112 97 255 / var(--tw-border-opacity));
}
.border-brand-500\/70 {
  border-color: rgb(112 97 255 / 0.7);
}
.border-emerald-200\/70 {
  border-color: rgb(167 243 208 / 0.7);
}
.border-ink-muted\/30 {
  border-color: rgb(95 102 132 / 0.3);
}
.border-ink\/10 {
  border-color: rgb(11 16 38 / 0.1);
}
.border-ink\/20 {
  border-color: rgb(11 16 38 / 0.2);
}
.border-ink\/5 {
  border-color: rgb(11 16 38 / 0.05);
}
.border-transparent {
  border-color: transparent;
}
.border-white\/50 {
  border-color: rgb(255 255 255 / 0.5);
}
.border-white\/55 {
  border-color: rgb(255 255 255 / 0.55);
}
.border-white\/60 {
  border-color: rgb(255 255 255 / 0.6);
}
.border-white\/70 {
  border-color: rgb(255 255 255 / 0.7);
}
.bg-\[rgba\(16\2c 20\2c 40\2c 0\.32\)\] {
  background-color: rgba(16,20,40,0.32);
}
.bg-amber-100\/70 {
  background-color: rgb(254 243 199 / 0.7);
}
.bg-amber-400 {
  --tw-bg-opacity: 1;
  background-color: rgb(251 191 36 / var(--tw-bg-opacity));
}
.bg-amber-50\/80 {
  background-color: rgb(255 251 235 / 0.8);
}
.bg-blush-50\/50 {
  background-color: rgb(255 241 246 / 0.5);
}
.bg-blush-50\/90 {
  background-color: rgb(255 241 246 / 0.9);
}
.bg-blush-500\/15 {
  background-color: rgb(245 99 141 / 0.15);
}
.bg-brand-50 {
  --tw-bg-opacity: 1;
  background-color: rgb(241 240 255 / var(--tw-bg-opacity));
}
.bg-brand-500 {
  --tw-bg-opacity: 1;
  background-color: rgb(112 97 255 / var(--tw-bg-opacity));
}
.bg-brand-500\/15 {
  background-color: rgb(112 97 255 / 0.15);
}
.bg-emerald-50\/80 {
  background-color: rgb(236 253 245 / 0.8);
}
.bg-emerald-50\/90 {
  background-color: rgb(236 253 245 / 0.9);
}
.bg-indigo-400 {
  --tw-bg-opacity: 1;
  background-color: rgb(129 140 248 / var(--tw-bg-opacity));
}
.bg-indigo-700 {
  --tw-bg-opacity: 1;
  background-color: rgb(67 56 202 / var(--tw-bg-opacity));
}
.bg-ink {
  --tw-bg-opacity: 1;
  background-color: rgb(11 16 38 / var(--tw-bg-opacity));
}
.bg-ink-muted\/60 {
  background-color: rgb(95 102 132 / 0.6);
}
.bg-ink\/10 {
  background-color: rgb(11 16 38 / 0.1);
}
.bg-ink\/15 {
  background-color: rgb(11 16 38 / 0.15);
}
.bg-ink\/40 {
  background-color: rgb(11 16 38 / 0.4);
}
.bg-rose-400 {
  --tw-bg-opacity: 1;
  background-color: rgb(251 113 133 / var(--tw-bg-opacity));
}
.bg-transparent {
  background-color: transparent;
}
.bg-violet-300 {
  --tw-bg-opacity: 1;
  background-color: rgb(196 181 253 / var(--tw-bg-opacity));
}
.bg-violet-400 {
  --tw-bg-opacity: 1;
  background-color: rgb(167 139 250 / var(--tw-bg-opacity));
}
.bg-white\/40 {
  background-color: rgb(255 255 255 / 0.4);
}
.bg-white\/45 {
  background-color: rgb(255 255 255 / 0.45);
}
.bg-white\/50 {
  background-color: rgb(255 255 255 / 0.5);
}
.bg-white\/55 {
  background-color: rgb(255 255 255 / 0.55);
}
.bg-white\/60 {
  background-color: rgb(255 255 255 / 0.6);
}
.bg-white\/80 {
  background-color: rgb(255 255 255 / 0.8);
}
.bg-white\/85 {
  background-color: rgb(255 255 255 / 0.85);
}
.bg-white\/95 {
  background-color: rgb(255 255 255 / 0.95);
}
.bg-gradient-to-br {
  background-image: linear-gradient(to bottom right, var(--tw-gradient-stops));
}
.from-amber-300\/60 {
  --tw-gradient-from: rgb(252 211 77 / 0.6) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(252 211 77 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-blush-300\/60 {
  --tw-gradient-from: rgb(255 148 182 / 0.6) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(255 148 182 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-brand-300\/50 {
  --tw-gradient-from: rgb(164 157 255 / 0.5) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(164 157 255 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-emerald-300\/60 {
  --tw-gradient-from: rgb(110 231 183 / 0.6) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(110 231 183 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.via-brand-200\/30 {
  --tw-gradient-to: rgb(199 194 255 / 0)  var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), rgb(199 194 255 / 0.3) var(--tw-gradient-via-position), var(--tw-gradient-to);
}
.to-amber-100\/30 {
  --tw-gradient-to: rgb(254 243 199 / 0.3) var(--tw-gradient-to-position);
}
.to-blush-100\/30 {
  --tw-gradient-to: rgb(255 220 232 / 0.3) var(--tw-gradient-to-position);
}
.to-blush-200\/40 {
  --tw-gradient-to: rgb(255 184 207 / 0.4) var(--tw-gradient-to-position);
}
.to-emerald-200\/30 {
  --tw-gradient-to: rgb(167 243 208 / 0.3) var(--tw-gradient-to-position);
}
.p-0\.5 {
  padding: 0.125rem;
}
.p-2 {
  padding: 0.5rem;
}
.p-3 {
  padding: 0.75rem;
}
.p-4 {
  padding: 1rem;
}
.p-5 {
  padding: 1.25rem;
}
.p-6 {
  padding: 1.5rem;
}
.p-8 {
  padding: 2rem;
}
.px-1 {
  padding-left: 0.25rem;
  padding-right: 0.25rem;
}
.px-2\.5 {
  padding-left: 0.625rem;
  padding-right: 0.625rem;
}
.px-3 {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}
.px-3\.5 {
  padding-left: 0.875rem;
  padding-right: 0.875rem;
}
.px-4 {
  padding-left: 1rem;
  padding-right: 1rem;
}
.px-5 {
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}
.px-6 {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}
.px-7 {
  padding-left: 1.75rem;
  padding-right: 1.75rem;
}
.px-8 {
  padding-left: 2rem;
  padding-right: 2rem;
}
.py-0\.5 {
  padding-top: 0.125rem;
  padding-bottom: 0.125rem;
}
.py-1 {
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
}
.py-1\.5 {
  padding-top: 0.375rem;
  padding-bottom: 0.375rem;
}
.py-10 {
  padding-top: 2.5rem;
  padding-bottom: 2.5rem;
}
.py-12 {
  padding-top: 3rem;
  padding-bottom: 3rem;
}
.py-2 {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}
.py-2\.5 {
  padding-top: 0.625rem;
  padding-bottom: 0.625rem;
}
.py-3 {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}
.py-4 {
  padding-top: 1rem;
  padding-bottom: 1rem;
}
.py-5 {
  padding-top: 1.25rem;
  padding-bottom: 1.25rem;
}
.py-6 {
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}
.py-8 {
  padding-top: 2rem;
  padding-bottom: 2rem;
}
.pb-2 {
  padding-bottom: 0.5rem;
}
.pb-20 {
  padding-bottom: 5rem;
}
.pt-0\.5 {
  padding-top: 0.125rem;
}
.pt-1 {
  padding-top: 0.25rem;
}
.pt-2 {
  padding-top: 0.5rem;
}
.pt-5 {
  padding-top: 1.25rem;
}
.pt-6 {
  padding-top: 1.5rem;
}
.text-left {
  text-align: left;
}
.text-center {
  text-align: center;
}
.align-middle {
  vertical-align: middle;
}
.font-display {
  font-family: var(--font-display), var(--font-sans), SF Pro Display, ui-sans-serif, system-ui, sans-serif;
}
.font-mono {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}
.font-sans {
  font-family: var(--font-sans), ui-sans-serif, system-ui, -apple-system, SF Pro Text, Segoe UI, sans-serif;
}
.text-2xl {
  font-size: 1.5rem;
  line-height: 2rem;
}
.text-3xl {
  font-size: 1.875rem;
  line-height: 2.25rem;
}
.text-5xl {
  font-size: 3rem;
  line-height: 1;
}
.text-6xl {
  font-size: 3.75rem;
  line-height: 1;
}
.text-\[0\.82rem\] {
  font-size: 0.82rem;
}
.text-\[0\.86rem\] {
  font-size: 0.86rem;
}
.text-\[0\.88rem\] {
  font-size: 0.88rem;
}
.text-\[0\.95rem\] {
  font-size: 0.95rem;
}
.text-\[1\.02rem\] {
  font-size: 1.02rem;
}
.text-\[1\.9rem\] {
  font-size: 1.9rem;
}
.text-\[10px\] {
  font-size: 10px;
}
.text-\[11px\] {
  font-size: 11px;
}
.text-\[1rem\] {
  font-size: 1rem;
}
.text-\[2\.4rem\] {
  font-size: 2.4rem;
}
.text-base {
  font-size: 1rem;
  line-height: 1.5rem;
}
.text-lg {
  font-size: 1.125rem;
  line-height: 1.75rem;
}
.text-sm {
  font-size: 0.875rem;
  line-height: 1.25rem;
}
.text-xl {
  font-size: 1.25rem;
  line-height: 1.75rem;
}
.text-xs {
  font-size: 0.75rem;
  line-height: 1rem;
}
.font-medium {
  font-weight: 500;
}
.font-normal {
  font-weight: 400;
}
.font-semibold {
  font-weight: 600;
}
.uppercase {
  text-transform: uppercase;
}
.italic {
  font-style: italic;
}
.tabular-nums {
  --tw-numeric-spacing: tabular-nums;
  font-variant-numeric: var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction);
}
.leading-\[1\.05\] {
  line-height: 1.05;
}
.leading-\[1\.15\] {
  line-height: 1.15;
}
.leading-\[1\.1\] {
  line-height: 1.1;
}
.leading-none {
  line-height: 1;
}
.leading-relaxed {
  line-height: 1.625;
}
.leading-snug {
  line-height: 1.375;
}
.tracking-\[0\.08em\] {
  letter-spacing: 0.08em;
}
.tracking-\[0\.14em\] {
  letter-spacing: 0.14em;
}
.tracking-\[0\.1em\] {
  letter-spacing: 0.1em;
}
.tracking-tight {
  letter-spacing: -0.025em;
}
.tracking-wide {
  letter-spacing: 0.025em;
}
.tracking-wider {
  letter-spacing: 0.05em;
}
.text-amber-600 {
  --tw-text-opacity: 1;
  color: rgb(217 119 6 / var(--tw-text-opacity));
}
.text-amber-700 {
  --tw-text-opacity: 1;
  color: rgb(180 83 9 / var(--tw-text-opacity));
}
.text-amber-800 {
  --tw-text-opacity: 1;
  color: rgb(146 64 14 / var(--tw-text-opacity));
}
.text-amber-900 {
  --tw-text-opacity: 1;
  color: rgb(120 53 15 / var(--tw-text-opacity));
}
.text-blush-500 {
  --tw-text-opacity: 1;
  color: rgb(245 99 141 / var(--tw-text-opacity));
}
.text-blush-600 {
  --tw-text-opacity: 1;
  color: rgb(212 73 111 / var(--tw-text-opacity));
}
.text-blush-600\/80 {
  color: rgb(212 73 111 / 0.8);
}
.text-brand-500 {
  --tw-text-opacity: 1;
  color: rgb(112 97 255 / var(--tw-text-opacity));
}
.text-brand-600 {
  --tw-text-opacity: 1;
  color: rgb(90 77 224 / var(--tw-text-opacity));
}
.text-brand-700 {
  --tw-text-opacity: 1;
  color: rgb(69 58 179 / var(--tw-text-opacity));
}
.text-emerald-700 {
  --tw-text-opacity: 1;
  color: rgb(4 120 87 / var(--tw-text-opacity));
}
.text-emerald-800 {
  --tw-text-opacity: 1;
  color: rgb(6 95 70 / var(--tw-text-opacity));
}
.text-ink {
  --tw-text-opacity: 1;
  color: rgb(11 16 38 / var(--tw-text-opacity));
}
.text-ink-faint {
  --tw-text-opacity: 1;
  color: rgb(138 144 168 / var(--tw-text-opacity));
}
.text-ink-muted {
  --tw-text-opacity: 1;
  color: rgb(95 102 132 / var(--tw-text-opacity));
}
.text-ink-soft {
  --tw-text-opacity: 1;
  color: rgb(45 51 82 / var(--tw-text-opacity));
}
.text-slate-800 {
  --tw-text-opacity: 1;
  color: rgb(30 41 59 / var(--tw-text-opacity));
}
.text-white {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
}
.text-white\/80 {
  color: rgb(255 255 255 / 0.8);
}
.underline {
  text-decoration-line: underline;
}
.underline-offset-2 {
  text-underline-offset: 2px;
}
.underline-offset-4 {
  text-underline-offset: 4px;
}
.antialiased {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.opacity-60 {
  opacity: 0.6;
}
.opacity-90 {
  opacity: 0.9;
}
.shadow-\[0_8px_22px_-14px_rgba\(112\2c 97\2c 255\2c 0\.35\)\] {
  --tw-shadow: 0 8px 22px -14px rgba(112,97,255,0.35);
  --tw-shadow-colored: 0 8px 22px -14px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-glass {
  --tw-shadow: 0 1px 1px rgba(10, 15, 40, 0.04), 0 12px 28px -12px rgba(112, 97, 255, 0.25), 0 28px 60px -24px rgba(245, 99, 141, 0.18);
  --tw-shadow-colored: 0 1px 1px var(--tw-shadow-color), 0 12px 28px -12px var(--tw-shadow-color), 0 28px 60px -24px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-glass-sm {
  --tw-shadow: 0 1px 1px rgba(10, 15, 40, 0.04), 0 6px 16px -8px rgba(112, 97, 255, 0.18);
  --tw-shadow-colored: 0 1px 1px var(--tw-shadow-color), 0 6px 16px -8px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-glow-brand {
  --tw-shadow: 0 6px 18px -6px rgba(112, 97, 255, 0.55), inset 0 1px 0 rgba(255,255,255,0.35);
  --tw-shadow-colored: 0 6px 18px -6px var(--tw-shadow-color), inset 0 1px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-sm {
  --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.outline-none {
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.outline {
  outline-style: solid;
}
.ring {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.ring-2 {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.ring-brand-400\/60 {
  --tw-ring-color: rgb(138 128 255 / 0.6);
}
.ring-white {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(255 255 255 / var(--tw-ring-opacity));
}
.blur {
  --tw-blur: blur(8px);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.blur-2xl {
  --tw-blur: blur(40px);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.blur-3xl {
  --tw-blur: blur(64px);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.filter {
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.backdrop-blur {
  --tw-backdrop-blur: blur(8px);
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.backdrop-blur-sm {
  --tw-backdrop-blur: blur(4px);
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.backdrop-blur-xl {
  --tw-backdrop-blur: blur(24px);
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.backdrop-filter {
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.transition {
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-transform {
  transition-property: transform;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.\[animation-delay\:150ms\] {
  animation-delay: 150ms;
}
.\[animation-delay\:300ms\] {
  animation-delay: 300ms;
}

/* =========================================================================
   Canvas & ambient background
   -------------------------------------------------------------------------
   We want a "soft baby night → dawn" backdrop: three large colored orbs
   (lavender, blush, sky-soft) floating over an off-white canvas, with a
   subtle SVG grain on top so the glass surfaces have texture to refract.

   The whole thing is attached to <body> with fixed pseudo-elements so it
   doesn't scroll and doesn't re-paint on every layout change. All glass
   surfaces (defined below) then blur the ambient light behind them.
   ========================================================================= */

html {
  scroll-behavior: smooth;
}

:root {
  color-scheme: light;
  --canvas: #faf7fb;
  --ink: #0b1026;
  --ink-soft: #2d3352;
  --ink-muted: #5f6684;

  /* Hairlines used for glass edges. */
  --hairline-top: rgba(255, 255, 255, 0.65);
  --hairline-outer: rgba(11, 16, 38, 0.06);
}

html,
body {
  height: 100%;
}

body {
  font-feature-settings: "rlig" 1, "calt" 1, "ss01" 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: var(--ink);
  background: var(--canvas);
  /* Ambient orbs drawn as fixed layered radial-gradients. Soft, large,
     very low contrast — they're meant to be the *light* being refracted
     by the glass, not decoration in their own right. */
  background-image:
    radial-gradient(
      1100px 700px at 8% -8%,
      rgba(165, 153, 255, 0.35),
      transparent 60%
    ),
    radial-gradient(
      900px 700px at 110% 10%,
      rgba(166, 191, 255, 0.32),
      transparent 55%
    ),
    radial-gradient(
      1000px 900px at 85% 110%,
      rgba(255, 148, 182, 0.28),
      transparent 60%
    ),
    radial-gradient(
      800px 600px at 20% 95%,
      rgba(218, 210, 255, 0.30),
      transparent 60%
    );
  background-attachment: fixed;
  background-repeat: no-repeat;
}

/* Subtle film grain so the glass has something to refract. The SVG is
   inlined so no extra request is needed. */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  opacity: 0.4;
  mix-blend-mode: soft-light;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 0.08 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
  background-size: 220px 220px;
}

/* Make sure real content sits above the grain layer. */
#__next,
body > *:not(style):not(script) {
  position: relative;
  z-index: 1;
}

/* =========================================================================
   Glass component utilities
   -------------------------------------------------------------------------
   One vocabulary the whole app uses. Keeps every surface consistent and
   lets us tune "the look" from one place.
   ========================================================================= */

/* =========================================================================
   Motion utilities
   -------------------------------------------------------------------------
   `.stagger > *` applies an increasing animation-delay so child cards
   slide-up one after another instead of all at once. Falls back gracefully
   on prefers-reduced-motion.
   ========================================================================= */

.stagger > * {
  animation: slide-up 360ms cubic-bezier(0.22, 1, 0.36, 1) both;
}
.stagger > *:nth-child(1) { animation-delay: 0ms; }
.stagger > *:nth-child(2) { animation-delay: 60ms; }
.stagger > *:nth-child(3) { animation-delay: 120ms; }
.stagger > *:nth-child(4) { animation-delay: 180ms; }
.stagger > *:nth-child(5) { animation-delay: 240ms; }
.stagger > *:nth-child(6) { animation-delay: 300ms; }
.stagger > *:nth-child(7) { animation-delay: 360ms; }
.stagger > *:nth-child(8) { animation-delay: 420ms; }

@media (prefers-reduced-motion: reduce) {
  .stagger > *,
  .animate-fade-in,
  .animate-slide-up,
  .animate-slide-in-right,
  .animate-slide-in-left,
  .animate-scale-in {
    animation: none !important;
  }
}

/* Skeleton loader. Linear shimmer over a soft glass surface so the
   loading state feels intentional, not broken. */
.skeleton {
  position: relative;
  overflow: hidden;
  background: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0.55) 0%,
    rgba(255, 255, 255, 0.85) 50%,
    rgba(255, 255, 255, 0.55) 100%
  );
  background-size: 200% 100%;
  animation: shimmer 1.6s linear infinite;
  border-radius: 0.75rem;
}

/* =========================================================================
   Assistant markdown bubble
   ========================================================================= */

.prose-sb {
  font-size: 0.9375rem;
  line-height: 1.55;
  color: var(--ink);
}
.prose-sb .sb-h {
  font-weight: 600;
  margin: 0.85rem 0 0.35rem;
  color: var(--ink);
}
.prose-sb .sb-h:first-child {
  margin-top: 0;
}
.prose-sb .sb-p {
  margin: 0.5rem 0;
}
.prose-sb .sb-p:first-child {
  margin-top: 0;
}
.prose-sb .sb-p:last-child {
  margin-bottom: 0;
}
.prose-sb .sb-ul,
.prose-sb .sb-ol {
  margin: 0.5rem 0;
  padding-left: 1.25rem;
}
.prose-sb .sb-ul {
  list-style: disc;
}
.prose-sb .sb-ol {
  list-style: decimal;
}
.prose-sb .sb-li {
  margin: 0.25rem 0;
}
.prose-sb .sb-li > .sb-p {
  margin: 0;
}
.prose-sb .sb-strong {
  font-weight: 600;
  color: var(--ink);
}
.prose-sb .sb-em {
  font-style: italic;
}
.prose-sb .sb-hr {
  border: none;
  border-top: 1px solid rgba(11, 16, 38, 0.1);
  margin: 0.85rem 0;
}
.prose-sb .sb-code {
  padding: 0.1rem 0.35rem;
  border-radius: 0.3rem;
  background: rgba(11, 16, 38, 0.08);
  font-size: 0.85em;
}
.prose-sb .sb-link {
  color: #5a4de0;
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* =========================================================================
   Dark theme
   -------------------------------------------------------------------------
   Activated by adding `.dark` on <html> (see ThemeToggle + the init script
   in layout.tsx). The approach is:

     1. Re-point the design-token CSS variables to their dark equivalents.
     2. Swap the body gradient orbs for dimmer, night-sky ones.
     3. Override every `bg-white/NN`, `border-white/NN`, `text-ink*` utility
        that actually appears in the codebase so components don't need
        explicit `dark:` variants sprinkled everywhere.
     4. Re-tint the hardcoded backgrounds inside the `.glass-*` component
        utilities (they were compiled via `@apply bg-white/55` etc. which
        the utility overrides in (3) cannot reach).
   ========================================================================= */

.dark {
  color-scheme: dark;
  --canvas: #070919;
  --ink: #E8EAF6;
  --ink-soft: #BEC3E0;
  --ink-muted: #8A90B8;

  --hairline-top: rgba(255, 255, 255, 0.08);
  --hairline-outer: rgba(255, 255, 255, 0.06);
}

.dark body {
  background: var(--canvas);
  background-image:
    radial-gradient(
      1100px 700px at 8% -8%,
      rgba(90, 77, 224, 0.28),
      transparent 60%
    ),
    radial-gradient(
      900px 700px at 110% 10%,
      rgba(70, 100, 180, 0.25),
      transparent 55%
    ),
    radial-gradient(
      1000px 900px at 85% 110%,
      rgba(213, 73, 111, 0.22),
      transparent 60%
    ),
    radial-gradient(
      800px 600px at 20% 95%,
      rgba(110, 95, 200, 0.22),
      transparent 60%
    );
}

/* Grain: tone it down in dark mode so it doesn't sparkle. */
.dark body::before {
  opacity: 0.25;
  mix-blend-mode: overlay;
}

/* --- Text (ink) utilities ---------------------------------------------- */
.dark .text-ink { color: var(--ink); }
.dark .text-ink-soft { color: var(--ink-soft); }
.dark .text-ink-muted { color: var(--ink-muted); }
.dark .text-ink-faint { color: rgba(232, 234, 246, 0.45); }

.dark .hover\:text-ink:hover { color: var(--ink); }

/* --- White background utilities ---------------------------------------- */
/* In dark mode "a whitish glass surface" becomes "a faint light veil on
   the dark canvas". We keep the alpha relationships so stacked surfaces
   still read as layered, just in the opposite direction. */
.dark .bg-white\/35 { background-color: rgba(255, 255, 255, 0.035); }
.dark .bg-white\/40 { background-color: rgba(255, 255, 255, 0.045); }
.dark .bg-white\/45 { background-color: rgba(255, 255, 255, 0.05); }
.dark .bg-white\/50 { background-color: rgba(255, 255, 255, 0.06); }
.dark .bg-white\/55 { background-color: rgba(255, 255, 255, 0.07); }
.dark .bg-white\/60 { background-color: rgba(255, 255, 255, 0.08); }
.dark .bg-white\/70 { background-color: rgba(255, 255, 255, 0.10); }
.dark .bg-white\/75 { background-color: rgba(255, 255, 255, 0.11); }
/* The two opaque-ish ones are used for popovers / tooltips / toasts; they
   need to actually cover whatever is behind them, so they get a solid
   near-black tint instead of a light veil. */
.dark .bg-white\/85 { background-color: rgba(17, 20, 42, 0.88); }
.dark .bg-white\/95 { background-color: rgba(17, 20, 42, 0.95); }
.dark .bg-white { background-color: rgba(255, 255, 255, 0.14); }

.dark .hover\:bg-white:hover { background-color: rgba(255, 255, 255, 0.14); }
.dark .hover\:bg-white\/50:hover { background-color: rgba(255, 255, 255, 0.07); }
.dark .hover\:bg-white\/70:hover { background-color: rgba(255, 255, 255, 0.10); }
.dark .hover\:bg-white\/75:hover { background-color: rgba(255, 255, 255, 0.12); }

/* --- White border utilities -------------------------------------------- */
.dark .border-white\/40 { border-color: rgba(255, 255, 255, 0.07); }
.dark .border-white\/50 { border-color: rgba(255, 255, 255, 0.09); }
.dark .border-white\/55 { border-color: rgba(255, 255, 255, 0.10); }
.dark .border-white\/60 { border-color: rgba(255, 255, 255, 0.12); }
.dark .border-white\/70 { border-color: rgba(255, 255, 255, 0.14); }

/* --- Ink border utilities ---------------------------------------------- */
.dark .border-ink\/20 { border-color: rgba(232, 234, 246, 0.18); }
.dark .hover\:border-ink\/40:hover { border-color: rgba(232, 234, 246, 0.35); }
.dark .bg-ink\/40 { background-color: rgba(232, 234, 246, 0.40); }

/* --- Glass component utilities ----------------------------------------- */
.dark .glass-card,
.dark .glass-card-tight {
  background-color: rgba(255, 255, 255, 0.045);
  border-color: rgba(255, 255, 255, 0.08);
}
.dark .glass-card::before {
  box-shadow:
    inset 0 1px 0 var(--hairline-top),
    inset 0 0 0 1px rgba(255, 255, 255, 0.04);
}

.dark .glass-card-warm {
  background:
    linear-gradient(
      180deg,
      rgba(80, 30, 50, 0.35),
      rgba(45, 20, 35, 0.30)
    );
}

.dark .glass-card-cool {
  background:
    linear-gradient(
      180deg,
      rgba(35, 45, 85, 0.40),
      rgba(40, 35, 80, 0.32)
    );
}

.dark .glass-nav {
  background-color: rgba(10, 12, 28, 0.55);
  border-bottom-color: rgba(255, 255, 255, 0.06);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.06),
    0 1px 0 rgba(0, 0, 0, 0.25);
}

.dark .glass-chip {
  background-color: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.10);
  color: var(--ink-soft);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.dark .glass-seg {
  background-color: rgba(255, 255, 255, 0.04);
  border-color: rgba(255, 255, 255, 0.08);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}
.dark .glass-seg-item { color: var(--ink-muted); }

.dark .glass-btn-secondary {
  background-color: rgba(255, 255, 255, 0.07);
  border-color: rgba(255, 255, 255, 0.10);
  color: var(--ink);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}
.dark .glass-btn-secondary:hover { background-color: rgba(255, 255, 255, 0.12); }

.dark .glass-btn-ghost { color: var(--ink-muted); }
.dark .glass-btn-ghost:hover {
  background-color: rgba(255, 255, 255, 0.07);
  color: var(--ink);
}

.dark .glass-btn-danger {
  background-color: rgba(213, 73, 111, 0.16);
  border-color: rgba(255, 148, 182, 0.30);
  color: #FFB8CF;
}
.dark .glass-btn-danger:hover { background-color: rgba(213, 73, 111, 0.24); }

.dark .glass-input {
  background-color: rgba(255, 255, 255, 0.05);
  border-color: rgba(255, 255, 255, 0.10);
  color: var(--ink);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.06),
    inset 0 0 0 1px rgba(0, 0, 0, 0.15);
}
.dark .glass-input:focus {
  border-color: rgb(138 128 255 / 0.75);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.08),
    0 0 0 4px rgba(112, 97, 255, 0.28);
}

.dark .glass-card-dashed {
  background-color: rgba(255, 255, 255, 0.03);
  border-color: rgba(232, 234, 246, 0.18);
}

/* --- Skeleton shimmer --------------------------------------------------- */
.dark .skeleton {
  background: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0.05) 0%,
    rgba(255, 255, 255, 0.12) 50%,
    rgba(255, 255, 255, 0.05) 100%
  );
  background-size: 200% 100%;
}

/* --- Assistant markdown ------------------------------------------------- */
.dark .prose-sb .sb-hr {
  border-top-color: rgba(232, 234, 246, 0.15);
}
.dark .prose-sb .sb-code {
  background: rgba(255, 255, 255, 0.08);
  color: var(--ink);
}
.dark .prose-sb .sb-link {
  color: #A49DFF;
}
.placeholder\:text-ink-faint::-moz-placeholder {
  --tw-text-opacity: 1;
  color: rgb(138 144 168 / var(--tw-text-opacity));
}
.placeholder\:text-ink-faint::placeholder {
  --tw-text-opacity: 1;
  color: rgb(138 144 168 / var(--tw-text-opacity));
}
.last\:border-0:last-child {
  border-width: 0px;
}
.hover\:border-ink\/40:hover {
  border-color: rgb(11 16 38 / 0.4);
}
.hover\:bg-amber-100:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(254 243 199 / var(--tw-bg-opacity));
}
.hover\:bg-white:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
}
.hover\:bg-white\/70:hover {
  background-color: rgb(255 255 255 / 0.7);
}
.hover\:bg-white\/75:hover {
  background-color: rgb(255 255 255 / 0.75);
}
.hover\:text-brand-700:hover {
  --tw-text-opacity: 1;
  color: rgb(69 58 179 / var(--tw-text-opacity));
}
.hover\:text-ink:hover {
  --tw-text-opacity: 1;
  color: rgb(11 16 38 / var(--tw-text-opacity));
}
.hover\:underline:hover {
  text-decoration-line: underline;
}
.hover\:opacity-100:hover {
  opacity: 1;
}
.hover\:opacity-90:hover {
  opacity: 0.9;
}
.focus\:ring-brand-400:focus {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(138 128 255 / var(--tw-ring-opacity));
}
.focus\:ring-brand-500:focus {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(112 97 255 / var(--tw-ring-opacity));
}
.disabled\:opacity-60:disabled {
  opacity: 0.6;
}
@media (min-width: 640px) {

  .sm\:order-none {
    order: 0;
  }

  .sm\:mx-0 {
    margin-left: 0px;
    margin-right: 0px;
  }

  .sm\:mt-12 {
    margin-top: 3rem;
  }

  .sm\:mt-24 {
    margin-top: 6rem;
  }

  .sm\:mt-28 {
    margin-top: 7rem;
  }

  .sm\:inline {
    display: inline;
  }

  .sm\:w-auto {
    width: auto;
  }

  .sm\:max-w-sm {
    max-width: 24rem;
  }

  .sm\:basis-auto {
    flex-basis: auto;
  }

  .sm\:grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .sm\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .sm\:grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .sm\:grid-cols-5 {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }

  .sm\:flex-row {
    flex-direction: row;
  }

  .sm\:items-center {
    align-items: center;
  }

  .sm\:justify-end {
    justify-content: flex-end;
  }

  .sm\:justify-center {
    justify-content: center;
  }

  .sm\:justify-between {
    justify-content: space-between;
  }

  .sm\:p-10 {
    padding: 2.5rem;
  }

  .sm\:p-6 {
    padding: 1.5rem;
  }

  .sm\:p-7 {
    padding: 1.75rem;
  }

  .sm\:p-8 {
    padding: 2rem;
  }

  .sm\:px-10 {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
  }

  .sm\:px-12 {
    padding-left: 3rem;
    padding-right: 3rem;
  }

  .sm\:px-6 {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }

  .sm\:py-12 {
    padding-top: 3rem;
    padding-bottom: 3rem;
  }

  .sm\:py-14 {
    padding-top: 3.5rem;
    padding-bottom: 3.5rem;
  }

  .sm\:py-16 {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }

  .sm\:py-5 {
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;
  }

  .sm\:pt-8 {
    padding-top: 2rem;
  }

  .sm\:text-left {
    text-align: left;
  }

  .sm\:text-4xl {
    font-size: 2.25rem;
    line-height: 2.5rem;
  }

  .sm\:text-6xl {
    font-size: 3.75rem;
    line-height: 1;
  }

  .sm\:text-\[2\.25rem\] {
    font-size: 2.25rem;
  }

  .sm\:text-\[3\.1rem\] {
    font-size: 3.1rem;
  }
}
@media (min-width: 768px) {

  .md\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (min-width: 1024px) {

  .lg\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .lg\:grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
.\[\&\[open\]_\.faq-plus\]\:rotate-45[open] .faq-plus {
  --tw-rotate: 45deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}