*, ::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.19 | 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: Inter, system-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]:where(:not([hidden="until-found"])) {
  display: none;
}

html, body {
  height: 100%;
}

body {
  display: flex;
  min-height: 100vh;
  flex-direction: column;
  --tw-bg-opacity: 1;
  background-color: rgb(10 12 18 / var(--tw-bg-opacity, 1));
  font-family: Inter, system-ui, sans-serif;
  --tw-text-opacity: 1;
  color: rgb(241 245 249 / var(--tw-text-opacity, 1));
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background-image:
      radial-gradient(ellipse 90% 50% at 20% -10%, rgba(139, 92, 246, .12), transparent 60%),
      radial-gradient(ellipse 60% 40% at 90% 10%, rgba(245, 158, 11, .07), transparent 55%),
      radial-gradient(ellipse 50% 40% at 100% 100%, rgba(139, 92, 246, .06), transparent 50%);
  background-attachment: fixed;
}

a {
  --tw-text-opacity: 1;
  color: rgb(196 181 253 / var(--tw-text-opacity, 1));
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

a:hover {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

::-moz-selection {
  background-color: rgb(124 58 237 / 0.4);
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

::selection {
  background-color: rgb(124 58 237 / 0.4);
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

::-webkit-scrollbar {
  height: 0.5rem;
  width: 0.5rem;
}

::-webkit-scrollbar-track {
  background-color: transparent;
}

::-webkit-scrollbar-thumb {
  border-radius: 9999px;
  --tw-bg-opacity: 1;
  background-color: rgb(36 40 56 / var(--tw-bg-opacity, 1));
}

::-webkit-scrollbar-thumb:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(51 56 80 / var(--tw-bg-opacity, 1));
}

/* ===== Tarjetas ===== */

.card {
  position: relative;
  margin-bottom: 1.25rem;
  border-radius: 1rem;
  border-width: 1px;
  border-color: rgb(36 40 56 / 0.8);
  background-image: linear-gradient(to bottom, var(--tw-gradient-stops));
  --tw-gradient-from: rgb(17 20 29 / 0.9) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(17 20 29 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
  --tw-gradient-to: rgb(17 20 29 / 0.7) var(--tw-gradient-to-position);
  padding: 1.25rem;
  --tw-shadow: 0 1px 0 0 rgba(255,255,255,.04) inset,0 10px 30px -8px rgba(0,0,0,.55);
  --tw-shadow-colored: inset 0 1px 0 0 var(--tw-shadow-color), 0 10px 30px -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);
  --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);
}

.card h2 {
  margin-bottom: 0.875rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 700;
  letter-spacing: -0.025em;
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

a.card:hover, .card-hover:hover {
  --tw-translate-y: -0.125rem;
  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));
  border-color: rgb(139 92 246 / 0.5);
  box-shadow: 0 1px 0 0 rgba(255,255,255,.04) inset, 0 16px 36px -10px rgba(124,58,237,.28);
}

.card, .card-hover {
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

/* ===== Grillas ===== */

.grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
}

/* ===== Chips de ícono (usados en sidebar, stats, listas) ===== */

.icon-chip {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  border-radius: 0.75rem;
  width: 2.25rem;
  height: 2.25rem;
}

.icon-chip.sm {
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 0.5rem;
  font-size: 0.75rem;
  line-height: 1rem;
}

/* ===== Badges / chips ===== */

.badge {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  border-radius: 9999px;
  --tw-bg-opacity: 1;
  background-color: rgb(124 58 237 / var(--tw-bg-opacity, 1));
  padding-left: 0.625rem;
  padding-right: 0.625rem;
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: 0.025em;
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
  --tw-shadow: 0 2px 8px -2px rgba(124,58,237,.6);
  --tw-shadow-colored: 0 2px 8px -2px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.badge::before {
  content: '';
  height: 0.375rem;
  width: 0.375rem;
  border-radius: 9999px;
  background-color: rgb(255 255 255 / 0.7);
}

.chip-row {
  margin-bottom: 1rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.chip {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  border-radius: 9999px;
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(36 40 56 / var(--tw-border-opacity, 1));
  background-color: rgb(25 28 40 / 0.7);
  padding-left: 0.875rem;
  padding-right: 0.875rem;
  padding-top: 0.375rem;
  padding-bottom: 0.375rem;
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 600;
  --tw-text-opacity: 1;
  color: rgb(203 213 225 / var(--tw-text-opacity, 1));
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.chip:hover {
  --tw-border-opacity: 1;
  border-color: rgb(139 92 246 / var(--tw-border-opacity, 1));
  background-color: rgb(124 58 237 / 0.15);
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

.chip.active {
  --tw-border-opacity: 1;
  border-color: rgb(139 92 246 / var(--tw-border-opacity, 1));
  background-image: linear-gradient(to bottom, var(--tw-gradient-stops));
  --tw-gradient-from: rgb(139 92 246 / 0.25) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(139 92 246 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
  --tw-gradient-to: rgb(124 58 237 / 0.25) var(--tw-gradient-to-position);
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
  --tw-shadow: 0 0 0 1px rgba(139,92,246,.15), 0 8px 30px rgba(0,0,0,.45);
  --tw-shadow-colored: 0 0 0 1px var(--tw-shadow-color), 0 8px 30px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

/* ===== Pastillas de rol / categoría (reutilizables en todo el admin) ===== */

.pill {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  white-space: nowrap;
  border-radius: 9999px;
  border-width: 1px;
  padding-left: 0.625rem;
  padding-right: 0.625rem;
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
  font-size: .68rem;
  font-weight: 700;
}

.pill.role-client {
  border-color: rgb(100 116 139 / 0.3);
  background-color: rgb(100 116 139 / 0.1);
  --tw-text-opacity: 1;
  color: rgb(203 213 225 / var(--tw-text-opacity, 1));
}

.pill.role-vendor {
  border-color: rgb(14 165 233 / 0.3);
  background-color: rgb(14 165 233 / 0.1);
  --tw-text-opacity: 1;
  color: rgb(125 211 252 / var(--tw-text-opacity, 1));
}

.pill.role-admin {
  border-color: rgb(139 92 246 / 0.3);
  background-color: rgb(139 92 246 / 0.1);
  --tw-text-opacity: 1;
  color: rgb(196 181 253 / var(--tw-text-opacity, 1));
}

.pill.role-superadmin {
  border-color: rgb(245 158 11 / 0.3);
  background-color: rgb(245 158 11 / 0.1);
  --tw-text-opacity: 1;
  color: rgb(253 230 138 / var(--tw-text-opacity, 1));
}

.pill.cat-certificado {
  border-color: rgb(16 185 129 / 0.3);
  background-color: rgb(16 185 129 / 0.1);
  --tw-text-opacity: 1;
  color: rgb(110 231 183 / var(--tw-text-opacity, 1));
}

.pill.cat-no_certificado {
  border-color: rgb(14 165 233 / 0.3);
  background-color: rgb(14 165 233 / 0.1);
  --tw-text-opacity: 1;
  color: rgb(125 211 252 / var(--tw-text-opacity, 1));
}

.pill.cat-minoristas {
  border-color: rgb(245 158 11 / 0.3);
  background-color: rgb(245 158 11 / 0.1);
  --tw-text-opacity: 1;
  color: rgb(253 230 138 / var(--tw-text-opacity, 1));
}

.pill.cat-ratones {
  border-color: rgb(244 63 94 / 0.3);
  background-color: rgb(244 63 94 / 0.1);
  --tw-text-opacity: 1;
  color: rgb(253 164 175 / var(--tw-text-opacity, 1));
}

.pill.cat-none {
  --tw-border-opacity: 1;
  border-color: rgb(36 40 56 / var(--tw-border-opacity, 1));
  --tw-bg-opacity: 1;
  background-color: rgb(25 28 40 / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(100 116 139 / var(--tw-text-opacity, 1));
}

.pill.on {
  border-color: rgb(16 185 129 / 0.3);
  background-color: rgb(16 185 129 / 0.1);
  --tw-text-opacity: 1;
  color: rgb(110 231 183 / var(--tw-text-opacity, 1));
}

.pill.off {
  --tw-border-opacity: 1;
  border-color: rgb(36 40 56 / var(--tw-border-opacity, 1));
  --tw-bg-opacity: 1;
  background-color: rgb(25 28 40 / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(100 116 139 / var(--tw-text-opacity, 1));
}

/* ===== Avatar circular con inicial (listas de usuarios) ===== */

.avatar {
  display: flex;
  height: 2rem;
  width: 2rem;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  background-image: linear-gradient(to bottom right, var(--tw-gradient-stops));
  --tw-gradient-from: #8b5cf6 var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(139 92 246 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
  --tw-gradient-to: #6d28d9 var(--tw-gradient-to-position);
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 700;
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
  --tw-shadow: 0 0 0 1px rgba(139,92,246,.15), 0 8px 30px rgba(0,0,0,.45);
  --tw-shadow-colored: 0 0 0 1px var(--tw-shadow-color), 0 8px 30px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

/* ===== Tarjetas de estadística con acento superior de color ===== */

.stat-card {
  position: relative;
  overflow: hidden;
  padding-top: 1.5rem;
}

.stat-card::before {
  content: '';
  position: absolute;
  left: 0px;
  right: 0px;
  top: 0px;
  height: 0.25rem;
  background-color: var(--stat-color,#8b5cf6);
}

/* ===== Tablas: scroll horizontal propio en pantallas chicas, sin ===== */

/* recortar contenido vertical (dropdowns de edición dentro de celdas)  */

table {
  display: block;
  width: 100%;
  max-width: 100%;
  border-collapse: collapse;
  overflow-x: auto;
  white-space: nowrap;
  font-size: 0.875rem;
  line-height: 1.25rem;
  -webkit-overflow-scrolling: touch;
}

th, td {
  border-bottom-width: 1px;
  border-color: rgb(36 40 56 / 0.7);
  padding-left: 0.875rem;
  padding-right: 0.875rem;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  text-align: left;
}

th {
  background-color: rgb(255 255 255 / .015);
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  --tw-text-opacity: 1;
  color: rgb(148 163 184 / var(--tw-text-opacity, 1));
}

tbody tr {
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

tr:hover td {
  background-color: rgb(255 255 255 / .03);
}

td .card, td details {
  white-space: normal;
}

/* Fila de "sin resultados" (un solo <td colspan>): como la tabla es block
     para poder scrollear en móvil, el colspan por sí solo no estira la celda
     a todo el ancho — se ve angosta y descentrada. Forzamos bloque a 100%. */

tr:has(> td[colspan]) {
  display: block;
  width: 100%;
}

tr:has(> td[colspan]) td[colspan] {
  display: block;
  width: 100%;
  white-space: normal;
  padding-top: 2rem;
  padding-bottom: 2rem;
  text-align: center;
  --tw-text-opacity: 1;
  color: rgb(100 116 139 / var(--tw-text-opacity, 1));
}

/* La tabla ocupa 100% de ancho pero el contenido real casi nunca lo llena,
     así que el navegador reparte ese sobrante en la última columna (casi
     siempre "Acciones"), dejando un hueco vacío antes de los botones.
     Forzamos que la última celda de cada fila no absorba ese espacio extra. */

tr > :last-child {
  width: 1%;
}

/* ===== Formularios ===== */

input, select, textarea {
  width: 100%;
  border-radius: 0.75rem;
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(36 40 56 / var(--tw-border-opacity, 1));
  background-color: rgb(25 28 40 / 0.8);
  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(241 245 249 / var(--tw-text-opacity, 1));
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

input::-moz-placeholder, select::-moz-placeholder, textarea::-moz-placeholder {
  --tw-text-opacity: 1;
  color: rgb(100 116 139 / var(--tw-text-opacity, 1));
}

input::placeholder, select::placeholder, textarea::placeholder {
  --tw-text-opacity: 1;
  color: rgb(100 116 139 / var(--tw-text-opacity, 1));
}

input, select, textarea {
  box-shadow: inset 0 1px 2px rgba(0,0,0,.25);
}

input:hover, select:hover, textarea:hover {
  --tw-border-opacity: 1;
  border-color: rgb(51 56 80 / var(--tw-border-opacity, 1));
}

input:focus, select:focus, textarea:focus {
  --tw-border-opacity: 1;
  border-color: rgb(139 92 246 / var(--tw-border-opacity, 1));
  outline: 2px solid transparent;
  outline-offset: 2px;
  --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(4px + 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);
  --tw-ring-color: rgb(124 58 237 / 0.15);
}

input[type="checkbox"] {
  height: 1rem;
  accent-color: #8b5cf6;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  width: 1rem;
}

.field {
  margin-bottom: 0.875rem;
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
}

.field label {
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.025em;
  --tw-text-opacity: 1;
  color: rgb(148 163 184 / var(--tw-text-opacity, 1));
}

form.inline {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}

/* ===== Botones ===== */

button, .btn {
  position: relative;
  display: inline-flex;
  cursor: pointer;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  border-radius: 0.75rem;
  border-width: 0px;
  background-image: linear-gradient(to bottom, var(--tw-gradient-stops));
  --tw-gradient-from: #8b5cf6 var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(139 92 246 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
  --tw-gradient-to: #6d28d9 var(--tw-gradient-to-position);
  padding-left: 1rem;
  padding-right: 1rem;
  padding-top: 0.625rem;
  padding-bottom: 0.625rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 700;
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

button:hover, .btn:hover {
  --tw-brightness: brightness(1.1);
  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);
}

button:active, .btn:active {
  --tw-scale-x: .97;
  --tw-scale-y: .97;
  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));
}

button:disabled, .btn:disabled {
  pointer-events: none;
  opacity: 0.5;
}

button, .btn {
  box-shadow: 0 1px 0 0 rgba(255,255,255,.18) inset, 0 8px 20px -6px rgba(124,58,237,.55);
}

button:focus-visible, .btn:focus-visible {
  outline: 2px solid transparent;
  outline-offset: 2px;
  --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(4px + 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);
  --tw-ring-color: rgb(139 92 246 / 0.3);
}

button.secondary {
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(36 40 56 / var(--tw-border-opacity, 1));
  --tw-bg-opacity: 1;
  background-color: rgb(25 28 40 / var(--tw-bg-opacity, 1));
  background-image: none;
  --tw-text-opacity: 1;
  color: rgb(226 232 240 / var(--tw-text-opacity, 1));
  box-shadow: 0 1px 0 0 rgba(255,255,255,.04) inset;
}

button.secondary:hover {
  --tw-border-opacity: 1;
  border-color: rgb(51 56 80 / var(--tw-border-opacity, 1));
  --tw-bg-opacity: 1;
  background-color: rgb(36 40 56 / var(--tw-bg-opacity, 1));
}

button.danger {
  background-image: linear-gradient(to bottom, var(--tw-gradient-stops));
  --tw-gradient-from: #f43f5e var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(244 63 94 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
  --tw-gradient-to: #e11d48 var(--tw-gradient-to-position);
  box-shadow: 0 1px 0 0 rgba(255,255,255,.18) inset, 0 8px 20px -6px rgba(225,29,72,.55);
}

/* Zonas de clic invisibles del selector de estrellas: deben quedar sin
     fondo/padding/bordes, ya que son overlays sobre los iconos de estrella. */

.star-zones button {
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  min-width: 0;
}

.star-zones button:hover, .star-zones button:active {
  filter: none !important;
  transform: none !important;
}

/* ===== Alertas ===== */

.flash {
  margin-bottom: 1.25rem;
  display: flex;
  align-items: center;
  gap: 0.625rem;
  border-radius: 0.75rem;
  border-width: 1px;
  padding-left: 1rem;
  padding-right: 1rem;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 500;
}

.flash.error {
  border-color: rgb(244 63 94 / 0.25);
  background-color: rgb(244 63 94 / 0.1);
  --tw-text-opacity: 1;
  color: rgb(253 164 175 / var(--tw-text-opacity, 1));
}

.flash.error::before {
  content: '\f071';
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  --tw-text-opacity: 1;
  color: rgb(251 113 133 / var(--tw-text-opacity, 1));
}

.flash.ok {
  border-color: rgb(16 185 129 / 0.25);
  background-color: rgb(16 185 129 / 0.1);
  --tw-text-opacity: 1;
  color: rgb(110 231 183 / var(--tw-text-opacity, 1));
}

.flash.ok::before {
  content: '\f058';
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  --tw-text-opacity: 1;
  color: rgb(52 211 153 / var(--tw-text-opacity, 1));
}

/* ===== Modales (elemento <dialog> nativo) ===== */

dialog.modal {
  margin: auto;
  width: 100%;
  max-width: 32rem;
  border-radius: 1rem;
  border-width: 1px;
  border-color: rgb(36 40 56 / 0.8);
  --tw-bg-opacity: 1;
  background-color: rgb(17 20 29 / var(--tw-bg-opacity, 1));
  padding: 0px;
  --tw-text-opacity: 1;
  color: rgb(241 245 249 / var(--tw-text-opacity, 1));
  box-shadow: 0 24px 60px -12px rgba(0,0,0,.6);
}

dialog.modal::backdrop {
  background-color: rgb(0 0 0 / 0.7);
  --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);
}

dialog.modal .modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  border-bottom-width: 1px;
  border-color: rgb(36 40 56 / 0.8);
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  padding-top: 1rem;
  padding-bottom: 1rem;
}

dialog.modal .modal-header h2 {
  margin-bottom: 0px;
}

dialog.modal .modal-body {
  max-height: 75vh;
  overflow-y: auto;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  padding-top: 1rem;
  padding-bottom: 1rem;
}

/* ===== Galería ===== */

.gallery-grid {
  display: grid;
  gap: 0.75rem;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
}

.gallery-item {
  position: relative;
  overflow: hidden;
  border-radius: 0.75rem;
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(36 40 56 / var(--tw-border-opacity, 1));
  --tw-bg-opacity: 1;
  background-color: rgb(17 20 29 / var(--tw-bg-opacity, 1));
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.gallery-item:hover {
  border-color: rgb(139 92 246 / 0.5);
}

.gallery-item img {
  display: block;
  height: 9rem;
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.gallery-item .actions {
  display: flex;
  justify-content: space-between;
  gap: 0.25rem;
  background-color: rgb(25 28 40 / 0.9);
  padding: 0.375rem;
}

.gallery-item.cover {
  --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);
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(139 92 246 / var(--tw-ring-opacity, 1));
}

/* ===== Sidebar admin: fijo al viewport (no crece con el contenido), ===== */

/* siempre a ancho completo en escritorio — no es colapsable.         ===== */

#adminSidebar {
  height: 100vh;
}

@media (min-width: 1024px) {
  .admin-content {
    margin-left: 18rem;
  }
}

.fixed {
  position: fixed;
}

.absolute {
  position: absolute;
}

.relative {
  position: relative;
}

.sticky {
  position: sticky;
}

.inset-0 {
  inset: 0px;
}

.inset-y-0 {
  top: 0px;
  bottom: 0px;
}

.left-0 {
  left: 0px;
}

.right-3 {
  right: 0.75rem;
}

.top-0 {
  top: 0px;
}

.top-1\/2 {
  top: 50%;
}

.z-10 {
  z-index: 10;
}

.z-20 {
  z-index: 20;
}

.z-30 {
  z-index: 30;
}

.col-span-full {
  grid-column: 1 / -1;
}

.mx-1 {
  margin-left: 0.25rem;
  margin-right: 0.25rem;
}

.mx-auto {
  margin-left: auto;
  margin-right: auto;
}

.\!mb-0 {
  margin-bottom: 0px !important;
}

.\!mb-3 {
  margin-bottom: 0.75rem !important;
}

.\!mb-4 {
  margin-bottom: 1rem !important;
}

.mb-1 {
  margin-bottom: 0.25rem;
}

.mb-10 {
  margin-bottom: 2.5rem;
}

.mb-2 {
  margin-bottom: 0.5rem;
}

.mb-3 {
  margin-bottom: 0.75rem;
}

.mb-3\.5 {
  margin-bottom: 0.875rem;
}

.mb-4 {
  margin-bottom: 1rem;
}

.mb-5 {
  margin-bottom: 1.25rem;
}

.mb-6 {
  margin-bottom: 1.5rem;
}

.mb-7 {
  margin-bottom: 1.75rem;
}

.mb-8 {
  margin-bottom: 2rem;
}

.ml-1 {
  margin-left: 0.25rem;
}

.ml-auto {
  margin-left: auto;
}

.mr-1 {
  margin-right: 0.25rem;
}

.mr-1\.5 {
  margin-right: 0.375rem;
}

.mt-0\.5 {
  margin-top: 0.125rem;
}

.mt-1 {
  margin-top: 0.25rem;
}

.mt-1\.5 {
  margin-top: 0.375rem;
}

.mt-2 {
  margin-top: 0.5rem;
}

.mt-3 {
  margin-top: 0.75rem;
}

.mt-3\.5 {
  margin-top: 0.875rem;
}

.mt-4 {
  margin-top: 1rem;
}

.mt-5 {
  margin-top: 1.25rem;
}

.mt-6 {
  margin-top: 1.5rem;
}

.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;
}

.hidden {
  display: none;
}

.h-1 {
  height: 0.25rem;
}

.h-10 {
  height: 2.5rem;
}

.h-12 {
  height: 3rem;
}

.h-2 {
  height: 0.5rem;
}

.h-20 {
  height: 5rem;
}

.h-36 {
  height: 9rem;
}

.h-5 {
  height: 1.25rem;
}

.h-6 {
  height: 1.5rem;
}

.h-8 {
  height: 2rem;
}

.h-9 {
  height: 2.25rem;
}

.h-full {
  height: 100%;
}

.max-h-56 {
  max-height: 14rem;
}

.max-h-64 {
  max-height: 16rem;
}

.w-1 {
  width: 0.25rem;
}

.w-1\/2 {
  width: 50%;
}

.w-10 {
  width: 2.5rem;
}

.w-12 {
  width: 3rem;
}

.w-2 {
  width: 0.5rem;
}

.w-20 {
  width: 5rem;
}

.w-6 {
  width: 1.5rem;
}

.w-64 {
  width: 16rem;
}

.w-72 {
  width: 18rem;
}

.w-8 {
  width: 2rem;
}

.w-9 {
  width: 2.25rem;
}

.w-full {
  width: 100%;
}

.w-px {
  width: 1px;
}

.min-w-0 {
  min-width: 0px;
}

.min-w-\[150px\] {
  min-width: 150px;
}

.min-w-\[220px\] {
  min-width: 220px;
}

.min-w-\[240px\] {
  min-width: 240px;
}

.\!max-w-2xl {
  max-width: 42rem !important;
}

.max-w-2xl {
  max-width: 42rem;
}

.max-w-5xl {
  max-width: 64rem;
}

.max-w-lg {
  max-width: 32rem;
}

.max-w-md {
  max-width: 28rem;
}

.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-\[2\] {
  flex: 2;
}

.shrink-0 {
  flex-shrink: 0;
}

.-translate-x-full {
  --tw-translate-x: -100%;
  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));
}

.-translate-y-1\/2 {
  --tw-translate-y: -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));
}

.cursor-pointer {
  cursor: pointer;
}

.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));
}

.\!flex-row {
  flex-direction: row !important;
}

.\!flex-col {
  flex-direction: column !important;
}

.flex-col {
  flex-direction: column;
}

.flex-wrap {
  flex-wrap: wrap;
}

.items-start {
  align-items: flex-start;
}

.items-end {
  align-items: flex-end;
}

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

.\!items-stretch {
  align-items: stretch !important;
}

.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-3\.5 {
  gap: 0.875rem;
}

.gap-4 {
  gap: 1rem;
}

.gap-x-4 {
  -moz-column-gap: 1rem;
       column-gap: 1rem;
}

.gap-y-1\.5 {
  row-gap: 0.375rem;
}

.space-y-0\.5 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.125rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.125rem * var(--tw-space-y-reverse));
}

