/* Tailwind CSS v4 compatible styles */

/* Reset and base styles */
*,
::before,
::after {
  box-sizing: border-box;
  border-width: 0;
  border-style: solid;
  border-color: #e5e7eb;
}

::before,
::after {
  --tw-content: '';
}

html,
:host {
  line-height: 1.5;
  -webkit-text-size-adjust: 100%;
  -moz-tab-size: 4;
  tab-size: 4;
  font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-feature-settings: normal;
  font-variation-settings: normal;
  -webkit-tap-highlight-color: transparent;
}

body {
  margin: 0;
  line-height: inherit;
  background-color: #fff2ce;
}

img {
  border-style: none;
}

/* Utility classes */
.h-screen {
  height: 100vh;
}

.flex {
  display: flex;
}

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

.justify-center {
  justify-content: center;
}

.w-auto {
  width: auto;
}

.h-auto {
  height: auto;
}

/* Responsive logo sizing */
.logo {
  max-width: min(90vw, 600px);
  max-height: min(90vh, 600px);
  width: auto;
  height: auto;
  object-fit: contain;
  transition: all 0.3s ease-in-out;
}

/* Mobile optimization */
@media (max-width: 768px) {
  .logo {
    max-width: min(85vw, 500px);
    max-height: min(85vh, 500px);
  }
}

@media (max-width: 480px) {
  .logo {
    max-width: min(80vw, 400px);
    max-height: min(80vh, 400px);
  }
}

@media (max-width: 320px) {
  .logo {
    max-width: min(75vw, 300px);
    max-height: min(75vh, 300px);
  }
}