/* ============================================================
   风月娘 UI · 设计系统 (FengYueNiang Design System) v1
   自有设计语言：红主 / 金辅 / 墨底 / 玉字 / 宋体骨
   挂在原框架之上，逐层重绘，属"风月娘创新工坊"专属
   ============================================================ */
:root{
  --fy-red:#e04a3a;          /* 主色·绯 */
  --fy-red-deep:#c93a2c;     /* 深绯 */
  --fy-red-soft:#f0a48c;     /* 浅绯 */
  --fy-gold:#d9a44a;         /* 辅·云纹金 */
  --fy-gold-soft:#e9cf9a;    /* 浅金 */
  --fy-ink:#0e0b0c;          /* 墨底 */
  --fy-card:#1a1418;         /* 卡片墨红 */
  --fy-line:rgba(217,164,74,.25);   /* 金细线 */
  --fy-line-red:rgba(224,74,58,.35);
  --fy-text:#f5eee6;         /* 玉白 */
  --fy-sub:#a89486;          /* 次级文字 */
  --fy-r:13px;               /* 统一圆角·去卡通化 */
  --fy-r-sm:9px;
}
/* —— 文字气质：宋体骨（国风） —— */
html,body{font-family:"Noto Serif SC","Songti SC","Source Han Serif SC",serif}
h1,h2,h3,h4,article h3{font-family:"Noto Serif SC","Songti SC",serif;letter-spacing:.01em}
/* 数字/英文保持清秀 */
[class*="tabular"],time,.font-mono{font-family:Quicksand,ui-rounded,system-ui}

/* —— 圆角体系收敛 —— */
[class*="rounded-3xl"]{border-radius:18px}
[class*="rounded-2xl"]{border-radius:var(--fy-r)}
[class*="rounded-xl"]{border-radius:var(--fy-r-sm)}
button{border-radius:var(--fy-r-sm)}

/* —— 选中/焦点 —— */
::selection{background:var(--fy-red);color:#fff}
:focus-visible{outline:2px solid var(--fy-red);outline-offset:2px}

/* —— 滚动条 —— */
::-webkit-scrollbar{width:9px;height:9px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#e04a3a,#8a2a20);border-radius:99px;border:2px solid #0e0b0c}
::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,#f06a52,#a33327)}

/* —— 顶栏：墨底金线 —— */
header{border-bottom:1px solid var(--fy-line)}
header nav a[aria-current="page"],header nav a.active{color:var(--fy-gold)}

/* —— 按钮：主红 / 次金线 —— */
button,[role="button"]{transition:transform .12s ease,box-shadow .12s ease}
button:active,[role="button"]:active{transform:scale(.97)}
.btn-primary,[class*="bg-["]{/*载体保留，靠 token 体系 */}

/* —— 卡片金细线 —— */
article,[class*="border"][class*="rounded"]{border-color:var(--fy-line)}

/* —— 输入框 —— */
input,textarea,select{border-color:var(--fy-line)}
input:focus,textarea:focus{border-color:var(--fy-red)!important}

/* —— 分隔线 —— */
hr{border-color:var(--fy-line)}

/* —— 链接 hover —— */
a{transition:color .15s}
main a:hover{color:var(--fy-gold-soft)}

/* —— 弹窗 —— */
[role="dialog"]{border:1px solid var(--fy-line)!important;box-shadow:0 24px 80px rgba(224,74,58,.12),0 12px 40px #000c!important}

/* —— 顶部滚动公告、跑马灯装饰条统一色调 —— */
[class*="animate-"],[class*="marquee"]{color:inherit}

/* —— 全局细节：图片圆角收敛 —— */
img{border-radius:var(--fy-r-sm)}
button img,[class*="rounded-full"] img{border-radius:inherit}

/* —— 徽标/角标 —— */
[class*="badge"],[class*="tag"]{border-radius:99px}

/* —— 底部留白节奏 —— */
main{padding-bottom:2px}
/* ============================================================
   风月娘 UI · v2 定向重绘（组件命名空间精准打击）
   ============================================================ */

/* —— 顶栏毛玻璃融合 —— */
header{backdrop-filter:blur(14px) saturate(1.1);background:rgba(14,10,11,.72)!important}

/* —— 卡片体系：金细线 + 悬浮反馈 —— */
.ts-card,.lobby-ranked-card,[class*="ts-card-stat"]{transition:transform .18s ease,box-shadow .18s ease}
.ts-card:hover,.lobby-ranked-card:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(224,74,58,.16),0 4px 14px #000a}

/* —— 热门标记 —— */
.ts-hot{letter-spacing:.05em}

/* —— 框架装饰金线 —— */
.brand-frame,.kit-frame{border:1px solid var(--fy-line)!important}

/* —— 区块标题：红竖笔（专属笔触） —— */
h2{position:relative}
h2::before{content:"";position:absolute;left:-14px;top:50%;transform:translateY(-50%);width:4px;height:1.05em;border-radius:2px;background:linear-gradient(180deg,#f06a52,#c93a2c);opacity:.95}
/* 弹窗标题除外 */
.gt-title::before{display:none}

/* —— 背景：一抹月晕（极淡） —— */
body{background-image:radial-gradient(1100px 520px at 82% -60px,rgba(224,74,58,.14),transparent 62%),radial-gradient(900px 460px at -80px 32%,rgba(217,164,74,.05),transparent 60%)!important;background-attachment:fixed}

/* —— 底部导航（移动）色调 —— */
nav[class*="bottom"],footer{backdrop-filter:blur(12px)}

/* —— 输入/选择聚焦 —— */
[class*="focus"]:focus-within{border-color:var(--fy-red-soft)}

/* ===== v3 · 窄屏适配（2026-10-09 · 换态 v5.3.6 后加） =====
   ① 768–940：顶栏次级入口收纳（隐藏 社区/API/创作，防 930px 横向溢出；三者侧栏均可达）
   ② ≤768：hero 装饰收边（模糊底图/光斑/超宽轮播不再撑出横向滚动） */
@media (min-width: 768px) and (max-width: 939.98px) {
  [class*="group/nav"] nav > :nth-child(6),
  [class*="group/nav"] nav > :nth-child(7),
  [class*="group/nav"] nav > :nth-child(8) { display: none; }
  /* 充值等页：grid 子项允许收缩（修 5px 溢出） */
  section.space-y-4 .grid.items-center > * { min-width: 0; }
  section.space-y-4 .mt-2.flex.flex-col { min-width: 0; }
  /* 按钮行内容防溢出（充值方式行）：收紧并允许省略 */
  section.space-y-4 .mt-2 button.group { padding-left: .625rem; padding-right: .625rem; gap: .5rem; }
  section.space-y-4 .mt-2 button.group span.whitespace-nowrap { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
}
@media (max-width: 767.98px) {
  main section { overflow-x: clip; }  /* 全 section：轮播/模糊底/光斑一律收边 */
}

/* ===== perf: 长列表离屏渲染跳过 ===== */
[class*="lg:grid-cols-5"]>div{content-visibility:auto;contain-intrinsic-size:auto 480px}