.space-y-2\.5 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.625rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.625rem * 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));
}

.self-start {
  align-self: flex-start;
}

.self-center {
  align-self: center;
}

.overflow-hidden {
  overflow: hidden;
}

.overflow-y-auto {
  overflow-y: auto;
}

.truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.whitespace-nowrap {
  white-space: nowrap;
}

.whitespace-pre-wrap {
  white-space: pre-wrap;
}

.rounded-2xl {
  border-radius: 1rem;
}

.rounded-full {
  border-radius: 9999px;
}

.rounded-lg {
  border-radius: 0.5rem;
}

.rounded-xl {
  border-radius: 0.75rem;
}

.rounded-r-full {
  border-top-right-radius: 9999px;
  border-bottom-right-radius: 9999px;
}

.border {
  border-width: 1px;
}

.\!border-l-4 {
  border-left-width: 4px !important;
}

.border-b {
  border-bottom-width: 1px;
}

.border-l-4 {
  border-left-width: 4px;
}

.border-r {
  border-right-width: 1px;
}

.border-t {
  border-top-width: 1px;
}

.border-amber-500\/25 {
  border-color: rgb(245 158 11 / 0.25);
}

.border-amber-500\/30 {
  border-color: rgb(245 158 11 / 0.3);
}

.border-amber-500\/40 {
  border-color: rgb(245 158 11 / 0.4);
}

