/* Alpine cloak */ [x-cloak]{display:none!important}
/* HTMX */ .htmx-swapping{opacity:0;transition:opacity .2s}.htmx-indicator{opacity:0;transition:opacity .2s}.htmx-request .htmx-indicator{opacity:1}
/* Fade in */ .fade-in{animation:fadeIn .2s ease-out}@keyframes fadeIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}
/* Skeleton shimmer */ .skeleton{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);background-size:200% 100%;animation:shimmer 1.5s infinite}@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}
/* Scrollbar */ ::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:3px}
/* Utilities */ .touch-target{min-height:44px;min-width:44px}.aspect-square{aspect-ratio:1/1}.aspect-video{aspect-ratio:16/9}.new-posts-bar{animation:slideDown .3s ease-out}.toast-stack{position:fixed;bottom:1.5rem;right:1.5rem;z-index:100;display:flex;flex-direction:column;gap:.5rem}
/* Animations */ @keyframes slideDown{from{transform:translateY(-100%);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes slideUp{from{transform:translateY(100%)}to{transform:translateY(0)}}.animate-slide-up{animation:slideUp .25s ease-out}@keyframes slideInRight{from{transform:translateX(100%);opacity:0}to{transform:translateX(0);opacity:1}}.animate-slide-in-right{animation:slideInRight .3s ease-out}
/* Record */ @keyframes recordPulse{0%,100%{box-shadow:0 0 0 0 rgba(239,68,68,.5)}50%{box-shadow:0 0 0 8px rgba(239,68,68,0)}}.animate-record-pulse{animation:recordPulse 1.5s infinite}
/* Reactions */ .reaction-pill{display:inline-flex;align-items:center;gap:2px;padding:2px 8px;background:white;border:1px solid #e5e7eb;border-radius:999px;font-size:12px}.delivery-read{color:#3b82f6}.delivery-delivered{color:#6b7280}.delivery-sent{color:#9ca3af}
/* KBD */ .kbd{display:inline-flex;align-items:center;padding:1px 5px;font-size:10px;background:#f3f4f6;border:1px solid #d1d5db;border-radius:4px;color:#6b7280}
/* Dark mode vars */ .dark{--bg-primary:#0f172a;--bg-secondary:#1e293b;--bg-card:#1e293b;--bg-input:#334155;--text-primary:#f1f5f9;--text-secondary:#94a3b8;--text-muted:#64748b;--border-color:#334155;--ring-color:#475569}
/* Dark surfaces */ .dark body{background-color:var(--bg-primary);color:var(--text-primary)}.dark .bg-white,.dark .bg-gray-50{background-color:var(--bg-card)!important;border-color:var(--border-color)!important}.dark .text-gray-900{color:var(--text-primary)!important}.dark .text-gray-500,.dark .text-gray-600,.dark .text-gray-700{color:var(--text-secondary)!important}.dark .text-gray-400{color:var(--text-muted)!important}.dark input,.dark textarea,.dark select{background-color:var(--bg-input)!important;border-color:var(--border-color)!important;color:var(--text-primary)!important}.dark .bg-gray-100{background-color:var(--bg-secondary)!important}.dark .border-gray-100,.dark .border-gray-200{--tw-border-opacity:1;border-color:var(--border-color)!important}.dark .shadow-sm{box-shadow:0 1px 2px 0 rgba(0,0,0,.3)!important}.dark .skeleton{background:linear-gradient(90deg,var(--bg-input) 25%,var(--bg-secondary) 50%,var(--bg-input) 75%)!important;background-size:200% 100%!important}.dark .swiper-pagination-bullet{background:var(--text-primary)!important}.dark .swiper-button-next,.dark .swiper-button-prev{background:rgba(255,255,255,.15)!important}.dark ::-webkit-scrollbar-thumb{background:var(--text-muted)!important}
/* Heart pop animation */ @keyframes heartPop{0%{transform:scale(1)}50%{transform:scale(1.35)}100%{transform:scale(1)}}.heart-pop{animation:heartPop .35s ease-out}.heart-pop-fast{animation:heartPop .2s ease-out}
/* Heart burst (double tap) */ @keyframes heartBurst{0%{transform:scale(0);opacity:1}50%{transform:scale(1.15);opacity:1}100%{transform:scale(1);opacity:0}}.animate-heart-burst{animation:heartBurst .8s ease-out forwards}
/* Like spin (reels) */ @keyframes likeSpin{0%{transform:scale(0) rotate(-45deg);opacity:1}60%{transform:scale(1.2) rotate(0deg)}100%{transform:scale(1) rotate(0deg);opacity:0}}
/* Lazysizes blur-up */ .lazyload,.lazyloading{opacity:0;transition:opacity .3s}.lazyloaded{opacity:1}.swiper-lazy:not(.swiper-lazy-loaded){opacity:0}.swiper-lazy-loaded{opacity:1;transition:opacity .3s}.swiper-lazy-preloader{border-color:rgba(255,255,255,.6)!important}
/* Carousel arrows */ .swiper-button-next,.swiper-button-prev{color:white!important;background:rgba(0,0,0,.4)!important;width:32px!important;height:32px!important;border-radius:50%!important;backdrop-filter:blur(4px)}.swiper-button-next:after,.swiper-button-prev:after{font-size:14px!important;font-weight:700}.swiper-pagination-bullet{background:white!important;opacity:.5!important}.swiper-pagination-bullet-active{opacity:1!important;background:#3b82f6!important}.swiper-pagination{position:absolute!important;bottom:8px!important}
/* Stories bar */ .stories-bar .swiper-slide{width:auto!important}.stories-bar .swiper-wrapper{padding-bottom:4px}
/* Spinner */ @keyframes spin{to{transform:rotate(360deg)}}