/* Droply — Minimalist Editorial Design System */

* { box-sizing: border-box; }

::-webkit-scrollbar { width: 3px; height: 3px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(150,150,150,0.2); border-radius: 99px; }

.hide-scrollbar::-webkit-scrollbar { display: none; }
.hide-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

/* Glass */
.glass {
  background: rgba(255,255,255,0.7);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
}
.dark .glass {
  background: rgba(15,17,23,0.75);
}

/* Animations */
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}
.fade-up { animation: fadeUp 0.4s ease-out both; }

@keyframes wave {
  0%, 100% { height: 4px; }
  50% { height: 22px; }
}
.wave-1 { animation: wave 0.8s ease-in-out infinite 0.0s; }
.wave-2 { animation: wave 0.9s ease-in-out infinite 0.15s; }
.wave-3 { animation: wave 0.7s ease-in-out infinite 0.05s; }
.wave-4 { animation: wave 1.1s ease-in-out infinite 0.25s; }
.wave-5 { animation: wave 0.6s ease-in-out infinite 0.1s; }

@keyframes pulse-rec {
  0%, 100% { box-shadow: 0 0 0 0 rgba(239,68,68,0.6); }
  50% { box-shadow: 0 0 0 10px rgba(239,68,68,0); }
}
.rec-pulse { animation: pulse-rec 1.5s infinite; }

/* Auto-expanding textarea */
textarea.auto-expand {
  field-sizing: content;
  min-height: 2.5rem;
  max-height: 20rem;
}