.border-blue-500\/30 {
  border-color: rgb(59 130 246 / 0.3);
}

.border-brand-500\/25 {
  border-color: rgb(139 92 246 / 0.25);
}

.border-brand-500\/30 {
  border-color: rgb(139 92 246 / 0.3);
}

.border-emerald-500\/25 {
  border-color: rgb(16 185 129 / 0.25);
}

.border-emerald-500\/30 {
  border-color: rgb(16 185 129 / 0.3);
}

.border-gold-500\/25 {
  border-color: rgb(245 158 11 / 0.25);
}

.border-gold-500\/30 {
  border-color: rgb(245 158 11 / 0.3);
}

.border-ink-600 {
  --tw-border-opacity: 1;
  border-color: rgb(36 40 56 / var(--tw-border-opacity, 1));
}

.border-ink-600\/70 {
  border-color: rgb(36 40 56 / 0.7);
}

.border-ink-600\/80 {
  border-color: rgb(36 40 56 / 0.8);
}

.border-red-500\/30 {
  border-color: rgb(239 68 68 / 0.3);
}

.border-rose-500\/30 {
  border-color: rgb(244 63 94 / 0.3);
}

.border-sky-500\/25 {
  border-color: rgb(14 165 233 / 0.25);
}

.border-sky-500\/30 {
  border-color: rgb(14 165 233 / 0.3);
}

