lua-cli 2.2.8-alpha.2 → 2.3.0-alpha.2

package/dist/web/app.css

@@ -1,3 +1,919 @@
+/*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */
+@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Onest:wght@400;500;600;700&display=swap') layer(base);
+@layer properties;
+@layer theme, base, components, utilities;
+@layer theme {
+  #lua-root, #lua-root :host {
+    --lua-font-sans: Inter, sans-serif;
+    --lua-font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
+      "Courier New", monospace;
+    --lua-color-gray-100: oklch(96.7% 0.003 264.542);
+    --lua-color-gray-200: oklch(92.8% 0.006 264.531);
+    --lua-color-gray-400: oklch(70.7% 0.022 261.325);
+    --lua-color-gray-700: oklch(37.3% 0.034 259.733);
+    --lua-color-gray-800: oklch(27.8% 0.033 256.848);
+    --lua-color-white: #fff;
+    --lua-spacing: 4px;
+    --lua-text-sm: 14px;
+    --lua-text-sm--line-height: calc(1.25 / 0.875);
+    --lua-font-weight-normal: 400;
+    --lua-leading-relaxed: 1.625;
+    --lua-radius-sm: calc(var(--radius) - 4px);
+    --lua-radius-lg: 8px;
+    --lua-radius-xl: 12px;
+    --lua-radius-2xl: 16px;
+    --lua-default-transition-duration: 150ms;
+    --lua-default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+    --lua-default-font-family: var(--lua-font-sans);
+    --lua-default-mono-font-family: var(--lua-font-mono);
+    --lua-font-heading: Onest, sans-serif;
+    --lua-color-background: hsl(var(--background));
+    --lua-color-foreground: hsl(var(--foreground));
+    --lua-color-primary: hsl(var(--primary));
+    --lua-color-border: hsl(var(--border));
+    --lua-color-ring: hsl(var(--ring));
+  }
+}
+@layer base {
+  #lua-root *, #lua-root ::after, #lua-root ::before, #lua-root ::backdrop, #lua-root ::file-selector-button {
+    box-sizing: border-box;
+    margin: 0;
+    padding: 0;
+    border: 0 solid;
+  }
+  #lua-root, #lua-root :host {
+    line-height: 1.5;
+    -webkit-text-size-adjust: 100%;
+    -moz-tab-size: 4;
+      -o-tab-size: 4;
+         tab-size: 4;
+    font-family: var(--lua-default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
+    font-feature-settings: var(--lua-default-font-feature-settings, normal);
+    font-variation-settings: var(--lua-default-font-variation-settings, normal);
+    -webkit-tap-highlight-color: transparent;
+  }
+  #lua-root hr {
+    height: 0;
+    color: inherit;
+    border-top-width: 1px;
+  }
+  #lua-root abbr:where([title]) {
+    -webkit-text-decoration: underline dotted;
+    text-decoration: underline dotted;
+  }
+  #lua-root h1, #lua-root h2, #lua-root h3, #lua-root h4, #lua-root h5, #lua-root h6 {
+    font-size: inherit;
+    font-weight: inherit;
+  }
+  #lua-root a {
+    color: inherit;
+    -webkit-text-decoration: inherit;
+    text-decoration: inherit;
+  }
+  #lua-root b, #lua-root strong {
+    font-weight: bolder;
+  }
+  #lua-root code, #lua-root kbd, #lua-root samp, #lua-root pre {
+    font-family: var(--lua-default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
+    font-feature-settings: var(--lua-default-mono-font-feature-settings, normal);
+    font-variation-settings: var(--lua-default-mono-font-variation-settings, normal);
+    font-size: 1em;
+  }
+  #lua-root small {
+    font-size: 80%;
+  }
+  #lua-root sub, #lua-root sup {
+    font-size: 75%;
+    line-height: 0;
+    position: relative;
+    vertical-align: baseline;
+  }
+  #lua-root sub {
+    bottom: -0.25em;
+  }
+  #lua-root sup {
+    top: -0.5em;
+  }
+  #lua-root table {
+    text-indent: 0;
+    border-color: inherit;
+    border-collapse: collapse;
+  }
+  #lua-root :-moz-focusring {
+    outline: auto;
+  }
+  #lua-root progress {
+    vertical-align: baseline;
+  }
+  #lua-root summary {
+    display: list-item;
+  }
+  #lua-root ol, #lua-root ul, #lua-root menu {
+    list-style: none;
+  }
+  #lua-root img, #lua-root svg, #lua-root video, #lua-root canvas, #lua-root audio, #lua-root iframe, #lua-root embed, #lua-root object {
+    display: block;
+    vertical-align: middle;
+  }
+  #lua-root img, #lua-root video {
+    max-width: 100%;
+    height: auto;
+  }
+  #lua-root button, #lua-root input, #lua-root select, #lua-root optgroup, #lua-root textarea, #lua-root ::file-selector-button {
+    font: inherit;
+    font-feature-settings: inherit;
+    font-variation-settings: inherit;
+    letter-spacing: inherit;
+    color: inherit;
+    border-radius: 0;
+    background-color: transparent;
+    opacity: 1;
+  }
+  #lua-root :where(select:is([multiple], [size])) optgroup {
+    font-weight: bolder;
+  }
+  #lua-root :where(select:is([multiple], [size])) optgroup option {
+    padding-inline-start: 20px;
+  }
+  #lua-root ::file-selector-button {
+    margin-inline-end: 4px;
+  }
+  #lua-root ::-moz-placeholder {
+    opacity: 1;
+  }
+  #lua-root ::placeholder {
+    opacity: 1;
+  }
+  @supports (not (-webkit-appearance: -apple-pay-button))  or (contain-intrinsic-size: 1px) {
+    #lua-root ::-moz-placeholder {
+      color: currentcolor;
+      @supports (color: color-mix(in lab, red, red)) {
+        color: color-mix(in oklab, currentcolor 50%, transparent);
+      }
+    }
+    #lua-root ::placeholder {
+      color: currentcolor;
+      @supports (color: color-mix(in lab, red, red)) {
+        color: color-mix(in oklab, currentcolor 50%, transparent);
+      }
+    }
+  }
+  #lua-root textarea {
+    resize: vertical;
+  }
+  #lua-root ::-webkit-search-decoration {
+    -webkit-appearance: none;
+  }
+  #lua-root ::-webkit-date-and-time-value {
+    min-height: 1lh;
+    text-align: inherit;
+  }
+  #lua-root ::-webkit-datetime-edit {
+    display: inline-flex;
+  }
+  #lua-root ::-webkit-datetime-edit-fields-wrapper {
+    padding: 0;
+  }
+  #lua-root ::-webkit-datetime-edit, #lua-root ::-webkit-datetime-edit-year-field, #lua-root ::-webkit-datetime-edit-month-field, #lua-root ::-webkit-datetime-edit-day-field, #lua-root ::-webkit-datetime-edit-hour-field, #lua-root ::-webkit-datetime-edit-minute-field, #lua-root ::-webkit-datetime-edit-second-field, #lua-root ::-webkit-datetime-edit-millisecond-field, #lua-root ::-webkit-datetime-edit-meridiem-field {
+    padding-block: 0;
+  }
+  #lua-root ::-webkit-calendar-picker-indicator {
+    line-height: 1;
+  }
+  #lua-root :-moz-ui-invalid {
+    box-shadow: none;
+  }
+  #lua-root button, #lua-root input:where([type="button"], [type="reset"], [type="submit"]), #lua-root ::file-selector-button {
+    -webkit-appearance: button;
+       -moz-appearance: button;
+            appearance: button;
+  }
+  #lua-root ::-webkit-inner-spin-button, #lua-root ::-webkit-outer-spin-button {
+    height: auto;
+  }
+  #lua-root [hidden]:where(:not([hidden="until-found"])) {
+    display: none !important;
+  }
+}
+@layer utilities {
+  #lua-root .lua\:relative {
+    position: relative;
+  }
+  #lua-root .lua\:mx-4 {
+    margin-inline: calc(var(--lua-spacing) * 4);
+  }
+  #lua-root .lua\:mr-4 {
+    margin-right: calc(var(--lua-spacing) * 4);
+  }
+  #lua-root .lua\:ml-4 {
+    margin-left: calc(var(--lua-spacing) * 4);
+  }
+  #lua-root .lua\:flex {
+    display: flex;
+  }
+  #lua-root .lua\:max-w-full {
+    max-width: 100%;
+  }
+  #lua-root .lua\:flex-col {
+    flex-direction: column;
+  }
+  #lua-root .lua\:flex-wrap {
+    flex-wrap: wrap;
+  }
+  #lua-root .lua\:items-end {
+    align-items: flex-end;
+  }
+  #lua-root .lua\:items-start {
+    align-items: flex-start;
+  }
+  #lua-root .lua\:justify-end {
+    justify-content: flex-end;
+  }
+  #lua-root .lua\:space-y-4 {
+    :where(& > :not(:last-child)) {
+      --tw-space-y-reverse: 0;
+      margin-block-start: calc(calc(var(--lua-spacing) * 4) * var(--tw-space-y-reverse));
+      margin-block-end: calc(calc(var(--lua-spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));
+    }
+  }
+  #lua-root .lua\:rounded-2xl {
+    border-radius: var(--lua-radius-2xl);
+  }
+  #lua-root .lua\:rounded-lg {
+    border-radius: var(--lua-radius-lg);
+  }
+  #lua-root .lua\:bg-gray-100 {
+    background-color: var(--lua-color-gray-100);
+  }
+  #lua-root .lua\:bg-white {
+    background-color: var(--lua-color-white);
+  }
+  #lua-root .lua\:p-3 {
+    padding: calc(var(--lua-spacing) * 3);
+  }
+  #lua-root .lua\:px-1 {
+    padding-inline: calc(var(--lua-spacing) * 1);
+  }
+  #lua-root .lua\:px-4 {
+    padding-inline: calc(var(--lua-spacing) * 4);
+  }
+  #lua-root .lua\:py-3 {
+    padding-block: calc(var(--lua-spacing) * 3);
+  }
+  #lua-root .lua\:leading-6 {
+    --tw-leading: calc(var(--lua-spacing) * 6);
+    line-height: calc(var(--lua-spacing) * 6);
+  }
+  #lua-root .lua\:font-normal {
+    --tw-font-weight: var(--lua-font-weight-normal);
+    font-weight: var(--lua-font-weight-normal);
+  }
+  #lua-root .lua\:whitespace-pre-wrap {
+    white-space: pre-wrap;
+  }
+  #lua-root .lua\:text-gray-400 {
+    color: var(--lua-color-gray-400);
+  }
+  #lua-root .lua\:text-gray-700 {
+    color: var(--lua-color-gray-700);
+  }
+  #lua-root .lua\:text-gray-800 {
+    color: var(--lua-color-gray-800);
+  }
+  #lua-root .lua\:sm\:mx-5 {
+    @media (width >= 40rem) {
+      margin-inline: calc(var(--lua-spacing) * 5);
+    }
+  }
+}
+@layer base {
+  #lua-root *, #lua-root ::after, #lua-root ::before, #lua-root ::backdrop, #lua-root ::file-selector-button {
+    border-color: var(--color-gray-200, currentcolor);
+  }
+}
+@layer base {
+  #lua-root {
+    --background: 0 0% 100%;
+    --foreground: 240 10% 3.9%;
+    --card: 0 0% 100%;
+    --card-foreground: 240 10% 3.9%;
+    --popover: 0 0% 100%;
+    --popover-foreground: 240 10% 3.9%;
+    --primary: 218 100% 59%;
+    --primary-foreground: 0 0% 100%;
+    --primary-hover: 218 91% 56%;
+    --primary-active: 218 85% 52%;
+    --secondary: 240 4.8% 95.9%;
+    --secondary-foreground: 240 5.9% 10%;
+    --secondary-hover: 240 4.8% 90%;
+    --secondary-active: 240 4.8% 85%;
+    --muted: 240 4.8% 95.9%;
+    --muted-foreground: 240 3.8% 46.1%;
+    --accent: 240 4.8% 95.9%;
+    --accent-foreground: 240 5.9% 10%;
+    --destructive: 351 100% 45%;
+    --destructive-foreground: 0 0% 100%;
+    --destructive-hover: 351 100% 40%;
+    --destructive-active: 351 100% 37%;
+    --border: 240 5.9% 90%;
+    --input: 240 5.9% 90%;
+    --ring: 240 5.9% 10%;
+    --chart-1: 12 76% 61%;
+    --chart-2: 173 58% 39%;
+    --chart-3: 197 37% 24%;
+    --chart-4: 43 74% 66%;
+    --chart-5: 27 87% 67%;
+    --radius: 0.5rem;
+  }
+  #lua-root .dark {
+    --background: 240 10% 3.9%;
+    --foreground: 0 0% 98%;
+    --card: 240 10% 3.9%;
+    --card-foreground: 0 0% 98%;
+    --popover: 240 10% 3.9%;
+    --popover-foreground: 0 0% 98%;
+    --primary: 218 100% 59%;
+    --primary-foreground: 0 0% 100%;
+    --primary-hover: 218 91% 56%;
+    --primary-active: 218 85% 52%;
+    --secondary: 240 3.7% 15.9%;
+    --secondary-foreground: 0 0% 98%;
+    --secondary-hover: 240 3.7% 20%;
+    --secondary-active: 240 3.7% 25%;
+    --muted: 240 3.7% 15.9%;
+    --muted-foreground: 240 5% 64.9%;
+    --accent: 240 3.7% 15.9%;
+    --accent-foreground: 0 0% 98%;
+    --destructive: 351 100% 45%;
+    --destructive-foreground: 0 0% 100%;
+    --destructive-hover: 351 100% 40%;
+    --destructive-active: 351 100% 37%;
+    --border: 240 3.7% 15.9%;
+    --input: 240 3.7% 15.9%;
+    --ring: 240 4.9% 83.9%;
+    --chart-1: 220 70% 50%;
+    --chart-2: 160 60% 45%;
+    --chart-3: 30 80% 55%;
+    --chart-4: 280 65% 60%;
+    --chart-5: 340 75% 55%;
+  }
+}
+@layer base {
+  #lua-root * {
+    border-color: var(--lua-color-border);
+  }
+  #lua-root {
+    background-color: var(--lua-color-background);
+    font-family: var(--lua-font-sans);
+    color: var(--lua-color-foreground);
+  }
+  #lua-root h1, #lua-root h2, #lua-root h3, #lua-root h4, #lua-root h5, #lua-root h6 {
+    font-family: var(--lua-font-heading);
+    color: var(--lua-color-foreground);
+  }
+  #lua-root p {
+    font-family: var(--lua-font-sans);
+    font-size: var(--lua-text-sm);
+    line-height: var(--tw-leading, var(--lua-text-sm--line-height));
+    --tw-leading: var(--lua-leading-relaxed);
+    line-height: var(--lua-leading-relaxed);
+    color: var(--lua-color-foreground);
+  }
+  #lua-root a {
+    color: var(--lua-color-primary);
+    text-underline-offset: 4px;
+    &:hover {
+      @media (hover: hover) {
+        text-decoration-line: underline;
+      }
+    }
+    &:focus-visible {
+      border-radius: var(--lua-radius-sm);
+    }
+    &:focus-visible {
+      outline-style: var(--tw-outline-style);
+      outline-width: 2px;
+    }
+    &:focus-visible {
+      outline-offset: 2px;
+    }
+    &:focus-visible {
+      outline-color: var(--lua-color-ring);
+    }
+    text-decoration-thickness: 1px;
+  }
+}
+@keyframes slide-in-from-top {
+  0% {
+    transform: translateY(-100%);
+  }
+  100% {
+    transform: translateY(0);
+  }
+}
+@keyframes slide-in-from-bottom {
+  0% {
+    transform: translateY(100%);
+  }
+  100% {
+    transform: translateY(0);
+  }
+}
+@keyframes slide-in-from-left {
+  0% {
+    transform: translateX(-100%);
+  }
+  100% {
+    transform: translateX(0);
+  }
+}
+@keyframes slide-in-from-right {
+  0% {
+    transform: translateX(100%);
+  }
+  100% {
+    transform: translateX(0);
+  }
+}
+@keyframes slide-out-to-top {
+  0% {
+    transform: translateY(0);
+  }
+  100% {
+    transform: translateY(-100%);
+  }
+}
+@keyframes slide-out-to-bottom {
+  0% {
+    transform: translateY(0);
+  }
+  100% {
+    transform: translateY(100%);
+  }
+}
+@keyframes slide-out-to-left {
+  0% {
+    transform: translateX(0);
+  }
+  100% {
+    transform: translateX(-100%);
+  }
+}
+@keyframes slide-out-to-right {
+  0% {
+    transform: translateX(0);
+  }
+  100% {
+    transform: translateX(100%);
+  }
+}
+@keyframes fade-in {
+  0% {
+    opacity: 0;
+  }
+  100% {
+    opacity: 1;
+  }
+}
+@keyframes fade-out {
+  0% {
+    opacity: 1;
+  }
+  100% {
+    opacity: 0;
+  }
+}
+#lua-root .lua\:animate-in {
+  animation: fade-in 0.2s ease-out;
+}
+#lua-root .lua\:animate-out {
+  animation: fade-out 0.2s ease-out;
+}
+#lua-root .lua\:fade-in-0 {
+  animation: fade-in 0.2s ease-out;
+}
+#lua-root .lua\:fade-out-0 {
+  animation: fade-out 0.2s ease-out;
+}
+#lua-root .lua\:slide-in-from-top {
+  animation: slide-in-from-top 0.3s ease-out;
+}
+#lua-root .lua\:slide-in-from-bottom {
+  animation: slide-in-from-bottom 0.3s ease-out;
+}
+#lua-root .lua\:slide-in-from-left {
+  animation: slide-in-from-left 0.3s ease-out;
+}
+#lua-root .lua\:slide-in-from-right {
+  animation: slide-in-from-right 0.3s ease-out;
+}
+#lua-root .lua\:slide-out-to-top {
+  animation: slide-out-to-top 0.3s ease-out;
+}
+#lua-root .lua\:slide-out-to-bottom {
+  animation: slide-out-to-bottom 0.3s ease-out;
+}
+#lua-root .lua\:slide-out-to-left {
+  animation: slide-out-to-left 0.3s ease-out;
+}
+#lua-root .lua\:slide-out-to-right {
+  animation: slide-out-to-right 0.3s ease-out;
+}
+#lua-root .lua\:data-\[state\=open\]\:animate-in[data-state="open"] {
+  animation: fade-in 0.2s ease-out;
+}
+#lua-root .lua\:data-\[state\=closed\]\:animate-out[data-state="closed"] {
+  animation: fade-out 0.2s ease-out;
+}
+#lua-root .lua\:data-\[state\=open\]\:fade-in-0[data-state="open"] {
+  animation: fade-in 0.2s ease-out;
+}
+#lua-root .lua\:data-\[state\=closed\]\:fade-out-0[data-state="closed"] {
+  animation: fade-out 0.2s ease-out;
+}
+#lua-root .lua\:data-\[state\=open\]\:slide-in-from-top[data-state="open"] {
+  animation: slide-in-from-top 0.3s ease-out;
+}
+#lua-root .lua\:data-\[state\=closed\]\:slide-out-to-top[data-state="closed"] {
+  animation: slide-out-to-top 0.3s ease-out;
+}
+#lua-root .lua\:data-\[state\=open\]\:slide-in-from-bottom[data-state="open"] {
+  animation: slide-in-from-bottom 0.3s ease-out;
+}
+#lua-root .lua\:data-\[state\=closed\]\:slide-out-to-bottom[data-state="closed"] {
+  animation: slide-out-to-bottom 0.3s ease-out;
+}
+#lua-root .lua\:data-\[state\=open\]\:slide-in-from-left[data-state="open"] {
+  animation: slide-in-from-left 0.3s ease-out;
+}
+#lua-root .lua\:data-\[state\=closed\]\:slide-out-to-left[data-state="closed"] {
+  animation: slide-out-to-left 0.3s ease-out;
+}
+#lua-root .lua\:data-\[state\=open\]\:slide-in-from-right[data-state="open"] {
+  animation: slide-in-from-right 0.3s ease-out;
+}
+#lua-root .lua\:data-\[state\=closed\]\:slide-out-to-right[data-state="closed"] {
+  animation: slide-out-to-right 0.3s ease-out;
+}
+#lua-root .lua\:data-\[state\=open\]\:duration-500[data-state="open"] {
+  animation-duration: 500ms;
+}
+#lua-root .lua\:data-\[state\=closed\]\:duration-300[data-state="closed"] {
+  animation-duration: 300ms;
+}
+@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Onest:wght@400;500;600;700&display=swap');
+#lua-root, #lua-root {
+  background-color: white;
+  font-family: 'Inter', system-ui, sans-serif;
+}
+#lua-root h1, #lua-root h2, #lua-root h3, #lua-root h4, #lua-root h5, #lua-root h6 {
+  font-family: 'Onest', system-ui, sans-serif;
+}
+@layer base {
+  #lua-root {
+    --background: 0 0% 100%;
+    --foreground: 240 10% 3.9%;
+    --card: 0 0% 100%;
+    --card-foreground: 240 10% 3.9%;
+    --popover: 0 0% 100%;
+    --popover-foreground: 240 10% 3.9%;
+    --primary: 240 5.9% 10%;
+    --primary-foreground: 0 0% 98%;
+    --secondary: 240 4.8% 95.9%;
+    --secondary-foreground: 240 5.9% 10%;
+    --secondary-hover: 240 4.8% 90%;
+    --secondary-active: 240 4.8% 85%;
+    --muted: 240 4.8% 95.9%;
+    --muted-foreground: 240 3.8% 46.1%;
+    --accent: 240 4.8% 95.9%;
+    --accent-foreground: 240 5.9% 10%;
+    --destructive: 0 84.2% 60.2%;
+    --destructive-foreground: 0 0% 98%;
+    --border: 240 5.9% 90%;
+    --input: 240 5.9% 90%;
+    --ring: 240 5.9% 10%;
+    --chart-1: 12 76% 61%;
+    --chart-2: 173 58% 39%;
+    --chart-3: 197 37% 24%;
+    --chart-4: 43 74% 66%;
+    --chart-5: 27 87% 67%;
+    --radius: 0.5rem;
+  }
+  #lua-root .dark {
+    --background: 240 10% 3.9%;
+    --foreground: 0 0% 98%;
+    --card: 240 10% 3.9%;
+    --card-foreground: 0 0% 98%;
+    --popover: 240 10% 3.9%;
+    --popover-foreground: 0 0% 98%;
+    --primary: 0 0% 98%;
+    --primary-foreground: 240 5.9% 10%;
+    --secondary: 240 3.7% 15.9%;
+    --secondary-foreground: 0 0% 98%;
+    --secondary-hover: 240 3.7% 20%;
+    --secondary-active: 240 3.7% 25%;
+    --muted: 240 3.7% 15.9%;
+    --muted-foreground: 240 5% 64.9%;
+    --accent: 240 3.7% 15.9%;
+    --accent-foreground: 0 0% 98%;
+    --destructive: 0 62.8% 30.6%;
+    --destructive-foreground: 0 0% 98%;
+    --border: 240 3.7% 15.9%;
+    --input: 240 3.7% 15.9%;
+    --ring: 240 4.9% 83.9%;
+    --chart-1: 220 70% 50%;
+    --chart-2: 160 60% 45%;
+    --chart-3: 30 80% 55%;
+    --chart-4: 280 65% 60%;
+    --chart-5: 340 75% 55%;
+  }
+}
+@layer base {
+  #lua-root * {
+    border-color: hsl(var(--border));
+  }
+  #lua-root {
+    background-color: hsl(var(--background));
+    color: hsl(var(--foreground));
+  }
+}
+@layer components {
+  #lua-root .chat-list-item-container {
+    display: grid;
+    max-width: 560px;
+    grid-template-columns: repeat(1, minmax(0, 1fr));
+    gap: calc(var(--lua-spacing) * 2);
+  }
+  #lua-root .chat-list-item {
+    position: relative;
+    margin-inline: calc(var(--lua-spacing) * 0);
+    cursor: pointer;
+    border-radius: var(--lua-radius-xl);
+    border-style: var(--tw-border-style);
+    border-width: 1px;
+    border-color: var(--lua-color-gray-200);
+    background-color: var(--lua-color-white);
+    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
+    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+    transition-property: all;
+    transition-timing-function: var(--tw-ease, var(--lua-default-transition-timing-function));
+    transition-duration: var(--tw-duration, var(--lua-default-transition-duration));
+    --tw-duration: 200ms;
+    transition-duration: 200ms;
+    &:hover {
+      @media (hover: hover) {
+        border-color: var(--lua-color-gray-200);
+      }
+    }
+    &:hover {
+      @media (hover: hover) {
+        --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
+        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+      }
+    }
+    &:active {
+      scale: 0.98;
+    }
+    &:active {
+      --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
+      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+    }
+    @media (width >= 40rem) {
+      margin-inline: calc(var(--lua-spacing) * 5);
+    }
+  }
+  @media (min-width: 640px) {
+    #lua-root .chat-list-item-container {
+      grid-template-columns: repeat(1, minmax(0, 1fr));
+    }
+    #lua-root .chat-list-item-image-wrapper {
+      height: calc(var(--lua-spacing) * 24);
+      width: calc(var(--lua-spacing) * 24);
+      flex-shrink: 0;
+    }
+    #lua-root .chat-list-item-image {
+      height: calc(var(--lua-spacing) * 24);
+      width: calc(var(--lua-spacing) * 24);
+      border-radius: var(--lua-radius-lg);
+      -o-object-fit: cover;
+         object-fit: cover;
+    }
+    #lua-root .chat-list-item-content {
+      display: flex;
+      gap: calc(var(--lua-spacing) * 4);
+    }
+    #lua-root .chat-list-item {
+      width: 100%;
+      padding: calc(var(--lua-spacing) * 3);
+    }
+    #lua-root .markdown-image-carousel {
+      gap: calc(var(--lua-spacing) * 4);
+    }
+  }
+  @media (max-width: 639px) {
+    #lua-root .chat-list-item-container {
+      display: flex;
+      max-width: 100%;
+      scroll-snap-type: x var(--tw-scroll-snap-strictness);
+      --tw-scroll-snap-strictness: mandatory;
+      gap: calc(var(--lua-spacing) * 2);
+      overflow: scroll;
+      overflow-x: auto;
+      padding-inline: calc(var(--lua-spacing) * 4);
+      padding-bottom: calc(var(--lua-spacing) * 4);
+      scrollbar-width: none;
+      -ms-overflow-style: none;
+    }
+    #lua-root .chat-list-item-image-wrapper {
+      width: 100%;
+    }
+    #lua-root .chat-list-item-content {
+      display: flex;
+      flex-direction: column;
+    }
+    #lua-root .chat-list-item-image {
+      height: 216px;
+      width: 100%;
+      border-top-left-radius: var(--lua-radius-lg);
+      border-top-right-radius: var(--lua-radius-lg);
+      -o-object-fit: cover;
+         object-fit: cover;
+    }
+    #lua-root .chat-list-item-container::-webkit-scrollbar {
+      display: none;
+    }
+    #lua-root .chat-list-item {
+      width: 240px;
+      flex: none;
+    }
+    #lua-root .chat-list-item img {
+      height: 216px;
+      width: 100%;
+      border-top-left-radius: var(--lua-radius-lg);
+      border-top-right-radius: var(--lua-radius-lg);
+      -o-object-fit: cover;
+         object-fit: cover;
+    }
+    #lua-root .chat-list-item .content-container {
+      padding: calc(var(--lua-spacing) * 4);
+    }
+    #lua-root .markdown-image-carousel {
+      gap: calc(var(--lua-spacing) * 2);
+    }
+  }
+  #lua-root .markdown-image-carousel {
+    display: flex;
+    scroll-snap-type: x var(--tw-scroll-snap-strictness);
+    --tw-scroll-snap-strictness: mandatory;
+    overflow-x: auto;
+    padding-inline: calc(var(--lua-spacing) * 4);
+    padding-bottom: calc(var(--lua-spacing) * 4);
+    scrollbar-width: none;
+    -ms-overflow-style: none;
+  }
+  #lua-root .markdown-image-item {
+    max-width: 300px;
+    flex: none;
+    border-radius: var(--lua-radius-xl);
+  }
+  #lua-root .markdown-image-item {
+    img {
+      height: 250px;
+      border-radius: var(--lua-radius-xl);
+      background-color: var(--lua-color-gray-100);
+      -o-object-fit: cover;
+         object-fit: cover;
+    }
+  }
+  #lua-root .leaflet-container {
+    z-index: 1;
+  }
+}
+@property --tw-space-y-reverse {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0;
+}
+@property --tw-leading {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-font-weight {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-outline-style {
+  syntax: "*";
+  inherits: false;
+  initial-value: solid;
+}
+@property --tw-border-style {
+  syntax: "*";
+  inherits: false;
+  initial-value: solid;
+}
+@property --tw-shadow {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0 0 #0000;
+}
+@property --tw-shadow-color {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-shadow-alpha {
+  syntax: "<percentage>";
+  inherits: false;
+  initial-value: 100%;
+}
+@property --tw-inset-shadow {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0 0 #0000;
+}
+@property --tw-inset-shadow-color {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-inset-shadow-alpha {
+  syntax: "<percentage>";
+  inherits: false;
+  initial-value: 100%;
+}
+@property --tw-ring-color {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-ring-shadow {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0 0 #0000;
+}
+@property --tw-inset-ring-color {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-inset-ring-shadow {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0 0 #0000;
+}
+@property --tw-ring-inset {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-ring-offset-width {
+  syntax: "<length>";
+  inherits: false;
+  initial-value: 0px;
+}
+@property --tw-ring-offset-color {
+  syntax: "*";
+  inherits: false;
+  initial-value: #fff;
+}
+@property --tw-ring-offset-shadow {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0 0 #0000;
+}
+@property --tw-duration {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-scroll-snap-strictness {
+  syntax: "*";
+  inherits: false;
+  initial-value: proximity;
+}
+@layer properties {
+  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
+    #lua-root *, #lua-root ::before, #lua-root ::after, #lua-root ::backdrop {
+      --tw-space-y-reverse: 0;
+      --tw-leading: initial;
+      --tw-font-weight: initial;
+      --tw-outline-style: solid;
+      --tw-border-style: solid;
+      --tw-shadow: 0 0 #0000;
+      --tw-shadow-color: initial;
+      --tw-shadow-alpha: 100%;
+      --tw-inset-shadow: 0 0 #0000;
+      --tw-inset-shadow-color: initial;
+      --tw-inset-shadow-alpha: 100%;
+      --tw-ring-color: initial;
+      --tw-ring-shadow: 0 0 #0000;
+      --tw-inset-ring-color: initial;
+      --tw-inset-ring-shadow: 0 0 #0000;
+      --tw-ring-inset: initial;
+      --tw-ring-offset-width: 0px;
+      --tw-ring-offset-color: #fff;
+      --tw-ring-offset-shadow: 0 0 #0000;
+      --tw-duration: initial;
+      --tw-scroll-snap-strictness: proximity;
+    }
+  }
+}
+
 /* Main App CSS - Modular Imports */
 
 /* Shared Styles */
@@ -72,8 +988,8 @@
 
 /* Reset and base styles */
 * {
-  margin: 0;
-  padding: 0;
+  /*margin: 0;*/
+  /*padding: 0;*/
   box-sizing: border-box;
 }
 
@@ -752,7 +1668,7 @@ a:focus-visible,
 }
 
 .production-resize-handle::after {
-  content: '';
+  content: "";
   position: absolute;
   top: 0;
   left: -2px;
@@ -810,7 +1726,7 @@ a:focus-visible,
 }
 
 .right-panel-tabs .tab-button.active::after {
-  content: '';
+  content: "";
   position: absolute;
   bottom: 0;
   left: 0;
@@ -821,7 +1737,7 @@ a:focus-visible,
 
 .right-panel-content {
   flex: 1;
-  overflow: hidden;
+  overflow: auto;
 }
 
 .versions-panel,
@@ -892,7 +1808,7 @@ a:focus-visible,
 }
 
 .column-tabs .tab-button.active::after {
-  content: '';
+  content: "";
   position: absolute;
   bottom: 0;
   left: 0;
@@ -988,7 +1904,6 @@ a:focus-visible,
 }
 
 .chat-header {
-  background: #2d2d30;
   color: #cccccc;
   padding: 12px 16px;
   border-bottom: 1px solid #3e3e42;
@@ -1060,7 +1975,6 @@ a:focus-visible,
   flex: 1;
   padding: 16px;
   overflow-y: auto;
-  background: #ffffff;
 }
 
 .message {
@@ -1108,7 +2022,6 @@ a:focus-visible,
   padding: 12px 16px;
 }
 
-
 /* Markdown styling for chat bubbles */
 .message-bubble h1,
 .message-bubble h2,
@@ -1144,7 +2057,9 @@ a:focus-visible,
   background: rgba(0, 0, 0, 0.1);
   padding: 2px 4px;
   border-radius: 3px;
-  font-family: 'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono', Consolas, 'Courier New', monospace;
+  font-family:
+    'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono', Consolas, 'Courier New',
+    monospace;
   font-size: 13px;
 }
 
@@ -1154,7 +2069,9 @@ a:focus-visible,
   border-radius: 6px;
   overflow-x: auto;
   margin: 8px 0;
-  font-family: 'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono', Consolas, 'Courier New', monospace;
+  font-family:
+    'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono', Consolas, 'Courier New',
+    monospace;
   font-size: 13px;
   line-height: 1.4;
 }
@@ -1180,7 +2097,7 @@ a:focus-visible,
 }
 
 .message-bubble a {
-  color: #007AFF;
+  color: #007aff;
   text-decoration: none;
 }
 
@@ -4303,6 +5220,7 @@ a:focus-visible,
   flex-direction: column;
   padding: 16px;
   overflow-y: auto;
+  min-height: 0;
 }
 
 .env-loading {
@@ -4391,7 +5309,7 @@ a:focus-visible,
   color: #ffffff;
   padding: 6px 10px;
   font-size: 12px;
-  font-family: 'Monaco', 'Menlo', 'Consolas', monospace;
+  font-family: "Monaco", "Menlo", "Consolas", monospace;
 }
 
 .env-input:focus {
@@ -4429,7 +5347,10 @@ a:focus-visible,
 
 /* Environment Variables List */
 .env-variables {
-  flex: 1;
+  flex: 0 1 auto;
+  overflow-y: visible;
+  min-height: 0;
+  padding-right: 4px;
 }
 
 .env-list {
@@ -4461,7 +5382,7 @@ a:focus-visible,
   align-items: flex-start;
   gap: 8px;
   flex: 1;
-  font-family: 'Monaco', 'Menlo', 'Consolas', monospace;
+  font-family: "Monaco", "Menlo", "Consolas", monospace;
   font-size: 12px;
   min-height: 20px;
 }
@@ -4586,7 +5507,7 @@ a:focus-visible,
   color: #ffffff;
   padding: 6px 8px;
   font-size: 12px;
-  font-family: 'Monaco', 'Menlo', 'Consolas', monospace;
+  font-family: "Monaco", "Menlo", "Consolas", monospace;
   line-height: 1.3;
 }
 
@@ -4698,6 +5619,7 @@ a:focus-visible,
 
 /* Help Section */
 .env-help {
+  flex-shrink: 0;
   margin-top: 16px;
   padding: 12px;
   background: rgba(0, 122, 204, 0.1);
@@ -4720,7 +5642,7 @@ a:focus-visible,
   background: rgba(255, 255, 255, 0.1);
   padding: 2px 4px;
   border-radius: 2px;
-  font-family: 'Monaco', 'Menlo', 'Consolas', monospace;
+  font-family: "Monaco", "Menlo", "Consolas", monospace;
   font-size: 13px;
   color: #007acc;
 }
@@ -5693,3 +6615,5 @@ a:focus-visible,
     padding: 12px 16px;
   }
 }
+
+