glasswind 0.1.0

package/dist/styles.css

@@ -0,0 +1,2663 @@
+/* src/styles/tokens.css */
+:root {
+  --gl-blur: 16px;
+  --gl-saturate: 180%;
+  --gl-bg: rgba(255, 255, 255, 0.14);
+  --gl-bg-hover: rgba(255, 255, 255, 0.22);
+  --gl-bg-active: rgba(255, 255, 255, 0.28);
+  --gl-bg-subtle: rgba(255, 255, 255, 0.08);
+  --gl-border: rgba(255, 255, 255, 0.30);
+  --gl-border-strong: rgba(255, 255, 255, 0.45);
+  --gl-highlight: rgba(255, 255, 255, 0.55);
+  --gl-shadow: 0 8px 32px rgba(17, 24, 39, 0.18);
+  --gl-shadow-lg: 0 20px 60px rgba(17, 24, 39, 0.28);
+  --gl-inner-glow: inset 0 1px 0 0 var(--gl-highlight);
+  --gl-primary: #6366f1;
+  --gl-primary-hover: #4f52e0;
+  --gl-primary-contrast: #ffffff;
+  --gl-primary-soft: rgba(99, 102, 241, 0.16);
+  --gl-success: #22c55e;
+  --gl-success-soft: rgba(34, 197, 94, 0.16);
+  --gl-danger: #ef4444;
+  --gl-danger-soft: rgba(239, 68, 68, 0.16);
+  --gl-warning: #f59e0b;
+  --gl-warning-soft: rgba(245, 158, 11, 0.16);
+  --gl-info: #0ea5e9;
+  --gl-info-soft: rgba(14, 165, 233, 0.16);
+  --gl-text: rgba(17, 24, 39, 0.94);
+  --gl-text-muted: rgba(17, 24, 39, 0.60);
+  --gl-text-faint: rgba(17, 24, 39, 0.40);
+  --gl-text-on-glass: rgba(17, 24, 39, 0.94);
+  --gl-ring: 0 0 0 3px rgba(99, 102, 241, 0.45);
+  --gl-radius-sm: 8px;
+  --gl-radius: 14px;
+  --gl-radius-lg: 20px;
+  --gl-radius-xl: 28px;
+  --gl-radius-full: 9999px;
+  --gl-font:
+    -apple-system,
+    BlinkMacSystemFont,
+    "Segoe UI",
+    Roboto,
+    Helvetica,
+    Arial,
+    "Apple Color Emoji",
+    "Segoe UI Emoji",
+    sans-serif;
+  --gl-font-mono:
+    ui-monospace,
+    SFMono-Regular,
+    Menlo,
+    Consolas,
+    monospace;
+  --gl-fs-xs: 0.75rem;
+  --gl-fs-sm: 0.85rem;
+  --gl-fs: 0.95rem;
+  --gl-fs-lg: 1.1rem;
+  --gl-fs-xl: 1.35rem;
+  --gl-fw: 500;
+  --gl-fw-bold: 650;
+  --gl-lh: 1.5;
+  --gl-space-1: 4px;
+  --gl-space-2: 8px;
+  --gl-space-3: 12px;
+  --gl-space-4: 16px;
+  --gl-space-5: 20px;
+  --gl-space-6: 24px;
+  --gl-space-8: 32px;
+  --gl-control-h-sm: 32px;
+  --gl-control-h-md: 40px;
+  --gl-control-h-lg: 48px;
+  --gl-ease: cubic-bezier(0.22, 1, 0.36, 1);
+  --gl-ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
+  --gl-dur-fast: 140ms;
+  --gl-dur: 220ms;
+  --gl-dur-slow: 340ms;
+  --gl-z-dropdown: 900;
+  --gl-z-drawer: 1000;
+  --gl-z-modal: 1010;
+  --gl-z-toast: 1100;
+  --gl-z-tooltip: 1200;
+}
+[data-theme=dark],
+.gl-dark {
+  --gl-bg: rgba(24, 24, 32, 0.48);
+  --gl-bg-hover: rgba(38, 38, 50, 0.58);
+  --gl-bg-active: rgba(48, 48, 62, 0.64);
+  --gl-bg-subtle: rgba(255, 255, 255, 0.05);
+  --gl-border: rgba(255, 255, 255, 0.14);
+  --gl-border-strong: rgba(255, 255, 255, 0.26);
+  --gl-highlight: rgba(255, 255, 255, 0.16);
+  --gl-shadow: 0 8px 32px rgba(0, 0, 0, 0.50);
+  --gl-shadow-lg: 0 20px 60px rgba(0, 0, 0, 0.62);
+  --gl-primary: #818cf8;
+  --gl-primary-hover: #a5b0ff;
+  --gl-primary-soft: rgba(129, 140, 248, 0.20);
+  --gl-text: rgba(255, 255, 255, 0.94);
+  --gl-text-muted: rgba(255, 255, 255, 0.62);
+  --gl-text-faint: rgba(255, 255, 255, 0.40);
+  --gl-text-on-glass: rgba(255, 255, 255, 0.94);
+  --gl-ring: 0 0 0 3px rgba(129, 140, 248, 0.50);
+}
+@media (prefers-color-scheme: dark) {
+  .gl-auto {
+    --gl-bg: rgba(24, 24, 32, 0.48);
+    --gl-bg-hover: rgba(38, 38, 50, 0.58);
+    --gl-bg-active: rgba(48, 48, 62, 0.64);
+    --gl-bg-subtle: rgba(255, 255, 255, 0.05);
+    --gl-border: rgba(255, 255, 255, 0.14);
+    --gl-border-strong: rgba(255, 255, 255, 0.26);
+    --gl-highlight: rgba(255, 255, 255, 0.16);
+    --gl-shadow: 0 8px 32px rgba(0, 0, 0, 0.50);
+    --gl-shadow-lg: 0 20px 60px rgba(0, 0, 0, 0.62);
+    --gl-primary: #818cf8;
+    --gl-primary-hover: #a5b0ff;
+    --gl-primary-soft: rgba(129, 140, 248, 0.20);
+    --gl-text: rgba(255, 255, 255, 0.94);
+    --gl-text-muted: rgba(255, 255, 255, 0.62);
+    --gl-text-faint: rgba(255, 255, 255, 0.40);
+    --gl-text-on-glass: rgba(255, 255, 255, 0.94);
+    --gl-ring: 0 0 0 3px rgba(129, 140, 248, 0.50);
+  }
+}
+
+/* src/styles/base.css */
+.gl-glass {
+  position: relative;
+  background: var(--gl-bg);
+  -webkit-backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  border: 1px solid var(--gl-border);
+  border-radius: var(--gl-radius);
+  box-shadow: var(--gl-shadow), var(--gl-inner-glow);
+  color: var(--gl-text-on-glass);
+}
+@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
+  .gl-glass {
+    background: rgba(255, 255, 255, 0.85);
+  }
+  [data-theme=dark] .gl-glass,
+  .gl-dark .gl-glass {
+    background: rgba(28, 28, 36, 0.92);
+  }
+}
+[class^=gl-],
+[class*=" gl-"] {
+  box-sizing: border-box;
+}
+.gl-focus-ring:focus-visible,
+.gl-focusable:focus-visible {
+  outline: none;
+  box-shadow: var(--gl-ring);
+}
+.gl-sr-only {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  padding: 0;
+  margin: -1px;
+  overflow: hidden;
+  clip: rect(0, 0, 0, 0);
+  white-space: nowrap;
+  border: 0;
+}
+@keyframes gl-fade-in {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+@keyframes gl-fade-out {
+  from {
+    opacity: 1;
+  }
+  to {
+    opacity: 0;
+  }
+}
+@keyframes gl-scale-in {
+  from {
+    opacity: 0;
+    transform: scale(0.94);
+  }
+  to {
+    opacity: 1;
+    transform: scale(1);
+  }
+}
+@keyframes gl-scale-out {
+  from {
+    opacity: 1;
+    transform: scale(1);
+  }
+  to {
+    opacity: 0;
+    transform: scale(0.94);
+  }
+}
+@keyframes gl-slide-up {
+  from {
+    opacity: 0;
+    transform: translate3d(0, 12px, 0);
+  }
+  to {
+    opacity: 1;
+    transform: translate3d(0, 0, 0);
+  }
+}
+@keyframes gl-slide-down {
+  from {
+    opacity: 0;
+    transform: translate3d(0, -12px, 0);
+  }
+  to {
+    opacity: 1;
+    transform: translate3d(0, 0, 0);
+  }
+}
+@keyframes gl-slide-in-right {
+  from {
+    transform: translate3d(100%, 0, 0);
+  }
+  to {
+    transform: translate3d(0, 0, 0);
+  }
+}
+@keyframes gl-slide-in-left {
+  from {
+    transform: translate3d(-100%, 0, 0);
+  }
+  to {
+    transform: translate3d(0, 0, 0);
+  }
+}
+@keyframes gl-slide-in-top {
+  from {
+    transform: translate3d(0, -100%, 0);
+  }
+  to {
+    transform: translate3d(0, 0, 0);
+  }
+}
+@keyframes gl-slide-in-bottom {
+  from {
+    transform: translate3d(0, 100%, 0);
+  }
+  to {
+    transform: translate3d(0, 0, 0);
+  }
+}
+@keyframes gl-spin {
+  to {
+    transform: rotate(360deg);
+  }
+}
+@keyframes gl-toast-in {
+  from {
+    opacity: 0;
+    transform: translate3d(0, 16px, 0) scale(0.96);
+  }
+  to {
+    opacity: 1;
+    transform: translate3d(0, 0, 0) scale(1);
+  }
+}
+@keyframes gl-indeterminate {
+  0% {
+    transform: translateX(-100%);
+  }
+  100% {
+    transform: translateX(250%);
+  }
+}
+@keyframes gl-shimmer {
+  0% {
+    background-position: -200% 0;
+  }
+  100% {
+    background-position: 200% 0;
+  }
+}
+@media (prefers-reduced-motion: reduce) {
+  [class^=gl-],
+  [class*=" gl-"] {
+    animation-duration: 0.01ms !important;
+    animation-iteration-count: 1 !important;
+    transition-duration: 0.01ms !important;
+    scroll-behavior: auto !important;
+  }
+}
+
+/* src/components/Accordion/Accordion.css */
+.gl-accordion {
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+  font-family: var(--gl-font);
+  font-size: var(--gl-fs);
+  color: var(--gl-text-on-glass);
+  background: var(--gl-bg);
+  border: 1px solid var(--gl-border);
+  border-radius: var(--gl-radius);
+  box-shadow: var(--gl-shadow), var(--gl-inner-glow);
+  -webkit-backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+}
+.gl-accordion__item + .gl-accordion__item {
+  border-top: 1px solid var(--gl-border);
+}
+.gl-accordion__item--disabled {
+  opacity: 0.55;
+}
+.gl-accordion__header {
+  margin: 0;
+  font-size: inherit;
+  font-weight: inherit;
+  line-height: inherit;
+}
+.gl-accordion__trigger {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: var(--gl-space-3);
+  width: 100%;
+  margin: 0;
+  padding: var(--gl-space-4) var(--gl-space-5);
+  font-family: inherit;
+  font-size: var(--gl-fs);
+  font-weight: var(--gl-fw-bold);
+  line-height: var(--gl-lh);
+  text-align: left;
+  color: var(--gl-text-on-glass);
+  background: transparent;
+  border: 0;
+  cursor: pointer;
+  user-select: none;
+  transition: background-color var(--gl-dur) var(--gl-ease), color var(--gl-dur) var(--gl-ease);
+}
+.gl-accordion__trigger:hover {
+  background: var(--gl-bg-hover);
+}
+.gl-accordion__trigger:active {
+  background: var(--gl-bg-active);
+}
+.gl-accordion__trigger:focus-visible {
+  outline: none;
+  box-shadow: inset var(--gl-ring);
+}
+.gl-accordion__trigger:disabled {
+  cursor: not-allowed;
+}
+.gl-accordion__title {
+  flex: 1 1 auto;
+  min-width: 0;
+}
+.gl-accordion__chevron {
+  display: inline-flex;
+  flex: 0 0 auto;
+  align-items: center;
+  justify-content: center;
+  font-size: 1.15em;
+  color: var(--gl-text-muted);
+  transition: transform var(--gl-dur) var(--gl-ease);
+  will-change: transform;
+}
+.gl-accordion__trigger[aria-expanded=true] .gl-accordion__chevron {
+  transform: rotate(180deg);
+}
+.gl-accordion__panel {
+  display: grid;
+  grid-template-rows: 0fr;
+  transition: grid-template-rows var(--gl-dur) var(--gl-ease);
+}
+.gl-accordion__panel[data-state=open] {
+  grid-template-rows: 1fr;
+}
+.gl-accordion__content {
+  overflow: hidden;
+  min-height: 0;
+  visibility: hidden;
+  transition: visibility 0s linear var(--gl-dur);
+}
+.gl-accordion__panel[data-state=open] .gl-accordion__content {
+  visibility: visible;
+  transition-delay: 0s;
+}
+.gl-accordion__body {
+  padding: 0 var(--gl-space-5) var(--gl-space-5);
+  color: var(--gl-text-muted);
+  font-weight: var(--gl-fw);
+  line-height: var(--gl-lh);
+}
+
+/* src/components/Avatar/Avatar.css */
+.gl-avatar {
+  --_avatar-size: 36px;
+  --_avatar-fs: var(--gl-fs-sm);
+  position: relative;
+  display: inline-flex;
+  flex: 0 0 auto;
+  align-items: center;
+  justify-content: center;
+  width: var(--_avatar-size);
+  height: var(--_avatar-size);
+  font-family: var(--gl-font);
+  font-size: var(--_avatar-fs);
+  font-weight: var(--gl-fw-bold);
+  line-height: 1;
+  letter-spacing: 0.02em;
+  vertical-align: middle;
+  user-select: none;
+  color: var(--gl-text-on-glass);
+  background: var(--gl-bg);
+  border: 1px solid var(--gl-border);
+  border-radius: var(--gl-radius-full);
+  box-shadow: var(--gl-shadow), var(--gl-inner-glow);
+  -webkit-backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+}
+.gl-avatar::after {
+  content: "";
+  position: absolute;
+  inset: 0;
+  z-index: 2;
+  padding: 1px;
+  border-radius: inherit;
+  background:
+    linear-gradient(
+      180deg,
+      var(--gl-highlight),
+      transparent 60%);
+  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
+  -webkit-mask-composite: xor;
+  mask-composite: exclude;
+  opacity: 0.7;
+  pointer-events: none;
+}
+.gl-avatar--circle {
+  border-radius: var(--gl-radius-full);
+}
+.gl-avatar--square {
+  border-radius: var(--gl-radius);
+}
+.gl-avatar--sm {
+  --_avatar-size: 28px;
+  --_avatar-fs: var(--gl-fs-xs);
+}
+.gl-avatar--md {
+  --_avatar-size: 36px;
+  --_avatar-fs: var(--gl-fs-sm);
+}
+.gl-avatar--lg {
+  --_avatar-size: 48px;
+  --_avatar-fs: var(--gl-fs);
+}
+.gl-avatar--xl {
+  --_avatar-size: 64px;
+  --_avatar-fs: var(--gl-fs-lg);
+}
+.gl-avatar__img {
+  position: absolute;
+  inset: 0;
+  z-index: 1;
+  display: block;
+  width: 100%;
+  height: 100%;
+  border-radius: inherit;
+  object-fit: cover;
+  animation: gl-fade-in var(--gl-dur) var(--gl-ease);
+}
+.gl-avatar__initials {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  text-transform: uppercase;
+}
+.gl-avatar__icon {
+  width: 62%;
+  height: 62%;
+  color: var(--gl-text-muted);
+}
+.gl-avatar__status {
+  position: absolute;
+  right: 6%;
+  bottom: 6%;
+  z-index: 3;
+  width: 28%;
+  height: 28%;
+  min-width: 8px;
+  min-height: 8px;
+  border: 2px solid var(--gl-border-strong);
+  border-radius: var(--gl-radius-full);
+  box-shadow: var(--gl-shadow);
+  animation: gl-scale-in var(--gl-dur) var(--gl-ease-spring);
+}
+.gl-avatar--square .gl-avatar__status {
+  right: -3px;
+  bottom: -3px;
+}
+.gl-avatar__status--online {
+  background: var(--gl-success);
+}
+.gl-avatar__status--offline {
+  background: var(--gl-text-faint);
+}
+.gl-avatar__status--busy {
+  background: var(--gl-danger);
+}
+.gl-avatar__status--away {
+  background: var(--gl-warning);
+}
+
+/* src/components/Badge/Badge.css */
+.gl-badge {
+  --_badge-accent: var(--gl-text);
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+  gap: var(--_badge-gap, var(--gl-space-2));
+  padding: var(--_badge-py, var(--gl-space-1)) var(--_badge-px, var(--gl-space-3));
+  font-family: var(--gl-font);
+  font-size: var(--_badge-fs, var(--gl-fs-sm));
+  font-weight: var(--gl-fw-bold);
+  line-height: 1;
+  white-space: nowrap;
+  vertical-align: middle;
+  border: 1px solid var(--gl-border);
+  border-radius: var(--gl-radius-sm);
+  color: var(--gl-text-on-glass);
+}
+.gl-badge--pill {
+  border-radius: var(--gl-radius-full);
+}
+.gl-badge--md {
+  --_badge-fs: var(--gl-fs-sm);
+  --_badge-px: var(--gl-space-3);
+  --_badge-py: var(--gl-space-1);
+  --_badge-gap: var(--gl-space-2);
+}
+.gl-badge--sm {
+  --_badge-fs: var(--gl-fs-xs);
+  --_badge-px: var(--gl-space-2);
+  --_badge-py: var(--gl-space-1);
+  --_badge-gap: var(--gl-space-1);
+}
+.gl-badge--glass {
+  background: var(--gl-bg);
+  -webkit-backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  box-shadow: var(--gl-shadow), var(--gl-inner-glow);
+}
+.gl-badge--glass::before {
+  content: "";
+  position: absolute;
+  inset: 0;
+  border-radius: inherit;
+  padding: 1px;
+  background:
+    linear-gradient(
+      180deg,
+      var(--gl-highlight),
+      transparent 60%);
+  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
+  -webkit-mask-composite: xor;
+  mask-composite: exclude;
+  opacity: 0.7;
+  pointer-events: none;
+}
+.gl-badge--primary,
+.gl-badge--success,
+.gl-badge--danger,
+.gl-badge--warning,
+.gl-badge--info {
+  color: var(--_badge-accent);
+  border-color: color-mix(in srgb, var(--_badge-accent) 40%, transparent);
+}
+.gl-badge--primary {
+  --_badge-accent: var(--gl-primary);
+  background: var(--gl-primary-soft);
+}
+.gl-badge--success {
+  --_badge-accent: var(--gl-success);
+  background: var(--gl-success-soft);
+}
+.gl-badge--danger {
+  --_badge-accent: var(--gl-danger);
+  background: var(--gl-danger-soft);
+}
+.gl-badge--warning {
+  --_badge-accent: var(--gl-warning);
+  background: var(--gl-warning-soft);
+}
+.gl-badge--info {
+  --_badge-accent: var(--gl-info);
+  background: var(--gl-info-soft);
+}
+.gl-badge__dot {
+  flex: none;
+  width: 0.5em;
+  height: 0.5em;
+  border-radius: var(--gl-radius-full);
+  background: var(--_badge-accent);
+}
+.gl-badge__label {
+  display: inline-flex;
+  align-items: center;
+}
+
+/* src/components/Button/Button.css */
+.gl-btn {
+  --_btn-h: var(--gl-control-h-md);
+  --_btn-px: var(--gl-space-5);
+  --_btn-fs: var(--gl-fs);
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  gap: var(--gl-space-2);
+  height: var(--_btn-h);
+  padding: 0 var(--_btn-px);
+  font-family: var(--gl-font);
+  font-size: var(--_btn-fs);
+  font-weight: var(--gl-fw-bold);
+  line-height: 1;
+  white-space: nowrap;
+  text-decoration: none;
+  cursor: pointer;
+  user-select: none;
+  border: 1px solid var(--gl-border);
+  border-radius: var(--gl-radius);
+  color: var(--gl-text-on-glass);
+  background: var(--gl-bg);
+  -webkit-backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  box-shadow: var(--gl-shadow), var(--gl-inner-glow);
+  transition:
+    transform var(--gl-dur-fast) var(--gl-ease),
+    background-color var(--gl-dur) var(--gl-ease),
+    border-color var(--gl-dur) var(--gl-ease),
+    box-shadow var(--gl-dur) var(--gl-ease),
+    opacity var(--gl-dur) var(--gl-ease);
+  will-change: transform;
+}
+.gl-btn::before {
+  content: "";
+  position: absolute;
+  inset: 0;
+  border-radius: inherit;
+  padding: 1px;
+  background:
+    linear-gradient(
+      180deg,
+      var(--gl-highlight),
+      transparent 60%);
+  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
+  -webkit-mask-composite: xor;
+  mask-composite: exclude;
+  opacity: 0.7;
+  pointer-events: none;
+}
+.gl-btn:hover {
+  background: var(--gl-bg-hover);
+  transform: translateY(-1px);
+  box-shadow: var(--gl-shadow-lg), var(--gl-inner-glow);
+}
+.gl-btn:active {
+  transform: translateY(0) scale(0.97);
+  background: var(--gl-bg-active);
+  box-shadow: var(--gl-shadow), var(--gl-inner-glow);
+}
+.gl-btn--sm {
+  --_btn-h: var(--gl-control-h-sm);
+  --_btn-px: var(--gl-space-4);
+  --_btn-fs: var(--gl-fs-sm);
+  border-radius: var(--gl-radius-sm);
+}
+.gl-btn--lg {
+  --_btn-h: var(--gl-control-h-lg);
+  --_btn-px: var(--gl-space-6);
+  --_btn-fs: var(--gl-fs-lg);
+  border-radius: var(--gl-radius-lg);
+}
+.gl-btn--primary {
+  background:
+    linear-gradient(
+      180deg,
+      color-mix(in srgb, var(--gl-primary) 88%, white 12%),
+      var(--gl-primary));
+  border-color: color-mix(in srgb, var(--gl-primary) 70%, black 30%);
+  color: var(--gl-primary-contrast);
+}
+.gl-btn--primary:hover {
+  background:
+    linear-gradient(
+      180deg,
+      color-mix(in srgb, var(--gl-primary) 80%, white 20%),
+      var(--gl-primary-hover));
+}
+.gl-btn--primary:active {
+  background: var(--gl-primary-hover);
+}
+.gl-btn--secondary {
+  background: var(--gl-bg-subtle);
+  color: var(--gl-text);
+}
+.gl-btn--ghost {
+  background: transparent;
+  border-color: transparent;
+  box-shadow: none;
+  -webkit-backdrop-filter: none;
+  backdrop-filter: none;
+  color: var(--gl-text);
+}
+.gl-btn--ghost::before {
+  display: none;
+}
+.gl-btn--ghost:hover {
+  background: var(--gl-bg-subtle);
+  box-shadow: none;
+}
+.gl-btn--ghost:active {
+  background: var(--gl-bg-hover);
+  box-shadow: none;
+}
+.gl-btn--danger {
+  background:
+    linear-gradient(
+      180deg,
+      color-mix(in srgb, var(--gl-danger) 88%, white 12%),
+      var(--gl-danger));
+  border-color: color-mix(in srgb, var(--gl-danger) 70%, black 30%);
+  color: #fff;
+}
+.gl-btn:disabled,
+.gl-btn[aria-disabled=true] {
+  opacity: 0.5;
+  cursor: not-allowed;
+  transform: none;
+  box-shadow: var(--gl-shadow), var(--gl-inner-glow);
+}
+.gl-btn--block {
+  display: flex;
+  width: 100%;
+}
+.gl-btn--loading {
+  cursor: progress;
+  color: transparent !important;
+}
+.gl-btn--loading .gl-btn__label,
+.gl-btn--loading .gl-btn__icon {
+  opacity: 0;
+}
+.gl-btn__label {
+  display: inline-flex;
+  align-items: center;
+}
+.gl-btn__icon {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 1.1em;
+}
+.gl-btn__spinner {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  width: 1.15em;
+  height: 1.15em;
+  margin: -0.575em 0 0 -0.575em;
+  border: 2px solid currentColor;
+  border-top-color: transparent;
+  border-radius: var(--gl-radius-full);
+  color: var(--gl-text);
+  animation: gl-spin 0.7s linear infinite;
+}
+.gl-btn--primary .gl-btn__spinner,
+.gl-btn--danger .gl-btn__spinner {
+  color: #fff;
+}
+
+/* src/components/Card/Card.css */
+.gl-card {
+  --_card-pad: var(--gl-space-6);
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  min-width: 0;
+  color: var(--gl-text-on-glass);
+  border: 1px solid var(--gl-border);
+  border-radius: var(--gl-radius-lg);
+  box-shadow: var(--gl-shadow), var(--gl-inner-glow);
+  transition:
+    transform var(--gl-dur) var(--gl-ease),
+    border-color var(--gl-dur) var(--gl-ease),
+    box-shadow var(--gl-dur) var(--gl-ease);
+}
+.gl-card::before {
+  content: "";
+  position: absolute;
+  inset: 0;
+  border-radius: inherit;
+  padding: 1px;
+  background:
+    linear-gradient(
+      180deg,
+      var(--gl-highlight),
+      transparent 60%);
+  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
+  -webkit-mask-composite: xor;
+  mask-composite: exclude;
+  opacity: 0.7;
+  pointer-events: none;
+}
+.gl-card--glass {
+  background: var(--gl-bg);
+  -webkit-backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+}
+.gl-card--solid {
+  background: var(--gl-bg-subtle);
+  -webkit-backdrop-filter: none;
+  backdrop-filter: none;
+}
+.gl-card--pad-none {
+  --_card-pad: 0px;
+}
+.gl-card--pad-sm {
+  --_card-pad: var(--gl-space-3);
+}
+.gl-card--pad-md {
+  --_card-pad: var(--gl-space-4);
+}
+.gl-card--pad-lg {
+  --_card-pad: var(--gl-space-6);
+}
+.gl-card--hoverable {
+  cursor: pointer;
+  will-change: transform;
+}
+.gl-card--hoverable:hover {
+  transform: translateY(-4px);
+  border-color: var(--gl-border-strong);
+  box-shadow: var(--gl-shadow-lg), var(--gl-inner-glow);
+}
+.gl-card__header,
+.gl-card__body,
+.gl-card__footer {
+  position: relative;
+  padding: var(--_card-pad);
+}
+.gl-card__header {
+  border-bottom: 1px solid var(--gl-border);
+}
+.gl-card__footer {
+  border-top: 1px solid var(--gl-border);
+}
+.gl-card__body {
+  flex: 1 1 auto;
+  min-height: 0;
+}
+
+/* src/components/Checkbox/Checkbox.css */
+.gl-checkbox {
+  --_box: 20px;
+  --_accent: var(--gl-primary);
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+  gap: var(--gl-space-2);
+  font-family: var(--gl-font);
+  font-size: var(--gl-fs);
+  font-weight: var(--gl-fw);
+  line-height: var(--gl-lh);
+  color: var(--gl-text);
+  cursor: pointer;
+  user-select: none;
+}
+.gl-checkbox--sm {
+  --_box: 16px;
+  font-size: var(--gl-fs-sm);
+}
+.gl-checkbox--lg {
+  --_box: 24px;
+  font-size: var(--gl-fs-lg);
+}
+.gl-checkbox__box {
+  position: relative;
+  flex: 0 0 auto;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: var(--_box);
+  height: var(--_box);
+  color: var(--gl-primary-contrast);
+  background: var(--gl-bg-subtle);
+  border: 1px solid var(--gl-border);
+  border-radius: var(--gl-radius-sm);
+  box-shadow: var(--gl-inner-glow);
+  -webkit-backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  transition:
+    background-color var(--gl-dur) var(--gl-ease),
+    border-color var(--gl-dur) var(--gl-ease),
+    box-shadow var(--gl-dur) var(--gl-ease),
+    transform var(--gl-dur-fast) var(--gl-ease);
+  will-change: transform;
+}
+.gl-checkbox__box::before {
+  content: "";
+  position: absolute;
+  inset: 0;
+  border-radius: inherit;
+  padding: 1px;
+  background:
+    linear-gradient(
+      180deg,
+      var(--gl-highlight),
+      transparent 60%);
+  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
+  -webkit-mask-composite: xor;
+  mask-composite: exclude;
+  opacity: 0.7;
+  pointer-events: none;
+}
+.gl-checkbox:hover .gl-checkbox__box {
+  border-color: var(--gl-border-strong);
+  background: var(--gl-bg);
+}
+.gl-checkbox:active .gl-checkbox__box {
+  transform: scale(0.92);
+}
+.gl-checkbox__check {
+  width: 72%;
+  height: 72%;
+  opacity: 0;
+  transform: scale(0.6);
+  transition: opacity var(--gl-dur-fast) var(--gl-ease), transform var(--gl-dur) var(--gl-ease-spring);
+}
+.gl-checkbox__dash {
+  position: absolute;
+  width: 56%;
+  height: 2px;
+  border-radius: var(--gl-radius-full);
+  background: currentColor;
+  opacity: 0;
+  transform: scaleX(0.4);
+  transition: opacity var(--gl-dur-fast) var(--gl-ease), transform var(--gl-dur) var(--gl-ease-spring);
+}
+.gl-checkbox__input:checked + .gl-checkbox__box {
+  background: var(--_accent);
+  border-color: var(--_accent);
+}
+.gl-checkbox__input:checked + .gl-checkbox__box .gl-checkbox__check {
+  opacity: 1;
+  transform: scale(1);
+}
+.gl-checkbox__input:indeterminate + .gl-checkbox__box {
+  background: var(--_accent);
+  border-color: var(--_accent);
+}
+.gl-checkbox__input:indeterminate + .gl-checkbox__box .gl-checkbox__check {
+  opacity: 0;
+  transform: scale(0.6);
+}
+.gl-checkbox__input:indeterminate + .gl-checkbox__box .gl-checkbox__dash {
+  opacity: 1;
+  transform: scaleX(1);
+}
+.gl-checkbox--error {
+  --_accent: var(--gl-danger);
+}
+.gl-checkbox--error .gl-checkbox__box {
+  border-color: var(--gl-danger);
+}
+.gl-checkbox--error .gl-checkbox__label {
+  color: var(--gl-danger);
+}
+.gl-checkbox__input:focus-visible + .gl-checkbox__box {
+  outline: none;
+  box-shadow: var(--gl-ring);
+}
+.gl-checkbox--disabled {
+  cursor: not-allowed;
+  opacity: 0.5;
+}
+.gl-checkbox--disabled .gl-checkbox__box {
+  transform: none;
+}
+.gl-checkbox__label {
+  display: inline-block;
+}
+
+/* src/components/Drawer/Drawer.css */
+.gl-drawer {
+  position: fixed;
+  inset: 0;
+  z-index: var(--gl-z-drawer);
+}
+.gl-drawer__backdrop {
+  position: fixed;
+  inset: 0;
+  background: rgba(17, 24, 39, 0.45);
+  -webkit-backdrop-filter: blur(2px);
+  backdrop-filter: blur(2px);
+  animation: gl-fade-in var(--gl-dur) var(--gl-ease) both;
+}
+.gl-drawer__panel {
+  position: fixed;
+  display: flex;
+  flex-direction: column;
+  max-width: 100%;
+  max-height: 100%;
+  overflow: hidden;
+  font-family: var(--gl-font);
+  font-size: var(--gl-fs);
+  line-height: var(--gl-lh);
+  color: var(--gl-text-on-glass);
+  background: var(--gl-bg);
+  border: 1px solid var(--gl-border);
+  -webkit-backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  box-shadow: var(--gl-shadow-lg), var(--gl-inner-glow);
+  outline: none;
+  will-change: transform;
+  animation-duration: var(--gl-dur);
+  animation-timing-function: var(--gl-ease);
+  animation-fill-mode: both;
+}
+@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
+  .gl-drawer__panel {
+    background: rgba(255, 255, 255, 0.9);
+  }
+  [data-theme=dark] .gl-drawer__panel,
+  .gl-dark .gl-drawer__panel {
+    background: rgba(28, 28, 36, 0.94);
+  }
+}
+.gl-drawer__panel--left,
+.gl-drawer__panel--right {
+  top: 0;
+  height: 100%;
+}
+.gl-drawer__panel--left {
+  left: 0;
+  border-top-right-radius: var(--gl-radius-lg);
+  border-bottom-right-radius: var(--gl-radius-lg);
+  animation-name: gl-slide-in-left;
+}
+.gl-drawer__panel--right {
+  right: 0;
+  border-top-left-radius: var(--gl-radius-lg);
+  border-bottom-left-radius: var(--gl-radius-lg);
+  animation-name: gl-slide-in-right;
+}
+.gl-drawer__panel--top,
+.gl-drawer__panel--bottom {
+  left: 0;
+  width: 100%;
+}
+.gl-drawer__panel--top {
+  top: 0;
+  border-bottom-left-radius: var(--gl-radius-lg);
+  border-bottom-right-radius: var(--gl-radius-lg);
+  animation-name: gl-slide-in-top;
+}
+.gl-drawer__panel--bottom {
+  bottom: 0;
+  border-top-left-radius: var(--gl-radius-lg);
+  border-top-right-radius: var(--gl-radius-lg);
+  animation-name: gl-slide-in-bottom;
+}
+.gl-drawer__header,
+.gl-drawer__footer {
+  display: flex;
+  flex: none;
+  align-items: center;
+  gap: var(--gl-space-4);
+}
+.gl-drawer__header {
+  padding: var(--gl-space-5) var(--gl-space-6);
+  border-bottom: 1px solid var(--gl-border);
+}
+.gl-drawer__title {
+  margin: 0;
+  font-size: var(--gl-fs-lg);
+  font-weight: var(--gl-fw-bold);
+  line-height: 1.25;
+  color: var(--gl-text);
+}
+.gl-drawer__body {
+  flex: 1 1 auto;
+  min-height: 0;
+  overflow-y: auto;
+  padding: var(--gl-space-6);
+}
+.gl-drawer__footer {
+  justify-content: flex-end;
+  gap: var(--gl-space-3);
+  padding: var(--gl-space-5) var(--gl-space-6);
+  border-top: 1px solid var(--gl-border);
+}
+.gl-drawer__close {
+  display: inline-flex;
+  flex: none;
+  align-items: center;
+  justify-content: center;
+  margin-inline-start: auto;
+  width: var(--gl-control-h-sm);
+  height: var(--gl-control-h-sm);
+  padding: 0;
+  cursor: pointer;
+  color: var(--gl-text-muted);
+  background: transparent;
+  border: 1px solid transparent;
+  border-radius: var(--gl-radius-full);
+  transition:
+    transform var(--gl-dur-fast) var(--gl-ease),
+    color var(--gl-dur) var(--gl-ease),
+    background-color var(--gl-dur) var(--gl-ease);
+}
+.gl-drawer__close:hover {
+  color: var(--gl-text);
+  background: var(--gl-bg-subtle);
+}
+.gl-drawer__close:active {
+  transform: scale(0.94);
+}
+
+/* src/components/Dropdown/Dropdown.css */
+.gl-dropdown {
+  position: relative;
+  display: inline-flex;
+}
+.gl-dropdown__trigger {
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  gap: var(--gl-space-2);
+  height: var(--gl-control-h-md);
+  padding: 0 var(--gl-space-5);
+  font-family: var(--gl-font);
+  font-size: var(--gl-fs);
+  font-weight: var(--gl-fw-bold);
+  line-height: 1;
+  white-space: nowrap;
+  cursor: pointer;
+  user-select: none;
+  color: var(--gl-text-on-glass);
+  border: 1px solid var(--gl-border);
+  border-radius: var(--gl-radius);
+  background: var(--gl-bg);
+  -webkit-backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  box-shadow: var(--gl-shadow), var(--gl-inner-glow);
+  transition:
+    transform var(--gl-dur-fast) var(--gl-ease),
+    background-color var(--gl-dur) var(--gl-ease),
+    border-color var(--gl-dur) var(--gl-ease),
+    box-shadow var(--gl-dur) var(--gl-ease);
+  will-change: transform;
+}
+.gl-dropdown__trigger::before {
+  content: "";
+  position: absolute;
+  inset: 0;
+  border-radius: inherit;
+  padding: 1px;
+  background:
+    linear-gradient(
+      180deg,
+      var(--gl-highlight),
+      transparent 60%);
+  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
+  -webkit-mask-composite: xor;
+  mask-composite: exclude;
+  opacity: 0.7;
+  pointer-events: none;
+}
+.gl-dropdown__trigger:hover {
+  background: var(--gl-bg-hover);
+  transform: translateY(-1px);
+  box-shadow: var(--gl-shadow-lg), var(--gl-inner-glow);
+}
+.gl-dropdown__trigger:active {
+  transform: translateY(0) scale(0.97);
+  background: var(--gl-bg-active);
+  box-shadow: var(--gl-shadow), var(--gl-inner-glow);
+}
+.gl-dropdown__trigger[aria-expanded=true] {
+  background: var(--gl-bg-hover);
+}
+.gl-dropdown__trigger:disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+  transform: none;
+  box-shadow: var(--gl-shadow), var(--gl-inner-glow);
+}
+.gl-dropdown__menu {
+  position: absolute;
+  z-index: var(--gl-z-dropdown);
+  min-width: 12rem;
+  max-width: min(20rem, calc(100vw - var(--gl-space-4)));
+  padding: var(--gl-space-2);
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+  color: var(--gl-text-on-glass);
+  border: 1px solid var(--gl-border);
+  border-radius: var(--gl-radius);
+  background: var(--gl-bg);
+  -webkit-backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  box-shadow: var(--gl-shadow-lg), var(--gl-inner-glow);
+  outline: none;
+  animation: gl-scale-in var(--gl-dur) var(--gl-ease);
+}
+.gl-dropdown__menu::before {
+  content: "";
+  position: absolute;
+  inset: 0;
+  border-radius: inherit;
+  padding: 1px;
+  background:
+    linear-gradient(
+      180deg,
+      var(--gl-highlight),
+      transparent 60%);
+  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
+  -webkit-mask-composite: xor;
+  mask-composite: exclude;
+  opacity: 0.6;
+  pointer-events: none;
+}
+.gl-dropdown__menu--bottom-start {
+  top: calc(100% + var(--gl-space-2));
+  left: 0;
+  transform-origin: top left;
+}
+.gl-dropdown__menu--bottom-end {
+  top: calc(100% + var(--gl-space-2));
+  right: 0;
+  transform-origin: top right;
+}
+.gl-dropdown__menu--top-start {
+  bottom: calc(100% + var(--gl-space-2));
+  left: 0;
+  transform-origin: bottom left;
+}
+.gl-dropdown__menu--top-end {
+  bottom: calc(100% + var(--gl-space-2));
+  right: 0;
+  transform-origin: bottom right;
+}
+.gl-dropdown__item {
+  position: relative;
+  display: flex;
+  align-items: center;
+  gap: var(--gl-space-3);
+  width: 100%;
+  padding: var(--gl-space-2) var(--gl-space-3);
+  font-family: var(--gl-font);
+  font-size: var(--gl-fs-sm);
+  font-weight: var(--gl-fw);
+  line-height: var(--gl-lh);
+  text-align: left;
+  white-space: nowrap;
+  cursor: pointer;
+  color: var(--gl-text);
+  border: none;
+  border-radius: var(--gl-radius-sm);
+  background: transparent;
+  transition:
+    transform var(--gl-dur-fast) var(--gl-ease),
+    background-color var(--gl-dur-fast) var(--gl-ease),
+    color var(--gl-dur-fast) var(--gl-ease);
+  will-change: transform;
+}
+.gl-dropdown__item:hover,
+.gl-dropdown__item:focus-visible {
+  background: var(--gl-bg-hover);
+  color: var(--gl-text);
+}
+.gl-dropdown__item:active {
+  transform: scale(0.98);
+  background: var(--gl-bg-active);
+}
+.gl-dropdown__item:disabled {
+  opacity: 0.45;
+  cursor: not-allowed;
+  background: transparent;
+  transform: none;
+}
+.gl-dropdown__item-icon {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  flex: 0 0 auto;
+  font-size: 1.1em;
+  color: var(--gl-text-muted);
+}
+.gl-dropdown__item-label {
+  flex: 1 1 auto;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+.gl-dropdown__separator {
+  height: 1px;
+  margin: var(--gl-space-2) calc(-1 * var(--gl-space-1));
+  background: var(--gl-border);
+  border: none;
+}
+.gl-dropdown__label {
+  padding: var(--gl-space-2) var(--gl-space-3) var(--gl-space-1);
+  font-family: var(--gl-font);
+  font-size: var(--gl-fs-xs);
+  font-weight: var(--gl-fw-bold);
+  letter-spacing: 0.04em;
+  text-transform: uppercase;
+  color: var(--gl-text-faint);
+  user-select: none;
+}
+
+/* src/components/Input/Input.css */
+.gl-input {
+  --_input-h: var(--gl-control-h-md);
+  --_input-px: var(--gl-space-4);
+  --_input-fs: var(--gl-fs);
+  --_input-radius: var(--gl-radius);
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+  gap: var(--gl-space-2);
+  height: var(--_input-h);
+  padding: 0 var(--_input-px);
+  font-family: var(--gl-font);
+  border: 1px solid var(--gl-border);
+  border-radius: var(--_input-radius);
+  color: var(--gl-text-on-glass);
+  background: var(--gl-bg-subtle);
+  -webkit-backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  box-shadow: var(--gl-inner-glow);
+  cursor: text;
+  transition:
+    border-color var(--gl-dur) var(--gl-ease),
+    background-color var(--gl-dur) var(--gl-ease),
+    box-shadow var(--gl-dur) var(--gl-ease);
+}
+.gl-input::before {
+  content: "";
+  position: absolute;
+  inset: 0;
+  border-radius: inherit;
+  padding: 1px;
+  background:
+    linear-gradient(
+      180deg,
+      var(--gl-highlight),
+      transparent 60%);
+  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
+  -webkit-mask-composite: xor;
+  mask-composite: exclude;
+  opacity: 0.6;
+  pointer-events: none;
+}
+.gl-input:hover {
+  border-color: var(--gl-border-strong);
+}
+.gl-input:focus-within {
+  border-color: var(--gl-border-strong);
+  box-shadow: var(--gl-ring), var(--gl-inner-glow);
+}
+.gl-input--subtle {
+  background: var(--gl-bg-subtle);
+}
+.gl-input--glass {
+  background: var(--gl-bg);
+  border-color: var(--gl-border);
+  box-shadow: var(--gl-shadow), var(--gl-inner-glow);
+}
+.gl-input--glass:focus-within {
+  box-shadow:
+    var(--gl-ring),
+    var(--gl-shadow),
+    var(--gl-inner-glow);
+}
+.gl-input--md {
+  --_input-h: var(--gl-control-h-md);
+  --_input-px: var(--gl-space-4);
+  --_input-fs: var(--gl-fs);
+  --_input-radius: var(--gl-radius);
+}
+.gl-input--sm {
+  --_input-h: var(--gl-control-h-sm);
+  --_input-px: var(--gl-space-3);
+  --_input-fs: var(--gl-fs-sm);
+  --_input-radius: var(--gl-radius-sm);
+  gap: var(--gl-space-1);
+}
+.gl-input--lg {
+  --_input-h: var(--gl-control-h-lg);
+  --_input-px: var(--gl-space-5);
+  --_input-fs: var(--gl-fs-lg);
+  --_input-radius: var(--gl-radius-lg);
+}
+.gl-input--error {
+  border-color: var(--gl-danger);
+}
+.gl-input--error:hover {
+  border-color: var(--gl-danger);
+}
+.gl-input--error:focus-within {
+  border-color: var(--gl-danger);
+  box-shadow: 0 0 0 3px var(--gl-danger-soft), var(--gl-inner-glow);
+}
+.gl-input--block {
+  display: flex;
+  width: 100%;
+}
+.gl-input--disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+.gl-input--disabled .gl-input__field {
+  cursor: not-allowed;
+}
+.gl-input__field {
+  flex: 1 1 auto;
+  min-width: 0;
+  width: 100%;
+  height: 100%;
+  margin: 0;
+  padding: 0;
+  border: none;
+  outline: none;
+  background: transparent;
+  color: inherit;
+  font-family: inherit;
+  font-size: var(--_input-fs);
+  font-weight: var(--gl-fw);
+  line-height: var(--gl-lh);
+  text-overflow: ellipsis;
+}
+.gl-input__field::placeholder {
+  color: var(--gl-text-faint);
+  opacity: 1;
+}
+.gl-input__field:disabled {
+  cursor: not-allowed;
+}
+.gl-input__field::-webkit-outer-spin-button,
+.gl-input__field::-webkit-inner-spin-button {
+  -webkit-appearance: none;
+  margin: 0;
+}
+.gl-input__icon {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  flex: 0 0 auto;
+  color: var(--gl-text-muted);
+  font-size: 1.1em;
+  pointer-events: none;
+}
+.gl-input__icon--left {
+  margin-inline-start: calc(-1 * var(--gl-space-1));
+}
+.gl-input__icon--right {
+  margin-inline-end: calc(-1 * var(--gl-space-1));
+}
+
+/* src/components/Modal/Modal.css */
+.gl-modal__backdrop {
+  position: fixed;
+  inset: 0;
+  z-index: var(--gl-z-modal);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: var(--gl-space-6);
+  overflow-y: auto;
+  background: rgba(17, 24, 39, 0.55);
+  -webkit-backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  animation: gl-fade-in var(--gl-dur) var(--gl-ease);
+}
+.gl-modal__panel {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  max-height: calc(100vh - var(--gl-space-8) * 2);
+  overflow: hidden;
+  font-family: var(--gl-font);
+  color: var(--gl-text-on-glass);
+  background: var(--gl-bg);
+  border: 1px solid var(--gl-border);
+  border-radius: var(--gl-radius-lg);
+  box-shadow: var(--gl-shadow-lg), var(--gl-inner-glow);
+  -webkit-backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  outline: none;
+  animation: gl-scale-in var(--gl-dur) var(--gl-ease);
+  will-change: transform, opacity;
+}
+.gl-modal__panel::before {
+  content: "";
+  position: absolute;
+  inset: 0;
+  border-radius: inherit;
+  padding: 1px;
+  background:
+    linear-gradient(
+      180deg,
+      var(--gl-highlight),
+      transparent 60%);
+  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
+  -webkit-mask-composite: xor;
+  mask-composite: exclude;
+  opacity: 0.7;
+  pointer-events: none;
+}
+.gl-modal__panel--sm {
+  max-width: 380px;
+}
+.gl-modal__panel--md {
+  max-width: 520px;
+}
+.gl-modal__panel--lg {
+  max-width: 760px;
+}
+.gl-modal__panel--full {
+  max-width: none;
+  width: 100%;
+  height: 100%;
+  max-height: none;
+}
+.gl-modal__header {
+  display: flex;
+  align-items: center;
+  gap: var(--gl-space-4);
+  flex: none;
+  padding: var(--gl-space-5) var(--gl-space-6);
+  border-bottom: 1px solid var(--gl-border);
+}
+.gl-modal__title {
+  margin: 0;
+  font-family: var(--gl-font);
+  font-size: var(--gl-fs-xl);
+  font-weight: var(--gl-fw-bold);
+  line-height: var(--gl-lh);
+  color: var(--gl-text);
+}
+.gl-modal__close {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  flex: none;
+  margin-inline-start: auto;
+  width: var(--gl-control-h-sm);
+  height: var(--gl-control-h-sm);
+  padding: 0;
+  font-size: var(--gl-fs-lg);
+  color: var(--gl-text-muted);
+  cursor: pointer;
+  background: transparent;
+  border: 1px solid transparent;
+  border-radius: var(--gl-radius-full);
+  transition:
+    transform var(--gl-dur-fast) var(--gl-ease),
+    background-color var(--gl-dur) var(--gl-ease),
+    color var(--gl-dur) var(--gl-ease);
+}
+.gl-modal__close:hover {
+  color: var(--gl-text);
+  background: var(--gl-bg-subtle);
+}
+.gl-modal__close:active {
+  transform: scale(0.92);
+}
+.gl-modal__close svg {
+  width: 1em;
+  height: 1em;
+}
+.gl-modal__body {
+  flex: 1 1 auto;
+  min-height: 0;
+  padding: var(--gl-space-6);
+  overflow-y: auto;
+  font-size: var(--gl-fs);
+  line-height: var(--gl-lh);
+  color: var(--gl-text);
+}
+.gl-modal__footer {
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  gap: var(--gl-space-3);
+  flex: none;
+  padding: var(--gl-space-5) var(--gl-space-6);
+  border-top: 1px solid var(--gl-border);
+}
+
+/* src/components/Progress/Progress.css */
+.gl-progress {
+  --_track-h: 10px;
+  --_fill: var(--gl-primary);
+  display: flex;
+  align-items: center;
+  gap: var(--gl-space-3);
+  width: 100%;
+  font-family: var(--gl-font);
+}
+.gl-progress--sm {
+  --_track-h: 6px;
+}
+.gl-progress--md {
+  --_track-h: 10px;
+}
+.gl-progress--lg {
+  --_track-h: 14px;
+}
+.gl-progress--primary {
+  --_fill: var(--gl-primary);
+}
+.gl-progress--success {
+  --_fill: var(--gl-success);
+}
+.gl-progress--danger {
+  --_fill: var(--gl-danger);
+}
+.gl-progress--warning {
+  --_fill: var(--gl-warning);
+}
+.gl-progress--info {
+  --_fill: var(--gl-info);
+}
+.gl-progress__track {
+  position: relative;
+  flex: 1 1 auto;
+  height: var(--_track-h);
+  overflow: hidden;
+  background: var(--gl-bg-subtle);
+  -webkit-backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  border: 1px solid var(--gl-border);
+  border-radius: var(--gl-radius-full);
+  box-shadow: var(--gl-inner-glow);
+}
+.gl-progress__bar {
+  position: absolute;
+  inset: 0;
+  transform-origin: left center;
+  transform: scaleX(var(--gl-progress-value, 0));
+  border-radius: inherit;
+  background:
+    linear-gradient(
+      90deg,
+      color-mix(in srgb, var(--_fill) 82%, white 18%),
+      var(--_fill));
+  transition: transform var(--gl-dur) var(--gl-ease);
+  will-change: transform;
+}
+.gl-progress__bar::after {
+  content: "";
+  position: absolute;
+  inset: 0;
+  border-radius: inherit;
+  background:
+    linear-gradient(
+      180deg,
+      var(--gl-highlight),
+      transparent 55%);
+  opacity: 0.5;
+  pointer-events: none;
+}
+.gl-progress__bar--indeterminate {
+  right: auto;
+  width: 40%;
+  transform: none;
+  transition: none;
+  animation: gl-indeterminate 1.4s var(--gl-ease) infinite;
+}
+.gl-progress__label {
+  flex: 0 0 auto;
+  min-width: 3ch;
+  font-size: var(--gl-fs-sm);
+  font-weight: var(--gl-fw-bold);
+  font-variant-numeric: tabular-nums;
+  color: var(--gl-text-muted);
+  text-align: right;
+}
+@media (prefers-reduced-motion: reduce) {
+  .gl-progress__bar--indeterminate {
+    left: 0;
+    right: 0;
+    width: auto;
+    transform: none;
+    opacity: 0.6;
+  }
+}
+
+/* src/components/Radio/Radio.css */
+.gl-radio-group {
+  display: flex;
+  gap: var(--gl-space-3);
+}
+.gl-radio-group--vertical {
+  flex-direction: column;
+}
+.gl-radio-group--horizontal {
+  flex-direction: row;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: var(--gl-space-5);
+}
+.gl-radio {
+  --_radio-size: var(--gl-space-5);
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+  gap: var(--gl-space-2);
+  font-family: var(--gl-font);
+  font-size: var(--gl-fs);
+  font-weight: var(--gl-fw);
+  line-height: var(--gl-lh);
+  color: var(--gl-text);
+  cursor: pointer;
+  user-select: none;
+}
+.gl-radio__dot {
+  position: relative;
+  display: grid;
+  place-items: center;
+  flex: 0 0 auto;
+  width: var(--_radio-size);
+  height: var(--_radio-size);
+  border: 1px solid var(--gl-border);
+  border-radius: var(--gl-radius-full);
+  background: var(--gl-bg);
+  -webkit-backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  box-shadow: var(--gl-inner-glow);
+  transition:
+    transform var(--gl-dur-fast) var(--gl-ease),
+    background-color var(--gl-dur) var(--gl-ease),
+    border-color var(--gl-dur) var(--gl-ease),
+    box-shadow var(--gl-dur) var(--gl-ease);
+  will-change: transform;
+}
+.gl-radio__dot::before {
+  content: "";
+  position: absolute;
+  inset: 0;
+  border-radius: inherit;
+  padding: 1px;
+  background:
+    linear-gradient(
+      180deg,
+      var(--gl-highlight),
+      transparent 60%);
+  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
+  -webkit-mask-composite: xor;
+  mask-composite: exclude;
+  opacity: 0.7;
+  pointer-events: none;
+}
+.gl-radio__mark {
+  width: 50%;
+  height: 50%;
+  border-radius: var(--gl-radius-full);
+  background: var(--gl-primary);
+  transform: scale(0);
+  opacity: 0;
+  transition: transform var(--gl-dur) var(--gl-ease-spring), opacity var(--gl-dur-fast) var(--gl-ease);
+  will-change: transform;
+}
+.gl-radio__label {
+  display: inline-flex;
+  align-items: center;
+}
+.gl-radio:not(.gl-radio--disabled):hover .gl-radio__dot {
+  background: var(--gl-bg-hover);
+  border-color: var(--gl-border-strong);
+}
+.gl-radio:not(.gl-radio--disabled):active .gl-radio__dot {
+  transform: scale(0.92);
+}
+.gl-radio--checked .gl-radio__dot {
+  border-color: var(--gl-primary);
+  background: var(--gl-primary-soft);
+}
+.gl-radio--checked .gl-radio__mark {
+  transform: scale(1);
+  opacity: 1;
+}
+.gl-radio__input:focus-visible ~ .gl-radio__dot {
+  outline: none;
+  box-shadow: var(--gl-inner-glow), var(--gl-ring);
+}
+.gl-radio--disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+
+/* src/components/Select/Select.css */
+.gl-select {
+  --_sel-h: var(--gl-control-h-md);
+  --_sel-px: var(--gl-space-4);
+  --_sel-fs: var(--gl-fs);
+  --_sel-radius: var(--gl-radius);
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+  width: auto;
+  max-width: 100%;
+  font-family: var(--gl-font);
+  vertical-align: middle;
+}
+.gl-select--block {
+  display: flex;
+  width: 100%;
+}
+.gl-select__field {
+  appearance: none;
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  width: 100%;
+  height: var(--_sel-h);
+  margin: 0;
+  padding: 0 calc(var(--_sel-px) + 1.5em) 0 var(--_sel-px);
+  font-family: inherit;
+  font-size: var(--_sel-fs);
+  font-weight: var(--gl-fw);
+  line-height: 1;
+  color: var(--gl-text-on-glass);
+  cursor: pointer;
+  border: 1px solid var(--gl-border);
+  border-radius: var(--_sel-radius);
+  background: var(--gl-bg-subtle);
+  -webkit-backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  box-shadow: var(--gl-inner-glow);
+  transition:
+    border-color var(--gl-dur) var(--gl-ease),
+    background-color var(--gl-dur) var(--gl-ease),
+    box-shadow var(--gl-dur) var(--gl-ease);
+}
+.gl-select__field:hover {
+  background: var(--gl-bg);
+  border-color: var(--gl-border-strong);
+}
+.gl-select__field:focus {
+  outline: none;
+}
+.gl-select__chevron {
+  position: absolute;
+  top: 50%;
+  right: var(--_sel-px);
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  color: var(--gl-text-muted);
+  pointer-events: none;
+  transform: translateY(-50%);
+  transition: transform var(--gl-dur) var(--gl-ease), color var(--gl-dur) var(--gl-ease);
+}
+.gl-select__chevron svg {
+  display: block;
+}
+.gl-select:focus-within .gl-select__field {
+  border-color: var(--gl-border-strong);
+  box-shadow: var(--gl-inner-glow), var(--gl-ring);
+}
+.gl-select:focus-within .gl-select__chevron {
+  color: var(--gl-text);
+  transform: translateY(-50%) scale(1.05);
+}
+.gl-select--md {
+  --_sel-h: var(--gl-control-h-md);
+  --_sel-px: var(--gl-space-4);
+  --_sel-fs: var(--gl-fs);
+  --_sel-radius: var(--gl-radius);
+}
+.gl-select--sm {
+  --_sel-h: var(--gl-control-h-sm);
+  --_sel-px: var(--gl-space-3);
+  --_sel-fs: var(--gl-fs-sm);
+  --_sel-radius: var(--gl-radius-sm);
+}
+.gl-select--lg {
+  --_sel-h: var(--gl-control-h-lg);
+  --_sel-px: var(--gl-space-5);
+  --_sel-fs: var(--gl-fs-lg);
+  --_sel-radius: var(--gl-radius-lg);
+}
+.gl-select--error .gl-select__field {
+  border-color: var(--gl-danger);
+}
+.gl-select--error.gl-select:focus-within .gl-select__field {
+  border-color: var(--gl-danger);
+  box-shadow: var(--gl-inner-glow), 0 0 0 3px var(--gl-danger-soft);
+}
+.gl-select--disabled {
+  opacity: 0.5;
+}
+.gl-select__field:disabled {
+  cursor: not-allowed;
+}
+
+/* src/components/Slider/Slider.css */
+.gl-slider {
+  --gl-slider-fill: 0%;
+  --_track-h: 6px;
+  --_thumb: 20px;
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+  width: 100%;
+  min-width: 140px;
+  height: var(--gl-control-h-md);
+  font-family: var(--gl-font);
+}
+.gl-slider--show-value {
+  margin-top: var(--gl-space-8);
+}
+.gl-slider__input {
+  -webkit-appearance: none;
+  appearance: none;
+  width: 100%;
+  height: var(--_thumb);
+  margin: 0;
+  padding: 0;
+  background: transparent;
+  cursor: pointer;
+  border-radius: var(--gl-radius-full);
+}
+.gl-slider__input:focus {
+  outline: none;
+}
+.gl-slider__input::-moz-focus-outer {
+  border: 0;
+}
+.gl-slider__input::-webkit-slider-runnable-track {
+  box-sizing: border-box;
+  height: var(--_track-h);
+  border-radius: var(--gl-radius-full);
+  background:
+    linear-gradient(
+      to right,
+      var(--gl-primary),
+      var(--gl-primary) var(--gl-slider-fill),
+      var(--gl-bg-subtle) var(--gl-slider-fill),
+      var(--gl-bg-subtle));
+  box-shadow: inset 0 0 0 1px var(--gl-border);
+}
+.gl-slider__input::-moz-range-track {
+  box-sizing: border-box;
+  height: var(--_track-h);
+  border-radius: var(--gl-radius-full);
+  background:
+    linear-gradient(
+      to right,
+      var(--gl-primary),
+      var(--gl-primary) var(--gl-slider-fill),
+      var(--gl-bg-subtle) var(--gl-slider-fill),
+      var(--gl-bg-subtle));
+  box-shadow: inset 0 0 0 1px var(--gl-border);
+}
+.gl-slider__input::-webkit-slider-thumb {
+  -webkit-appearance: none;
+  appearance: none;
+  box-sizing: border-box;
+  width: var(--_thumb);
+  height: var(--_thumb);
+  margin-top: calc((var(--_track-h) - var(--_thumb)) / 2);
+  border: 1px solid var(--gl-border-strong);
+  border-radius: var(--gl-radius-full);
+  background: var(--gl-bg);
+  -webkit-backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  box-shadow: var(--gl-shadow), var(--gl-inner-glow);
+  cursor: grab;
+  transition: transform var(--gl-dur-fast) var(--gl-ease), box-shadow var(--gl-dur) var(--gl-ease);
+  will-change: transform;
+}
+.gl-slider__input::-moz-range-thumb {
+  box-sizing: border-box;
+  width: var(--_thumb);
+  height: var(--_thumb);
+  border: 1px solid var(--gl-border-strong);
+  border-radius: var(--gl-radius-full);
+  background: var(--gl-bg);
+  -webkit-backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  box-shadow: var(--gl-shadow), var(--gl-inner-glow);
+  cursor: grab;
+  transition: transform var(--gl-dur-fast) var(--gl-ease), box-shadow var(--gl-dur) var(--gl-ease);
+  will-change: transform;
+}
+.gl-slider__input:hover::-webkit-slider-thumb {
+  transform: scale(1.12);
+}
+.gl-slider__input:active::-webkit-slider-thumb {
+  transform: scale(1.04);
+  cursor: grabbing;
+}
+.gl-slider__input:hover::-moz-range-thumb {
+  transform: scale(1.12);
+}
+.gl-slider__input:active::-moz-range-thumb {
+  transform: scale(1.04);
+  cursor: grabbing;
+}
+.gl-slider__input:focus-visible::-webkit-slider-thumb {
+  box-shadow:
+    var(--gl-shadow),
+    var(--gl-inner-glow),
+    var(--gl-ring);
+}
+.gl-slider__input:focus-visible::-moz-range-thumb {
+  box-shadow:
+    var(--gl-shadow),
+    var(--gl-inner-glow),
+    var(--gl-ring);
+}
+.gl-slider__value {
+  position: absolute;
+  left: var(--gl-slider-fill);
+  bottom: 50%;
+  margin-bottom: calc(var(--_thumb) / 2 + var(--gl-space-2));
+  transform: translateX(-50%);
+  min-width: 2ch;
+  padding: var(--gl-space-1) var(--gl-space-2);
+  font-size: var(--gl-fs-xs);
+  font-weight: var(--gl-fw-bold);
+  line-height: 1;
+  text-align: center;
+  color: var(--gl-text-on-glass);
+  background: var(--gl-bg);
+  -webkit-backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  border: 1px solid var(--gl-border);
+  border-radius: var(--gl-radius-sm);
+  box-shadow: var(--gl-shadow), var(--gl-inner-glow);
+  pointer-events: none;
+  white-space: nowrap;
+}
+.gl-slider--disabled {
+  opacity: 0.5;
+}
+.gl-slider--disabled .gl-slider__input,
+.gl-slider--disabled .gl-slider__input::-webkit-slider-thumb {
+  cursor: not-allowed;
+}
+.gl-slider--disabled .gl-slider__input::-moz-range-thumb {
+  cursor: not-allowed;
+}
+@media (prefers-reduced-motion: reduce) {
+  .gl-slider__input::-webkit-slider-thumb {
+    transition-duration: 0.01ms;
+  }
+  .gl-slider__input::-moz-range-thumb {
+    transition-duration: 0.01ms;
+  }
+}
+
+/* src/components/Spinner/Spinner.css */
+.gl-spinner {
+  --_spinner-size: 1.5rem;
+  --_spinner-bw: 2px;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: var(--_spinner-size);
+  height: var(--_spinner-size);
+  color: inherit;
+  vertical-align: middle;
+  flex: none;
+}
+.gl-spinner__ring {
+  width: 100%;
+  height: 100%;
+  border: var(--gl-spinner-bw, var(--_spinner-bw)) solid currentColor;
+  border-top-color: transparent;
+  border-radius: var(--gl-radius-full);
+  opacity: 0.9;
+  animation: gl-spin 0.7s linear infinite;
+  will-change: transform;
+}
+.gl-spinner--sm {
+  --_spinner-size: 1rem;
+  --_spinner-bw: 2px;
+}
+.gl-spinner--md {
+  --_spinner-size: 1.5rem;
+  --_spinner-bw: 2px;
+}
+.gl-spinner--lg {
+  --_spinner-size: 2.25rem;
+  --_spinner-bw: 3px;
+}
+.gl-spinner--xl {
+  --_spinner-size: 3rem;
+  --_spinner-bw: 4px;
+}
+
+/* src/components/Switch/Switch.css */
+.gl-switch {
+  --_sw-w: 44px;
+  --_sw-h: 26px;
+  --_sw-pad: 3px;
+  --_sw-thumb: calc(var(--_sw-h) - var(--_sw-pad) * 2);
+  --_sw-travel: calc(var(--_sw-w) - var(--_sw-thumb) - var(--_sw-pad) * 2);
+  display: inline-flex;
+  align-items: center;
+  gap: var(--gl-space-3);
+  font-family: var(--gl-font);
+  font-size: var(--gl-fs);
+  font-weight: var(--gl-fw);
+  line-height: var(--gl-lh);
+  color: var(--gl-text);
+  cursor: pointer;
+  user-select: none;
+}
+.gl-switch--sm {
+  --_sw-w: 34px;
+  --_sw-h: 20px;
+  font-size: var(--gl-fs-sm);
+}
+.gl-switch--md {
+  --_sw-w: 44px;
+  --_sw-h: 26px;
+  font-size: var(--gl-fs);
+}
+.gl-switch--lg {
+  --_sw-w: 54px;
+  --_sw-h: 32px;
+  font-size: var(--gl-fs-lg);
+}
+.gl-switch__track {
+  position: relative;
+  flex: none;
+  width: var(--_sw-w);
+  height: var(--_sw-h);
+  border-radius: var(--gl-radius-full);
+  background: var(--gl-bg-subtle);
+  -webkit-backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  border: 1px solid var(--gl-border);
+  box-shadow: var(--gl-shadow), var(--gl-inner-glow);
+  transition:
+    background-color var(--gl-dur) var(--gl-ease),
+    border-color var(--gl-dur) var(--gl-ease),
+    box-shadow var(--gl-dur) var(--gl-ease);
+}
+.gl-switch__track::before {
+  content: "";
+  position: absolute;
+  inset: 0;
+  border-radius: inherit;
+  padding: 1px;
+  background:
+    linear-gradient(
+      180deg,
+      var(--gl-highlight),
+      transparent 60%);
+  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
+  -webkit-mask-composite: xor;
+  mask-composite: exclude;
+  opacity: 0.7;
+  pointer-events: none;
+}
+.gl-switch__thumb {
+  position: absolute;
+  top: var(--_sw-pad);
+  left: var(--_sw-pad);
+  width: var(--_sw-thumb);
+  height: var(--_sw-thumb);
+  border-radius: var(--gl-radius-full);
+  background: var(--gl-primary-contrast);
+  box-shadow: var(--gl-shadow);
+  transform: translateX(0);
+  transition: transform var(--gl-dur) var(--gl-ease-spring);
+  will-change: transform;
+}
+.gl-switch:hover:not(.gl-switch--disabled) .gl-switch__track {
+  background: var(--gl-bg-hover);
+}
+.gl-switch--checked .gl-switch__track {
+  background: var(--gl-primary);
+  border-color: color-mix(in srgb, var(--gl-primary) 70%, black 30%);
+}
+.gl-switch--checked:hover:not(.gl-switch--disabled) .gl-switch__track {
+  background: var(--gl-primary-hover);
+}
+.gl-switch--checked .gl-switch__thumb {
+  transform: translateX(var(--_sw-travel));
+}
+.gl-switch__input:focus-visible + .gl-switch__track {
+  box-shadow:
+    var(--gl-shadow),
+    var(--gl-inner-glow),
+    var(--gl-ring);
+}
+.gl-switch--disabled {
+  cursor: not-allowed;
+  opacity: 0.5;
+}
+.gl-switch__label {
+  color: var(--gl-text);
+}
+
+/* src/components/Tabs/Tabs.css */
+.gl-tabs {
+  display: flex;
+  flex-direction: column;
+  gap: var(--gl-space-4);
+  font-family: var(--gl-font);
+  color: var(--gl-text);
+}
+.gl-tabs__list {
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+  gap: var(--gl-space-1);
+  align-self: flex-start;
+  max-width: 100%;
+  padding: var(--gl-space-1);
+  border: 1px solid var(--gl-border);
+  border-radius: var(--gl-radius-full);
+  background: var(--gl-bg);
+  -webkit-backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  box-shadow: var(--gl-shadow), var(--gl-inner-glow);
+  overflow-x: auto;
+  scrollbar-width: none;
+}
+.gl-tabs__list::-webkit-scrollbar {
+  display: none;
+}
+.gl-tabs__list::before {
+  content: "";
+  position: absolute;
+  inset: 0;
+  border-radius: inherit;
+  padding: 1px;
+  background:
+    linear-gradient(
+      180deg,
+      var(--gl-highlight),
+      transparent 60%);
+  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
+  -webkit-mask-composite: xor;
+  mask-composite: exclude;
+  opacity: 0.7;
+  pointer-events: none;
+}
+.gl-tabs__tab {
+  position: relative;
+  display: inline-flex;
+  flex: 0 0 auto;
+  align-items: center;
+  justify-content: center;
+  gap: var(--gl-space-2);
+  height: var(--gl-control-h-sm);
+  padding: 0 var(--gl-space-4);
+  font-family: inherit;
+  font-size: var(--gl-fs-sm);
+  font-weight: var(--gl-fw-bold);
+  line-height: 1;
+  white-space: nowrap;
+  color: var(--gl-text-muted);
+  background: transparent;
+  border: 0;
+  border-radius: var(--gl-radius-full);
+  cursor: pointer;
+  user-select: none;
+  transition:
+    transform var(--gl-dur-fast) var(--gl-ease),
+    color var(--gl-dur) var(--gl-ease),
+    background-color var(--gl-dur) var(--gl-ease),
+    box-shadow var(--gl-dur) var(--gl-ease);
+  will-change: transform;
+}
+.gl-tabs__tab:hover {
+  color: var(--gl-text);
+  background: var(--gl-bg-subtle);
+}
+.gl-tabs__tab:active {
+  transform: scale(0.97);
+}
+.gl-tabs__tab--active {
+  color: var(--gl-text-on-glass);
+  background: var(--gl-bg-hover);
+  box-shadow: var(--gl-shadow), var(--gl-inner-glow);
+}
+.gl-tabs__tab--active:hover {
+  background: var(--gl-bg-active);
+}
+.gl-tabs__tab:disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+  transform: none;
+}
+.gl-tabs__tab-label {
+  display: inline-flex;
+  align-items: center;
+}
+.gl-tabs__panel {
+  font-family: var(--gl-font);
+  font-size: var(--gl-fs);
+  line-height: var(--gl-lh);
+  color: var(--gl-text);
+  outline: none;
+}
+.gl-tabs__panel:not([hidden]) {
+  animation: gl-slide-up var(--gl-dur) var(--gl-ease);
+}
+.gl-tabs__panel:focus-visible {
+  outline: none;
+  border-radius: var(--gl-radius);
+  box-shadow: var(--gl-ring);
+}
+
+/* src/components/Textarea/Textarea.css */
+.gl-textarea {
+  position: relative;
+  display: inline-flex;
+  flex-direction: column;
+  min-width: 12rem;
+  border: 1px solid var(--gl-border);
+  border-radius: var(--gl-radius);
+  background: var(--gl-bg-subtle);
+  -webkit-backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  box-shadow: var(--gl-shadow), var(--gl-inner-glow);
+  color: var(--gl-text-on-glass);
+  transition:
+    border-color var(--gl-dur) var(--gl-ease),
+    box-shadow var(--gl-dur) var(--gl-ease),
+    background-color var(--gl-dur) var(--gl-ease);
+}
+.gl-textarea::before {
+  content: "";
+  position: absolute;
+  inset: 0;
+  border-radius: inherit;
+  padding: 1px;
+  background:
+    linear-gradient(
+      180deg,
+      var(--gl-highlight),
+      transparent 60%);
+  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
+  -webkit-mask-composite: xor;
+  mask-composite: exclude;
+  opacity: 0.6;
+  pointer-events: none;
+}
+.gl-textarea--glass {
+  background: var(--gl-bg);
+}
+.gl-textarea--subtle {
+  background: var(--gl-bg-subtle);
+}
+.gl-textarea:focus-within {
+  border-color: var(--gl-border-strong);
+  box-shadow:
+    var(--gl-ring),
+    var(--gl-shadow),
+    var(--gl-inner-glow);
+}
+.gl-textarea--error {
+  border-color: var(--gl-danger);
+}
+.gl-textarea--error:focus-within {
+  border-color: var(--gl-danger);
+  box-shadow:
+    0 0 0 3px color-mix(in srgb, var(--gl-danger) 40%, transparent),
+    var(--gl-shadow),
+    var(--gl-inner-glow);
+}
+.gl-textarea--full {
+  display: flex;
+  width: 100%;
+}
+.gl-textarea--disabled {
+  opacity: 0.55;
+  cursor: not-allowed;
+}
+.gl-textarea__field {
+  width: 100%;
+  flex: 1 1 auto;
+  min-height: calc(var(--gl-fs) * var(--gl-lh) * 3);
+  margin: 0;
+  padding: var(--gl-space-3) var(--gl-space-4);
+  font-family: var(--gl-font);
+  font-size: var(--gl-fs);
+  font-weight: var(--gl-fw);
+  line-height: var(--gl-lh);
+  color: inherit;
+  background: transparent;
+  border: 0;
+  border-radius: inherit;
+  outline: none;
+  resize: vertical;
+  -webkit-appearance: none;
+  appearance: none;
+}
+.gl-textarea__field::placeholder {
+  color: var(--gl-text-faint);
+}
+.gl-textarea__field:disabled {
+  cursor: not-allowed;
+}
+.gl-textarea--auto .gl-textarea__field {
+  resize: none;
+  overflow: hidden;
+}
+
+/* src/components/Toast/Toast.css */
+.gl-toast-viewport {
+  position: fixed;
+  z-index: var(--gl-z-toast);
+  display: flex;
+  flex-direction: column;
+  gap: var(--gl-space-3);
+  width: min(24rem, calc(100vw - (var(--gl-space-5) * 2)));
+  pointer-events: none;
+}
+.gl-toast-viewport--top-right {
+  top: var(--gl-space-5);
+  right: var(--gl-space-5);
+  flex-direction: column-reverse;
+}
+.gl-toast-viewport--top-left {
+  top: var(--gl-space-5);
+  left: var(--gl-space-5);
+  flex-direction: column-reverse;
+}
+.gl-toast-viewport--bottom-right {
+  bottom: var(--gl-space-5);
+  right: var(--gl-space-5);
+}
+.gl-toast-viewport--bottom-left {
+  bottom: var(--gl-space-5);
+  left: var(--gl-space-5);
+}
+.gl-toast {
+  --_toast-accent: var(--gl-border-strong);
+  position: relative;
+  display: flex;
+  align-items: flex-start;
+  gap: var(--gl-space-3);
+  width: 100%;
+  padding: var(--gl-space-4);
+  overflow: hidden;
+  pointer-events: auto;
+  font-family: var(--gl-font);
+  color: var(--gl-text-on-glass);
+  background: var(--gl-bg);
+  border: 1px solid var(--gl-border);
+  border-radius: var(--gl-radius);
+  box-shadow: var(--gl-shadow), var(--gl-inner-glow);
+  -webkit-backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  animation: gl-toast-in var(--gl-dur) var(--gl-ease);
+  will-change: transform, opacity;
+}
+.gl-toast::before {
+  content: "";
+  position: absolute;
+  inset: 0;
+  border-radius: inherit;
+  padding: 1px;
+  background:
+    linear-gradient(
+      180deg,
+      var(--gl-highlight),
+      transparent 60%);
+  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
+  -webkit-mask-composite: xor;
+  mask-composite: exclude;
+  opacity: 0.7;
+  pointer-events: none;
+}
+@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
+  .gl-toast {
+    background: rgba(255, 255, 255, 0.9);
+  }
+  [data-theme=dark] .gl-toast,
+  .gl-dark .gl-toast {
+    background: rgba(28, 28, 36, 0.94);
+  }
+}
+.gl-toast--glass {
+  --_toast-accent: var(--gl-border-strong);
+}
+.gl-toast--success {
+  --_toast-accent: var(--gl-success);
+}
+.gl-toast--danger {
+  --_toast-accent: var(--gl-danger);
+}
+.gl-toast--warning {
+  --_toast-accent: var(--gl-warning);
+}
+.gl-toast--info {
+  --_toast-accent: var(--gl-info);
+}
+.gl-toast__accent {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  width: 4px;
+  background: var(--_toast-accent);
+  pointer-events: none;
+}
+.gl-toast__body {
+  display: flex;
+  flex: 1 1 auto;
+  flex-direction: column;
+  gap: var(--gl-space-1);
+  min-width: 0;
+  padding-left: var(--gl-space-1);
+}
+.gl-toast__title {
+  font-size: var(--gl-fs);
+  font-weight: var(--gl-fw-bold);
+  line-height: var(--gl-lh);
+  color: var(--gl-text);
+}
+.gl-toast__description {
+  font-size: var(--gl-fs-sm);
+  font-weight: var(--gl-fw);
+  line-height: var(--gl-lh);
+  color: var(--gl-text-muted);
+  overflow-wrap: anywhere;
+}
+.gl-toast__close {
+  flex: none;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 24px;
+  height: 24px;
+  margin: -2px -2px 0 0;
+  padding: 0;
+  color: var(--gl-text-muted);
+  background: transparent;
+  border: 0;
+  border-radius: var(--gl-radius-sm);
+  cursor: pointer;
+  transition:
+    transform var(--gl-dur-fast) var(--gl-ease),
+    color var(--gl-dur-fast) var(--gl-ease),
+    background-color var(--gl-dur-fast) var(--gl-ease);
+}
+.gl-toast__close:hover {
+  color: var(--gl-text);
+  background: var(--gl-bg-subtle);
+}
+.gl-toast__close:active {
+  transform: scale(0.92);
+}
+.gl-toast__close-icon {
+  width: 16px;
+  height: 16px;
+}
+
+/* src/components/Tooltip/Tooltip.css */
+.gl-tooltip-wrap {
+  position: relative;
+  display: inline-flex;
+}
+.gl-tooltip {
+  position: absolute;
+  z-index: var(--gl-z-tooltip);
+  max-width: 240px;
+  width: max-content;
+  padding: var(--gl-space-2) var(--gl-space-3);
+  font-family: var(--gl-font);
+  font-size: var(--gl-fs-sm);
+  font-weight: var(--gl-fw);
+  line-height: var(--gl-lh);
+  text-align: center;
+  color: var(--gl-text-on-glass);
+  background: var(--gl-bg);
+  border: 1px solid var(--gl-border);
+  border-radius: var(--gl-radius-sm);
+  box-shadow: var(--gl-shadow), var(--gl-inner-glow);
+  -webkit-backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  backdrop-filter: blur(var(--gl-blur)) saturate(var(--gl-saturate));
+  pointer-events: none;
+  animation-duration: var(--gl-dur);
+  animation-timing-function: var(--gl-ease);
+  animation-fill-mode: both;
+  will-change: transform, opacity;
+}
+.gl-tooltip--top {
+  bottom: calc(100% + var(--gl-space-2));
+  left: 50%;
+  transform: translateX(-50%) scale(1);
+  transform-origin: bottom center;
+  animation-name: gl-tooltip-in-x;
+}
+.gl-tooltip--bottom {
+  top: calc(100% + var(--gl-space-2));
+  left: 50%;
+  transform: translateX(-50%) scale(1);
+  transform-origin: top center;
+  animation-name: gl-tooltip-in-x;
+}
+.gl-tooltip--left {
+  right: calc(100% + var(--gl-space-2));
+  top: 50%;
+  transform: translateY(-50%) scale(1);
+  transform-origin: center right;
+  animation-name: gl-tooltip-in-y;
+}
+.gl-tooltip--right {
+  left: calc(100% + var(--gl-space-2));
+  top: 50%;
+  transform: translateY(-50%) scale(1);
+  transform-origin: center left;
+  animation-name: gl-tooltip-in-y;
+}
+@keyframes gl-tooltip-in-x {
+  from {
+    opacity: 0;
+    transform: translateX(-50%) scale(0.94);
+  }
+  to {
+    opacity: 1;
+    transform: translateX(-50%) scale(1);
+  }
+}
+@keyframes gl-tooltip-in-y {
+  from {
+    opacity: 0;
+    transform: translateY(-50%) scale(0.94);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(-50%) scale(1);
+  }
+}
+@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
+  .gl-tooltip {
+    background: rgba(255, 255, 255, 0.9);
+  }
+  [data-theme=dark] .gl-tooltip,
+  .gl-dark .gl-tooltip {
+    background: rgba(28, 28, 36, 0.94);
+  }
+}
+
+/* src/styles/index.css */
+/*# sourceMappingURL=styles.css.map */