@import "tailwindcss";

@theme {
  --animate-page-enter: pageEnter 0.8s ease-out forwards;
  --animate-fade-up: fadeUp 0.35s ease-out;
}

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

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

@layer base {
  * {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  *::-webkit-scrollbar {
    display: none;
  }

  html {
    font-size: 18px;
    -webkit-text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }

  @media (max-width: 768px) {
    html { font-size: 16px; }
  }

  body {
    font-family: 'KaiTi', '楷体', 'STKaiti', 'AR PL UKai CN', 'AR PL KaitiM GB',
      -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Helvetica Neue',
      sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    line-height: 1.6;
    color: #333;
    background: transparent;
    overflow-x: hidden;
  }

  a { color: inherit; text-decoration: none; }
  button { border: none; background: none; cursor: pointer; font-family: inherit; }
  input, textarea { border: none; outline: none; font-family: inherit; }
  ul, ol { list-style: none; }
  img { max-width: 100%; height: auto; }
}

/* 粒子效果样式 */
.click-particle {
  will-change: transform, opacity;
  animation-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  filter: blur(0.5px);
  transform: translateZ(0);
  backface-visibility: hidden;
}

.click-ripple {
  will-change: transform, opacity;
  animation-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transform: translateZ(0);
  backface-visibility: hidden;
}

@media (prefers-reduced-motion: reduce) {
  .click-particle,
  .click-ripple {
    animation-duration: 0.3s;
  }
}