/*! Meraki World V43 CLS Fino - mantiene diseño, colores, animaciones y tamaño visual */
html{scrollbar-gutter:stable;-webkit-text-size-adjust:100%;text-size-adjust:100%;}
body{min-height:100vh;overflow-y:scroll;font-synthesis:none;}
#root{min-height:100svh;}
#root:empty{min-height:100svh;background:hsl(0 0% 100%);} 
/* Header estable: no cambia diseño, solo reserva el mismo alto antes de terminar carga */
header,.sticky.top-0,.fixed.top-0{min-height:88px;}
.sticky.top-0>div,.fixed.top-0>div,header>div{min-height:72px;}
@media(max-width:767px){header,.sticky.top-0,.fixed.top-0{min-height:76px}.sticky.top-0>div,.fixed.top-0>div,header>div{min-height:64px}}
/* Hero estable */
.h-\[90vh\].min-h-\[600px\]{height:90vh;min-height:600px;}
@supports(height:90svh){.h-\[90vh\].min-h-\[600px\]{height:90svh;}}
@media(max-width:767px){.h-\[90vh\].min-h-\[600px\]{height:82vh;min-height:560px}@supports(height:82svh){.h-\[90vh\].min-h-\[600px\]{height:82svh;}}}
.h-\[50px\]{height:50px;min-height:50px;}
@media(min-width:768px){.md\:h-\[100px\]{height:100px;min-height:100px;}}
/* Imágenes: mantiene el mismo tamaño visual, pero evita saltos por baseline/dimensiones tardías */
img{display:block;vertical-align:middle;overflow-clip-margin:content-box;}
img[src*="/uploads/products/"]{aspect-ratio:1/1;object-fit:cover;}
img[src*="images.unsplash.com"]{aspect-ratio:16/10;}
/* Tarjetas de producto: no cambia el tamaño de la imagen; solo estabiliza skeleton/textos */
.kawaii-card .h-64{height:16rem;min-height:16rem;flex:0 0 16rem;}
.kawaii-card h3.line-clamp-1{min-height:1.75rem;line-height:1.45;}
.kawaii-card p.line-clamp-2{min-height:2.75rem;line-height:1.38;}
.kawaii-card.overflow-hidden.h-full.flex.flex-col.opacity-80{min-height:27.75rem;}
.skeleton-shimmer{contain:paint;}
/* Grillas del catálogo: reserva espacio suficiente mientras llega la API sin modificar cards finales */
.grid.grid-cols-1.sm\:grid-cols-2.lg\:grid-cols-3.xl\:grid-cols-4.gap-8{min-height:28rem;}
@media(min-width:640px){.grid.grid-cols-1.sm\:grid-cols-2.lg\:grid-cols-3.xl\:grid-cols-4.gap-8{min-height:29rem;}}
/* Bloques de filtros/orden: alto estable cuando se hidrata React */
.rounded-2xl.border-2.border-border.shadow-sm{min-height:74px;}
.kawaii-input{min-height:40px;}
/* Categorías horizontales del home: reserva alto para que no salte cuando entran iconos/texto */
.snap-start.shrink-0.w-\[280px\] .kawaii-card{min-height:166px;}
.w-20.h-20{width:5rem;height:5rem;min-width:5rem;min-height:5rem;}
/* Secciones inferiores con animaciones: las animaciones siguen, pero el layout queda estable */
.py-20.relative.bg-background{min-height:480px;}
.py-24.bg-muted\/30{min-height:640px;}
.py-24.relative.overflow-hidden.bg-primary\/5{min-height:360px;}
.py-24.relative.overflow-hidden:not(.bg-primary\/5){min-height:420px;}
@media(max-width:767px){.py-20.relative.bg-background{min-height:430px}.py-24.bg-muted\/30{min-height:760px}.py-24.relative.overflow-hidden.bg-primary\/5{min-height:520px}.py-24.relative.overflow-hidden:not(.bg-primary\/5){min-height:520px}}
/* Fuente: reduce saltos al intercambiar de fallback a Outfit */
body,input,button,select,textarea{font-family:Outfit,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;}
button,a,input,select,textarea{font-synthesis-weight:none;}
svg{flex-shrink:0;}
/* Mantiene animaciones en compositor, sin tocar layout */
[class*="animate-"],.transition-all,.transition-transform,.transition-opacity{will-change:transform,opacity;}
.kawaii-card{backface-visibility:hidden;transform:translateZ(0);}
[data-radix-popper-content-wrapper]{position:fixed!important;}
/* Respeta usuarios con reducción de movimiento sin quitar animación para el resto */
@media(prefers-reduced-motion:reduce){[class*="animate-"],.transition-all,.transition-transform,.transition-opacity{transition-duration:.01ms!important;animation-duration:.01ms!important;}}