/*
Theme Name: 狮子座 · 王者星曜
Theme URI: https://example.com/leo-royal
Author: WorkBuddy AI
Author URI: https://example.com
Description: 一款满屏「皇家金 × 曜石紫」气质的狮子座(Leo)星座主题。沿用原版满屏区块与卡片布局体系，帝王金、曜石紫为底，狮星符号、太阳纹章与十二功绩相映成辉。内置自动建页、后台视频上传(mp4/Bilibili/YouTube)、滚动渐显动画与响应式布局，开箱即用。
Version: 1.0.0
Requires at least: 5.0
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: leo
Tags: constellation, zodiac, chinese-style, one-column, custom-menu, custom-logo, translation-ready
*/

/* ============================================================
   00 设计令牌：皇家金 × 曜石紫
   ============================================================ */
:root {
  --noon:    #171223;   /* 曜石紫深夜 */
  --night:   #1f1730;   /* 副夜空 */
  --night2:  #271b3a;   /* 卡片夜空 */
  --night3:  #2f2147;
  --royal:   #3a2b56;
  --cream:   #f5ecd7;
  --cream2:  #e9dfc4;
  --gold:    #d4a837;
  --gold-hi: #e9c45e;
  --gold-so: #f4e3a8;
  --crimson: #c0392b;
  --ink-faint: #9c92b8;
  --line:    #3d2f56;
  --font-kai: "Noto Serif SC","Kaiti SC","KaiTi","STKaiti",serif;
  --font-lat: "Cinzel","Times New Roman",serif;
  --maxw: 1200px;
  --nav-h: 72px;
}

* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { font-family: var(--font-kai); background: var(--night); color: var(--cream); line-height: 1.9; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; height: auto; display: block; }
ul { list-style: none; }
::selection { background: rgba(233,196,94,.9); color: #1a1026; }

/* 星芒分隔符 */
.seal-divider { display:flex; align-items:center; gap:14px; justify-content:center; margin:26px auto; color:var(--gold); }
.seal-divider::before,.seal-divider::after { content:""; height:1px; width:120px; background:linear-gradient(90deg,transparent,var(--gold),transparent); }
.seal-divider span { width:9px; height:9px; background:var(--gold); transform:rotate(45deg); display:inline-block; box-shadow:0 0 12px var(--gold); }

.vertical-text { writing-mode:vertical-rl; letter-spacing:.35em; font-family:var(--font-kai); color:rgba(245,236,215,.55); }

/* ---------- 01 导航 ---------- */
.dw-nav { position:fixed; top:0; left:0; right:0; z-index:1000; height:var(--nav-h); display:flex; align-items:center; justify-content:space-between; padding:0 5vw; background:rgba(23,18,35,.9); backdrop-filter:blur(12px); border-bottom:1px solid var(--line); transition:background .4s,box-shadow .4s; }
.dw-nav.scrolled { box-shadow:0 2px 24px rgba(0,0,0,.5); border-bottom-color:var(--royal); }
.dw-nav .site-title a,.dw-nav .dw-menu a { color:var(--cream); }
.dw-nav .dw-menu a:hover,.dw-nav .dw-menu .current-menu-item a { color:var(--gold-hi); }
.site-title { font-family:var(--font-kai); font-size:20px; letter-spacing:4px; }
.site-title a { color:var(--cream); }
.site-title .logo-seal { display:inline-flex; width:34px; height:34px; border-radius:50%; background:radial-gradient(circle at 40% 34%,var(--gold-hi),var(--gold) 60%); color:#1a1026; align-items:center; justify-content:center; font-size:20px; margin-right:10px; vertical-align:-8px; box-shadow:0 0 16px rgba(233,196,94,.6); font-family:var(--font-lat); }
.dw-menu ul { display:flex; gap:2px; }
.dw-menu a { padding:8px 12px; font-size:14.5px; letter-spacing:2.5px; color:var(--cream); transition:color .3s; }
.dw-menu a:hover,.dw-menu .current-menu-item a { color:var(--gold-hi); }
.dw-menu-toggle { display:none; background:none; border:none; font-size:24px; cursor:pointer; color:var(--cream); }

/* ---------- 02 满屏区块通用 ---------- */
.fullscreen { min-height:100vh; position:relative; overflow:hidden; display:flex; align-items:center; }
.section-pad { padding:110px 5vw; }
.dw-container { max-width:var(--maxw); margin:0 auto; width:100%; }
.page-hero { min-height:60vh; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; position:relative; overflow:hidden; padding:calc(var(--nav-h) + 46px) 5vw 56px; background:radial-gradient(ellipse at 50% -10%,#3a2350 0%,var(--night) 55%,var(--noon) 100%); }
.page-hero .hero-kicker { font-size:14px; letter-spacing:10px; color:var(--gold); margin-bottom:14px; }
.page-hero h1 { font-family:var(--font-kai); font-size:clamp(38px,6vw,72px); letter-spacing:16px; font-weight:400; color:var(--cream); }
.page-hero .hero-sub { max-width:760px; margin:20px auto 0; color:#c9b8e0; font-size:16px; }

.watermark { position:absolute; inset:0; pointer-events:none; z-index:0; display:flex; align-items:center; justify-content:center; font-family:var(--font-lat); font-size:clamp(150px,24vw,360px); color:rgba(233,196,94,.05); letter-spacing:.06em; white-space:nowrap; }
.dark-section .watermark { color:rgba(244,227,168,.05); }

.reveal { opacity:0; transform:translateY(36px); transition:opacity 1s ease,transform 1s ease; }
.reveal.visible { opacity:1; transform:none; }
.reveal-d1 { transition-delay:.15s; } .reveal-d2 { transition-delay:.3s; }
.reveal-d3 { transition-delay:.45s; } .reveal-d4 { transition-delay:.6s; }

/* ---------- 03 首页 ---------- */
.hero-home { background:linear-gradient(rgba(23,18,35,.7),rgba(23,18,35,.85)),radial-gradient(ellipse at 30% 20%,rgba(154,62,94,.35),transparent 45%),radial-gradient(ellipse at 78% 30%,rgba(212,168,55,.2),transparent 50%),var(--noon); flex-direction:column; justify-content:center; position:relative; }
.hero-home.has-banner .bg-banner { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.85; z-index:0; }
.hero-home.has-banner::after { content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(180deg,rgba(15,10,24,.55),rgba(23,18,35,.3) 45%,var(--noon) 95%); }
.hero-home .mountain-layer { position:absolute; left:0; right:0; bottom:0; height:34vh; pointer-events:none; z-index:1; }
.hero-inner { position:relative; z-index:2; text-align:center; }
.hero-kicker-lat { font-family:var(--font-lat); font-size:19px; letter-spacing:18px; color:var(--gold); text-transform:uppercase; margin-bottom:8px; }
.hero-title-big { font-family:var(--font-lat); font-size:clamp(66px,13vw,168px); letter-spacing:clamp(8px,3vw,36px); font-weight:700; color:var(--cream); text-shadow:0 8px 60px rgba(233,196,94,.35); }
.hero-title-cn { font-family:var(--font-kai); font-size:clamp(30px,4.6vw,54px); letter-spacing:clamp(10px,3vw,26px); color:var(--gold-so); margin-top:6px; font-weight:400; }
.hero-subtitle { font-size:clamp(14px,1.8vw,18px); letter-spacing:8px; color:#e6dcc0; margin-top:18px; }
.hero-liner { margin-top:22px; font-family:var(--font-kai); font-size:18px; letter-spacing:5px; color:var(--gold-hi); }
.hero-date { display:inline-block; margin-top:22px; padding:7px 22px; border:1px solid var(--gold); color:var(--gold-so); font-family:var(--font-lat); letter-spacing:5px; font-size:15px; border-radius:40px; background:rgba(212,168,55,.08); }
.hero-scroll { position:absolute; bottom:3.5vh; left:50%; transform:translateX(-50%); z-index:3; text-align:center; color:var(--ink-faint); font-size:13px; letter-spacing:4px; }
.hero-scroll .line { width:1px; height:48px; margin:8px auto 0; background:linear-gradient(180deg,var(--gold),transparent); animation:drip 2.2s infinite ease-in-out; }
@keyframes drip { 0%{transform:scaleY(0);transform-origin:top;} 55%{transform:scaleY(1);transform-origin:top;} 100%{transform:scaleY(0);transform-origin:bottom;} }
.hero-side-verse { position:absolute; top:50%; transform:translateY(-50%); z-index:2; font-size:15px; }
.hero-side-verse.left { left:4vw; } .hero-side-verse.right { right:4vw; text-align:center; }
.side-seal { display:inline-block; margin-top:14px; padding:7px 12px; border:1px solid var(--gold); color:var(--gold-hi); font-size:14px; letter-spacing:3px; border-radius:4px; font-family:var(--font-kai); }

.home-intro { background:var(--night); position:relative; }
.home-intro-grid { display:grid; grid-template-columns:1.1fr .9fr; gap:5vw; align-items:center; }
.home-intro h2 { font-family:var(--font-kai); font-size:clamp(28px,3.4vw,42px); letter-spacing:8px; font-weight:400; color:var(--gold-hi); margin-bottom:20px; }
.home-intro p { color:#cfc3e2; font-size:16px; text-align:justify; }
.intro-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:34px; }
.intro-stats .stat { border-top:2px solid var(--gold); padding-top:14px; }
.intro-stats .num { font-size:32px; font-family:var(--font-lat); color:var(--gold-hi); }
.intro-stats .lbl { font-size:13.5px; color:var(--ink-faint); letter-spacing:2px; font-family:var(--font-kai); }
.intro-taiji { display:flex; align-items:center; justify-content:center; }
.intro-leo-sym { display:flex; align-items:center; justify-content:center; }
.intro-leo-sym svg { width:min(320px,58%); filter:drop-shadow(0 12px 40px rgba(233,196,94,.35)); }

.home-paths { background:var(--night2); position:relative; }
.paths-head { text-align:center; margin-bottom:60px; }
.paths-head h2 { font-family:var(--font-kai); font-size:clamp(28px,3.8vw,46px); letter-spacing:12px; font-weight:400; color:var(--gold-hi); }
.paths-head p { color:var(--ink-faint); letter-spacing:5px; margin-top:10px; font-family:var(--font-kai); }
.paths-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.path-card { background:linear-gradient(160deg,rgba(63,44,90,.5),rgba(39,27,58,.9)); border:1px solid var(--line); padding:40px 32px; border-radius:10px; position:relative; overflow:hidden; transition:transform .5s ease,box-shadow .5s ease,border-color .5s; }
.path-card:hover { transform:translateY(-8px); box-shadow:0 22px 46px rgba(0,0,0,.4); border-color:var(--gold); }
.path-card::after { content:attr(data-char); position:absolute; right:-8px; bottom:-40px; font-family:var(--font-lat); font-size:150px; color:rgba(233,196,94,.05); line-height:1; }
.path-card .idx { font-size:12.5px; color:var(--gold); letter-spacing:4px; font-family:var(--font-kai); }
.path-card h3 { font-family:var(--font-kai); font-size:23px; letter-spacing:5px; margin:12px 0 14px; font-weight:400; color:var(--gold-so); }
.path-card p { font-size:14px; color:#cbc0dc; min-height:96px; text-align:justify; }
.path-card .more { display:inline-block; margin-top:16px; font-size:14px; color:var(--gold-hi); letter-spacing:2px; }
.path-card .more::after { content:"→"; margin-left:6px; transition:margin-left .3s; }
.path-card:hover .more::after { margin-left:12px; }

.home-quote { background:radial-gradient(ellipse at 50% 30%,var(--night2),var(--noon) 75%); color:var(--cream); text-align:center; flex-direction:column; justify-content:center; border-top:1px solid var(--line); }
.home-quote blockquote { font-family:var(--font-kai); font-size:clamp(22px,3.2vw,38px); letter-spacing:6px; font-weight:400; max-width:920px; color:var(--gold-so); }
.home-quote cite { display:block; margin-top:24px; font-style:normal; font-size:15px; color:var(--ink-faint); letter-spacing:5px; }
.home-quote .quote-mark { font-size:88px; color:var(--gold); line-height:.6; font-family:var(--font-kai); text-shadow:0 0 30px rgba(233,196,94,.4); }

/* ===== 页头横幅背景（每页可加一张淡图作为氛围） ===== */
.hero-bg { position:absolute; inset:0; z-index:0; overflow:hidden; }
.hero-bg img { width:100%; height:100%; object-fit:cover; opacity:.22; }
.hero-bg::after { content:""; position:absolute; inset:0; background:radial-gradient(ellipse at 50% 0%,rgba(23,18,35,0),var(--noon) 120%); }
.section-dark > * , .starry > .dw-container , .starry .hero-inner{ position:relative; z-index:2; }

/* ---------- 通用分节小标题 ---------- */
.sec-head { text-align:center; margin-bottom:52px; }
.sec-head .k { font-family:var(--font-lat); font-size:13px; letter-spacing:8px; color:var(--gold); text-transform:uppercase; }
.sec-head h2 { font-family:var(--font-kai); font-size:clamp(28px,3.8vw,44px); letter-spacing:14px; font-weight:400; color:var(--gold-hi); margin:8px 0 6px; }
.sec-head p { color:var(--ink-faint); letter-spacing:4px; font-size:14px; }

/* ===== data 数据带 ===== */
.dtl-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; background:var(--night2); padding:54px 5vw; text-align:center; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.dtl-stats .num { font-family:var(--font-lat); font-size:40px; color:var(--gold-hi); }
.dtl-stats .lbl { font-size:13px; letter-spacing:3px; color:var(--ink-faint); margin-top:4px; font-family:var(--font-kai); }
.dtl-stats.four { grid-template-columns:repeat(4,1fr); }
.dtl-stats.three { grid-template-columns:repeat(3,1fr); }

/* ===== 竖向条目（神话 3/6 页用） ===== */
.vlist { margin-top:46px; display:flex; flex-direction:column; gap:18px; }
.vrow { display:flex; gap:22px; align-items:flex-start; background:linear-gradient(160deg,rgba(63,44,90,.35),rgba(39,27,58,.8)); border:1px solid var(--line); padding:28px 30px; border-radius:12px; transition:border-color .4s; }
.vrow:hover { border-color:var(--gold); }
.vrow .vr-no { font-family:var(--font-lat); font-size:15px; color:var(--gold); letter-spacing:2px; min-width:78px; padding-top:4px; }
.vrow .vr-head h4 { font-size:17px; color:var(--gold-so); letter-spacing:2px; margin-bottom:6px; }
.vrow .vr-head p { font-size:14.2px; color:#c6bad8; text-align:justify; }

/* ===== 星级评级（通用） ===== */
.star-row { color:var(--gold); letter-spacing:4px; font-size:17px; }
.star-row .off { color:rgba(255,255,255,.14); }

/* ---------- 页脚 ---------- */
.dw-footer { background:#0d0917; color:#8f85a8; text-align:center; padding:58px 5vw; border-top:1px solid var(--line); }
.dw-footer .foot-verse { font-family:var(--font-kai); font-size:18px; letter-spacing:8px; color:#cfc3e2; margin-bottom:12px; }
.dw-footer p { font-size:14px; }
.dw-footer a { color:#cfc3e2; }
.dw-footer a:hover { color:var(--gold-hi); }
.dw-footer .foot-sig { font-family:var(--font-lat); letter-spacing:6px; font-size:12.5px; color:var(--gold); margin:6px 0 18px; text-transform:uppercase; }
.foot-menu { display:flex; flex-wrap:wrap; gap:6px; justify-content:center; }
.foot-menu li a { padding:6px 12px; font-size:13.5px; letter-spacing:3px; }

/* ====== 通用内容卡片网格 / 布局区 ====== */
.wrap { background:var(--night); position:relative; }
.wrap-2 { background:var(--night2); position:relative; }
.icon-card { background:linear-gradient(160deg,rgba(63,44,90,.45),rgba(39,27,58,.9)); border:1px solid var(--line); border-radius:14px; padding:36px 30px; transition:transform .5s,border-color .5s; }
.icon-card:hover { transform:translateY(-6px); border-color:var(--gold); }
.icon-card .ic-sym { font-family:var(--font-lat); font-size:30px; color:var(--gold-hi); display:block; margin-bottom:6px; }
.icon-card .ic-k { font-family:var(--font-lat); font-size:12.5px; letter-spacing:4px; color:var(--gold); text-transform:uppercase; }
.icon-card h3 { font-family:var(--font-kai); font-size:22px; letter-spacing:4px; font-weight:400; color:var(--gold-so); margin:8px 0 12px; }
.icon-card p { font-size:14px; color:#cdc1de; text-align:justify; }

.tri-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.quad-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:22px; }
.dual-grid { display:grid; grid-template-columns:1fr 1fr; gap:26px; }
.trio-feature { display:grid; grid-template-columns:1.1fr; }
@media (min-width:981px) { .clip-grid-lg { grid-template-columns:repeat(2,1fr);} }

.big-quote { text-align:center; padding:110px 5vw; background:radial-gradient(ellipse at 50% 30%,var(--night2),var(--noon) 80%); }
.big-quote .q-mark { font-size:80px; color:var(--gold); font-family:var(--font-kai); line-height:.5; }
.big-quote p.q-main { font-family:var(--font-kai); font-size:clamp(20px,2.8vw,34px); letter-spacing:5px; color:var(--gold-so); max-width:900px; margin:24px auto 0; }
.big-quote cite { display:block; margin-top:20px; font-style:normal; color:var(--ink-faint); letter-spacing:4px; font-size:14.5px; }

/* 标签组 */
.tag-row { display:flex; flex-wrap:wrap; gap:9px; }
.tag-row span { font-size:12.5px; border:1px solid var(--royal); color:#d8cde8; padding:4px 13px; border-radius:30px; letter-spacing:1.5px; background:rgba(0,0,0,.18); }

/* ===== 双栏竖排意境（左右对开） ===== */
.duo { display:grid; grid-template-columns:1fr 1fr; gap:5vw; align-items:center; }
.duo .dtx h3 { font-family:var(--font-kai); font-size:clamp(25px,3vw,40px); letter-spacing:10px; font-weight:400; color:var(--gold-hi); margin-bottom:18px; }
.duo .dtx p { color:#cfc3e2; font-size:15.5px; text-align:justify; margin-bottom:14px; }
.duo .dtx .serif-o { font-family:var(--font-kai); color:var(--gold); letter-spacing:3px; font-size:16px; line-height:2.2; }
.duo-art { display:flex; justify-content:center; }
.duo-art svg, .duo-art img { width:min(380px,86%); filter:drop-shadow(0 16px 44px rgba(233,196,94,.3)); }

/* ===== 配对计量 ===== */
.compat { background:linear-gradient(160deg,rgba(63,44,90,.45),rgba(39,27,58,.9)); border:1px solid var(--line); border-radius:14px; padding:28px 24px; text-align:center; transition:transform .5s,border-color .5s; }
.compat:hover { transform:translateY(-5px); border-color:var(--gold); }
.compat .pair-zod { font-family:var(--font-lat); font-size:40px; color:var(--gold-hi); line-height:1; }
.compat .pair-name { font-family:var(--font-kai); font-size:14px; letter-spacing:3px; color:var(--ink-faint); margin:4px 0 8px; }
.compat p { font-size:13.6px; color:#c6bad8; text-align:justify; }
.meter-wrap { height:6px; background:rgba(255,255,255,.09); border-radius:6px; margin:14px 0 6px; overflow:hidden; }
.meter { height:100%; border-radius:6px; background:linear-gradient(90deg,var(--crimson),var(--gold-hi)); width:0; }

/* ===== 视频区 ===== */
.video-page .page-hero h1 { color:var(--cream); }
.video-page .page-hero .hero-kicker { color:var(--gold); }
.video-page .page-hero .hero-sub { color:#b9acd6; }
.video-main { background:var(--noon); padding-bottom:130px; }
.video-shell { background:#000; border:1px solid rgba(255,255,255,.15); position:relative; aspect-ratio:16/9; display:flex; align-items:center; justify-content:center; border-radius:14px; overflow:hidden; box-shadow:0 30px 90px rgba(0,0,0,.6); }
.video-shell iframe, .video-shell video { position:absolute; inset:0; width:100%; height:100%; border:0; }
.video-empty { text-align:center; color:#9c92b8; padding:46px; background:transparent; }
.video-empty .empty-leo { width:92px; margin:0 auto 24px; animation:glow-sun 5s infinite ease-in-out; }
.video-empty h3 { font-family:var(--font-kai); font-size:26px; letter-spacing:8px; color:#e4d9f0; margin-bottom:12px; font-weight:400; }
.video-empty p { font-size:14.5px; color:#a99bc4; line-height:2.1; }
.video-guide { margin-top:44px; display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.vg-card { background:linear-gradient(160deg,rgba(63,44,90,.4),rgba(39,27,58,.9)); border:1px solid var(--line); border-radius:12px; padding:30px 28px; transition:border-color .4s; }
.vg-card:hover { border-color:var(--gold); }
.vg-card .vg-step { font-family:var(--font-lat); color:var(--gold); font-size:13px; letter-spacing:3px; }
.vg-card h4 { font-size:16px; color:var(--gold-so); margin:10px 0 8px; letter-spacing:2px; font-family:var(--font-kai); }
.vg-card p { font-size:13.5px; color:#c0b4d4; line-height:1.9; }
.vg-card code { background:rgba(233,196,94,.12); color:var(--gold-so); padding:1px 7px; border-radius:3px; font-size:12.5px; }

/* ===== 名人卡（图+文横排） ===== */
.famous-item { display:grid; grid-template-columns:220px 1fr; background:linear-gradient(160deg,rgba(63,44,90,.4),rgba(39,27,58,.9)); border:1px solid var(--line); border-radius:14px; overflow:hidden; margin-bottom:26px; transition:border-color .4s; }
.famous-item:hover { border-color:var(--gold); }
.famous-stamp { background:radial-gradient(circle at 50% 34%,rgba(233,196,94,.26),rgba(23,18,35,.95)); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; border-right:1px solid var(--line); padding:28px 12px; text-align:center; }
.famous-stamp .f-avatar { width:92px; height:92px; border-radius:50%; object-fit:cover; border:2px solid var(--gold); box-shadow:0 0 22px rgba(233,196,94,.4); }
.famous-stamp .f-monogram { width:92px; height:92px; border-radius:50%; display:grid; place-items:center; font-family:var(--font-lat); font-size:40px; color:#2a1c16; background:radial-gradient(circle at 34% 30%,#f4e3a8,#d4a837 70%,#8a6d1c); border:2px solid var(--gold); box-shadow:0 0 22px rgba(233,196,94,.5); }
.famous-stamp .f-sym { font-family:var(--font-lat); font-size:22px; color:#d7a0e0; }
.famous-body { padding:28px 34px; }
.famous-body h3 { font-family:var(--font-kai); font-size:24px; letter-spacing:4px; color:var(--gold-so); font-weight:400; }
.famous-body .f-pos { font-size:14px; color:var(--gold); letter-spacing:3px; margin:6px 0 12px; }
.famous-body p { font-size:14.6px; color:#c6bad8; text-align:justify; }

/* ===== 十二星座配对一览 ===== */
.zod-row-line { margin-top:16px; display:flex; flex-wrap:wrap; gap:8px; }
.zod-chip { border:1px solid var(--royal); padding:5px 12px; border-radius:30px; font-size:13px; color:#d8cde8; letter-spacing:1px; }
.zod-chip.best { border-color:var(--gold); color:var(--gold-so); }

/* ===== star 角色区两列徽章 ===== */
.badge-pill { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:40px; }
.badge-cell { background:linear-gradient(160deg,rgba(63,44,90,.45),rgba(39,27,58,.9)); border:1px solid var(--line); border-radius:50%; aspect-ratio:1/1; display:flex; flex-direction:column; align-items:center; justify-content:center; margin:0 auto; width:100%; max-width:230px; text-align:center; transition:border-color .4s,transform .4s; }
.badge-cell:hover { border-color:var(--gold); transform:translateY(-5px); }
.badge-cell .bc-sym { font-family:var(--font-lat); font-size:34px; color:var(--gold-hi); }
.badge-cell .bc-txt { font-family:var(--font-kai); font-size:15px; color:var(--gold-so); letter-spacing:2px; margin-top:6px; }
.badge-cell small { color:var(--ink-faint); font-size:11.5px; letter-spacing:1px; }
.round-note { font-size:13.5px; color:#8f85a8; text-align:center; margin-top:22px; letter-spacing:1px; }

/* ===== 附注引注 ===== */
.fine-line { margin-top:26px; font-size:13px; color:#8f85a8; letter-spacing:.5px; text-align:center; line-height:2; }

/* ================================================================
   响应式
   ================================================================ */
@media (max-width: 1024px){
  .quad-grid { grid-template-columns:repeat(2,1fr); }
  .badge-cell { max-width:190px; }
}
@media (max-width: 900px){
  .duo { grid-template-columns:1fr; gap:46px; }
  .tri-grid, .compat-grid, .career-grid { grid-template-columns:1fr 1fr; }
  .dtl-stats.four { grid-template-columns:repeat(2,1fr); }
  .hero-side-verse { display:none; }
  .famous-item { grid-template-columns:100px 1fr; }
  .famous-stamp .f-avatar { width:72px; height:72px; }
  .famous-stamp .f-sym { display:none; }
  .badge-pill { grid-template-columns:repeat(3,1fr); }
}
@media (max-width: 700px){
  .dw-menu { position:absolute; top:var(--nav-h); left:0; right:0; background:rgba(23,18,35,.98); border-bottom:1px solid var(--line); display:none; padding:10px 0 18px; }
  .dw-menu.open { display:block; }
  .dw-menu ul { flex-direction:column; }
  .dw-menu a { display:block; padding:12px 6vw; font-size:16px; }
  .dw-menu-toggle { display:block; }
  .tri-grid, .dual-grid, .quad-grid, .dtl-stats.three, .dtl-stats.four { grid-template-columns:1fr; }
  .video-guide { grid-template-columns:1fr; }
  .hero-title-big { letter-spacing:6px; font-size:clamp(52px,18vw,96px); }
  .famous-item, .career-item { grid-template-columns:1fr; }
  .famous-stamp, .career-eyebrow { border-right:none; border-bottom:1px solid var(--line); padding:22px 8px; flex-direction:row; gap:18px; justify-content:flex-start; }
  .famous-stamp .f-avatar { width:60px;height:60px; }
  .career-eyebrow { flex-direction:column; text-align:center; }
  .badge-pill { grid-template-columns:repeat(2,1fr); }
}




