@howssatoshi/quantumcss 1.7.3 → 1.7.4

package/dist/quantum.css

@@ -0,0 +1,2374 @@
+/* Quantum CSS JIT Output */
+:root {
+  --q-color-white: #ffffff;
+  --q-color-black: #000000;
+  --q-color-slate-50: #f8fafc;
+  --q-color-slate-100: #f1f5f9;
+  --q-color-slate-200: #e2e8f0;
+  --q-color-slate-300: #cbd5e1;
+  --q-color-slate-400: #94a3b8;
+  --q-color-slate-500: #64748b;
+  --q-color-slate-600: #475569;
+  --q-color-slate-700: #334155;
+  --q-color-slate-800: #1e293b;
+  --q-color-slate-900: #0f172a;
+  --q-color-slate-950: #020617;
+  --q-color-blue-50: #eff6ff;
+  --q-color-blue-100: #dbeafe;
+  --q-color-blue-200: #bfdbfe;
+  --q-color-blue-300: #93c5fd;
+  --q-color-blue-400: #60a5fa;
+  --q-color-blue-500: #3b82f6;
+  --q-color-blue-600: #2563eb;
+  --q-color-orange-50: #fff7ed;
+  --q-color-orange-100: #ffedd5;
+  --q-color-orange-200: #fed7aa;
+  --q-color-orange-300: #fdba74;
+  --q-color-orange-400: #fb923c;
+  --q-color-orange-500: #f97316;
+  --q-color-orange-600: #ea580c;
+  --q-color-red-500: #ef4444;
+  --q-color-green-100: #d1fae5;
+  --q-color-green-500: #10b981;
+  --q-color-purple-50: #faf5ff;
+  --q-color-purple-100: #f3e8ff;
+  --q-color-purple-200: #e9d5ff;
+  --q-color-purple-300: #d8b4fe;
+  --q-color-purple-400: #c084fc;
+  --q-color-purple-500: #a855f7;
+  --q-color-purple-600: #9333ea;
+  --q-color-purple-700: #7e22ce;
+  --q-color-yellow-50: #fefce8;
+  --q-color-yellow-100: #fef9c3;
+  --q-color-yellow-200: #fef08a;
+  --q-color-yellow-300: #fde047;
+  --q-color-yellow-400: #facc15;
+  --q-color-yellow-500: #eab308;
+  --q-color-yellow-600: #ca8a04;
+  --q-color-yellow-700: #a16207;
+  --q-color-pink-50: #fdf2f8;
+  --q-color-pink-100: #fce7f3;
+  --q-color-pink-200: #fbcfe8;
+  --q-color-pink-300: #f9a8d4;
+  --q-color-pink-400: #f472b6;
+  --q-color-pink-500: #ec4899;
+  --q-color-pink-600: #db2777;
+  --q-color-pink-700: #be185d;
+  --q-color-cyan-50: #ecfeff;
+  --q-color-cyan-100: #cffafe;
+  --q-color-cyan-200: #a5f3fc;
+  --q-color-cyan-300: #67e8f9;
+  --q-color-cyan-400: #22d3ee;
+  --q-color-cyan-500: #06b6d4;
+  --q-color-cyan-600: #0891b2;
+  --q-color-cyan-700: #0e7490;
+  --q-color-indigo-50: #eef2ff;
+  --q-color-indigo-100: #e0e7ff;
+  --q-color-indigo-200: #c7d2fe;
+  --q-color-indigo-300: #a5b4fc;
+  --q-color-indigo-400: #818cf8;
+  --q-color-indigo-500: #6366f1;
+  --q-color-indigo-600: #4f46e5;
+  --q-color-indigo-700: #4338ca;
+  --q-color-starlight-blue: #00d4ff;
+  --q-color-starlight-peach: #ffb38a;
+  --q-color-starlight-orange: #ff7e5f;
+  --q-color-starlight-deep: #08081a;
+  --q-color-transparent: transparent;
+  --q-color-primary-50: #eff6ff;
+  --q-color-primary-100: #dbeafe;
+  --q-color-primary-200: #bfdbfe;
+  --q-color-primary-300: #93c5fd;
+  --q-color-primary-400: #60a5fa;
+  --q-color-primary-500: #3b82f6;
+  --q-color-primary-600: #2563eb;
+  --q-color-primary-700: #1d4ed8;
+  --q-color-primary-800: #1e40af;
+  --q-color-primary-900: #1e3a8a;
+  --q-color-secondary-50: #f8fafc;
+  --q-color-secondary-100: #f1f5f9;
+  --q-color-secondary-200: #e2e8f0;
+  --q-color-secondary-300: #cbd5e1;
+  --q-color-secondary-400: #94a3b8;
+  --q-color-secondary-500: #64748b;
+  --q-color-secondary-600: #475569;
+  --q-color-secondary-700: #334155;
+  --q-color-secondary-800: #1e293b;
+  --q-color-secondary-900: #0f172a;
+  --q-color-success: #10b981;
+  --q-color-warning: #f59e0b;
+  --q-color-error: #ef4444;
+  --q-color-neutral: #6b7280;
+  --q-color-muted: var(--text-muted);
+  --q-color-starlight-blue: #00d4ff;
+  --q-color-starlight-peach: #ffb38a;
+  --q-color-starlight-orange: #ff7e5f;
+  --q-color-starlight-deep: #08081a;
+  --q-space-0: 0px;
+  --q-space-1: 0.25rem;
+  --q-space-2: 0.5rem;
+  --q-space-3: 0.75rem;
+  --q-space-4: 1rem;
+  --q-space-5: 1.25rem;
+  --q-space-6: 1.5rem;
+  --q-space-8: 2rem;
+  --q-space-10: 2.5rem;
+  --q-space-12: 3rem;
+  --q-space-14: 3.5rem;
+  --q-space-16: 4rem;
+  --q-space-20: 5rem;
+  --q-space-24: 6rem;
+  --q-space-32: 8rem;
+  --q-space-40: 10rem;
+  --q-space-48: 12rem;
+  --q-space-64: 16rem;
+  --q-space-128: 32rem;
+  --q-space-144: 36rem;
+  --q-space-px: 1px;
+  --q-radius-none: 0px;
+  --q-radius-sm: 0.125rem;
+  --q-radius-md: 0.375rem;
+  --q-radius-lg: 0.5rem;
+  --q-radius-xl: 0.75rem;
+  --q-radius-2xl: 1rem;
+  --q-radius-3xl: 1.5rem;
+  --q-radius-full: 9999px;
+  --q-shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
+  --q-shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
+  --q-shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
+  --q-shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
+  --q-shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / 0.25);
+  --q-size-xs: 0.75rem;
+  --q-size-sm: 0.875rem;
+  --q-size-base: 1rem;
+  --q-size-lg: 1.125rem;
+  --q-size-xl: 1.25rem;
+  --q-size-2xl: 1.5rem;
+  --q-size-3xl: 2rem;
+  --q-size-4xl: 2.5rem;
+  --q-size-5xl: 3rem;
+  --q-size-6xl: 4rem;
+  --q-max-w-xs: 20rem;
+  --q-max-w-sm: 24rem;
+  --q-max-w-md: 28rem;
+  --q-max-w-lg: 32rem;
+  --q-max-w-xl: 36rem;
+  --q-max-w-2xl: 42rem;
+  --q-max-w-3xl: 48rem;
+  --q-max-w-4xl: 56rem;
+  --q-max-w-5xl: 64rem;
+  --q-max-w-6xl: 72rem;
+  --q-max-w-7xl: 80rem;
+  --q-max-w-full: 100%;
+  --q-max-w-min: min-content;
+  --q-max-w-max: max-content;
+  --q-max-w-fit: fit-content;
+  --q-max-w-prose: 65ch;
+}
+
+.search-input {
+  padding-left: 3rem;
+  width: 100%;
+  height: 3rem;
+}
+
+.p-12 {
+  padding: 3rem;
+}
+
+.max-w-4xl {
+  max-width: 56rem;
+}
+
+.mx-auto {
+  margin-left: auto;
+  margin-right: auto;
+}
+
+.space-y-12 > * + * {
+  margin-top: 3rem;
+}
+
+.text-4xl {
+  font-size: 2.5rem;
+  line-height: 1.2;
+}
+
+.space-y-4 > * + * {
+  margin-top: 1rem;
+}
+
+.text-xl {
+  font-size: 1.25rem;
+  line-height: 1.2;
+}
+
+.flex {
+  display: flex;
+}
+
+.gap-4 {
+  gap: 1rem;
+}
+
+.btn-primary {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  transition: all 0.2s ease;
+  font-weight: 600;
+  border-radius: var(--q-radius-md);
+  border: none;
+  height: 3rem;
+  background: linear-gradient(135deg, var(--q-color-starlight-peach) 0%, var(--q-color-starlight-blue) 100%);
+  color: #000;
+  border-color: transparent;
+  box-shadow: 0 0 30px rgba(0, 212, 255, 0.2);
+  padding-left: 1.5rem;
+  padding-right: 1.5rem;
+  padding-left: 1.5rem;
+  padding-right: 1.5rem;
+  padding-top: 0.5rem;
+  padding-bottom: 0.5rem;
+  box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
+}
+
+.btn-primary:hover {
+  transform: scale(1.05);
+}
+
+.btn-primary:active {
+  transform: scale(0.95);
+}
+
+.btn-secondary {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  transition: all 0.2s ease;
+  font-weight: 600;
+  border-radius: var(--q-radius-md);
+  border: none;
+  height: 3rem;
+  background-color: rgba(255, 255, 255, 0.05);
+  backdrop-filter: blur(16px);
+  -webkit-backdrop-filter: blur(16px);
+  border-color: rgba(255, 255, 255, 0.1);
+  border-width: 1px;
+  border-style: solid;
+  padding-left: 1.5rem;
+  padding-right: 1.5rem;
+  padding-top: 0.5rem;
+  padding-bottom: 0.5rem;
+  box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
+}
+
+.btn-secondary:hover {
+  background-color: rgba(255, 255, 255, 0.1) !important;
+}
+
+.btn-secondary:active {
+  transform: scale(0.95);
+}
+
+.card-premium {
+  display: flex;
+  flex-direction: column;
+  align-items: stretch;
+  padding: var(--q-space-10);
+  overflow: hidden;
+  border-radius: var(--q-radius-lg);
+  transition: all 0.3s ease;
+  position: relative;
+  background-color: rgba(255, 255, 255, 0.05);
+  backdrop-filter: blur(16px);
+  -webkit-backdrop-filter: blur(16px);
+  border-color: rgba(255, 255, 255, 0.1);
+  border-width: 1px;
+  border-style: solid;
+  padding: 2rem;
+  box-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
+}
+
+.max-w-sm {
+  max-width: 24rem;
+}
+
+.text-2xl {
+  font-size: 1.5rem;
+  line-height: 1.2;
+}
+
+.mb-4 {
+  margin-bottom: 1rem;
+}
+
+.p-10 {
+  padding: 2.5rem;
+}
+
+.space-y-8 > * + * {
+  margin-top: 2rem;
+}
+
+.bg-black {
+  background-color: #000000 !important;
+}
+
+.text-white {
+  color: #ffffff !important;
+}
+
+.top-0 {
+  top: 0px;
+}
+
+.z-50 {
+  z-index: 50;
+}
+
+.glass {
+  background-color: rgba(255, 255, 255, 0.03);
+  backdrop-filter: blur(16px);
+  -webkit-backdrop-filter: blur(16px);
+  border-width: 1px;
+  border-style: solid;
+  border-color: rgba(255, 255, 255, 0.1);
+}
+
+.p-4 {
+  padding: 1rem;
+}
+
+.mb-8 {
+  margin-bottom: 2rem;
+}
+
+.ml-4 {
+  margin-left: 1rem;
+}
+
+.starlight-card {
+  display: flex;
+  flex-direction: column;
+  align-items: stretch;
+  padding: var(--q-space-10);
+  overflow: hidden;
+  border-radius: var(--q-radius-lg);
+  transition: all 0.3s ease;
+  position: relative;
+  background-color: rgba(255, 255, 255, 0.05);
+  backdrop-filter: blur(16px);
+  -webkit-backdrop-filter: blur(16px);
+  border-color: rgba(255, 255, 255, 0.03);
+  border-width: 1px;
+  border-style: solid;
+}
+
+.mt-8 {
+  margin-top: 2rem;
+}
+
+.grid {
+  display: grid;
+}
+
+.grid-cols-1 {
+  grid-template-columns: repeat(1, minmax(0, 1fr));
+}
+
+.input-starlight {
+  display: block;
+  width: 100%;
+  appearance: none;
+  transition: all 0.2s ease;
+  border-radius: var(--q-radius-md);
+  border: none;
+  line-height: 1.2;
+  height: 3rem;
+  background-color: rgba(255, 255, 255, 0.05);
+  backdrop-filter: blur(16px);
+  -webkit-backdrop-filter: blur(16px);
+  border-color: rgba(255, 255, 255, 0.03);
+  border-width: 1px;
+  border-style: solid;
+  padding-left: 1rem;
+  padding-right: 1rem;
+  border-color: rgba(255, 255, 255, 0.15);
+}
+
+.textarea-starlight {
+  display: block;
+  width: 100%;
+  appearance: none;
+  transition: all 0.2s ease;
+  border-radius: var(--q-radius-md);
+  border: none;
+  line-height: 1.2;
+  height: 3rem;
+  background-color: rgba(255, 255, 255, 0.05);
+  backdrop-filter: blur(16px);
+  -webkit-backdrop-filter: blur(16px);
+  border-color: rgba(255, 255, 255, 0.03);
+  border-width: 1px;
+  border-style: solid;
+  padding: 1rem;
+  min-height: 8rem;
+  border-color: rgba(255, 255, 255, 0.15);
+}
+
+.bg-green-500 {
+  background-color: #10b981 !important;
+}
+
+.mt-4 {
+  margin-top: 1rem;
+}
+
+.btn-starlight {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  transition: all 0.2s ease;
+  font-weight: 600;
+  border-radius: var(--q-radius-md);
+  border: none;
+  height: 3rem;
+  background: linear-gradient(135deg, var(--q-color-starlight-peach) 0%, var(--q-color-starlight-blue) 100%);
+  color: #000;
+  border-color: transparent;
+  box-shadow: 0 0 30px rgba(0, 212, 255, 0.2);
+  padding-left: 1.5rem;
+  padding-right: 1.5rem;
+}
+
+.p-8 {
+  padding: 2rem;
+}
+
+.min-h-screen {
+  min-height: screen;
+}
+
+.w-6 {
+  width: 1.5rem;
+}
+
+.h-6 {
+  height: 1.5rem;
+}
+
+.hidden {
+  display: none;
+}
+
+.max-w-144 {
+  max-width: 36rem;
+}
+
+.mb-20 {
+  margin-bottom: 5rem;
+}
+
+.pt-16 {
+  padding-top: 4rem;
+}
+
+.text-6xl {
+  font-size: 4rem;
+  line-height: 1.2;
+}
+
+.mb-6 {
+  margin-bottom: 1.5rem;
+}
+
+.text-gradient-starlight {
+  background: linear-gradient(to right, var(--q-color-starlight-peach), var(--q-color-starlight-blue));
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
+  display: inline-block;
+}
+
+.max-w-prose {
+  max-width: 65ch;
+}
+
+.mb-10 {
+  margin-bottom: 2.5rem;
+}
+
+.justify-center {
+  justify-content: center;
+}
+
+.gap-6 {
+  gap: 1.5rem;
+}
+
+.bg-starlight {
+  background: linear-gradient(135deg, var(--q-color-starlight-peach) 0%, var(--q-color-starlight-blue) 100%);
+}
+
+.text-black {
+  color: #000000 !important;
+}
+
+.px-10 {
+  padding-left: 2.5rem;
+  padding-right: 2.5rem;
+}
+
+.py-4 {
+  padding-top: 1rem;
+  padding-bottom: 1rem;
+}
+
+.rounded-full {
+  border-radius: 9999px;
+}
+
+.glow-blue {
+  box-shadow: 0 0 30px rgba(0, 212, 255, 0.25);
+}
+
+.scale-105 {
+  transform: scale(1.05);
+}
+
+.hover\:bg-white:hover {
+  background-color: #ffffff !important;
+}
+
+[hover~="bg-white"]:hover {
+  background-color: #ffffff !important;
+}
+
+.border-none {
+  border-width: 0;
+}
+
+.px-12 {
+  padding-left: 3rem;
+  padding-right: 3rem;
+}
+
+.border-2 {
+  border-width: 2px;
+  border-style: solid;
+}
+
+.border-solid {
+  border-style: solid;
+}
+
+.border-white {
+  border-color: #ffffff;
+}
+
+.text-sm {
+  font-size: 0.875rem;
+  line-height: 1.5;
+}
+
+.gap-10 {
+  gap: 2.5rem;
+}
+
+.rounded-2xl {
+  border-radius: 1rem;
+}
+
+.rounded-xl {
+  border-radius: 0.75rem;
+}
+
+.glow-peach {
+  box-shadow: 0 0 30px rgba(255, 179, 138, 0.25);
+}
+
+.w-full {
+  width: 100%;
+}
+
+.py-3 {
+  padding-top: 0.75rem;
+  padding-bottom: 0.75rem;
+}
+
+.bg-starlight-deep {
+  background-color: #08081a !important;
+}
+
+.rounded-3xl {
+  border-radius: 1.5rem;
+}
+
+.text-lg {
+  font-size: 1.125rem;
+  line-height: 1.5;
+}
+
+.flex-col {
+  flex-direction: column;
+}
+
+.px-6 {
+  padding-left: 1.5rem;
+  padding-right: 1.5rem;
+}
+
+.hover\:scale-105:hover {
+  transform: scale(1.05);
+}
+
+[hover~="scale-105"]:hover {
+  transform: scale(1.05);
+}
+
+.mt-32 {
+  margin-top: 8rem;
+}
+
+.pt-10 {
+  padding-top: 2.5rem;
+}
+
+.border-t {
+  border-width: 0;
+  border-top-width: 1px;
+  border-style: solid;
+}
+
+.border-slate-100 {
+  border-color: #f1f5f9;
+}
+
+.py-2 {
+  padding-top: 0.5rem;
+  padding-bottom: 0.5rem;
+}
+
+.bg-slate-50 {
+  background-color: #f8fafc !important;
+}
+
+.justify-between {
+  justify-content: space-between;
+}
+
+.items-center {
+  align-items: center;
+}
+
+.text-slate-500 {
+  color: #64748b !important;
+}
+
+.border-b {
+  border-width: 0;
+  border-bottom-width: 1px;
+  border-style: solid;
+}
+
+.border-slate-900 {
+  border-color: #0f172a;
+}
+
+.bg-white {
+  background-color: #ffffff !important;
+}
+
+.py-6 {
+  padding-top: 1.5rem;
+  padding-bottom: 1.5rem;
+}
+
+.text-primary {
+  color: #3b82f6 !important;
+}
+
+.text-blue-600 {
+  color: #2563eb !important;
+}
+
+.gap-8 {
+  gap: 2rem;
+}
+
+.text-xs {
+  font-size: 0.75rem;
+  line-height: 1.5;
+}
+
+.border-b-2 {
+  border-width: 0;
+  border-bottom-width: 2px;
+  border-style: solid;
+}
+
+.border-transparent {
+  border-color: transparent;
+}
+
+.hover\:border-blue-600:hover {
+  border-color: #2563eb;
+}
+
+[hover~="border-blue-600"]:hover {
+  border-color: #2563eb;
+}
+
+.transition-colors {
+  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
+}
+
+.w-10 {
+  width: 2.5rem;
+}
+
+.h-10 {
+  height: 2.5rem;
+}
+
+.hover\:bg-slate-100:hover {
+  background-color: #f1f5f9 !important;
+}
+
+[hover~="bg-slate-100"]:hover {
+  background-color: #f1f5f9 !important;
+}
+
+.bg-slate-900 {
+  background-color: #0f172a !important;
+}
+
+.rounded {
+  border-radius: 0.375rem;
+}
+
+.bg-blue-600 {
+  background-color: #2563eb !important;
+}
+
+.overflow-hidden {
+  overflow: hidden;
+}
+
+.inline-block {
+  display: inline-block;
+}
+
+.py-12 {
+  padding-top: 3rem;
+  padding-bottom: 3rem;
+}
+
+.px-3 {
+  padding-left: 0.75rem;
+  padding-right: 0.75rem;
+}
+
+.py-1 {
+  padding-top: 0.25rem;
+  padding-bottom: 0.25rem;
+}
+
+.text-5xl {
+  font-size: 3rem;
+  line-height: 1.2;
+}
+
+.text-slate-300 {
+  color: #cbd5e1 !important;
+}
+
+.max-w-2xl {
+  max-width: 42rem;
+}
+
+.gap-12 {
+  gap: 3rem;
+}
+
+.aspect-video {
+  aspect-ratio: 16 / 9;
+  width: 100%;
+  height: auto;
+}
+
+.bg-slate-100 {
+  background-color: #f1f5f9 !important;
+}
+
+.rounded-lg {
+  border-radius: 0.5rem;
+}
+
+.h-full {
+  height: 100%;
+}
+
+.group:hover .group-hover\:scale-105 {
+  transform: scale(1.05);
+}
+
+.group:hover [group-hover~="scale-105"] {
+  transform: scale(1.05);
+}
+
+.transition-transform {
+  transition-property: transform;
+}
+
+.pb-2 {
+  padding-bottom: 0.5rem;
+}
+
+.space-y-6 > * + * {
+  margin-top: 1.5rem;
+}
+
+.items-start {
+  align-items: flex-start;
+}
+
+.text-slate-100 {
+  color: #f1f5f9 !important;
+}
+
+.group:hover .group-hover\:text-blue-100 {
+  color: #dbeafe !important;
+}
+
+.group:hover [group-hover~="text-blue-100"] {
+  color: #dbeafe !important;
+}
+
+.group:hover .group-hover\:text-blue-600 {
+  color: #2563eb !important;
+}
+
+.group:hover [group-hover~="text-blue-600"] {
+  color: #2563eb !important;
+}
+
+.text-slate-400 {
+  color: #94a3b8 !important;
+}
+
+.mt-1 {
+  margin-top: 0.25rem;
+}
+
+.p-6 {
+  padding: 1.5rem;
+}
+
+.border-slate-200 {
+  border-color: #e2e8f0;
+}
+
+.p-3 {
+  padding: 0.75rem;
+}
+
+.focus\:border-blue-600:focus {
+  border-color: #2563eb;
+}
+
+[focus~="border-blue-600"]:focus {
+  border-color: #2563eb;
+}
+
+.py-20 {
+  padding-top: 5rem;
+  padding-bottom: 5rem;
+}
+
+.mt-24 {
+  margin-top: 6rem;
+}
+
+.pb-16 {
+  padding-bottom: 4rem;
+}
+
+.col-span-1 {
+  grid-column: span 1 / span 1;
+}
+
+.text-3xl {
+  font-size: 2rem;
+  line-height: 1.2;
+}
+
+.max-w-md {
+  max-width: 28rem;
+}
+
+.space-y-3 > * + * {
+  margin-top: 0.75rem;
+}
+
+.p-0 {
+  padding: 0px;
+}
+
+.hover\:text-blue-600:hover {
+  color: #2563eb !important;
+}
+
+[hover~="text-blue-600"]:hover {
+  color: #2563eb !important;
+}
+
+.pt-12 {
+  padding-top: 3rem;
+}
+
+.text-slate-600 {
+  color: #475569 !important;
+}
+
+.w-5 {
+  width: 1.25rem;
+}
+
+.h-5 {
+  height: 1.25rem;
+}
+
+.w-8 {
+  width: 2rem;
+}
+
+.h-8 {
+  height: 2rem;
+}
+
+.w-7 {
+  width: 1.75rem;
+}
+
+.h-7 {
+  height: 1.75rem;
+}
+
+.max-w-6xl {
+  max-width: 72rem;
+}
+
+.mb-12 {
+  margin-bottom: 3rem;
+}
+
+.mb-2 {
+  margin-bottom: 0.5rem;
+}
+
+.w-24 {
+  width: 6rem;
+}
+
+.text-base {
+  font-size: 1rem;
+  line-height: 1.5;
+}
+
+.w-20 {
+  width: 5rem;
+}
+
+.h-20 {
+  height: 5rem;
+}
+
+.bg-blue-100 {
+  background-color: #dbeafe !important;
+}
+
+.border-blue-200 {
+  border-color: #bfdbfe;
+}
+
+.w-32 {
+  width: 8rem;
+}
+
+.h-32 {
+  height: 8rem;
+}
+
+.w-16 {
+  width: 4rem;
+}
+
+.h-16 {
+  height: 4rem;
+}
+
+.bg-blue-500 {
+  background-color: #3b82f6 !important;
+}
+
+.bg-orange-500 {
+  background-color: #f97316 !important;
+}
+
+.relative {
+  position: relative;
+}
+
+.h-48 {
+  height: 12rem;
+}
+
+.absolute {
+  position: absolute;
+}
+
+.w-4 {
+  width: 1rem;
+}
+
+.h-4 {
+  height: 1rem;
+}
+
+.bg-black_20 {
+  background-color: rgba(0, 0, 0, 0.2) !important;
+}
+
+.btn-base {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  transition: all 0.2s ease;
+  font-weight: 600;
+  border-radius: var(--q-radius-md);
+  border: none;
+  height: 3rem;
+}
+
+.input-base {
+  display: block;
+  width: 100%;
+  appearance: none;
+  transition: all 0.2s ease;
+  border-radius: var(--q-radius-md);
+  border: none;
+  line-height: 1.2;
+  height: 3rem;
+}
+
+.border-white_5 {
+  border-color: rgba(255, 255, 255, 0.05);
+}
+
+.bg-white_5 {
+  background-color: rgba(255, 255, 255, 0.05) !important;
+}
+
+.starlight-nav {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  width: 100%;
+  min-width: 100%;
+  position: sticky;
+  top: 0;
+  left: 0;
+  right: 0;
+  z-index: 1000;
+  background-color: rgba(255, 255, 255, 0.05);
+  backdrop-filter: blur(16px);
+  -webkit-backdrop-filter: blur(16px);
+  border-color: rgba(255, 255, 255, 0.03);
+  border-width: 1px;
+  border-style: solid;
+}
+
+.ml-auto {
+  margin-left: auto;
+}
+
+html[data-theme="light"] .light\:bg-slate-300, body.light-mode .light\:bg-slate-300 {
+  background-color: #cbd5e1 !important;
+}
+
+html[data-theme="light"] [light~="bg-slate-300"], body.light-mode [light~="bg-slate-300"] {
+  background-color: #cbd5e1 !important;
+}
+
+.h-\[400px\] {
+  height: 400px;
+}
+
+.border-r {
+  border-width: 0;
+  border-right-width: 1px;
+  border-style: solid;
+}
+
+.border-white_10 {
+  border-color: rgba(255, 255, 255, 0.1);
+}
+
+.block {
+  display: block;
+}
+
+.flex-1 {
+  flex: 1 1 0%;
+}
+
+.starlight-search {
+  position: relative;
+  display: block;
+  width: 100%;
+  height: 3rem;
+  background-color: rgba(255, 255, 255, 0.05);
+  backdrop-filter: blur(16px);
+  -webkit-backdrop-filter: blur(16px);
+  border-color: rgba(255, 255, 255, 0.03);
+  border-width: 1px;
+  border-style: solid;
+  border-radius: 0.75rem;
+}
+
+.search-icon {
+  position: absolute;
+  left: 1rem;
+  top: 1_2;
+  pointer-events: none;
+  z-index: 10;
+  width: 1.25rem;
+  height: 1.25rem;
+}
+
+.text-muted {
+  color: var(--text-muted) !important;
+}
+
+.starlight-dashboard {
+  display: grid;
+  grid-template-columns: repeat(1, minmax(0, 1fr));
+  gap: 2rem;
+}
+
+html[data-theme="light"] .light\:shadow-lg, body.light-mode .light\:shadow-lg {
+  box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
+}
+
+html[data-theme="light"] [light~="shadow-lg"], body.light-mode [light~="shadow-lg"] {
+  box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
+}
+
+.w-2 {
+  width: 0.5rem;
+}
+
+.h-2 {
+  height: 0.5rem;
+}
+
+.bg-success {
+  background-color: #10b981 !important;
+}
+
+.mr-1 {
+  margin-right: 0.25rem;
+}
+
+.starlight-gallery {
+  display: grid;
+  grid-template-columns: repeat(1, minmax(0, 1fr));
+  gap: 1rem;
+}
+
+.starlight-form {
+  display: flex;
+  flex-direction: column;
+  align-items: stretch;
+  padding: var(--q-space-10);
+  overflow: hidden;
+  border-radius: var(--q-radius-lg);
+  transition: all 0.3s ease;
+  position: relative;
+  background-color: rgba(255, 255, 255, 0.05);
+  backdrop-filter: blur(16px);
+  -webkit-backdrop-filter: blur(16px);
+  border-color: rgba(255, 255, 255, 0.03);
+  border-width: 1px;
+  border-style: solid;
+  display: grid;
+  grid-template-columns: repeat(1, minmax(0, 1fr));
+  gap: 2rem;
+  align-items: flex-start;
+}
+
+.form-row {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  gap: 1rem;
+}
+
+.mt-auto {
+  margin-top: auto;
+}
+
+.dialog-base {
+  display: flex;
+  flex-direction: column;
+  align-items: stretch;
+  padding: var(--q-space-10);
+  overflow-y: auto;
+  border-radius: var(--q-radius-xl);
+  position: relative;
+}
+
+.theme-glass-dark {
+  background-color: rgba(255, 255, 255, 0.05);
+  backdrop-filter: blur(16px);
+  -webkit-backdrop-filter: blur(16px);
+  border-color: rgba(255, 255, 255, 0.03);
+  border-width: 1px;
+  border-style: solid;
+}
+
+.pt-4 {
+  padding-top: 1rem;
+}
+
+.pl-5 {
+  padding-left: 1.25rem;
+}
+
+.mt-20 {
+  margin-top: 5rem;
+}
+
+.starlight-dialog {
+  display: flex;
+  flex-direction: column;
+  align-items: stretch;
+  padding: var(--q-space-10);
+  overflow-y: auto;
+  border-radius: var(--q-radius-xl);
+  position: relative;
+  position: fixed;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  max-width: 90vw;
+  max-height: 90vh;
+  z-index: 2000;
+  background-color: rgba(255, 255, 255, 0.05);
+  backdrop-filter: blur(16px);
+  -webkit-backdrop-filter: blur(16px);
+  border-color: rgba(255, 255, 255, 0.03);
+  border-width: 1px;
+  border-style: solid;
+  background-color: rgba(8, 8, 26, 0.4) !important;
+  backdrop-filter: blur(24px) !important;
+  -webkit-backdrop-filter: blur(24px) !important;
+}
+
+.dialog-close {
+  position: absolute;
+  top: 1.5rem;
+  right: 1.5rem;
+  width: 2rem;
+  height: 2rem;
+  border-radius: 50%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+}
+
+.text-success {
+  color: #10b981 !important;
+}
+
+.h-14 {
+  height: 3.5rem;
+}
+
+.grid-cols-2 {
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+}
+
+.gap-3 {
+  gap: 0.75rem;
+}
+
+.badge-base {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 0.75rem;
+  font-weight: 600;
+  text-transform: uppercase;
+  letter-spacing: 0.05em;
+  border-radius: var(--q-radius-sm);
+  border: none;
+}
+
+.bg-starlight-blue_10 {
+  background-color: rgba(0, 212, 255, 0.1) !important;
+}
+
+.text-starlight-blue {
+  color: #00d4ff !important;
+}
+
+.border-starlight-blue_20 {
+  border-color: rgba(0, 212, 255, 0.2);
+}
+
+.px-4 {
+  padding-left: 1rem;
+  padding-right: 1rem;
+}
+
+.pt-8 {
+  padding-top: 2rem;
+}
+
+.pb-12 {
+  padding-bottom: 3rem;
+}
+
+.max-w-3xl {
+  max-width: 48rem;
+}
+
+.h-40 {
+  height: 10rem;
+}
+
+.bg-gradient-to-br {
+  --q-gradient-from-transparent: rgba(0,0,0,0);
+  --q-gradient-to-transparent: rgba(0,0,0,0);
+  background-image: linear-gradient(to bottom right, var(--q-gradient-stops)) !important;
+  --q-gradient-stops: var(--q-gradient-from, var(--q-gradient-from-transparent)), var(--q-gradient-to, var(--q-gradient-to-transparent));
+}
+
+.from-blue-500_20 {
+  --q-gradient-from: rgba(59, 130, 246, 0.2);
+  --q-gradient-to: rgba(59, 130, 246, 0);
+  --q-gradient-from-transparent: rgba(59, 130, 246, 0);
+  --q-gradient-stops: var(--q-gradient-from), var(--q-gradient-to);
+}
+
+.to-purple-500_20 {
+  --q-gradient-to: rgba(168, 85, 247, 0.2);
+}
+
+.to-blue-500_20 {
+  --q-gradient-to: rgba(59, 130, 246, 0.2);
+}
+
+.from-purple-500_20 {
+  --q-gradient-from: rgba(168, 85, 247, 0.2);
+  --q-gradient-to: rgba(168, 85, 247, 0);
+  --q-gradient-from-transparent: rgba(168, 85, 247, 0);
+  --q-gradient-stops: var(--q-gradient-from), var(--q-gradient-to);
+}
+
+.to-pink-500_20 {
+  --q-gradient-to: rgba(236, 72, 153, 0.2);
+}
+
+.from-orange-500_20 {
+  --q-gradient-from: rgba(249, 115, 22, 0.2);
+  --q-gradient-to: rgba(249, 115, 22, 0);
+  --q-gradient-from-transparent: rgba(249, 115, 22, 0);
+  --q-gradient-stops: var(--q-gradient-from), var(--q-gradient-to);
+}
+
+.to-red-500_20 {
+  --q-gradient-to: rgba(239, 68, 68, 0.2);
+}
+
+.from-green-500_20 {
+  --q-gradient-from: rgba(16, 185, 129, 0.2);
+  --q-gradient-to: rgba(16, 185, 129, 0);
+  --q-gradient-from-transparent: rgba(16, 185, 129, 0);
+  --q-gradient-stops: var(--q-gradient-from), var(--q-gradient-to);
+}
+
+.from-cyan-500_20 {
+  --q-gradient-from: rgba(6, 182, 212, 0.2);
+  --q-gradient-to: rgba(6, 182, 212, 0);
+  --q-gradient-from-transparent: rgba(6, 182, 212, 0);
+  --q-gradient-stops: var(--q-gradient-from), var(--q-gradient-to);
+}
+
+.from-indigo-500_20 {
+  --q-gradient-from: rgba(99, 102, 241, 0.2);
+  --q-gradient-to: rgba(99, 102, 241, 0);
+  --q-gradient-from-transparent: rgba(99, 102, 241, 0);
+  --q-gradient-stops: var(--q-gradient-from), var(--q-gradient-to);
+}
+
+.to-orange-500_20 {
+  --q-gradient-to: rgba(249, 115, 22, 0.2);
+}
+
+.from-pink-500_20 {
+  --q-gradient-from: rgba(236, 72, 153, 0.2);
+  --q-gradient-to: rgba(236, 72, 153, 0);
+  --q-gradient-from-transparent: rgba(236, 72, 153, 0);
+  --q-gradient-stops: var(--q-gradient-from), var(--q-gradient-to);
+}
+
+.to-cyan-500_20 {
+  --q-gradient-to: rgba(6, 182, 212, 0.2);
+}
+
+.from-red-500_20 {
+  --q-gradient-from: rgba(239, 68, 68, 0.2);
+  --q-gradient-to: rgba(239, 68, 68, 0);
+  --q-gradient-from-transparent: rgba(239, 68, 68, 0);
+  --q-gradient-stops: var(--q-gradient-from), var(--q-gradient-to);
+}
+
+.checkbox-starlight {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  transition: all 0.2s ease;
+  font-weight: 600;
+  border-radius: var(--q-radius-md);
+  border: none;
+  height: 3rem;
+  background-color: rgba(255, 255, 255, 0.05);
+  backdrop-filter: blur(16px);
+  -webkit-backdrop-filter: blur(16px);
+  border-color: rgba(255, 255, 255, 0.03);
+  border-width: 1px;
+  border-style: solid;
+  width: 1.25rem;
+  height: 1.25rem;
+  border-color: rgba(255, 255, 255, 0.2);
+}
+
+.mt-6 {
+  margin-top: 1.5rem;
+}
+
+.w-3_4 {
+  width: 75.00%;
+}
+
+.h-12 {
+  height: 3rem;
+}
+
+.w-1_2 {
+  width: 50.00%;
+}
+
+.px-8 {
+  padding-left: 2rem;
+  padding-right: 2rem;
+}
+
+.shadow-2xl {
+  box-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);
+}
+
+.text-transparent {
+  color: transparent !important;
+}
+
+.bg-clip-text {
+  background-clip: text;
+  -webkit-background-clip: text;
+}
+
+.bg-gradient-to-r {
+  --q-gradient-from-transparent: rgba(0,0,0,0);
+  --q-gradient-to-transparent: rgba(0,0,0,0);
+  background-image: linear-gradient(to right, var(--q-gradient-stops)) !important;
+  --q-gradient-stops: var(--q-gradient-from, var(--q-gradient-from-transparent)), var(--q-gradient-to, var(--q-gradient-to-transparent));
+}
+
+.from-starlight-orange {
+  --q-gradient-from: rgba(255, 126, 95, 1);
+  --q-gradient-to: rgba(255, 126, 95, 0);
+  --q-gradient-from-transparent: rgba(255, 126, 95, 0);
+  --q-gradient-stops: var(--q-gradient-from), var(--q-gradient-to);
+}
+
+.to-starlight-peach {
+  --q-gradient-to: rgba(255, 179, 138, 1);
+}
+
+.border-starlight-blue_30 {
+  border-color: rgba(0, 212, 255, 0.3);
+}
+
+.border-4 {
+  border-width: 4px;
+  border-style: solid;
+}
+
+.border-red-500_50 {
+  border-color: rgba(239, 68, 68, 0.5);
+}
+
+.svg-fluid {
+  width: 100%;
+  height: auto;
+  max-width: 100%;
+  display: block;
+}
+
+.overlay-base {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+}
+
+.pointer-events-none {
+  pointer-events: none;
+}
+
+.overlay-top-left {
+  position: absolute;
+  top: 0;
+  left: 0;
+}
+
+.bg-black_50 {
+  background-color: rgba(0, 0, 0, 0.5) !important;
+}
+
+.overlay-bottom-right {
+  position: absolute;
+  bottom: 0;
+  right: 0;
+}
+
+.focus-glow-purple-500:focus {
+  outline: none !important;
+  box-shadow: 0 0 0 4px rgba(168, 85, 247, 0.4), 0 0 35px rgba(168, 85, 247, 0.7) !important;
+}
+
+.focus-glow-purple-500:active {
+  outline: none !important;
+  box-shadow: 0 0 0 4px rgba(168, 85, 247, 0.4), 0 0 35px rgba(168, 85, 247, 0.7) !important;
+}
+
+.focus-glow-orange-500:focus {
+  outline: none !important;
+  box-shadow: 0 0 0 4px rgba(249, 115, 22, 0.4), 0 0 35px rgba(249, 115, 22, 0.7) !important;
+}
+
+.focus-glow-orange-500:active {
+  outline: none !important;
+  box-shadow: 0 0 0 4px rgba(249, 115, 22, 0.4), 0 0 35px rgba(249, 115, 22, 0.7) !important;
+}
+
+.focus-glow:focus {
+  outline: none !important;
+  box-shadow: 0 0 0 4px rgba(0, 212, 255, 0.4), 0 0 35px rgba(0, 212, 255, 0.7) !important;
+}
+
+.mb-3 {
+  margin-bottom: 0.75rem;
+}
+
+.mr-8 {
+  margin-right: 2rem;
+}
+
+.py-2\.5 {
+  padding-top: 0.625rem;
+  padding-bottom: 0.625rem;
+}
+
+.max-w-\[1200px\] {
+  max-width: 1200px;
+}
+
+.hover\:bg-starlight:hover {
+  background: linear-gradient(135deg, var(--q-color-starlight-peach) 0%, var(--q-color-starlight-blue) 100%);
+}
+
+[hover~="bg-starlight"]:hover {
+  background: linear-gradient(135deg, var(--q-color-starlight-peach) 0%, var(--q-color-starlight-blue) 100%);
+}
+
+.shadow-lg {
+  box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
+}
+
+.py-24 {
+  padding-top: 6rem;
+  padding-bottom: 6rem;
+}
+
+.items-end {
+  align-items: flex-end;
+}
+
+.pb-1 {
+  padding-bottom: 0.25rem;
+}
+
+.hover\:text-white:hover {
+  color: #ffffff !important;
+}
+
+[hover~="text-white"]:hover {
+  color: #ffffff !important;
+}
+
+.duration-500 {
+  transition-duration: 500ms;
+}
+
+.gap-2 {
+  gap: 0.5rem;
+}
+
+.mb-32 {
+  margin-bottom: 8rem;
+}
+
+.p-16 {
+  padding: 4rem;
+}
+
+.mb-16 {
+  margin-bottom: 4rem;
+}
+
+.col-span-2 {
+  grid-column: span 2 / span 2;
+}
+
+.to-blue-500 {
+  --q-gradient-to: rgba(59, 130, 246, 1);
+}
+
+.space-y-1 > * + * {
+  margin-top: 0.25rem;
+}
+
+.pt-6 {
+  padding-top: 1.5rem;
+}
+
+.w-3 {
+  width: 0.75rem;
+}
+
+.h-3 {
+  height: 0.75rem;
+}
+
+.bg-red-500 {
+  background-color: #ef4444 !important;
+}
+
+.top-bar {
+  top: bar;
+}
+
+.mb-1 {
+  margin-bottom: 0.25rem;
+}
+
+.mt-2 {
+  margin-top: 0.5rem;
+}
+
+.hover\:bg-white_10:hover {
+  background-color: rgba(255, 255, 255, 0.1) !important;
+}
+
+[hover~="bg-white_10"]:hover {
+  background-color: rgba(255, 255, 255, 0.1) !important;
+}
+
+.bg-red-500_20 {
+  background-color: rgba(239, 68, 68, 0.2) !important;
+}
+
+.bg-green-500_20 {
+  background-color: rgba(16, 185, 129, 0.2) !important;
+}
+
+.left-0 {
+  left: 0px;
+}
+
+.z-0 {
+  z-index: 0;
+}
+
+.from-primary {
+  --q-gradient-from: rgba(59, 130, 246, 1);
+  --q-gradient-to: rgba(59, 130, 246, 0);
+  --q-gradient-from-transparent: rgba(59, 130, 246, 0);
+  --q-gradient-stops: var(--q-gradient-from), var(--q-gradient-to);
+}
+
+.h-24 {
+  height: 6rem;
+}
+
+.hover\:text-primary:hover {
+  color: #3b82f6 !important;
+}
+
+[hover~="text-primary"]:hover {
+  color: #3b82f6 !important;
+}
+
+.gap-16 {
+  gap: 4rem;
+}
+
+.space-y-16 > * + * {
+  margin-top: 4rem;
+}
+
+.text-secondary {
+  color: #64748b !important;
+}
+
+.w-12 {
+  width: 3rem;
+}
+
+.border-primary_30 {
+  border-color: rgba(59, 130, 246, 0.3);
+}
+
+.p-1 {
+  padding: 0.25rem;
+}
+
+.bg-black_40 {
+  background-color: rgba(0, 0, 0, 0.4) !important;
+}
+
+.max-w-none {
+  max-width: none;
+}
+
+.space-y-10 > * + * {
+  margin-top: 2.5rem;
+}
+
+.border-primary {
+  border-color: #3b82f6;
+}
+
+.bg-primary_5 {
+  background-color: rgba(59, 130, 246, 0.05) !important;
+}
+
+.bg-yellow-500 {
+  background-color: #eab308 !important;
+}
+
+.mt-12 {
+  margin-top: 3rem;
+}
+
+.mr-2 {
+  margin-right: 0.5rem;
+}
+
+.hover\:bg-white_5:hover {
+  background-color: rgba(255, 255, 255, 0.05) !important;
+}
+
+[hover~="bg-white_5"]:hover {
+  background-color: rgba(255, 255, 255, 0.05) !important;
+}
+
+.group:hover .group-hover\:text-primary {
+  color: #3b82f6 !important;
+}
+
+.group:hover [group-hover~="text-primary"] {
+  color: #3b82f6 !important;
+}
+
+.backdrop-blur-md {
+  backdrop-filter: blur(12px);
+  -webkit-backdrop-filter: blur(12px);
+}
+
+.bottom-section {
+  bottom: section;
+}
+
+.top-nav {
+  top: nav;
+}
+
+.top-nav-actions {
+  top: nav-actions;
+}
+
+.space-x-12 > * + * {
+  margin-left: 3rem;
+}
+
+.hover\:text-starlight-blue:hover {
+  color: #00d4ff !important;
+}
+
+[hover~="text-starlight-blue"]:hover {
+  color: #00d4ff !important;
+}
+
+.py-16 {
+  padding-top: 4rem;
+  padding-bottom: 4rem;
+}
+
+.py-1\.5 {
+  padding-top: 0.375rem;
+  padding-bottom: 0.375rem;
+}
+
+.rounded-\[2\.5rem\] {
+  border-radius: 2.5rem;
+}
+
+.max-w-5xl {
+  max-width: 64rem;
+}
+
+.bg-transparent {
+  background-color: transparent;
+}
+
+.placeholder\:text-white_10:placeholder {
+  color: rgba(255, 255, 255, 0.1) !important;
+}
+
+[placeholder~="text-white_10"] {
+  color: rgba(255, 255, 255, 0.1) !important;
+}
+
+.border-l {
+  border-width: 0;
+  border-left-width: 1px;
+  border-style: solid;
+}
+
+.px-16 {
+  padding-left: 4rem;
+  padding-right: 4rem;
+}
+
+.h-auto {
+  height: auto;
+}
+
+.hover\:glow-blue:hover {
+  box-shadow: 0 0 30px rgba(0, 212, 255, 0.25);
+}
+
+[hover~="glow-blue"]:hover {
+  box-shadow: 0 0 30px rgba(0, 212, 255, 0.25);
+}
+
+.text-orange-600 {
+  color: #ea580c !important;
+}
+
+.hover\:border-starlight-blue_30:hover {
+  border-color: rgba(0, 212, 255, 0.3);
+}
+
+[hover~="border-starlight-blue_30"]:hover {
+  border-color: rgba(0, 212, 255, 0.3);
+}
+
+.transition-all {
+  transition-property: all;
+}
+
+.h-80 {
+  height: 20rem;
+}
+
+.group:hover .group-hover\:scale-110 {
+  transform: scale(1.1);
+}
+
+.group:hover [group-hover~="scale-110"] {
+  transform: scale(1.1);
+}
+
+.duration-700 {
+  transition-duration: 700ms;
+}
+
+.bg-gradient-to-t {
+  --q-gradient-from-transparent: rgba(0,0,0,0);
+  --q-gradient-to-transparent: rgba(0,0,0,0);
+  background-image: linear-gradient(to top, var(--q-gradient-stops)) !important;
+  --q-gradient-stops: var(--q-gradient-from, var(--q-gradient-from-transparent)), var(--q-gradient-to, var(--q-gradient-to-transparent));
+}
+
+.from-black_90 {
+  --q-gradient-from: rgba(0, 0, 0, 0.9);
+  --q-gradient-to: rgba(0, 0, 0, 0);
+  --q-gradient-from-transparent: rgba(0, 0, 0, 0);
+  --q-gradient-stops: var(--q-gradient-from), var(--q-gradient-to);
+}
+
+.via-black_20 {
+  --q-gradient-to: rgba(0, 0, 0, 0);
+  --q-gradient-to-transparent: rgba(0, 0, 0, 0);
+  --q-gradient-stops: var(--q-gradient-from), rgba(0, 0, 0, 0.2), var(--q-gradient-to);
+}
+
+.to-transparent {
+  --q-gradient-to: rgba(0,0,0,0);
+}
+
+.z-10 {
+  z-index: 10;
+}
+
+.bottom-8 {
+  bottom: 2rem;
+}
+
+.left-8 {
+  left: 2rem;
+}
+
+.z-20 {
+  z-index: 20;
+}
+
+.bg-blue-600_20 {
+  background-color: rgba(37, 99, 235, 0.2) !important;
+}
+
+.ml-2 {
+  margin-left: 0.5rem;
+}
+
+.hover\:text-black:hover {
+  color: #000000 !important;
+}
+
+[hover~="text-black"]:hover {
+  color: #000000 !important;
+}
+
+.bg-orange-600_20 {
+  background-color: rgba(234, 88, 12, 0.2) !important;
+}
+
+.rounded-\[3rem\] {
+  border-radius: 3rem;
+}
+
+.from-starlight-blue_5 {
+  --q-gradient-from: rgba(0, 212, 255, 0.05);
+  --q-gradient-to: rgba(0, 212, 255, 0);
+  --q-gradient-from-transparent: rgba(0, 212, 255, 0);
+  --q-gradient-stops: var(--q-gradient-from), var(--q-gradient-to);
+}
+
+.max-w-xl {
+  max-width: 36rem;
+}
+
+.placeholder\:text-white_20:placeholder {
+  color: rgba(255, 255, 255, 0.2) !important;
+}
+
+[placeholder~="text-white_20"] {
+  color: rgba(255, 255, 255, 0.2) !important;
+}
+
+.space-x-6 > * + * {
+  margin-left: 1.5rem;
+}
+
+.bg-white_80 {
+  background-color: rgba(255, 255, 255, 0.8) !important;
+}
+
+.max-w-\[1440px\] {
+  max-width: 1440px;
+}
+
+.text-slate-900 {
+  color: #0f172a !important;
+}
+
+.hover\:text-orange-600:hover {
+  color: #ea580c !important;
+}
+
+[hover~="text-orange-600"]:hover {
+  color: #ea580c !important;
+}
+
+.hover\:bg-slate-200:hover {
+  background-color: #e2e8f0 !important;
+}
+
+[hover~="bg-slate-200"]:hover {
+  background-color: #e2e8f0 !important;
+}
+
+.-top-1 {
+  top: 0.25rem;
+}
+
+.-right-1 {
+  right: -0.25rem;
+}
+
+.bg-orange-600 {
+  background-color: #ea580c !important;
+}
+
+.min-w-56 {
+  min-width: 14rem;
+}
+
+.flex-shrink-0 {
+  flex-shrink: 0;
+}
+
+.space-x-4 > * + * {
+  margin-left: 1rem;
+}
+
+.group:hover .group-hover\:text-slate-900 {
+  color: #0f172a !important;
+}
+
+.group:hover [group-hover~="text-slate-900"] {
+  color: #0f172a !important;
+}
+
+.min-w-0 {
+  min-width: 0;
+}
+
+.gap-x-8 {
+  column-gap: 2rem;
+}
+
+.gap-y-16 {
+  row-gap: 4rem;
+}
+
+.aspect-\[3/4\] {
+  aspect-ratio: 3/4;
+  width: 100%;
+  height: auto;
+}
+
+.top-4 {
+  top: 1rem;
+}
+
+.left-4 {
+  left: 1rem;
+}
+
+.space-y-2 > * + * {
+  margin-top: 0.5rem;
+}
+
+.bottom-4 {
+  bottom: 1rem;
+}
+
+.duration-300 {
+  transition-duration: 300ms;
+}
+
+.px-1 {
+  padding-left: 0.25rem;
+  padding-right: 0.25rem;
+}
+
+.bg-slate-900_80 {
+  background-color: rgba(15, 23, 42, 0.8) !important;
+}
+
+.shadow-sm {
+  box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
+}
+
+.hover\:text-slate-900:hover {
+  color: #0f172a !important;
+}
+
+[hover~="text-slate-900"]:hover {
+  color: #0f172a !important;
+}
+
+.text-slate-200 {
+  color: #e2e8f0 !important;
+}
+
+.bg-slate-950 {
+  background-color: #020617 !important;
+}
+
+.placeholder\:text-slate-600:placeholder {
+  color: #475569 !important;
+}
+
+[placeholder~="text-slate-600"] {
+  color: #475569 !important;
+}
+
+@media (min-width: 640px) {
+  .starlight-gallery {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+  }
+  
+  .sm\:flex-row {
+    flex-direction: row;
+  }
+  
+  [sm~="flex-row"] {
+    flex-direction: row;
+  }
+}
+
+@media (min-width: 768px) {
+  .md__flex {
+    display: flex;
+  }
+  
+  [md~="flex"] {
+    display: flex;
+  }
+  
+  .md__gap-4 {
+    gap: 1rem;
+  }
+  
+  [md~="gap-4"] {
+    gap: 1rem;
+  }
+  
+  .md\:grid-cols-2 {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+  }
+  
+  [md~="grid-cols-2"] {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+  }
+  
+  .md\:flex-row {
+    flex-direction: row;
+  }
+  
+  [md~="flex-row"] {
+    flex-direction: row;
+  }
+  
+  .md\:w-80 {
+    width: 20rem;
+  }
+  
+  [md~="w-80"] {
+    width: 20rem;
+  }
+  
+  .md\:grid-cols-4 {
+    grid-template-columns: repeat(4, minmax(0, 1fr));
+  }
+  
+  [md~="grid-cols-4"] {
+    grid-template-columns: repeat(4, minmax(0, 1fr));
+  }
+  
+  .md\:col-span-2 {
+    grid-column: span 2 / span 2;
+  }
+  
+  [md~="col-span-2"] {
+    grid-column: span 2 / span 2;
+  }
+  
+  .md\:grid-cols-3 {
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+  }
+  
+  [md~="grid-cols-3"] {
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+  }
+  
+  .starlight-dashboard {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+  }
+  
+  .starlight-form {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+  }
+  
+  .md\:px-8 {
+    padding-left: 2rem;
+    padding-right: 2rem;
+  }
+  
+  [md~="px-8"] {
+    padding-left: 2rem;
+    padding-right: 2rem;
+  }
+  
+  .md\:hidden {
+    display: none;
+  }
+  
+  [md~="hidden"] {
+    display: none;
+  }
+  
+  .md\:w-96 {
+    width: 24rem;
+  }
+  
+  [md~="w-96"] {
+    width: 24rem;
+  }
+  
+  .md\:col-span-1 {
+    grid-column: span 1 / span 1;
+  }
+  
+  [md~="col-span-1"] {
+    grid-column: span 1 / span 1;
+  }
+  
+  .md\:flex {
+    display: flex;
+  }
+  
+  .md\:block {
+    display: block;
+  }
+  
+  [md~="block"] {
+    display: block;
+  }
+  
+  .md\:h-full {
+    height: 100%;
+  }
+  
+  [md~="h-full"] {
+    height: 100%;
+  }
+}
+
+@media (min-width: 1024px) {
+  .lg\:grid-cols-12 {
+    grid-template-columns: repeat(12, minmax(0, 1fr));
+  }
+  
+  [lg~="grid-cols-12"] {
+    grid-template-columns: repeat(12, minmax(0, 1fr));
+  }
+  
+  .starlight-dashboard {
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+  }
+  
+  .starlight-gallery {
+    grid-template-columns: repeat(4, minmax(0, 1fr));
+  }
+  
+  .lg\:grid-cols-3 {
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+  }
+  
+  [lg~="grid-cols-3"] {
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+  }
+  
+  .lg\:col-span-8 {
+    grid-column: span 8 / span 8;
+  }
+  
+  [lg~="col-span-8"] {
+    grid-column: span 8 / span 8;
+  }
+  
+  .lg\:col-span-4 {
+    grid-column: span 4 / span 4;
+  }
+  
+  [lg~="col-span-4"] {
+    grid-column: span 4 / span 4;
+  }
+  
+  .lg\:flex {
+    display: flex;
+  }
+  
+  [lg~="flex"] {
+    display: flex;
+  }
+  
+  .lg\:flex-row {
+    flex-direction: row;
+  }
+  
+  [lg~="flex-row"] {
+    flex-direction: row;
+  }
+  
+  .lg\:w-64 {
+    width: 16rem;
+  }
+  
+  [lg~="w-64"] {
+    width: 16rem;
+  }
+  
+  .lg\:col-span-2 {
+    grid-column: span 2 / span 2;
+  }
+  
+  [lg~="col-span-2"] {
+    grid-column: span 2 / span 2;
+  }
+}
+
+@media (min-width: 1280px) {
+  .xl\:grid-cols-4 {
+    grid-template-columns: repeat(4, minmax(0, 1fr));
+  }
+  
+  [xl~="grid-cols-4"] {
+    grid-template-columns: repeat(4, minmax(0, 1fr));
+  }
+}