/* 第六音素 自定义样式 - 配合 Tailwind CDN 使用 */

:root {
  --brand-pink: #ec4899;
  --brand-orange: #f97316;
  --brand-indigo: #6366f1;
}

body {
  font-family: "PingFang SC", "Helvetica Neue", Helvetica, Arial, "Microsoft YaHei", sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* 玻璃导航 */
.glass-nav {
  backdrop-filter: saturate(180%) blur(14px);
  -webkit-backdrop-filter: saturate(180%) blur(14px);
}

/* 隐藏滚动条但保留滚动 */
.hide-scrollbar::-webkit-scrollbar { display: none; }
.hide-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

/* 自定义 audio 控件样式 */
audio::-webkit-media-controls-panel {
  background: rgba(255, 255, 255, 0.8);
}

/* 工具按钮 hover 反馈 */
button, a { transition: all 0.15s ease; }

/* 选区颜色 */
::selection {
  background: rgba(236, 72, 153, 0.2);
  color: #be185d;
}

/* 滚动条 */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-track {
  background: transparent;
}
::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.15);
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: rgba(0, 0, 0, 0.25);
}

/* x-cloak 防止 Alpine 闪烁 */
[x-cloak] { display: none !important; }

/* 文本渐变 */
.text-gradient {
  background: linear-gradient(135deg, #ec4899, #f97316);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* 漂亮分割线 */
.divider-gradient {
  height: 1px;
  background: linear-gradient(to right, transparent, #d1d5db, transparent);
}