.border-violet-500\/30 {
  border-color: rgb(139 92 246 / 0.3);
}

.\!border-l-rose-500 {
  --tw-border-opacity: 1 !important;
  border-left-color: rgb(244 63 94 / var(--tw-border-opacity, 1)) !important;
}

.\!border-l-sky-500 {
  --tw-border-opacity: 1 !important;
  border-left-color: rgb(14 165 233 / var(--tw-border-opacity, 1)) !important;
}

.border-l-brand-500 {
  --tw-border-opacity: 1;
  border-left-color: rgb(139 92 246 / var(--tw-border-opacity, 1));
}

.border-l-emerald-500 {
  --tw-border-opacity: 1;
  border-left-color: rgb(16 185 129 / var(--tw-border-opacity, 1));
}

.border-l-gold-500 {
  --tw-border-opacity: 1;
  border-left-color: rgb(245 158 11 / var(--tw-border-opacity, 1));
}

.border-l-rose-500 {
  --tw-border-opacity: 1;
  border-left-color: rgb(244 63 94 / var(--tw-border-opacity, 1));
}

.border-l-sky-500 {
  --tw-border-opacity: 1;
  border-left-color: rgb(14 165 233 / var(--tw-border-opacity, 1));
}

.border-t-ink-600\/60 {
  border-top-color: rgb(36 40 56 / 0.6);
}

.\!bg-ink-700 {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(25 28 40 / var(--tw-bg-opacity, 1)) !important;
}

.\!bg-ink-700\/80 {
  background-color: rgb(25 28 40 / 0.8) !important;
}

.\!bg-rose-500\/\[\.04\] {
  background-color: rgb(244 63 94 / .04) !important;
}

.\!bg-transparent {
  background-color: transparent !important;
}

.bg-amber-500\/10 {
  background-color: rgb(245 158 11 / 0.1);
}

