/* Global Styles */

* {
  box-sizing: border-box;
}

html, body {
  margin: 0;
  padding: 0;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  user-select: none;
}

body {
  background: #f5f7fa;
}

h1, h2, h3 {
  margin: 0;
}

button {
  font-family: inherit;
  cursor: pointer;
}

button:active {
  opacity: 0.8;
}

input, textarea {
  font-family: inherit;
}

input:focus, textarea:focus {
  outline: none;
}

/* Utilities */

.hidden {
  display: none !important;
}

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

.mt-1 { margin-top: 0.5rem; }
.mt-2 { margin-top: 1rem; }
.mt-4 { margin-top: 2rem; }

.mb-1 { margin-bottom: 0.5rem; }
.mb-2 { margin-bottom: 1rem; }
.mb-4 { margin-bottom: 2rem; }

.p-2 { padding: 1rem; }
.p-4 { padding: 2rem; }

/* Responsive */
@media (max-width: 640px) {
  body {
    font-size: 14px;
  }
}

/* Animations */
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes slideUp {
  from { 
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.fade-in {
  animation: fadeIn 0.3s ease-in;
}

.slide-up {
  animation: slideUp 0.3s ease-out;
}