/* 深色玻璃拟态前台 */
:root {
  --bg: #0e1a24;
  --card: rgba(25,35,50,0.55);
  --border: rgba(255,255,255,0.12);
  --text: #f0f3fa;
  --text-dim: #bdd4ff;
  --accent: #5d9eff;
  --radius: 20px;
}
* { margin:0; padding:0; box-sizing:border-box; }
body.yf-home {
  font-family: 'Segoe UI','PingFang SC','Microsoft YaHei',sans-serif !important;
  background: radial-gradient(circle at 20% 30%, #1a2a3a, #0e1a24) !important;
  color: var(--text) !important;
  min-height:100vh;
}
.yf-wrap { max-width:480px; margin:0 auto; padding:20px 16px 40px; position:relative; z-index:1; }
.yf-hero { text-align:center; padding:30px 0 20px; }
.yf-hero-title {
  font-size:1.8rem !important; font-weight:600;
  background: linear-gradient(135deg,#fff,#cbd5e6);
  -webkit-background-clip:text; background-clip:text; color:transparent !important;
}
.yf-hero-sub { color:var(--text-dim) !important; margin-top:8px; font-size:0.95rem; }
.yf-notice {
  background: var(--card) !important;
  backdrop-filter: blur(12px);
  border:1px solid var(--border) !important;
  border-radius:16px !important;
  padding:12px 16px; margin-bottom:16px;
  color: var(--text-dim) !important;
  font-size:0.85rem;
}
.yf-panel {
  background: var(--card) !important;
  backdrop-filter: blur(12px);
  border:1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  padding:20px !important;
  margin-bottom:16px !important;
  box-shadow: 0 10px 30px rgba(0,0,0,0.3) !important;
}
.yf-panel-head { font-size:1.1rem !important; color:var(--text) !important; margin-bottom:14px; text-align:center; font-weight:600; }
.yf-tier-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.yf-tier {
  background: rgba(15,25,35,0.6) !important;
  border:1px solid var(--border) !important;
  border-radius:16px !important;
  padding:16px; text-align:center; cursor:pointer; transition:all 0.2s;
}
.yf-tier:hover, .yf-tier.is-active {
  border-color: var(--accent) !important;
  background: rgba(60,110,255,0.15) !important;
  box-shadow: 0 0 15px rgba(93,158,255,0.3) !important;
}
.yf-tier-img { width:60px; height:60px; margin:0 auto 8px; border-radius:12px; }
.yf-tier-name { color: var(--text) !important; font-size:0.9rem !important; }
.yf-tier-price { color:#ffd700 !important; font-weight:700 !important; font-size:1.1rem !important; background:none !important; }
.yf-board {
  background: var(--card) !important;
  backdrop-filter: blur(12px);
  border:1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  padding:20px !important;
}
.yf-board-item {
  display:flex; justify-content:space-between; align-items:center;
  padding:12px 0; border-bottom:1px solid rgba(255,255,255,0.06);
  color: var(--text) !important;
}
.yf-board-item:last-child { border-bottom:none; }
.yf-footer { text-align:center; color:rgba(180,210,255,0.4) !important; font-size:0.75rem; margin-top:20px; }
.yf-contacts { display:flex; gap:10px; justify-content:center; flex-wrap:wrap; }
.yf-contact {
  background: rgba(15,25,35,0.6) !important;
  border:1px solid var(--border) !important;
  border-radius:12px; padding:10px 16px; color:var(--text-dim) !important; font-size:0.85rem;
}
/* 隐藏品牌插画占位圆 */
.yf-hero .brand-illustration, .yf-hero img[alt=""], .yf-hero .illustration { display:none !important; }
/* 置顶推荐位改深色玻璃 */
.yf-pin, .pin-tuiguang, [class*="pin"], [class*="tuiguang"] {
  background: rgba(25,35,50,0.55) !important;
  backdrop-filter: blur(12px);
  border: 1px solid rgba(255,255,255,0.12) !important;
  border-radius: 20px !important;
  color: #f0f3fa !important;
}
.yf-pin a, .pin-tuiguang a { color: #5d9eff !important; }
/* 修复裂图 */
.yf-panel-head img, .section-title img { display:none !important; }
.yf-notice { display:flex; align-items:center; gap:10px; }
.yf-notice-icon { flex:0 0 auto; }
.yf-notice-icon svg { width:16px !important; height:16px !important; }
.yf-notice p { margin:0; }
/* 感谢名单改深色玻璃 */
.yf-board-card {
  background: rgba(25,35,50,0.55) !important;
  backdrop-filter: blur(12px);
  border: 1px solid rgba(255,255,255,0.12) !important;
  box-shadow: 0 10px 30px rgba(0,0,0,0.3) !important;
  color: #f0f3fa !important;
}
.yf-board-head h2 { color: #f0f3fa !important; }
.yf-board-head p { color: #bdd4ff !important; }
.yf-stat {
  background: rgba(15,25,35,0.6) !important;
  box-shadow: inset 0 1px 3px rgba(0,0,0,0.3) !important;
}
.yf-stat b { color: #f0f3fa !important; }
.yf-stat span { color: #bdd4ff !important; }
.yf-board-tabs {
  background: rgba(15,25,35,0.6) !important;
  box-shadow: inset 0 1px 3px rgba(0,0,0,0.3) !important;
}
.yf-tab { color: #bdd4ff !important; }
.yf-tab.active, .yf-tab[aria-selected="true"] {
  background: rgba(60,110,255,0.2) !important;
  color: #7ca9ff !important;
}
.yf-board-empty { color: #bdd4ff !important; }