.bg-amber-500\/15 {
  background-color: rgb(245 158 11 / 0.15);
}

.bg-black\/60 {
  background-color: rgb(0 0 0 / 0.6);
}

.bg-blue-500\/10 {
  background-color: rgb(59 130 246 / 0.1);
}

.bg-brand-500 {
  --tw-bg-opacity: 1;
  background-color: rgb(139 92 246 / var(--tw-bg-opacity, 1));
}

.bg-brand-500\/10 {
  background-color: rgb(139 92 246 / 0.1);
}

.bg-brand-500\/15 {
  background-color: rgb(139 92 246 / 0.15);
}

.bg-brand-500\/25 {
  background-color: rgb(139 92 246 / 0.25);
}

.bg-brand-600\/20 {
  background-color: rgb(124 58 237 / 0.2);
}

.bg-emerald-500\/10 {
  background-color: rgb(16 185 129 / 0.1);
}

.bg-emerald-500\/15 {
  background-color: rgb(16 185 129 / 0.15);
}

.bg-emerald-500\/20 {
  background-color: rgb(16 185 129 / 0.2);
}

.bg-emerald-500\/5 {
  background-color: rgb(16 185 129 / 0.05);
}

.bg-fuchsia-500\/15 {
  background-color: rgb(217 70 239 / 0.15);
}

.bg-gold-400 {
  --tw-bg-opacity: 1;
  background-color: rgb(251 191 36 / var(--tw-bg-opacity, 1));
}

.bg-gold-500\/10 {
  background-color: rgb(245 158 11 / 0.1);
}

.bg-gold-500\/15 {
  background-color: rgb(245 158 11 / 0.15);
}

.bg-gold-500\/20 {
  background-color: rgb(245 158 11 / 0.2);
}

.bg-ink-600 {
  --tw-bg-opacity: 1;
  background-color: rgb(36 40 56 / var(--tw-bg-opacity, 1));
}

.bg-ink-700 {
  --tw-bg-opacity: 1;
  background-color: rgb(25 28 40 / var(--tw-bg-opacity, 1));
}

.bg-ink-700\/40 {
  background-color: rgb(25 28 40 / 0.4);
}

.bg-ink-700\/60 {
  background-color: rgb(25 28 40 / 0.6);
}

.bg-ink-800 {
  --tw-bg-opacity: 1;
  background-color: rgb(17 20 29 / var(--tw-bg-opacity, 1));
}

.bg-ink-800\/40 {
  background-color: rgb(17 20 29 / 0.4);
}

.bg-ink-800\/50 {
  background-color: rgb(17 20 29 / 0.5);
}

.bg-ink-800\/60 {
  background-color: rgb(17 20 29 / 0.6);
}

.bg-ink-900\/60 {
  background-color: rgb(10 12 18 / 0.6);
}

.bg-ink-900\/80 {
  background-color: rgb(10 12 18 / 0.8);
}

.bg-ink-900\/90 {
  background-color: rgb(10 12 18 / 0.9);
}

.bg-ink-900\/95 {
  background-color: rgb(10 12 18 / 0.95);
}

.bg-red-500\/10 {
  background-color: rgb(239 68 68 / 0.1);
}

.bg-rose-500\/10 {
  background-color: rgb(244 63 94 / 0.1);
}

.bg-rose-500\/15 {
  background-color: rgb(244 63 94 / 0.15);
}

.bg-sky-500\/10 {
  background-color: rgb(14 165 233 / 0.1);
}

.bg-sky-500\/15 {
  background-color: rgb(14 165 233 / 0.15);
}

.bg-sky-500\/20 {
  background-color: rgb(14 165 233 / 0.2);
}

.bg-slate-500\/15 {
  background-color: rgb(100 116 139 / 0.15);
}

.bg-violet-500\/10 {
  background-color: rgb(139 92 246 / 0.1);
}

.bg-white {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}

.bg-white\/\[\.04\] {
  background-color: rgb(255 255 255 / .04);
}

.\!bg-gradient-to-b {
  background-image: linear-gradient(to bottom, var(--tw-gradient-stops)) !important;
}

.bg-gradient-to-b {
  background-image: linear-gradient(to bottom, var(--tw-gradient-stops));
}

.bg-gradient-to-br {
  background-image: linear-gradient(to bottom right, var(--tw-gradient-stops));
}

.bg-gradient-to-r {
  background-image: linear-gradient(to right, var(--tw-gradient-stops));
}

.bg-sidebar-sheen {
  background-image: linear-gradient(180deg, rgba(139,92,246,.08), transparent 30%);
}

.\!from-gold-500 {
  --tw-gradient-from: #f59e0b var(--tw-gradient-from-position) !important;
  --tw-gradient-to: rgb(245 158 11 / 0) var(--tw-gradient-to-position) !important;
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important;
}

.\!from-rose-500 {
  --tw-gradient-from: #f43f5e var(--tw-gradient-from-position) !important;
  --tw-gradient-to: rgb(244 63 94 / 0) var(--tw-gradient-to-position) !important;
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important;
}

