@iota-uz/sdk 0.4.44 → 0.5.1

package/tailwind/iota.css

@@ -1,1195 +0,0 @@
-@font-face {
-  font-family: "Inter";
-  font-style: normal;
-  font-display: swap;
-  src: url(/assets/fonts/Inter.var.woff2) format('woff2-variations');
-  font-weight: 1 1000;
-}
-
-@font-face {
-  font-family: "Gilroy";
-  font-style: normal;
-  font-display: swap;
-  src: url(/assets/fonts/Gilroy/Gilroy-Regular.woff2) format('woff2');
-  font-weight: 400;
-}
-
-@font-face {
-  font-family: "Gilroy";
-  font-style: normal;
-  font-display: swap;
-  src: url(/assets/fonts/Gilroy/Gilroy-Medium.woff2) format('woff2');
-  font-weight: 500;
-}
-
-@font-face {
-  font-family: "Gilroy";
-  font-style: normal;
-  font-display: swap;
-  src: url(/assets/fonts/Gilroy/Gilroy-Semibold.woff2) format('woff2');
-  font-weight: 600;
-}
-
-@layer base {
-  :root {
-    /* Base */
-    --white: 100% 0 0;
-    --black-800: 26% 0 0;
-    /* #242424 */
-    --black: 18.67% 0 0;
-    /* #131313 */
-    --black-950: 16.84% 0 0;
-    /* #151515 */
-    --transparent: 0 0 0 / 0;
-
-    /* Primary */
-    --primary-400: 62.51% 0.172 283.89;
-    /* #8f87ff */
-    --primary-500: 58.73% 0.23 279.66;
-    /* #695EFF */
-    --primary-600: 50% 0.192 279.97;
-    /* #544BCC */
-    --primary-650: 52.52% 0.272 280.57;
-    /* #5C33FF */
-    --primary-700: 45.57% 0.171 280.34;
-    /* #4A42B2 */
-
-    /* Gray - Tailwind CSS v4 OKLCH palette */
-    --gray-50: 98.5% 0.002 247.839;
-    --gray-100: 96.7% 0.003 264.542;
-    --gray-200: 92.8% 0.006 264.531;
-    --gray-300: 87.2% 0.01 258.338;
-    --gray-400: 70.7% 0.022 261.325;
-    --gray-500: 55.1% 0.027 264.364;
-    --gray-600: 44.6% 0.03 256.802;
-    --gray-700: 37.3% 0.034 259.733;
-    --gray-800: 27.8% 0.033 256.848;
-    --gray-900: 21% 0.034 264.665;
-    --gray-950: 13% 0.028 261.692;
-
-    /* Red */
-    --red-500: 59.16% 0.218 0.58;
-    --red-100: var(--red-500) / 10%;
-    --red-200: var(--red-500) / 20%;
-    --red-300: var(--red-500) / 30%;
-
-    /* Green */
-    --green-50: 96.3% 0.0173 168.27;
-    --green-100: 92.4% 0.0346 168.27;
-    --green-200: 84.9% 0.0692 168.27;
-    --green-500: 78.02% 0.1534 168.27;
-    --green-600: 64.33% 0.1128 171.09;
-
-    /* Pink */
-    --pink-500: 59.16% 0.218 0.58;
-    --pink-600: 58.93% 0.2129 359.93;
-
-    /* Yellow */
-    --yellow-500: 80.13% 0.1458 73.41;
-
-    /* Blue */
-    --blue-500: 82.1% 0.099263 240.9782;
-    --blue-600: 64.12% 0.0638 240.72;
-
-    /* Purple */
-    --purple-500: 52.06% 0.2042 305.37;
-
-    /* Sizes */
-    --size-00: 0.25rem;
-    --size-0: 0.4rem;
-    --size-1: 0.5rem;
-    --size-2: 0.75rem;
-    --size-3: 1rem;
-    --size-4: 1.25rem;
-    --size-5: 1.5rem;
-
-    --size-content-1: 20ch;
-    --size-content-2: 45ch;
-    --size-content-3: 60ch;
-
-    /* Border */
-    --border-size-1: 1px;
-
-    /* Default btn */
-    --clr-btn-bg: var(--transparent);
-    --clr-btn-bg-active: var(--gray-200);
-    --clr-btn-bg-hover: var(--gray-100);
-    --clr-btn-text: var(--black);
-    --clr-btn-text-hover: var(--black);
-    --clr-btn-border: var(--transparent);
-    --clr-btn-border-hover: var(--transparent);
-
-    /* Primary btn */
-    --clr-primary-btn-bg: var(--primary-500);
-    --clr-primary-btn-bg-active: var(--primary-700);
-    --clr-primary-btn-bg-hover: var(--primary-600);
-    --clr-primary-btn-text: var(--white);
-    --clr-primary-btn-text-hover: var(--white);
-    --clr-primary-btn-border: var(--primary-600);
-    --clr-primary-btn-border-hover: var(--primary-600);
-
-    /* Secondary btn */
-    --clr-secondary-btn-bg: var(--white);
-    --clr-secondary-btn-bg-active: var(--gray-300);
-    --clr-secondary-btn-bg-hover: var(--gray-200);
-    --clr-secondary-btn-text: var(--black);
-    --clr-secondary-btn-text-hover: var(--black);
-    --clr-secondary-btn-border: var(--gray-300);
-    --clr-secondary-btn-border-hover: var(--gray-300);
-
-    /* Danger btn */
-    --clr-danger-btn-bg: var(--red-500) / 10%;
-    --clr-danger-btn-bg-active: var(--red-500) / 30%;
-    --clr-danger-btn-bg-hover: var(--red-500) / 20%;
-    --clr-danger-btn-text: var(--red-500);
-    --clr-danger-btn-text-hover: var(--red-500);
-    --clr-danger-btn-border: var(--clr-danger-btn-bg);
-    --clr-danger-btn-border-hover: var(--clr-danger-btn-bg);
-
-    /* Primary outline btn */
-    --clr-primary-outline-btn-text: var(--primary-500);
-    --clr-primary-outline-btn-text-hover: var(--primary-500);
-    --clr-primary-outline-btn-border: var(--primary-500);
-    --clr-primary-outline-btn-border-hover: var(--primary-500);
-    --clr-primary-outline-btn-bg-hover: var(--primary-500) / 5%;
-
-    /* Sidebar btn */
-    --clr-sidebar-btn-bg: var(--transparent);
-    --clr-sidebar-btn-bg-active: var(--primary-500);
-    --clr-sidebar-btn-bg-hover: var(--primary-500);
-    --clr-sidebar-btn-text: var(--gray-400);
-    --clr-sidebar-btn-text-hover: var(--white);
-    --clr-sidebar-btn-border: var(--transparent);
-    --clr-sidebar-btn-border-hover: var(--primary-500);
-
-    /* Form control */
-    --clr-form-control-bg: var(--transparent);
-    --clr-form-control-bg-active: var(--transparent);
-    --clr-form-control-placeholder: var(--gray-400);
-    --clr-form-control-border: var(--clr-border-default);
-    --clr-form-control-border-hover: var(--primary-500);
-    --clr-form-control-text: var(--black);
-    --clr-form-control-ring: var(--primary-650) / 20%;
-    --clr-form-control-label: var(--gray-400);
-    --form-control-border-size: var(--border-size-1);
-    --form-control-size-x: calc(var(--size-2) - var(--form-control-border-size) * 2);
-    --form-control-size-y: calc(var(--size-2) - var(--form-control-border-size) * 2);
-
-    /* Surface */
-    --clr-surface-50: var(--gray-50);
-    --clr-surface-100: var(--gray-100);
-    --clr-surface-200: var(--black);
-    --clr-surface-300: var(--white);
-    --clr-surface-400: var(--gray-200);
-    --clr-surface-500: var(--gray-100);
-    --clr-surface-600: var(--white);
-
-    /* Text */
-    --clr-text-100: var(--black);
-    --clr-text-200: var(--gray-600);
-    --clr-text-300: var(--gray-400);
-    --clr-text-green: var(--green-500);
-    --clr-text-pink: var(--pink-500);
-    --clr-text-yellow: var(--yellow-500);
-    --clr-text-blue: var(--blue-500);
-    --clr-text-purple: var(--purple-500);
-
-    /* Avatar */
-    --clr-avatar-bg: var(--primary-500) / 15%;
-    --clr-avatar-text: var(--primary-500);
-
-    /* Border */
-    --clr-border-subtle: var(--gray-200);
-    --clr-border-default: var(--gray-300);
-    --clr-border-strong: var(--gray-500);
-    --clr-border-brand: var(--primary-500);
-    --clr-border-danger: var(--red-500);
-    --clr-border-warning: var(--yellow-500);
-    --clr-border-success: var(--green-500);
-    --clr-border-disabled: var(--gray-200);
-    /* Deprecated compatibility alias. */
-    --clr-border-primary: var(--clr-border-default);
-    --clr-border-secondary: var(--gray-100);
-    --clr-border-green: var(--green-500);
-    --clr-border-pink: var(--pink-500);
-    --clr-border-yellow: var(--yellow-500);
-    --clr-border-blue: var(--blue-500);
-    --clr-border-purple: var(--purple-500);
-
-    /* Table */
-    --table-radius: 0.5rem;
-
-    /* Shadows */
-    --shadow-100: 0px 4px 8px 0px rgba(0, 0, 0, 0.16);
-    --shadow-200: 0px 8px 8px 0px rgba(0, 0, 0, 0.08);
-
-    /* Theme switcher */
-    --clr-theme-switcher-bg: var(--gray-100);
-    --clr-theme-switcher-text: var(--black);
-
-    --clr-success: var(--green-500);
-    --clr-on-sucess: var(--white);
-
-    /* Badges */
-    --clr-badge-pink: var(--pink-500) / 8%;
-    --clr-badge-yellow: var(--yellow-500) / 8%;
-    --clr-badge-green: var(--green-500) / 8%;
-    --clr-badge-blue: var(--blue-500) / 8%;
-    --clr-badge-purple: var(--purple-500) / 8%;
-    --clr-badge-gray: var(--gray-100);
-
-    /* Easing */
-    --ease-1: cubic-bezier(.25, 0, .5, 1);
-    --ease-2: cubic-bezier(.25, 0, .4, 1);
-    --ease-3: cubic-bezier(.25, 0, .3, 1);
-    --ease-elastic-in-out-2: cubic-bezier(.5, -.3, .1, 1.5);
-    --ease-elastic-in-out-3: cubic-bezier(.5, -.5, .1, 1.5);
-    --ease-squish-2: var(--ease-elastic-in-out-2);
-    --ease-squish-3: var(--ease-elastic-in-out-3);
-
-    /* Animation */
-    --animation-slide-in-up: slide-in-up 500ms var(--ease-3);
-    --animation-slide-in-right: slide-in-right 500ms var(--ease-3);
-    --animation-slide-in-left: slide-in-left 500ms var(--ease-3);
-    --animation-slide-in-down: slide-in-down 500ms var(--ease-3);
-    --animation-scale-down: scale-down 500ms var(--ease-3);
-    --animation-slide-out-down: slide-out-down 500ms var(--ease-3);
-    --animation-slide-out-right: slide-out-right 500ms var(--ease-3);
-    --animation-slide-out-left: slide-out-left 500ms var(--ease-3);
-  }
-
-  *,
-  ::before,
-  ::after,
-  ::backdrop {
-    /* Compatibility fallback only. Visible component borders use semantic tokens. */
-    border-color: oklch(var(--clr-border-subtle));
-  }
-
-  ::selection {
-    background-color: oklch(var(--primary-600));
-    color: oklch(var(--white));
-  }
-
-  html.dark {
-    color-scheme: dark;
-    /* Surface */
-    --clr-surface-50: var(--black-950);
-    --clr-surface-100: var(--black-950);
-    --clr-surface-300: var(--black);
-    --clr-surface-400: var(--black-950);
-    --clr-surface-500: var(--black);
-    --clr-surface-600: var(--black-950);
-
-    /* Badges */
-    --clr-badge-pink: var(--pink-600) / 8%;
-    --clr-badge-green: var(--green-600) / 8%;
-    --clr-badge-blue: var(--blue-600) / 8%;
-    --clr-badge-gray: var(--gray-700);
-
-    /* Text */
-    --clr-text-100: var(--white);
-    --clr-text-200: var(--gray-100);
-    --clr-text-300: var(--gray-300);
-    --clr-text-green: var(--green-600);
-    --clr-text-pink: var(--pink-600);
-    --clr-text-blue: var(--blue-600);
-
-    /* Avatar */
-    --clr-avatar-text: var(--primary-400);
-
-    /* Border */
-    --clr-border-subtle: var(--gray-800);
-    --clr-border-default: var(--gray-700);
-    --clr-border-strong: var(--gray-500);
-    --clr-border-brand: var(--primary-400);
-    --clr-border-danger: var(--red-500);
-    --clr-border-warning: var(--yellow-500);
-    --clr-border-success: var(--green-600);
-    --clr-border-disabled: var(--gray-800);
-    --clr-border-primary: var(--clr-border-default);
-    --clr-border-secondary: var(--black-950);
-    --clr-border-green: var(--green-600);
-    --clr-border-pink: var(--pink-600);
-    --clr-border-blue: var(--blue-600);
-
-    /* Secondary btn */
-    --clr-secondary-btn-bg: var(--black-950);
-    --clr-secondary-btn-bg-active: var(--black);
-    --clr-secondary-btn-bg-hover: var(--black);
-    --clr-secondary-btn-text: var(--gray-100);
-    --clr-secondary-btn-text-hover: var(--white);
-    --clr-secondary-btn-border: var(--black-800);
-    --clr-secondary-btn-border-hover: var(--black-950);
-
-    /* Form control */
-    --clr-form-control-bg: var(--black);
-    --clr-form-control-bg-active: var(--black);
-    --clr-form-control-placeholder: var(--gray-100);
-    --clr-form-control-border: var(--clr-border-default);
-    --clr-form-control-border-hover: var(--primary-500);
-    --clr-form-control-text: var(--white);
-    --clr-form-control-ring: var(--primary-650);
-    --clr-form-control-label: var(--white);
-  }
-
-  button {
-    cursor: default;
-  }
-
-  button:disabled {
-    opacity: 0.7;
-    pointer-events: none;
-  }
-
-  details>summary {
-    list-style: none;
-  }
-
-  details summary::-webkit-details-marker {
-    display: none;
-  }
-
-  details summary::marker {
-    display: none;
-  }
-
-  input::-webkit-outer-spin-button,
-  input::-webkit-inner-spin-button {
-    -webkit-appearance: none;
-    margin: 0;
-  }
-
-  input[type="number"] {
-    -moz-appearance: textfield;
-  }
-
-  form:invalid .btn:not(.btn-enabled) {
-    --events: none;
-    --opacity: 0.7;
-  }
-}
-
-[x-cloak] {
-  display: none !important;
-}
-
-@layer components {
-  .form-control {
-    --bg-color: var(--clr-form-control-bg);
-    --bg-active: var(--clr-form-control-bg-active);
-    --placeholder: var(--clr-form-control-placeholder);
-    --text-color: var(--clr-form-control-text);
-    --border-color: var(--clr-form-control-border);
-    --border-hover: var(--clr-form-control-border-hover);
-    --border-size: var(--form-control-border-size);
-    --ring-color: var(--transparent);
-    --ring-color-active: var(--clr-form-control-ring);
-    --size-x: var(--form-control-size-x);
-    --size-y: var(--form-control-size-y);
-    --font-size: 0.875rem;
-    --radius: 0.5rem;
-    --opacity: 1;
-    --events: all;
-    pointer-events: var(--events);
-    outline: none;
-    background-color: oklch(var(--bg-color));
-    box-shadow: 0 0 0 2px oklch(var(--ring-color));
-    color: oklch(var(--text-color));
-    font-size: var(--font-size);
-    border-radius: var(--radius);
-    opacity: var(--opacity);
-    border: var(--border-size) solid oklch(var(--border-color));
-    transition-duration: 200ms;
-    font-weight: 500;
-  }
-
-  .form-control-input {
-    padding: var(--size-y) var(--size-x);
-    border-radius: var(--radius);
-    background-color: oklch(var(--bg-color));
-  }
-
-  .form-control-input:disabled {
-    cursor: not-allowed;
-    opacity: 0.5;
-  }
-
-  .form-control-label {
-    color: var(--clr-form-control-label);
-    font-size: 0.875rem;
-  }
-
-  .form-control-input::placeholder {
-    color: oklch(var(--placeholder));
-  }
-
-  .form-control:hover {
-    --border-color: var(--border-hover);
-  }
-
-  .form-control:focus-within {
-    --border-color: var(--border-hover);
-    --ring-color: var(--ring-color-active);
-  }
-
-  .btn {
-    --text-color: var(--clr-btn-text);
-    --loading-indicator-color: var(--clr-btn-text);
-    --text-hover: var(--clr-btn-text-hover);
-    --bg-color: var(--clr-btn-bg);
-    --bg-active: var(--clr-btn-bg-active);
-    --bg-hover: var(--clr-btn-bg-hover);
-    --border-color: var(--clr-btn-border);
-    --border-hover: var(--clr-btn-border-hover);
-    --border-size: 1px;
-    --size-x: calc(1rem - var(--border-size) * 2);
-    --size-y: calc(0.75rem - var(--border-size) * 2);
-    --font-size: 0.875rem;
-    --radius: 0.5rem;
-    --opacity: 1;
-    --events: all;
-    --user-select: auto;
-    --height: 2.625rem;
-    --width: auto;
-    background-color: oklch(var(--bg-color));
-    color: oklch(var(--text-color));
-    padding: var(--size-y) var(--size-x);
-    font-size: var(--font-size);
-    border-radius: var(--radius);
-    opacity: var(--opacity);
-    border: var(--border-size) solid oklch(var(--border-color));
-    transition-duration: 200ms;
-    font-weight: 500;
-    position: relative;
-    display: inline-flex;
-    align-items: center;
-    outline-color: oklch(var(--bg-active));
-    user-select: var(--user-select);
-    height: var(--height);
-    width: var(--width);
-    cursor: pointer;
-  }
-
-  .btn:not(.btn-loading):not(.htmx-request):active,
-  .btn:not(.btn-loading):not(.htmx-request).active {
-    --bg-color: var(--bg-active);
-    --text-color: var(--text-hover);
-  }
-
-  .btn:not(.btn-loading):not(.htmx-request):hover {
-    --bg-color: var(--bg-hover);
-    --text-color: var(--text-hover);
-    --border-hover: var(--border-hover);
-  }
-
-  .btn-primary {
-    --bg-color: var(--clr-primary-btn-bg);
-    --bg-active: var(--clr-primary-btn-bg-active);
-    --text-color: var(--clr-primary-btn-text);
-    --border-color: var(--clr-primary-btn-border);
-    --bg-hover: var(--clr-primary-btn-bg-hover);
-    --text-hover: var(--clr-primary-btn-text-hover);
-    --loading-indicator-color: var(--clr-primary-btn-text);
-    --border-hover: var(--clr-primary-btn-border-hover);
-  }
-
-  .btn-secondary {
-    --bg-color: var(--clr-secondary-btn-bg);
-    --bg-active: var(--clr-secondary-btn-bg-active);
-    --text-color: var(--clr-secondary-btn-text);
-    --border-color: var(--clr-secondary-btn-border);
-    --bg-hover: var(--clr-secondary-btn-bg-hover);
-    --text-hover: var(--clr-secondary-btn-text-hover);
-    --border-hover: var(--clr-secondary-btn-border-hover);
-  }
-
-  .btn-danger {
-    --bg-color: var(--clr-danger-btn-bg);
-    --bg-active: var(--clr-danger-btn-bg-active);
-    --text-color: var(--clr-danger-btn-text);
-    --loading-indicator-color: var(--clr-danger-btn-text);
-    --border-color: var(--clr-danger-btn-border);
-    --bg-hover: var(--clr-danger-btn-bg-hover);
-    --text-hover: var(--clr-danger-btn-text-hover);
-    --border-hover: var(--clr-danger-btn-border-hover);
-  }
-
-  .btn-primary-outline {
-    --text-color: var(--clr-primary-outline-btn-text);
-    --loading-indicator-color: var(--clr-primary-outline-btn-text);
-    --border-color: var(--clr-primary-outline-btn-border);
-    --text-hover: var(--clr-primary-outline-btn-text-hover);
-    --border-hover: var(--clr-primary-outline-btn-border-hover);
-    --bg-hover: var(--clr-primary-outline-btn-bg-hover);
-  }
-
-  .btn-sidebar {
-    --bg-color: var(--clr-sidebar-btn-bg);
-    --bg-active: var(--clr-sidebar-btn-bg-active);
-    --text-color: var(--clr-sidebar-btn-text);
-    --loading-indicator-color: var(--clr-sidebar-btn-text);
-    --border-color: var(--clr-sidebar-btn-border);
-    --bg-hover: var(--clr-sidebar-btn-bg-hover);
-    --text-hover: var(--clr-sidebar-btn-text-hover);
-    --border-hover: var(--clr-sidebar-btn-border-hover);
-  }
-
-  .btn-md {
-    --height: 3rem;
-    --size-x: 1rem;
-    --size-y: calc(1rem - 3.5px);
-  }
-
-  .btn-sm {
-    --height: 2.5rem;
-    --size-x: 0.75rem;
-    --size-y: calc(0.75rem - 3.5px);
-  }
-
-  .btn-xs {
-    --height: 1.65rem;
-    --size-x: 0.25rem;
-    --size-y: 0.1rem;
-  }
-
-  .btn-fixed {
-    --size-y: var(--size-x);
-    --width: var(--height);
-  }
-
-  .btn-with-icon {
-    gap: 0.5rem;
-  }
-
-  .btn-rounded {
-    --radius: 9999px;
-  }
-
-  .btn-loading {
-    --text-color: var(--transparent);
-  }
-
-  .btn-disabled {
-    opacity: 0.7;
-    pointer-events: none;
-  }
-
-  .htmx-request .btn,
-  .htmx-request.btn {
-    --text-color: var(--transparent);
-    --user-select: none;
-  }
-
-  .btn-loading-indicator {
-    --size: var(--size-0);
-    --radius: 9999px;
-    --display: none;
-    --color: var(--loading-indicator-color);
-    width: var(--size);
-    height: var(--size);
-    border-radius: var(--radius);
-    background-color: oklch(var(--color));
-    color: oklch(var(--color));
-    animation: dot-flashing 1s infinite linear alternate;
-    animation-delay: 0.5s;
-    display: var(--display);
-    position: absolute;
-    opacity: 1;
-    left: 50%;
-    transform: translateX(-50%);
-  }
-
-  .btn-loading-indicator::before,
-  .btn-loading-indicator::after {
-    content: "";
-    display: inline-block;
-    position: absolute;
-    top: 0;
-  }
-
-  .btn-loading-indicator::before {
-    left: calc(-1 * var(--size) * 1.5);
-    width: var(--size);
-    height: var(--size);
-    border-radius: var(--radius);
-    background-color: oklch(var(--color));
-    color: oklch(var(--color));
-    animation: dot-flashing 1s infinite linear alternate;
-    animation-delay: 0s;
-  }
-
-  .btn-loading-indicator::after {
-    left: calc(var(--size) * 1.5);
-    width: var(--size);
-    height: var(--size);
-    border-radius: var(--radius);
-    background-color: oklch(var(--color));
-    color: oklch(var(--color));
-    animation: dot-flashing 1s infinite linear alternate;
-    animation-delay: 1s;
-  }
-
-  .btn-loading .btn-loading-indicator,
-  .htmx-request .btn-loading-indicator,
-  .htmx-request.btn-loading-indicator {
-    --display: block;
-  }
-
-  /*
-   * Loading state (stale-while-revalidate): while an HTMX row/content swap is
-   * in flight, dim the previous rows in place and show a centered spinner via
-   * .table-loading-overlay, instead of hiding the rows and blanking the table
-   * body. Custom class names are used deliberately: `.hidden` collides with
-   * Tailwind's utility (which lives in @layer utilities and wins on layer
-   * order regardless of specificity), so a `.htmx-request .hidden` reveal can
-   * never take effect — see the dead rules below.
-   */
-  .htmx-request .hide-on-load {
-    opacity: 0.5;
-    pointer-events: none;
-    transition: opacity 0.15s ease;
-  }
-
-  /* Fully self-contained styling (no utility classes) so the overlay renders
-     correctly regardless of which template roots a consumer's Tailwind build
-     scans for class generation. */
-  .table-loading-overlay {
-    display: none;
-    position: absolute;
-    inset: 0;
-    z-index: 20;
-    align-items: center;
-    justify-content: center;
-    pointer-events: none;
-  }
-
-  .htmx-request .table-loading-overlay {
-    display: flex;
-  }
-
-  .table-loading-overlay__card {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    padding: 0.875rem;
-    border-radius: 9999px;
-    background-color: #fff;
-    box-shadow:
-      0 6px 18px rgba(2, 6, 23, 0.14),
-      0 1px 3px rgba(2, 6, 23, 0.1);
-  }
-
-  .htmx-request.hide-on-load {
-    display: revert;
-  }
-
-  .htmx-request .hidden {
-    display: revert;
-  }
-
-  .htmx-request.hidden {
-    display: revert;
-  }
-
-  .table {
-    --radius: var(--table-radius);
-    border-collapse: separate;
-    border-spacing: 0;
-  }
-
-  .table tr:first-child th:first-child {
-    border-top-left-radius: var(--radius);
-  }
-
-  .table tr:first-child th:last-child {
-    border-top-right-radius: var(--radius);
-  }
-
-  .table tr:last-child td:first-child {
-    border-bottom-left-radius: var(--radius);
-  }
-
-  .table tr:last-child td:last-child {
-    border-bottom-right-radius: var(--radius);
-  }
-
-  .dialog {
-    --bg-color: var(--clr-surface-300);
-    --text-color: var(--clr-text-100);
-    --radius: 0.5rem;
-    display: grid;
-    align-content: start;
-    background-color: oklch(var(--bg-color));
-    border: 1px solid oklch(var(--clr-border-subtle));
-    color: oklch(var(--text-color));
-    max-inline-size: min(90vw, var(--size-content-3));
-    margin: auto;
-    padding: 0;
-    position: fixed;
-    inset: 0;
-    overflow: hidden;
-    transition: opacity 500ms var(--ease-3);
-  }
-
-  .dialog-rounded {
-    border-radius: var(--radius);
-  }
-
-  .dialog-btt {
-    animation: var(--animation-slide-out-down) forwards;
-    animation-timing-function: var(--ease-squish-2);
-  }
-
-  .dialog-rtl {
-    animation: var(--animation-slide-out-right) forwards;
-    animation-timing-function: var(--ease-squish-2);
-  }
-
-  .dialog-ltr {
-    animation: var(--animation-slide-out-left) forwards;
-    animation-timing-function: var(--ease-squish-2);
-  }
-
-  .dialog-tbd {
-    animation: var(--animation-slide-out-up) forwards;
-    animation-timing-function: var(--ease-squish-2);
-  }
-
-  .dialog:not([open]) {
-    pointer-events: none;
-    opacity: 0;
-  }
-
-  .dialog-btt[open] {
-    animation: var(--animation-slide-in-up);
-  }
-
-  .dialog-rtl[open] {
-    animation: var(--animation-slide-in-right);
-  }
-
-  .dialog-ltr[open] {
-    animation: var(--animation-slide-in-left);
-  }
-
-  .dialog-tbd[open] {
-    animation: var(--animation-slide-in-down);
-  }
-
-  .dialog::backdrop {
-    backdrop-filter: blur(8px);
-    transition: backdrop-filter 500ms ease;
-  }
-
-  .tab-slider {
-    @apply relative;
-  }
-
-  .tab-slider-inner {
-    @apply mb-6 flex;
-  }
-
-  .tab-slider-track {
-    @apply relative flex w-full items-center font-sans bg-slate-100 dark:bg-slate-700;
-  }
-
-  .tab-slider-item {
-    @apply relative z-20 h-full flex flex-1 items-center justify-center text-sm font-sans;
-  }
-
-  .tab-slider-item:not(.tab-active) {
-    @apply text-slate-400 dark:text-slate-400;
-  }
-
-  .tab-slider-item.tab-active {
-    @apply text-white dark:text-white;
-  }
-
-  .tab-slider-naver {
-    @apply absolute start-0 top-0 z-10 h-full bg-brand-500 dark:bg-brand-500 transition-all duration-300;
-  }
-
-  .tab-content {
-    @apply relative block;
-  }
-
-  /* Alignment classes */
-  .tabs-centered .tab-slider-inner {
-    @apply justify-center;
-  }
-
-  .tabs-end .tab-slider-inner {
-    @apply justify-end;
-  }
-
-  /* Rounded variants */
-  .tabs-rounded .tab-slider-track,
-  .tabs-rounded .tab-slider-naver {
-    @apply rounded-md;
-  }
-
-  .tabs-smooth .tab-slider-track,
-  .tabs-smooth .tab-slider-naver {
-    @apply rounded-lg;
-  }
-
-  .tabs-curved .tab-slider-track,
-  .tabs-curved .tab-slider-naver {
-    @apply rounded-xl;
-  }
-
-  .tabs-full .tab-slider-track,
-  .tabs-full .tab-slider-naver {
-    @apply rounded-full;
-  }
-
-  /* Size: sm */
-  .tabs-sm.tabs-two-slots .tab-slider-track {
-    @apply max-w-[140px];
-  }
-
-  .tabs-sm.tabs-three-slots .tab-slider-track {
-    @apply max-w-[210px];
-  }
-
-  .tabs-sm .tab-slider-track {
-    @apply h-8;
-  }
-
-  /* Size: md */
-  .tabs-md.tabs-two-slots .tab-slider-track {
-    @apply max-w-[250px];
-  }
-
-  .tabs-md.tabs-three-slots .tab-slider-track {
-    @apply max-w-[320px];
-  }
-
-  .tabs-md .tab-slider-track {
-    @apply h-10;
-  }
-
-  /* Slot-based transitions */
-  .tabs-two-slots .tab-slider-naver,
-  .tabs-two-slots .tab-slider-item {
-    @apply w-1/2;
-  }
-
-  .tabs-two-slots .tab-slider-item:first-child.tab-active~.tab-slider-naver {
-    @apply ms-0;
-  }
-
-  .tabs-two-slots .tab-slider-item:nth-child(2).tab-active~.tab-slider-naver {
-    @apply ms-[50%];
-  }
-
-  .tabs-three-slots .tab-slider-naver,
-  .tabs-three-slots .tab-slider-item {
-    @apply w-1/3;
-  }
-
-  .tabs-three-slots .tab-slider-item:first-child.tab-active~.tab-slider-naver {
-    @apply ms-0;
-  }
-
-  .tabs-three-slots .tab-slider-item:nth-child(2).tab-active~.tab-slider-naver {
-    @apply ms-[33.3%];
-  }
-
-  .tabs-three-slots .tab-slider-item:nth-child(3).tab-active~.tab-slider-naver {
-    @apply ms-[66.6%];
-  }
-
-  .accent-color-card {
-    --color: oklch(var(--primary-500));
-  }
-
-  /* Prevent Alpine.js transition flicker on initial load */
-  [x-cloak] {
-    display: none !important;
-  }
-
-  /* Prevent sidebar flicker during initial load */
-  .sidebar-container:not([data-alpine-loaded]) {
-    opacity: 0;
-    transition: opacity 0.1s ease-in;
-  }
-
-  .sidebar-container[data-alpine-loaded] {
-    opacity: 1;
-  }
-
-  /* Sidebar width styles */
-  .sidebar-expanded {
-    width: 280px;
-  }
-
-  /* Sidebar collapsed styles */
-  .sidebar-collapsed {
-    width: 4rem !important;
-    min-height: 100vh !important;
-  }
-
-  .sidebar-collapsed .btn-sidebar {
-    justify-content: center;
-    min-width: 2.5rem;
-    --text-color: var(--gray-100);
-  }
-
-  .sidebar-collapsed .btn-sidebar:hover {
-    --text-color: var(--white);
-    --bg-color: var(--clr-sidebar-btn-bg-hover);
-  }
-
-  /* Collapsed accordion group styling */
-  .sidebar-collapsed .accordion-group-collapsed {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    min-width: 2.5rem;
-    height: 3rem;
-    border-radius: 0.375rem;
-    cursor: pointer;
-    transition: background-color 0.2s;
-    color: oklch(var(--gray-100));
-  }
-
-  .sidebar-collapsed .accordion-group-collapsed:hover {
-    background-color: oklch(var(--clr-sidebar-btn-bg-hover));
-    color: oklch(var(--white));
-  }
-
-  /* Sidebar flyout dropdown (collapsed mode popover) */
-  .sidebar-flyout {
-    background-color: oklch(var(--clr-surface-200));
-    border: 1px solid oklch(var(--white) / 8%);
-    box-shadow: 0 8px 24px -4px oklch(var(--black) / 60%);
-    color: oklch(var(--white));
-  }
-
-  .sidebar-flyout .btn-sidebar {
-    --text-color: var(--gray-300);
-  }
-
-  .sidebar-flyout .btn-sidebar:not(.btn-loading):not(.htmx-request):hover {
-    --bg-color: var(--clr-sidebar-btn-bg-hover);
-    --text-color: var(--white);
-  }
-
-  .sidebar-flyout .btn-sidebar:not(.btn-loading):not(.htmx-request).active {
-    --bg-color: var(--clr-sidebar-btn-bg-active);
-    --text-color: var(--white);
-  }
-
-  /* Toggle button styling */
-  .btn-ghost {
-    --text-color: var(--gray-600);
-  }
-
-  .btn-ghost:hover {
-    --text-color: var(--gray-400);
-    --bg-color: var(--gray-200);
-  }
-
-  /* Toggle button in collapsed state */
-  .sidebar-collapsed .btn-ghost {
-    --text-color: var(--gray-600);
-  }
-
-  .sidebar-collapsed .btn-ghost:hover {
-    --text-color: var(--gray-400);
-    --bg-color: var(--gray-200);
-  }
-
-  /* Sidebar toggle button styling */
-  .btn-sidebar-toggle {
-    --text-color: var(--gray-600);
-    --bg-color: var(--white);
-    --border-color: var(--transparent);
-  }
-
-  .btn-sidebar-toggle:hover {
-    --text-color: var(--gray-400);
-    --bg-color: var(--gray-100);
-  }
-
-  /* Sidebar click-to-toggle cursor styles */
-  .sidebar-expand-cursor {
-    cursor: e-resize;
-  }
-
-  .sidebar-collapse-cursor {
-    cursor: w-resize;
-  }
-
-  .sidebar-expand-cursor a,
-  .sidebar-expand-cursor button,
-  .sidebar-expand-cursor summary,
-  .sidebar-expand-cursor [role="button"],
-  .sidebar-collapse-cursor a,
-  .sidebar-collapse-cursor button,
-  .sidebar-collapse-cursor summary,
-  .sidebar-collapse-cursor [role="button"] {
-    cursor: pointer;
-  }
-}
-
-@layer utilities {
-  .hide-scrollbar {
-    scrollbar-width: none;
-  }
-
-  .hide-scrollbar::-webkit-scrollbar {
-    display: none;
-  }
-
-  .no-transition {
-    transition: none !important;
-  }
-
-  /* Slider styles */
-  .slider-thumb {
-    -webkit-appearance: none;
-    appearance: none;
-    height: 1rem;
-    position: relative;
-    z-index: 10;
-  }
-
-  .slider-thumb::-webkit-slider-thumb {
-    -webkit-appearance: none;
-    appearance: none;
-    width: 16px;
-    height: 16px;
-    border-radius: 50%;
-    background: oklch(var(--primary-500));
-    cursor: pointer;
-    border: 2px solid white;
-    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
-    position: relative;
-    z-index: 20;
-  }
-
-  .slider-thumb::-moz-range-thumb {
-    width: 16px;
-    height: 16px;
-    border-radius: 50%;
-    background: oklch(var(--primary-500));
-    cursor: pointer;
-    border: 2px solid white;
-    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
-    position: relative;
-    z-index: 20;
-  }
-
-  .slider-thumb:focus {
-    outline: none;
-  }
-
-  .slider-thumb:disabled::-webkit-slider-thumb {
-    background: oklch(var(--gray-400));
-  }
-
-  .slider-thumb:disabled::-moz-range-thumb {
-    background: oklch(var(--gray-400));
-  }
-}
-
-/* iOS Safari 100vh fix - use dynamic viewport height */
-@supports (height: 100dvh) {
-  .min-h-screen {
-    min-height: 100dvh !important;
-  }
-  .h-screen {
-    height: 100dvh !important;
-  }
-}
-
-/* Keyframes */
-@keyframes slide-in-right {
-  from {
-    transform: translateX(100%)
-  }
-}
-
-@keyframes slide-out-right {
-  to {
-    transform: translateX(100%)
-  }
-}
-
-
-@keyframes slide-in-left {
-  from {
-    transform: translateX(-100%)
-  }
-}
-
-@keyframes slide-out-left {
-  to {
-    transform: translateX(-100%)
-  }
-}
-
-@keyframes slide-in-up {
-  from {
-    transform: translateY(100%)
-  }
-}
-
-@keyframes scale-down {
-  to {
-    transform: scale(.75)
-  }
-}
-
-@keyframes slide-out-down {
-  to {
-    transform: translateY(100%)
-  }
-}
-
-@keyframes slide-in-down {
-  from {
-    transform: translateY(-100%)
-  }
-}
-
-@keyframes slide-out-up {
-  to {
-    transform: translateY(-100%)
-  }
-}
-
-@keyframes dot-flashing {
-  0% {
-    background-color: oklch(var(--color));
-  }
-
-  50%,
-  100% {
-    background-color: oklch(var(--color) / 30%);
-  }
-}
-
-/* Lazy loading component styles */
-.lazy-load.htmx-settling * {
-  opacity: 0;
-}
-
-.lazy-load * {
-  transition: opacity 300ms ease-in;
-}
-
-/*
- * Infinite-scroll loading spinner reveal (scaffold/table InfiniteScrollSpinner).
- * The row stays `class="hidden"` so it is display:none at rest AND excluded from
- * the fillGrid() `tr:not(.hidden) > td[colspan]` scroll-guard; its hx-indicator
- * adds `.htmx-request` while the next page loads. Unlayered on purpose: Tailwind's
- * `.hidden { display:none }` lives in @layer utilities and wins over any layered
- * rule regardless of specificity, so the reveal must be unlayered to override it.
- */
-#infinite-scroll-spinner.htmx-request {
-  display: table-row;
-}