/* 品牌站：首页、政策页、404、全站页脚。颜色变量来自 engine/style.css（Highlighter 主题） */
.site-hero { text-align: center; padding: 8vh 0 28px; }
.site-hero h1 { font-size: clamp(34px, 9vw, 52px); letter-spacing: -.02em; }
.brand-title { display: inline-flex; align-items: center; gap: .2em; }
.brand-logo { width: 1.15em; height: 1.15em; }
.site-hero .lead { color: var(--muted); }
.site-hero .primary { display: inline-block; max-width: 320px; margin-top: 12px; text-decoration: none; }
.test-list { display: grid; gap: 14px; margin-bottom: 24px; }
.test-card { display: flex; gap: 16px; align-items: center; padding: 18px; border-radius: var(--radius); background: var(--panel); color: inherit; text-decoration: none; border: 1.5px solid transparent; transition: border-color .2s; }
.test-card:hover { border-color: var(--accent); }
.test-card-art { width: 96px; height: auto; flex: none; }
.test-card-body h2 { font-size: 21px; margin-bottom: 6px; }
.test-card-body p { margin-bottom: 6px; }
.test-card-cta { color: var(--accent-text); font-weight: 700; }
@media (max-width: 420px) { .test-card { flex-direction: column; text-align: center; } }
.legal { padding-top: 12px; }
.legal h1 { font-size: 30px; margin-top: 12px; }
.legal h2 { font-size: 18px; margin-top: 26px; }
.legal a, .site-footer a { color: var(--accent-text); }
.site-footer { max-width: 640px; margin: 0 auto; padding: 18px 16px 40px; border-top: 1px solid var(--line); text-align: center; color: var(--muted); font-size: 13px; }
.site-footer p { margin: 0 0 6px; }
@media print { .site-footer, .langs { display: none; } }

/* ---------- 柚子点缀（2026-11-13 猫猫要的：首页背景切片、页脚小柚子、404 滚走的柚子、卡片悬停冒切片）---------- */
body[data-page="home"] { overflow-x: clip; }
body[data-page="home"] .site-hero { position: relative; }
body[data-page="home"] .site-hero::before, body[data-page="home"] .site-hero::after {
  content: ""; position: absolute; z-index: -1; pointer-events: none; background: url(/assets/yuzu-slice.svg) center / contain no-repeat;
}
body[data-page="home"] .site-hero::before { width: 170px; height: 170px; top: 10px; right: -80px; opacity: .2; transform: rotate(18deg); }
body[data-page="home"] .site-hero::after { width: 130px; height: 130px; top: 190px; left: -90px; opacity: .14; transform: rotate(-12deg); }
.footer-yuzu { width: 14px; height: 14px; vertical-align: -2px; margin-right: 5px; }
.test-card { position: relative; overflow: hidden; }
.test-card::after {
  content: ""; position: absolute; width: 70px; height: 70px; top: -20px; right: -20px; pointer-events: none;
  background: url(/assets/yuzu-slice.svg) center / contain no-repeat; transform: scale(0) rotate(-40deg); opacity: 0;
  transition: transform .35s cubic-bezier(.2, .8, .2, 1.3), opacity .25s;
}
.test-card:hover::after { transform: scale(1) rotate(0); opacity: .9; }
.nf-track { width: 220px; height: 64px; margin: 0 auto 18px; position: relative; overflow: hidden; }
.nf-yuzu { width: 52px; height: 52px; position: absolute; bottom: 0; left: 84px; animation: nf-roll 2.6s cubic-bezier(.5, 0, .7, 1) infinite; }
@keyframes nf-roll {
  0%, 25% { transform: translateX(0) rotate(0); opacity: 1; }
  85% { transform: translateX(150px) rotate(300deg); opacity: 1; }
  86% { opacity: 0; } 87% { transform: translateX(-140px) rotate(-60deg); opacity: 0; }
  100% { transform: translateX(0) rotate(0); opacity: 1; }
}
@media (prefers-reduced-motion: reduce) { .nf-yuzu { animation: none; } .test-card::after { transition: none; } }