.from-amber-500\/\[\.07\] {
  --tw-gradient-from: rgb(245 158 11 / .07) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(245 158 11 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.from-brand-300 {
  --tw-gradient-from: #c4b5fd var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(196 181 253 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.from-brand-400 {
  --tw-gradient-from: #a78bfa var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(167 139 250 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.from-brand-500 {
  --tw-gradient-from: #8b5cf6 var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(139 92 246 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.from-brand-500\/20 {
  --tw-gradient-from: rgb(139 92 246 / 0.2) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(139 92 246 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.from-brand-600\/20 {
  --tw-gradient-from: rgb(124 58 237 / 0.2) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(124 58 237 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.from-emerald-400 {
  --tw-gradient-from: #34d399 var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(52 211 153 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.from-emerald-500 {
  --tw-gradient-from: #10b981 var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(16 185 129 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.from-emerald-500\/15 {
  --tw-gradient-from: rgb(16 185 129 / 0.15) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(16 185 129 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.from-fuchsia-400 {
  --tw-gradient-from: #e879f9 var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(232 121 249 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.from-gold-300 {
  --tw-gradient-from: #fde68a var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(253 230 138 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.from-gold-400 {
  --tw-gradient-from: #fbbf24 var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(251 191 36 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.from-gold-500\/15 {
  --tw-gradient-from: rgb(245 158 11 / 0.15) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(245 158 11 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.from-rose-500\/25 {
  --tw-gradient-from: rgb(244 63 94 / 0.25) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(244 63 94 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.from-rose-600\/20 {
  --tw-gradient-from: rgb(225 29 72 / 0.2) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(225 29 72 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.from-sky-400 {
  --tw-gradient-from: #38bdf8 var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(56 189 248 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.from-sky-500\/15 {
  --tw-gradient-from: rgb(14 165 233 / 0.15) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(14 165 233 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.from-sky-500\/25 {
  --tw-gradient-from: rgb(14 165 233 / 0.25) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(14 165 233 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.from-slate-400 {
  --tw-gradient-from: #94a3b8 var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(148 163 184 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.via-brand-300 {
  --tw-gradient-to: rgb(196 181 253 / 0)  var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), #c4b5fd var(--tw-gradient-via-position), var(--tw-gradient-to);
}

.via-fuchsia-300 {
  --tw-gradient-to: rgb(240 171 252 / 0)  var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), #f0abfc var(--tw-gradient-via-position), var(--tw-gradient-to);
}

.via-fuchsia-500 {
  --tw-gradient-to: rgb(217 70 239 / 0)  var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), #d946ef var(--tw-gradient-via-position), var(--tw-gradient-to);
}

.via-fuchsia-500\/10 {
  --tw-gradient-to: rgb(217 70 239 / 0)  var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), rgb(217 70 239 / 0.1) var(--tw-gradient-via-position), var(--tw-gradient-to);
}

.via-rose-500\/10 {
  --tw-gradient-to: rgb(244 63 94 / 0)  var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), rgb(244 63 94 / 0.1) var(--tw-gradient-via-position), var(--tw-gradient-to);
}

.\!to-rose-600 {
  --tw-gradient-to: #e11d48 var(--tw-gradient-to-position) !important;
}

.\!to-rose-700 {
  --tw-gradient-to: #be123c var(--tw-gradient-to-position) !important;
}

.to-brand-600 {
  --tw-gradient-to: #7c3aed var(--tw-gradient-to-position);
}

.to-brand-700 {
  --tw-gradient-to: #6d28d9 var(--tw-gradient-to-position);
}

.to-emerald-500\/\[\.03\] {
  --tw-gradient-to: rgb(16 185 129 / .03) var(--tw-gradient-to-position);
}

.to-emerald-600 {
  --tw-gradient-to: #059669 var(--tw-gradient-to-position);
}

.to-fuchsia-300 {
  --tw-gradient-to: #f0abfc var(--tw-gradient-to-position);
}

.to-fuchsia-500\/\[\.03\] {
  --tw-gradient-to: rgb(217 70 239 / .03) var(--tw-gradient-to-position);
}

.to-fuchsia-600 {
  --tw-gradient-to: #c026d3 var(--tw-gradient-to-position);
}

.to-fuchsia-600\/10 {
  --tw-gradient-to: rgb(192 38 211 / 0.1) var(--tw-gradient-to-position);
}

.to-gold-300 {
  --tw-gradient-to: #fde68a var(--tw-gradient-to-position);
}

.to-gold-500 {
  --tw-gradient-to: #f59e0b var(--tw-gradient-to-position);
}

.to-gold-500\/15 {
  --tw-gradient-to: rgb(245 158 11 / 0.15) var(--tw-gradient-to-position);
}

.to-gold-500\/\[\.03\] {
  --tw-gradient-to: rgb(245 158 11 / .03) var(--tw-gradient-to-position);
}

.to-rose-500\/15 {
  --tw-gradient-to: rgb(244 63 94 / 0.15) var(--tw-gradient-to-position);
}

.to-rose-500\/5 {
  --tw-gradient-to: rgb(244 63 94 / 0.05) var(--tw-gradient-to-position);
}

.to-sky-500\/5 {
  --tw-gradient-to: rgb(14 165 233 / 0.05) var(--tw-gradient-to-position);
}

.to-sky-500\/\[\.03\] {
  --tw-gradient-to: rgb(14 165 233 / .03) var(--tw-gradient-to-position);
}

.to-sky-600 {
  --tw-gradient-to: #0284c7 var(--tw-gradient-to-position);
}

.to-slate-600 {
  --tw-gradient-to: #475569 var(--tw-gradient-to-position);
}

.to-transparent {
  --tw-gradient-to: transparent var(--tw-gradient-to-position);
}

.bg-clip-text {
  -webkit-background-clip: text;
          background-clip: text;
}

.object-cover {
  -o-object-fit: cover;
     object-fit: cover;
}

.\!p-0 {
  padding: 0px !important;
}

.p-0 {
  padding: 0px;
}

.p-10 {
  padding: 2.5rem;
}

.p-2 {
  padding: 0.5rem;
}

.p-2\.5 {
  padding: 0.625rem;
}

.p-3 {
  padding: 0.75rem;
}

.p-4 {
  padding: 1rem;
}

.p-5 {
  padding: 1.25rem;
}

.p-6 {
  padding: 1.5rem;
}

.p-8 {
  padding: 2rem;
}

.\!py-1 {
  padding-top: 0.25rem !important;
  padding-bottom: 0.25rem !important;
}

.\!py-2 {
  padding-top: 0.5rem !important;
  padding-bottom: 0.5rem !important;
}

.px-1 {
  padding-left: 0.25rem;
  padding-right: 0.25rem;
}

.px-2 {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}

.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;
}

.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-3\.5 {
  padding-top: 0.875rem;
  padding-bottom: 0.875rem;
}

.py-4 {
  padding-top: 1rem;
  padding-bottom: 1rem;
}

.py-6 {
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}

.py-8 {
  padding-top: 2rem;
  padding-bottom: 2rem;
}

.pb-2\.5 {
  padding-bottom: 0.625rem;
}

.pb-4 {
  padding-bottom: 1rem;
}

.pb-5 {
  padding-bottom: 1.25rem;
}

.pl-1 {
  padding-left: 0.25rem;
}

.pr-1\.5 {
  padding-right: 0.375rem;
}

.pt-3 {
  padding-top: 0.75rem;
}

.pt-5 {
  padding-top: 1.25rem;
}

.pt-6 {
  padding-top: 1.5rem;
}

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

.text-center {
  text-align: center;
}

.text-right {
  text-align: right;
}

.font-sans {
  font-family: Inter, system-ui, sans-serif;
}

.\!text-\[\.65rem\] {
  font-size: .65rem !important;
}

.\!text-sm {
  font-size: 0.875rem !important;
  line-height: 1.25rem !important;
}

.text-2xl {
  font-size: 1.5rem;
  line-height: 2rem;
}

.text-3xl {
  font-size: 1.875rem;
  line-height: 2.25rem;
}

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

.text-\[\.65rem\] {
  font-size: .65rem;
}

.text-\[\.66rem\] {
  font-size: .66rem;
}

.text-\[\.68rem\] {
  font-size: .68rem;
}

.text-\[\.6rem\] {
  font-size: .6rem;
}

.text-\[\.72rem\] {
  font-size: .72rem;
}

.text-\[\.74rem\] {
  font-size: .74rem;
}

.text-\[\.78rem\] {
  font-size: .78rem;
}

.text-\[\.7rem\] {
  font-size: .7rem;
}

.text-\[\.82rem\] {
  font-size: .82rem;
}

.text-\[\.85rem\] {
  font-size: .85rem;
}

.text-\[1\.05rem\] {
  font-size: 1.05rem;
}

.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-semibold {
  font-weight: 600 !important;
}

.font-bold {
  font-weight: 700;
}

.font-extrabold {
  font-weight: 800;
}

.font-medium {
  font-weight: 500;
}

.font-normal {
  font-weight: 400;
}

.font-semibold {
  font-weight: 600;
}

.uppercase {
  text-transform: uppercase;
}

.\!normal-case {
  text-transform: none !important;
}

.leading-none {
  line-height: 1;
}

.leading-tight {
  line-height: 1.25;
}

.\!tracking-normal {
  letter-spacing: 0em !important;
}

.tracking-tight {
  letter-spacing: -0.025em;
}

.tracking-wide {
  letter-spacing: 0.025em;
}

.tracking-wider {
  letter-spacing: 0.05em;
}

.tracking-widest {
  letter-spacing: 0.1em;
}

.\!text-ink-950 {
  --tw-text-opacity: 1 !important;
  color: rgb(5 6 10 / var(--tw-text-opacity, 1)) !important;
}

.\!text-slate-300 {
  --tw-text-opacity: 1 !important;
  color: rgb(203 213 225 / var(--tw-text-opacity, 1)) !important;
}

.text-amber-400 {
  --tw-text-opacity: 1;
  color: rgb(251 191 36 / var(--tw-text-opacity, 1));
}

.text-blue-300 {
  --tw-text-opacity: 1;
  color: rgb(147 197 253 / var(--tw-text-opacity, 1));
}

.text-brand-300 {
  --tw-text-opacity: 1;
  color: rgb(196 181 253 / var(--tw-text-opacity, 1));
}

.text-brand-400 {
  --tw-text-opacity: 1;
  color: rgb(167 139 250 / var(--tw-text-opacity, 1));
}

.text-emerald-300 {
  --tw-text-opacity: 1;
  color: rgb(110 231 183 / var(--tw-text-opacity, 1));
}

.text-emerald-300\/80 {
  color: rgb(110 231 183 / 0.8);
}

.text-emerald-400 {
  --tw-text-opacity: 1;
  color: rgb(52 211 153 / var(--tw-text-opacity, 1));
}

.text-emerald-400\/70 {
  color: rgb(52 211 153 / 0.7);
}

.text-fuchsia-400 {
  --tw-text-opacity: 1;
  color: rgb(232 121 249 / var(--tw-text-opacity, 1));
}

.text-gold-300 {
  --tw-text-opacity: 1;
  color: rgb(253 230 138 / var(--tw-text-opacity, 1));
}

.text-gold-300\/80 {
  color: rgb(253 230 138 / 0.8);
}

.text-gold-400 {
  --tw-text-opacity: 1;
  color: rgb(251 191 36 / var(--tw-text-opacity, 1));
}

.text-gold-400\/70 {
  color: rgb(251 191 36 / 0.7);
}

.text-ink-600 {
  --tw-text-opacity: 1;
  color: rgb(36 40 56 / var(--tw-text-opacity, 1));
}

.text-ink-950 {
  --tw-text-opacity: 1;
  color: rgb(5 6 10 / var(--tw-text-opacity, 1));
}

.text-red-300 {
  --tw-text-opacity: 1;
  color: rgb(252 165 165 / var(--tw-text-opacity, 1));
}

.text-rose-200 {
  --tw-text-opacity: 1;
  color: rgb(254 205 211 / var(--tw-text-opacity, 1));
}

.text-rose-300 {
  --tw-text-opacity: 1;
  color: rgb(253 164 175 / var(--tw-text-opacity, 1));
}

.text-rose-400 {
  --tw-text-opacity: 1;
  color: rgb(251 113 133 / var(--tw-text-opacity, 1));
}

.text-rose-400\/70 {
  color: rgb(251 113 133 / 0.7);
}

.text-sky-300 {
  --tw-text-opacity: 1;
  color: rgb(125 211 252 / var(--tw-text-opacity, 1));
}

.text-sky-300\/80 {
  color: rgb(125 211 252 / 0.8);
}

.text-sky-400 {
  --tw-text-opacity: 1;
  color: rgb(56 189 248 / var(--tw-text-opacity, 1));
}

.text-slate-100 {
  --tw-text-opacity: 1;
  color: rgb(241 245 249 / var(--tw-text-opacity, 1));
}

.text-slate-200 {
  --tw-text-opacity: 1;
  color: rgb(226 232 240 / var(--tw-text-opacity, 1));
}

.text-slate-300 {
  --tw-text-opacity: 1;
  color: rgb(203 213 225 / var(--tw-text-opacity, 1));
}

.text-slate-400 {
  --tw-text-opacity: 1;
  color: rgb(148 163 184 / var(--tw-text-opacity, 1));
}

.text-slate-500 {
  --tw-text-opacity: 1;
  color: rgb(100 116 139 / var(--tw-text-opacity, 1));
}

.text-slate-600 {
  --tw-text-opacity: 1;
  color: rgb(71 85 105 / var(--tw-text-opacity, 1));
}

.text-transparent {
  color: transparent;
}

.text-violet-300 {
  --tw-text-opacity: 1;
  color: rgb(196 181 253 / var(--tw-text-opacity, 1));
}

.text-white {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

.underline {
  text-decoration-line: underline;
}

.accent-brand-500 {
  accent-color: #8b5cf6;
}

.opacity-80 {
  opacity: 0.8;
}

.\!shadow-none {
  --tw-shadow: 0 0 #0000 !important;
  --tw-shadow-colored: 0 0 #0000 !important;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
}

.shadow-\[0_0_10px_2px_rgba\(139\2c 92\2c 246\2c \.6\)\] {
  --tw-shadow: 0 0 10px 2px rgba(139,92,246,.6);
  --tw-shadow-colored: 0 0 10px 2px 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-\[0_0_10px_2px_rgba\(245\2c 158\2c 11\2c \.6\)\] {
  --tw-shadow: 0 0 10px 2px rgba(245,158,11,.6);
  --tw-shadow-colored: 0 0 10px 2px 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-\[0_10px_28px_-10px_rgba\(14\2c 165\2c 233\2c \.35\)\] {
  --tw-shadow: 0 10px 28px -10px rgba(14,165,233,.35);
  --tw-shadow-colored: 0 10px 28px -10px 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-\[0_10px_28px_-10px_rgba\(16\2c 185\2c 129\2c \.35\)\] {
  --tw-shadow: 0 10px 28px -10px rgba(16,185,129,.35);
  --tw-shadow-colored: 0 10px 28px -10px 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-\[0_16px_36px_-10px_rgba\(0\2c 0\2c 0\2c \.6\)\] {
  --tw-shadow: 0 16px 36px -10px rgba(0,0,0,.6);
  --tw-shadow-colored: 0 16px 36px -10px 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-\[0_1px_0_0_rgba\(255\2c 255\2c 255\2c \.2\)_inset\2c 0_10px_24px_-6px_rgba\(192\2c 38\2c 211\2c \.5\)\] {
  --tw-shadow: 0 1px 0 0 rgba(255,255,255,.2) inset,0 10px 24px -6px rgba(192,38,211,.5);
  --tw-shadow-colored: inset 0 1px 0 0 var(--tw-shadow-color), 0 10px 24px -6px 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-\[0_1px_0_0_rgba\(255\2c 255\2c 255\2c \.25\)_inset\2c 0_10px_24px_-6px_rgba\(16\2c 185\2c 129\2c \.6\)\] {
  --tw-shadow: 0 1px 0 0 rgba(255,255,255,.25) inset,0 10px 24px -6px rgba(16,185,129,.6);
  --tw-shadow-colored: inset 0 1px 0 0 var(--tw-shadow-color), 0 10px 24px -6px 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-\[0_4px_14px_-2px_rgba\(100\2c 116\2c 139\2c \.5\)\] {
  --tw-shadow: 0 4px 14px -2px rgba(100,116,139,.5);
  --tw-shadow-colored: 0 4px 14px -2px 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-\[0_4px_14px_-2px_rgba\(14\2c 165\2c 233\2c \.5\)\] {
  --tw-shadow: 0 4px 14px -2px rgba(14,165,233,.5);
  --tw-shadow-colored: 0 4px 14px -2px 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-\[0_4px_14px_-2px_rgba\(16\2c 185\2c 129\2c \.5\)\] {
  --tw-shadow: 0 4px 14px -2px rgba(16,185,129,.5);
  --tw-shadow-colored: 0 4px 14px -2px 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-\[0_4px_14px_-2px_rgba\(217\2c 70\2c 239\2c \.5\)\] {
  --tw-shadow: 0 4px 14px -2px rgba(217,70,239,.5);
  --tw-shadow-colored: 0 4px 14px -2px 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-\[0_4px_14px_-4px_rgba\(16\2c 185\2c 129\2c \.6\)\] {
  --tw-shadow: 0 4px 14px -4px rgba(16,185,129,.6);
  --tw-shadow-colored: 0 4px 14px -4px 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 {
  --tw-shadow: 0 0 0 1px rgba(139,92,246,.15), 0 8px 30px rgba(0,0,0,.45);
  --tw-shadow-colored: 0 0 0 1px var(--tw-shadow-color), 0 8px 30px 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-gold {
  --tw-shadow: 0 0 0 1px rgba(245,158,11,.25), 0 8px 24px rgba(245,158,11,.12);
  --tw-shadow-colored: 0 0 0 1px var(--tw-shadow-color), 0 8px 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-lg {
  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.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-ink-600 {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(36 40 56 / var(--tw-ring-opacity, 1));
}

.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-md {
  --tw-backdrop-blur: blur(12px);
  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-all {
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.transition-colors {
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  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;
}

.duration-200 {
  transition-duration: 200ms;
}

/* ===== Luciérnagas: fondo animado compartido por todas las páginas ===== */

.fireflies-layer {
  position: fixed;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
}

.firefly {
  position: absolute;
  bottom: -10px;
  left: var(--left);
  width: var(--size);
  height: var(--size);
  border-radius: 9999px;
  background: #fff;
  opacity: 0;
  box-shadow: 0 0 6px 2px rgba(255, 255, 255, .85), 0 0 14px 5px rgba(200, 220, 255, .4);
  animation: firefly-rise var(--duration) linear var(--delay) infinite,
             firefly-flicker 2.2s ease-in-out var(--delay) infinite;
  will-change: transform, opacity;
}

@keyframes firefly-rise {
  0%   {
    transform: translate(0, 0);
    opacity: 0;
  }

  6%   {
    opacity: 1;
  }

  50%  {
    transform: translate(var(--drift), -55vh);
  }

  94%  {
    opacity: 1;
  }

  100% {
    transform: translate(calc(var(--drift) * -1), -110vh);
    opacity: 0;
  }
}

@keyframes firefly-flicker {
  0%, 100% {
    filter: brightness(1) drop-shadow(0 0 2px rgba(255,255,255,.6));
  }

  50%      {
    filter: brightness(1.7) drop-shadow(0 0 5px rgba(255,255,255,.9));
  }
}

/* ===== Skeletons de carga (listas/tablas mientras llegan datos por AJAX) ===== */

.skeleton {
  position: relative;
  overflow: hidden;
  background: #191c28;
  /* ink-700 */
}

.skeleton::after {
  content: '';
  position: absolute;
  inset: 0;
  transform: translateX(-100%);
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .07), transparent);
  animation: skeleton-sweep 1.6s ease-in-out infinite;
}

@keyframes skeleton-sweep {
  100% {
    transform: translateX(100%);
  }
}

@media (min-width: 640px) {
  form.sm\:inline {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
  }
}

.hover\:border-emerald-500\/50:hover {
  border-color: rgb(16 185 129 / 0.5);
}

.hover\:\!bg-ink-600:hover {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(36 40 56 / var(--tw-bg-opacity, 1)) !important;
}

.hover\:bg-ink-700:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(25 28 40 / var(--tw-bg-opacity, 1));
}

.hover\:bg-ink-700\/70:hover {
  background-color: rgb(25 28 40 / 0.7);
}

.hover\:bg-sky-500\/20:hover {
  background-color: rgb(14 165 233 / 0.2);
}

.hover\:bg-white\/\[\.03\]:hover {
  background-color: rgb(255 255 255 / .03);
}

.hover\:text-brand-300:hover {
  --tw-text-opacity: 1;
  color: rgb(196 181 253 / var(--tw-text-opacity, 1));
}

.hover\:text-emerald-300:hover {
  --tw-text-opacity: 1;
  color: rgb(110 231 183 / var(--tw-text-opacity, 1));
}

.hover\:text-sky-300:hover {
  --tw-text-opacity: 1;
  color: rgb(125 211 252 / var(--tw-text-opacity, 1));
}

.hover\:text-slate-300:hover {
  --tw-text-opacity: 1;
  color: rgb(203 213 225 / var(--tw-text-opacity, 1));
}

.hover\:text-white:hover {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

.hover\:brightness-110:hover {
  --tw-brightness: brightness(1.1);
  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);
}

.group\/ref[open] .group-open\/ref\:hidden {
  display: none;
}

.group\/details[open] .group-open\/details\: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));
}

.group\/ref[open] .group-open\/ref\: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));
}

.group\/vendor[open] .group-open\/vendor\: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));
}

.group:hover .group-hover\:opacity-100 {
  opacity: 1;
}

.has-\[\:checked\]\:border-brand-500:has(:checked) {
  --tw-border-opacity: 1;
  border-color: rgb(139 92 246 / var(--tw-border-opacity, 1));
}

.has-\[\:checked\]\:bg-brand-600\/10:has(:checked) {
  background-color: rgb(124 58 237 / 0.1);
}

@media (min-width: 640px) {
  .sm\:col-span-2 {
    grid-column: span 2 / span 2;
  }

  .sm\:col-span-3 {
    grid-column: span 3 / span 3;
  }

  .sm\:block {
    display: block;
  }

  .sm\:inline {
    display: inline;
  }

  .sm\:flex {
    display: flex;
  }

  .sm\:hidden {
    display: none;
  }

  .sm\:w-auto {
    width: 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-start {
    justify-content: flex-start;
  }

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

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

  .sm\:gap-0 {
    gap: 0px;
  }

  .sm\:gap-1 {
    gap: 0.25rem;
  }

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

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

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

  .sm\:px-8 {
    padding-left: 2rem;
    padding-right: 2rem;
  }

  .sm\:py-2 {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
  }

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

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

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

  .sm\:text-2xl {
    font-size: 1.5rem;
    line-height: 2rem;
  }

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

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

  .sm\:text-\[\.82rem\] {
    font-size: .82rem;
  }

  .sm\:text-\[\.92rem\] {
    font-size: .92rem;
  }
}

@media (min-width: 1024px) {
  .lg\:hidden {
    display: none;
  }

  .lg\:translate-x-0 {
    --tw-translate-x: 0px;
    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));
  }
}

.\[\&\:\:-webkit-details-marker\]\:hidden::-webkit-details-marker {
  display: none;
}