@charset "UTF-8";

:root {
  /* Dark theme (default) */
  --bg: #0f0e0d;
  --bg-soft: #151310;
  --card: #1c1814;
  --card-2: #181511;
  --border: #40352b;
  --border-soft: rgba(243, 182, 128, 0.11);
  --text: #eee7df;
  --heading: #fffaf5;
  --body: #decec0;
  --muted: #ac9b8a;
  --muted-2: #817369;
  --card-bg: rgba(24, 21, 17, 0.92);
  --header-bg: rgba(15, 14, 13, 0.8);
  --input-bg: #14110f;
  --body-grad-1: rgba(224, 111, 42, 0.1);
  --body-grad-2: rgba(20, 184, 166, 0.06);
  --blue: #e06f2a;
  --blue-2: #c45a1b;
  --blue-light: #f3b680;
  --green: #22c55e;
  --red: #ef4444;
  --yellow: #f59e0b;
  --purple: #c084fc;
  --radius: 16px;
  --radius-sm: 10px;
  --shadow: 0 24px 60px rgba(0, 0, 0, 0.32);
  --max: 1180px;
  --font: "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", sans-serif;
  --mono: "JetBrains Mono", "SFMono-Regular", Consolas, monospace;
}

html:lang(zh-CN) {
  --font: "PingFang SC", "Noto Sans SC", "Hiragino Sans GB", "Microsoft YaHei", "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

*,
*::before,
*::after { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
  margin: 0 !important;
  padding: 0 !important;
  width: 100%;
  max-width: none !important;
}

body {
  margin: 0;
  padding: 0 !important;
  width: 100% !important;
  max-width: none !important;
  font-family: var(--font);
  color: var(--text);
  background:
    radial-gradient(circle at top left, var(--body-grad-1), transparent 34%),
    radial-gradient(circle at top right, var(--body-grad-2), transparent 28%),
    var(--bg);
  line-height: 1.65;
  min-height: 100vh;
  position: relative;
}

body.theme-fluxgrid,
body.theme-fluxgrid.is-home,
body.theme-fluxgrid .site-shell,
body.theme-fluxgrid .site-main {
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
button, input, textarea { font: inherit; }

#particle-bg {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 0;
  pointer-events: none;
  opacity: 0.78;
}

html[data-theme="light"] #particle-bg {
  opacity: 0.86;
}

.site-shell {
  min-height: 100vh;
  position: relative;
  width: 100%;
  z-index: 1;
}

.flux-container {
  width: min(var(--max), calc(100% - 48px));
  max-width: var(--max) !important;
  margin: 0 auto;
}

.site-main {
  padding-bottom: 48px;
  width: 100%;
  transition: opacity 0.22s ease;
}

html.is-animating .site-main { opacity: 0; }

.pjax-progress-bar {
  position: fixed;
  top: 0;
  left: 0;
  height: 3px;
  width: 0;
  background: linear-gradient(90deg, var(--blue), var(--blue-light), #ed8b4a);
  box-shadow: 0 0 10px rgba(224, 111, 42, 0.7), 0 0 4px rgba(243, 182, 128, 0.9);
  z-index: 9999;
  opacity: 0;
  pointer-events: none;
  border-radius: 0 2px 2px 0;
}

/* ===== Card entrance animations (viewport-triggered) =====
 * 默认隐藏,JS 用 IntersectionObserver 检测进入视口后加 .is-visible 触发过渡。
 * 批次内的错峰延迟由 JS 控制。
 */
.post-stack .post-card,
.list-wrap .list-item,
.featured-grid .featured-card,
.home-project-feature,
.home-project-card,
.home-hot-feature,
.home-hot-card,
.home-toy-card,
.sidebar .side-card,
.empty-panel,
.pagination-wrap,
.article-toc-panel,
.article-info,
.article-footer,
.comment-form-panel {
  opacity: 0;
  transform: translateY(10px);
  transition: opacity 0.5s cubic-bezier(0.2, 0.7, 0.3, 1),
              transform 0.5s cubic-bezier(0.2, 0.7, 0.3, 1);
  will-change: opacity, transform;
}

.post-stack .post-card.is-visible,
.list-wrap .list-item.is-visible,
.featured-grid .featured-card.is-visible,
.home-project-feature.is-visible,
.home-project-card.is-visible,
.home-hot-feature.is-visible,
.home-hot-card.is-visible,
.home-toy-card.is-visible,
.sidebar .side-card.is-visible,
.empty-panel.is-visible,
.pagination-wrap.is-visible,
.article-toc-panel.is-visible,
.article-info.is-visible,
.article-footer.is-visible,
.comment-form-panel.is-visible {
  opacity: 1;
  transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
  .post-stack .post-card,
  .list-wrap .list-item,
  .featured-grid .featured-card,
  .home-project-feature,
  .home-project-card,
  .home-hot-feature,
  .home-hot-card,
  .home-toy-card,
  .sidebar .side-card,
  .empty-panel,
  .pagination-wrap,
  .article-toc-panel,
  .article-info,
  .article-footer,
  .comment-form-panel {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}