/* =========================================================
   清愿阁 设计令牌 tokens.css
   设计系统：彩格调 · 双主题（日/夜）
   所有页面通过 <link rel="stylesheet" href="tokens.css"> 引用
   ========================================================= */

:root{
  /* 色彩 · 日间 */
  --qy-bg:#fbf8f2; --qy-card:#fffdf8; --qy-surface:#fff9ef;
  --qy-text:#2b2620; --qy-text-2:#6b6358;
  --qy-gold:#e2c498; --qy-gold-d:#c9a86a; --qy-gold-ink:#7a5e29; --qy-cta:#b94b3f;
  --qy-on-gold:#3a2f1c; /* 金底之上的深字色（徽章/按钮文字等），两主题通用 */
  --qy-ok:#4f8a6b; --qy-warn:#d99a4e; --qy-danger:#a23b30; --qy-border:#e7e1d6;
  --qy-gold-hover:#d4b487; --qy-gold-active:#c9a86a; --qy-gold-disabled:#e8ddc8;
  --qy-cta-hover:#a84236; --qy-cta-active:#943a30; --qy-cta-disabled:#d9b3ad;
  --qy-shadow-1:0 2px 8px rgba(43,38,32,.06); --qy-shadow-2:0 8px 24px rgba(43,38,32,.10);
  /* 日间主题补充：更柔和的暖色调光感 */
  --qy-glow-soft:0 4px 16px rgba(226,196,152,.18);
  --qy-glow-gold:0 8px 32px rgba(226,196,152,.28);
  --qy-r-card:16px; --qy-r-btn:12px; --qy-r-dlg:20px; --qy-r-pill:999px;
  --qy-s1:4px;--qy-s2:8px;--qy-s3:12px;--qy-s4:16px;--qy-s5:20px;--qy-s6:24px;--qy-s8:32px;--qy-s10:40px;--qy-s12:48px;--qy-s16:64px;
  --qy-maxw:1200px;
  --qy-font-serif:"Noto Serif SC","Songti SC","STSong","SimSun",Georgia,serif;
  --qy-font-sans:"Noto Sans SC","PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,-apple-system,"Segoe UI",sans-serif;
  --qy-t-fast:.18s; --qy-t:.28s; --qy-t-slow:.5s; --qy-ease:cubic-bezier(.22,.61,.36,1);
}

[data-theme="night"]{
  --qy-bg:#15120f; --qy-bg-2:#141a2b; --qy-card:#241f18; --qy-surface:#2c261d;
  --qy-text:#f3ede2; --qy-text-2:#b0a696;
  --qy-gold:#f0d9ad; --qy-gold-d:#d4b487; --qy-gold-ink:var(--qy-gold-d); --qy-cta:#d4614f;
  --qy-ok:#6fae8a; --qy-warn:#e6b466; --qy-danger:#c8544a; --qy-border:#3a3228;
  --qy-cta-hover:#c5503e; --qy-gold-hover:#f5e2bd;
  --qy-glow-gold:0 0 16px rgba(226,196,152,.35); --qy-glow-soft:0 0 24px rgba(226,196,152,.18);
  --qy-shadow-1:var(--qy-glow-soft); --qy-shadow-2:var(--qy-glow-gold);
}

/* ---------- 基础重置 ---------- */
*{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px;-webkit-text-size-adjust:100%;background:var(--qy-bg);transition:background var(--qy-t) var(--qy-ease)}
body{
  font-family:var(--qy-font-sans);
  background:transparent; color:var(--qy-text);
  line-height:1.6; min-height:100vh;
  transition:color var(--qy-t) var(--qy-ease);
  -webkit-font-smoothing:antialiased;
  /* 日间主题暖色光感：顶部柔和金色辉光（半透明，粒子可透出） */
  background-image:radial-gradient(ellipse 120% 50% at 50% 0%,rgba(226,196,152,.15) 0%,transparent 60%);
  background-repeat:no-repeat;
}
/* 夜间主题保持纯背景（背景色已上移到 html，body 透明让粒子透出） */
[data-theme="night"] html{ background:var(--qy-bg); }
[data-theme="night"] body{
  background:transparent;
  background-image:none;
}
a{color:inherit;text-decoration:none}
img,svg{display:block;max-width:100%}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
input,select,textarea{font-family:inherit;font-size:1rem}

/* 衬线标题 */
.serif{font-family:var(--qy-font-serif)}
.gold-text{color:var(--qy-gold-ink)}
/* 鎏金 LOGO 描边（覆盖 SVG 属性中的 var，确保两主题下可见） */
.logo-mark{stroke:var(--qy-gold-d)}

/* ---------- 布局容器 ---------- */
.container{width:100%;max-width:var(--qy-maxw);margin:0 auto;padding:0 var(--qy-s4)}
.page{min-height:100vh;display:flex;flex-direction:column}
main{flex:1}

/* ---------- 卡片 ---------- */
/* 日间（默认）：暖色渐变 */
.card{
  background:linear-gradient(160deg,#fffdf8 0%,#fff9ef 100%);
  border:1px solid var(--qy-border);
  border-radius:var(--qy-r-card);
  box-shadow:var(--qy-shadow-1);
  padding:var(--qy-s6);
  transition:background var(--qy-t) var(--qy-ease),box-shadow var(--qy-t) var(--qy-ease),transform var(--qy-t) var(--qy-ease);
}
/* 夜间：深底纯色 */
[data-theme="night"] .card{
  background:var(--qy-card);
}
.card-hover:hover{box-shadow:var(--qy-shadow-2);transform:translateY(-2px)}
.surface{background:var(--qy-surface)}

/* ---------- 按钮 ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:var(--qy-s2);
  padding:var(--qy-s3) var(--qy-s6);
  border-radius:var(--qy-r-btn); font-size:.95rem; font-weight:600;
  transition:all var(--qy-t-fast) var(--qy-ease); white-space:nowrap;
}
.btn:active{transform:scale(.97)}
/* 鎏金主按钮 */
.btn-primary{background:var(--qy-gold);color:#3a2f1c;box-shadow:var(--qy-shadow-1)}
.btn-primary:hover{background:var(--qy-gold-hover)}
.btn-primary:active{background:var(--qy-gold-active)}
.btn-primary:disabled{background:var(--qy-gold-disabled);cursor:not-allowed}
/* 红 CTA */
.btn-cta{background:var(--qy-cta);color:#fff}
.btn-cta:hover{background:var(--qy-cta-hover)}
.btn-cta:active{background:var(--qy-cta-active)}
.btn-cta:disabled{background:var(--qy-cta-disabled);cursor:not-allowed}
/* 幽灵描边 */
.btn-ghost{background:transparent;border:1px solid var(--qy-border);color:var(--qy-text)}
.btn-ghost:hover{border-color:var(--qy-gold-d);color:var(--qy-gold-ink)}
.btn-block{width:100%}
.btn-lg{padding:var(--qy-s4) var(--qy-s8);font-size:1.05rem}

/* ---------- 输入框 ---------- */
.field{margin-bottom:var(--qy-s4)}
.field label{display:block;font-size:.85rem;color:var(--qy-text-2);margin-bottom:var(--qy-s2)}
.input,.select,.textarea{
  width:100%;background:var(--qy-surface);color:var(--qy-text);
  border:1px solid var(--qy-border);border-radius:var(--qy-r-btn);
  padding:var(--qy-s3) var(--qy-s4);font-size:1rem;
  transition:border-color var(--qy-t-fast) var(--qy-ease),box-shadow var(--qy-t-fast) var(--qy-ease);
}
.input:focus,.select:focus,.textarea:focus{
  outline:none;border-color:var(--qy-gold-d);
  box-shadow:0 0 0 3px rgba(226,196,152,.25);
}
/* 中年友好大字号（测算表单） */
.input-lg,.select-lg{
  width:100%;background:var(--qy-surface);color:var(--qy-text);
  border:1.5px solid var(--qy-border);border-radius:var(--qy-r-btn);
  padding:var(--qy-s4);font-size:1.15rem;
}
.input-lg:focus,.select-lg:focus{border-color:var(--qy-gold-d);box-shadow:0 0 0 3px rgba(226,196,152,.25);outline:none}

/* ---------- 风控徽章（红/黄/绿） ---------- */
.badge{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:var(--qy-r-pill);font-size:.78rem;font-weight:600}
.badge::before{content:"";width:7px;height:7px;border-radius:50%}
.badge-ok{background:rgba(79,138,107,.14);color:var(--qy-ok)}
.badge-ok::before{background:var(--qy-ok)}
.badge-warn{background:rgba(217,154,78,.16);color:var(--qy-warn)}
.badge-warn::before{background:var(--qy-warn)}
.badge-danger{background:rgba(162,59,48,.14);color:var(--qy-danger)}
.badge-danger::before{background:var(--qy-danger)}

/* ---------- 顶部导航 ---------- */
.topnav{
  position:sticky;top:0;z-index:50;
  background:color-mix(in srgb,var(--qy-bg) 88%,transparent);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--qy-border);
}
.topnav .container{display:flex;align-items:center;justify-content:space-between;height:60px}
.logo-row{display:flex;align-items:center;gap:var(--qy-s2)}
.logo-mark{width:30px;height:30px;flex:none}
.logo-text{font-family:var(--qy-font-serif);font-size:1.25rem;font-weight:700;letter-spacing:2px;color:var(--qy-gold-ink)}
.nav-links{display:flex;gap:var(--qy-s6);font-size:.9rem;color:var(--qy-text-2)}
.nav-links a:hover{color:var(--qy-gold-ink)}

/* 主题切换按钮 */
.theme-toggle{
  width:42px;height:42px;border-radius:var(--qy-r-pill);
  border:1px solid var(--qy-border);background:var(--qy-surface);
  display:flex;align-items:center;justify-content:center;cursor:pointer;
  transition:all var(--qy-t-fast) var(--qy-ease);
}
.theme-toggle:hover{border-color:var(--qy-gold-d)}
.theme-toggle svg{width:20px;height:20px}
/* 工具按钮组 */
.topnav-tools{display:flex;align-items:center;gap:8px}
.music-toggle{
  width:42px;height:42px;border-radius:var(--qy-r-pill);
  border:1px solid var(--qy-border);background:var(--qy-surface);
  display:flex;align-items:center;justify-content:center;cursor:pointer;
  color:var(--qy-gold-d);transition:all var(--qy-t-fast) var(--qy-ease);
}
.music-toggle:hover{border-color:var(--qy-gold-d);background:var(--qy-card);position:relative}
.music-toggle:hover::after{
  content:'禅音';
  position:absolute;top:-28px;left:50%;transform:translateX(-50%);
  background:var(--qy-card);color:var(--qy-text);
  padding:3px 8px;border-radius:var(--qy-r-pill);font-size:.65rem;
  border:1px solid var(--qy-border);white-space:nowrap;
  box-shadow:0 2px 8px rgba(0,0,0,.08);
  pointer-events:none;
  animation:tooltipFadeIn .3s var(--qy-ease);
}
@keyframes tooltipFadeIn{from{opacity:0;transform:translateX(-50%) translateY(4px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}
.music-toggle svg{width:20px;height:20px;stroke:var(--qy-gold-d);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.music-toggle.playing{border-color:var(--qy-gold-d);background:linear-gradient(160deg,var(--qy-gold),var(--qy-gold-d));color:#3a2f1c}
.music-toggle.playing svg{stroke:var(--qy-gold-ink)}
.music-bars{display:inline-flex;align-items:flex-end;gap:2px;height:18px}
.music-bars span{display:block;width:3px;background:currentColor;border-radius:1px}
.music-bars span:nth-child(1){height:8px;animation:musicBar 1.2s ease-in-out infinite}
.music-bars span:nth-child(2){height:14px;animation:musicBar 1.2s ease-in-out .15s infinite}
.music-bars span:nth-child(3){height:10px;animation:musicBar 1.2s ease-in-out .3s infinite}
.music-bars span:nth-child(4){height:16px;animation:musicBar 1.2s ease-in-out .45s infinite}
.music-bars span:nth-child(5){height:6px;animation:musicBar 1.2s ease-in-out .6s infinite}
.music-bars.paused span{animation:pausedBar .3s ease forwards}
@keyframes musicBar{0%,100%{transform:scaleY(.6)}50%{transform:scaleY(1.4)}}
@keyframes pausedBar{to{transform:scaleY(1)}}

/* ---------- 底部 Tab 栏（仅移动端） ---------- */
.tab-bar{
  position:fixed;left:0;right:0;bottom:0;z-index:60;
  display:flex;background:color-mix(in srgb,var(--qy-card) 94%,transparent);
  backdrop-filter:blur(12px);border-top:1px solid var(--qy-border);
  padding:6px 0 calc(6px + env(safe-area-inset-bottom));
}
.tab-bar a{
  flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;
  padding:6px 0;font-size:.7rem;color:var(--qy-text-2);
}
.tab-bar a svg{width:22px;height:22px}
.tab-bar a.active{color:var(--qy-gold-ink)}
.tab-bar a.active svg{stroke:var(--qy-gold-d)}
/* 给固定底栏留出滚动空间（仅移动端） */
.with-tab{padding-bottom:74px}

/* ---------- 倒计时环 ---------- */
.ring-wrap{position:relative;width:120px;height:120px;margin:0 auto}
.ring-wrap svg{transform:rotate(-90deg)}
.ring-bg{stroke:var(--qy-border)}
.ring-fg{stroke:var(--qy-cta);transition:stroke-dashoffset 1s linear}
.ring-label{
  position:absolute;inset:0;display:flex;flex-direction:column;
  align-items:center;justify-content:center;font-variant-numeric:tabular-nums;
}
.ring-time{font-size:1.6rem;font-weight:700;font-family:var(--qy-font-serif)}
.ring-sub{font-size:.7rem;color:var(--qy-text-2)}

/* ---------- 通用工具 ---------- */
.muted{color:var(--qy-text-2)}
.center{text-align:center}
.flex{display:flex}.between{justify-content:space-between}.items-center{align-items:center}
.gap-2{gap:var(--qy-s2)}.gap-4{gap:var(--qy-s4)}.gap-6{gap:var(--qy-s6)}
.grid{display:grid}
.mt-4{margin-top:var(--qy-s4)}.mt-6{margin-top:var(--qy-s6)}.mt-8{margin-top:var(--qy-s8)}
.mb-4{margin-bottom:var(--qy-s4)}.mb-6{margin-bottom:var(--qy-s6)}
.divider{height:1px;background:var(--qy-border);border:0;margin:var(--qy-s6) 0}

/* 响应式：三断点 320 / 768 / 1200 */
@media (max-width:768px){
  :root{--qy-s16:40px;--qy-s12:32px}
  /* 移动端：隐藏 nav-links + quick-gates，底部 tab-bar 为主导航 */
  .nav-links{display:none}
  .quick-gates{display:none}
  .card{padding:var(--qy-s4)}
}
@media (min-width:769px){
  /* 桌面端：隐藏底部 tab-bar，保留 nav-links + quick-gates 双导航 */
  .tab-bar{display:none!important}
  .quick-gates{display:flex!important}
  .with-tab{padding-bottom:0!important}
  /* 桌面端统一扩大内容区宽度（!important 覆盖各页内联 max-width） */
  .cal-main,.pm-main,.dv-main,.wallet-main,.cm-main,.share-main,
  .bazi-main,.nm-main,.dm-main,.fb-main,.pay-demo,.orc-main,
  .lt-main,.lb-main,.login-card,.my-main{max-width:1100px!important}
  .pm-h{max-width:720px!important;margin:0 auto var(--qy-s6)!important}
  .palm-box{max-width:420px!important}
  .form-card{max-width:460px!important}
  /* 表格类页面保持表格宽度 */
  .data-table{max-width:none!important}
}
@media (min-width:1200px){
  /* 桌面端大宽屏：更多列布局 */
  .cal-main,.pm-main,.dv-main,.wallet-main,.cm-main,.share-main,
  .bazi-main,.nm-main,.dm-main,.fb-main,.pay-demo,.orc-main,
  .lt-main,.lb-main,.login-card,.my-main{max-width:1200px!important}
}
@media (max-width:320px){
  .container{padding:0 var(--qy-s3)}
}

/* ===== v2 组件增补 ===== */
/* =========================================================
   清愿阁 v2 组件增补 · 彩格调
   追加段：v2 新增页面专用组件（与 v1 令牌一致）
   依赖：tokens.css 全部 --qy-* 变量
   ========================================================= */

/* ---------- 通用补充（促进跨页一致，原多页内联已存在） ---------- */
.toast{position:fixed;left:50%;bottom:90px;transform:translateX(-50%) translateY(20px);background:var(--qy-card);border:1px solid var(--qy-gold-d);color:var(--qy-text);padding:10px 18px;border-radius:var(--qy-r-pill);box-shadow:var(--qy-shadow-2);opacity:0;pointer-events:none;transition:all var(--qy-t) var(--qy-ease);z-index:80;font-size:.85rem}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.section-title{font-family:var(--qy-font-serif);font-size:1.3rem;letter-spacing:3px;color:var(--qy-text);margin:var(--qy-s6) 0 var(--qy-s4)}
.section-title .sub{font-size:.8rem;color:var(--qy-text-2);letter-spacing:1px;margin-left:var(--qy-s3)}
.empty{text-align:center;color:var(--qy-text-2);font-size:.9rem;padding:var(--qy-s8) 0}
.avatar{width:56px;height:56px;flex:none;color:var(--qy-gold-d);background:var(--qy-surface);border:1px solid var(--qy-border);border-radius:50%;padding:8px}
.table-scroll{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
.table-scroll>.data-table{min-width:640px}
.seg{display:inline-flex;border:1px solid var(--qy-border);border-radius:var(--qy-r-pill);overflow:hidden}
.seg button{padding:6px 14px;font-size:.82rem;color:var(--qy-text-2);background:transparent;transition:all var(--qy-t-fast)}
.seg button.on{background:var(--qy-gold);color:#3a2f1c;font-weight:600}

/* ---------- 1) 数据表格增强 .data-table ---------- */
.data-table{width:100%;border-collapse:collapse;font-size:.88rem;background:var(--qy-card);border-radius:var(--qy-r-card);overflow:hidden}
.data-table th,.data-table .th{text-align:left;padding:12px var(--qy-s4);color:var(--qy-text-2);font-weight:600;font-size:.8rem;background:var(--qy-surface);border-bottom:1px solid var(--qy-border);white-space:nowrap}
.data-table td{padding:12px var(--qy-s4);border-bottom:1px solid var(--qy-border);color:var(--qy-text);vertical-align:middle}
.data-table tbody tr{transition:background var(--qy-t-fast) var(--qy-ease)}
.data-table tbody tr:hover{background:var(--qy-surface)}
.data-table tbody tr:last-child td{border-bottom:0}
.data-table .num{text-align:right;font-variant-numeric:tabular-nums}
.data-table .col-amount{font-family:var(--qy-font-serif);font-weight:600;font-variant-numeric:tabular-nums}
/* 状态色列：用 data-status 着色，禁止自定义颜色 */
.data-table .col-status[data-status="ok"]{color:var(--qy-ok);font-weight:600}
.data-table .col-status[data-status="warn"]{color:var(--qy-warn);font-weight:600}
.data-table .col-status[data-status="danger"]{color:var(--qy-danger);font-weight:600}

/* ---------- 2) 时间轴 .timeline ---------- */
.timeline{position:relative;padding-left:var(--qy-s8);margin:var(--qy-s4) 0}
.tl-line{position:absolute;left:13px;top:8px;bottom:8px;width:2px;background:var(--qy-border)}
.tl-item{position:relative;padding:0 0 var(--qy-s6)}
.tl-item:last-child{padding-bottom:0}
.tl-dot{position:absolute;left:-25px;top:2px;width:14px;height:14px;border-radius:50%;background:var(--qy-gold);border:3px solid var(--qy-card);box-shadow:0 0 0 1px var(--qy-gold-d)}
.tl-item.major .tl-dot{background:var(--qy-cta);box-shadow:0 0 0 1px var(--qy-cta-active)}
.tl-year{font-family:var(--qy-font-serif);font-size:1.1rem;color:var(--qy-gold-ink);margin-bottom:2px}
.tl-title{font-family:var(--qy-font-serif);font-size:1rem;color:var(--qy-text);margin-bottom:2px}
.tl-desc{font-size:.88rem;color:var(--qy-text-2);line-height:1.6}

/* ---------- 3) 音频播放器 .player ---------- */
.player{background:var(--qy-surface);border:1px solid var(--qy-border);border-radius:var(--qy-r-card);padding:var(--qy-s4)}
.player-bar{display:flex;align-items:center;gap:var(--qy-s4);margin-top:var(--qy-s4)}
.player-play{width:48px;height:48px;flex:none;border-radius:50%;background:var(--qy-gold);color:#3a2f1c;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all var(--qy-t-fast) var(--qy-ease)}
.player-play:hover{background:var(--qy-gold-hover)}
.player-play:active{transform:scale(.97)}
.player-meta{flex:1;min-width:0}
.player-title{font-family:var(--qy-font-serif);font-size:1rem;color:var(--qy-text)}
.player-sub{font-size:.78rem;color:var(--qy-text-2)}
.player-time{font-size:.75rem;color:var(--qy-text-2);font-variant-numeric:tabular-nums;white-space:nowrap}
/* 声波可视化容器：用渐变条模拟，每根 <i> 内联 height 控制波形 */
.waveform{display:flex;align-items:center;gap:3px;height:40px;margin-top:var(--qy-s3)}
.waveform i{flex:1;min-width:2px;height:30%;border-radius:var(--qy-r-pill);background:linear-gradient(var(--qy-gold),var(--qy-gold-d));opacity:.5;transition:opacity var(--qy-t-fast) var(--qy-ease)}
.waveform i.on{opacity:1}

/* ---------- 4) 日历网格 .cal-grid ---------- */
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.cal-dow{font-size:.72rem;color:var(--qy-text-2);text-align:center;padding:var(--qy-s2) 0}
.cal-cell{position:relative;aspect-ratio:1;border:1px solid var(--qy-border);border-radius:var(--qy-r-btn);background:var(--qy-card);display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:.9rem;color:var(--qy-text);cursor:pointer;transition:all var(--qy-t-fast) var(--qy-ease)}
.cal-cell:hover{border-color:var(--qy-gold-d);box-shadow:var(--qy-shadow-1)}
.cal-cell.muted{color:var(--qy-text-2);opacity:.4}
.cal-cell.today{border-color:var(--qy-gold);box-shadow:0 0 0 2px rgba(226,196,152,.35);font-weight:700}
.cal-cell.today::after{content:"";position:absolute;bottom:6px;width:6px;height:6px;border-radius:50%;background:var(--qy-gold-d)}
.cal-cell.has-event{color:var(--qy-gold-ink);font-weight:600}
.cal-cell.has-event::before{content:"";position:absolute;top:6px;width:6px;height:6px;border-radius:50%;background:var(--qy-cta)}
.cal-cell.selected{background:var(--qy-gold);color:#3a2f1c}

/* ---------- 5) 海报容器 .poster-frame ---------- */
.poster-frame{background:var(--qy-surface);border:1px solid var(--qy-border);border-radius:var(--qy-r-card);padding:var(--qy-s4);max-width:360px;margin:0 auto}
.poster-canvas{position:relative;width:100%;aspect-ratio:9/16;background:linear-gradient(160deg,var(--qy-bg) 0%,var(--qy-card) 60%,var(--qy-surface) 100%);border:1px solid var(--qy-gold-d);border-radius:var(--qy-r-btn);overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:var(--qy-s8) var(--qy-s6)}
.poster-canvas .p-logo{width:64px;height:64px;color:var(--qy-gold-d)}
.poster-canvas .p-title{font-family:var(--qy-font-serif);font-size:1.6rem;letter-spacing:4px;color:var(--qy-gold-ink);margin-top:var(--qy-s4)}
.poster-canvas .p-sub{font-size:.9rem;color:var(--qy-text-2);margin-top:var(--qy-s2)}
.poster-canvas .p-qr{width:200px;height:200px;background:#fff;border-radius:12px;margin:var(--qy-s4) auto;display:flex;align-items:center;justify-content:center;color:var(--qy-text-2);font-size:.72rem;overflow:hidden}
.poster-canvas .p-qr img,.poster-canvas .p-qr canvas{display:block;width:100%;height:100%}
.poster-canvas .p-qr-fallback{font-size:.68rem;color:var(--qy-text-2);text-align:center;line-height:1.5;padding:var(--qy-s4);word-break:break-all}
.poster-canvas .p-qr-loading{font-size:.68rem;color:var(--qy-text-2)}
.poster-canvas .p-foot{position:absolute;bottom:var(--qy-s4);font-size:.7rem;color:var(--qy-text-2);letter-spacing:1px}

/* ---------- 6) 对话气泡 .chat ---------- */
.chat{display:flex;flex-direction:column;gap:var(--qy-s4);padding:var(--qy-s4) 0}
.bubble{position:relative;max-width:78%;padding:var(--qy-s3) var(--qy-s4);border-radius:var(--qy-r-card);font-size:.92rem;line-height:1.6}
.bubble-them{align-self:flex-start;background:var(--qy-surface);border:1px solid var(--qy-border);border-bottom-left-radius:var(--qy-r-btn);color:var(--qy-text)}
.bubble-me{align-self:flex-end;background:var(--qy-gold);color:#3a2f1c;border-bottom-right-radius:var(--qy-r-btn);font-weight:500}
.bubble-meta{font-size:.7rem;color:var(--qy-text-2);margin-top:4px}
.chat-input{display:flex;gap:var(--qy-s2);align-items:center;padding:var(--qy-s3);background:var(--qy-card);border:1px solid var(--qy-border);border-radius:var(--qy-r-pill);margin-top:var(--qy-s4)}
.chat-input input{flex:1;border:none;background:transparent;color:var(--qy-text);font-size:.95rem;padding:0 var(--qy-s3);outline:none}
.chat-input .btn{padding:8px 16px}

/* ---------- 7) 榜单行 .rank-row ---------- */
.rank-row{display:flex;align-items:center;gap:var(--qy-s4);padding:var(--qy-s4);background:var(--qy-card);border:1px solid var(--qy-border);border-radius:var(--qy-r-card);margin-bottom:var(--qy-s3);transition:all var(--qy-t-fast) var(--qy-ease)}
.rank-row:hover{box-shadow:var(--qy-shadow-1);transform:translateY(-1px)}
.rank-no{width:34px;height:34px;flex:none;display:flex;align-items:center;justify-content:center;font-family:var(--qy-font-serif);font-weight:700;font-size:1.1rem;color:var(--qy-text-2);border-radius:50%;background:var(--qy-surface);border:1px solid var(--qy-border)}
.rank-medal{font-size:1.1rem;line-height:1}
.rank-row.top1 .rank-no{background:linear-gradient(135deg,#f6e3b4,var(--qy-gold));color:#3a2f1c;box-shadow:0 0 0 1px var(--qy-gold-d)}
.rank-row.top2 .rank-no{background:linear-gradient(135deg,#e8e8ec,var(--qy-text-2));color:#3a2f1c;box-shadow:0 0 0 1px var(--qy-border)}
.rank-row.top3 .rank-no{background:linear-gradient(135deg,#e8cfa6,var(--qy-gold-d));color:#3a2f1c;box-shadow:0 0 0 1px var(--qy-gold-d)}
.rank-avatar{width:42px;height:42px;flex:none;border-radius:50%;background:var(--qy-surface);border:1px solid var(--qy-border);display:flex;align-items:center;justify-content:center;color:var(--qy-gold-d)}
.rank-info{flex:1;min-width:0}
.rank-name{font-family:var(--qy-font-serif);font-size:1rem;color:var(--qy-text)}
.rank-sub{font-size:.78rem;color:var(--qy-text-2)}
.rank-val{font-family:var(--qy-font-serif);font-size:1.05rem;font-weight:700;color:var(--qy-gold-ink);font-variant-numeric:tabular-nums;white-space:nowrap}
.rank-row.me{border-color:var(--qy-gold-d);background:linear-gradient(160deg,var(--qy-surface),var(--qy-card))}

/* ---------- 8) 签到日历 .checkin-grid ---------- */
.checkin-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:var(--qy-s2);margin-top:var(--qy-s4)}
.checkin-day{aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border:1px dashed var(--qy-border);border-radius:var(--qy-r-btn);background:var(--qy-card);font-size:.72rem;color:var(--qy-text-2)}
.checkin-day .d{font-family:var(--qy-font-serif);font-size:.95rem;color:var(--qy-text)}
.checkin-day.done{border-style:solid;border-color:var(--qy-gold);background:linear-gradient(160deg,var(--qy-surface),var(--qy-card));color:var(--qy-gold-ink)}
.checkin-day.done .d{color:var(--qy-gold-ink)}
.checkin-day.done::before{content:"✦";color:var(--qy-gold-d);font-size:.75rem;line-height:1}
.checkin-day.today{border-color:var(--qy-cta);color:var(--qy-text)}
.checkin-day.locked{opacity:.45}
.checkin-note{font-size:.78rem;color:var(--qy-text-2);margin-top:var(--qy-s3)}
.checkin-note b{color:var(--qy-gold-ink);font-family:var(--qy-font-serif)}

/* ---------- 9) 雷达图容器 .radar-wrap ---------- */
.radar-wrap{position:relative;width:100%;max-width:320px;aspect-ratio:1;margin:0 auto}
.radar-wrap svg{width:100%;height:100%;overflow:visible}
.radar-grid{fill:none;stroke:var(--qy-border)}
.radar-axis{stroke:var(--qy-border);stroke-dasharray:3 3}
.radar-area{fill:var(--qy-gold-d);opacity:.16;stroke:var(--qy-gold-d);stroke-width:2;stroke-linejoin:round}
.radar-dot{fill:var(--qy-cta)}
.radar-label{font-size:11px;fill:var(--qy-text-2);font-family:var(--qy-font-serif)}
.radar-val{font-size:10px;fill:var(--qy-gold-ink)}

/* ---------- 10) 热力条 .heat-bar ---------- */
.heat-bar{display:flex;gap:4px;flex-wrap:wrap;align-items:stretch}
.heat-cell{flex:1;min-width:18px;height:34px;border-radius:6px;border:1px solid var(--qy-border);display:flex;align-items:center;justify-content:center;font-size:.7rem;color:var(--qy-text);background:var(--qy-surface)}
.heat-cell[data-luck="1"]{background:rgba(79,138,107,.18);border-color:var(--qy-ok);color:var(--qy-ok)}
.heat-cell[data-luck="2"]{background:rgba(217,154,78,.16);border-color:var(--qy-warn);color:var(--qy-warn)}
.heat-cell[data-luck="3"]{background:rgba(162,59,48,.16);border-color:var(--qy-danger);color:var(--qy-danger)}
.heat-legend{display:flex;gap:var(--qy-s4);font-size:.75rem;color:var(--qy-text-2);margin-top:var(--qy-s2);flex-wrap:wrap}
.heat-legend i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:4px;vertical-align:middle}
.heat-legend .g{background:var(--qy-ok)}.heat-legend .m{background:var(--qy-warn)}.heat-legend .b{background:var(--qy-danger)}

/* ---------- 11) 对比卡 .vs-card ---------- */
.vs-card{display:grid;grid-template-columns:1fr auto 1fr;gap:var(--qy-s4);align-items:stretch;margin:var(--qy-s6) 0}
.vs-side{border:1px solid var(--qy-border);border-radius:var(--qy-r-card);padding:var(--qy-s6);background:var(--qy-card);display:flex;flex-direction:column}
.vs-free{opacity:.97}
.vs-paid{border-color:var(--qy-gold-d);box-shadow:var(--qy-shadow-2);background:linear-gradient(160deg,var(--qy-surface),var(--qy-card));position:relative}
.vs-paid::before{content:"推荐";position:absolute;top:0;right:var(--qy-s4);transform:translateY(-50%);background:var(--qy-gold);color:#3a2f1c;font-size:.7rem;font-weight:700;padding:2px 10px;border-radius:var(--qy-r-pill)}
.vs-head{font-family:var(--qy-font-serif);font-size:1.1rem;letter-spacing:2px;margin-bottom:var(--qy-s3)}
.vs-free .vs-head{color:var(--qy-text-2)}
.vs-paid .vs-head{color:var(--qy-gold-ink)}
.vs-price{font-family:var(--qy-font-serif);font-size:1.6rem;font-weight:700;margin:var(--qy-s2) 0}
.vs-free .vs-price{color:var(--qy-text-2)}
.vs-paid .vs-price{color:var(--qy-cta)}
.vs-list{list-style:none;display:flex;flex-direction:column;gap:var(--qy-s2);margin:var(--qy-s4) 0;font-size:.88rem;color:var(--qy-text-2)}
.vs-list li{display:flex;gap:var(--qy-s2);align-items:flex-start}
.vs-list li::before{content:"✓";color:var(--qy-ok);font-weight:700;flex:none}
.vs-free .vs-list li.no::before{content:"✕";color:var(--qy-danger)}
.vs-mid{display:flex;align-items:center;justify-content:center;font-family:var(--qy-font-serif);font-size:1.1rem;color:var(--qy-gold-ink)}
@media(max-width:600px){.vs-card{grid-template-columns:1fr}.vs-mid{padding:var(--qy-s2) 0}}

/* ---------- 12) 标签云 .tag-cloud ---------- */
.tag-cloud{display:flex;flex-wrap:wrap;gap:var(--qy-s2);margin:var(--qy-s4) 0}
.tag-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:var(--qy-r-pill);background:var(--qy-surface);border:1px solid var(--qy-border);color:var(--qy-text-2);font-size:.85rem;transition:all var(--qy-t-fast) var(--qy-ease);cursor:pointer}
.tag-chip:hover{border-color:var(--qy-gold-d);color:var(--qy-gold-ink);transform:translateY(-1px)}
.tag-chip.active{background:var(--qy-gold);color:#3a2f1c;border-color:var(--qy-gold-d);font-weight:600}
.tag-chip .t-count{font-size:.72rem;opacity:.7;font-variant-numeric:tabular-nums}
.tag-chip.lg{font-size:1rem;padding:8px 18px}
.tag-chip.sm{font-size:.75rem;padding:4px 10px}

/* ---------- 13) 进度条 / 跨设备同步 .sync-bar ---------- */
.progress{width:100%;height:10px;background:var(--qy-surface);border:1px solid var(--qy-border);border-radius:var(--qy-r-pill);overflow:hidden}
.progress>i{display:block;height:100%;background:linear-gradient(90deg,var(--qy-gold),var(--qy-gold-d));border-radius:var(--qy-r-pill);transition:width var(--qy-t-slow) var(--qy-ease)}
.progress.thin{height:6px}
.progress.success>i{background:linear-gradient(90deg,var(--qy-ok),#5fa37e)}
.sync-bar{margin:var(--qy-s4) 0}
.sync-bar .sync-head{display:flex;justify-content:space-between;align-items:center;font-size:.85rem;color:var(--qy-text-2);margin-bottom:var(--qy-s2)}
.sync-bar .sync-head b{color:var(--qy-gold-ink);font-family:var(--qy-font-serif)}
.sync-devices{display:flex;gap:var(--qy-s3);margin-top:var(--qy-s3);flex-wrap:wrap}
.sync-device{display:flex;align-items:center;gap:8px;font-size:.8rem;color:var(--qy-text-2);background:var(--qy-surface);border:1px solid var(--qy-border);border-radius:var(--qy-r-pill);padding:6px 12px}
.sync-device .dot{width:8px;height:8px;border-radius:50%;background:var(--qy-ok);flex:none}
.sync-device.pending .dot{background:var(--qy-warn)}

/* ---------- 响应式：v2 增补组件三断点补强 ---------- */
@media(max-width:768px){
  .rank-row{gap:var(--qy-s3);padding:var(--qy-s3)}
  .player-bar{flex-wrap:wrap}
  .sync-devices{gap:var(--qy-s2)}
}

/* ---------- 全局降级：尊重 prefers-reduced-motion（无障碍） ---------- */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
}

/* ========== v2.2 组件增补（加载/导航/过渡） ========== */
.qy-spinner{width:32px;height:32px;border:2px solid transparent;border-top-color:var(--qy-gold-d);border-radius:50%;animation:spin 1.2s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.qy-skeleton{background:linear-gradient(110deg,var(--qy-surface) 0%,color-mix(in srgb,var(--qy-gold-d) 12%,var(--qy-surface)) 40%,var(--qy-surface) 80%);background-size:200% 100%;animation:skeleton-pulse 1.5s ease-in-out infinite;border-radius:var(--qy-r-btn)}
@keyframes skeleton-pulse{0%{background-position:200% 0}100%{background-position:-200% 0}}
.quick-gates{display:flex;align-items:stretch;justify-content:space-between;gap:0;padding:var(--qy-s2) 0;border-bottom:1px solid var(--qy-border);background:color-mix(in srgb,var(--qy-bg) 60%,transparent)}
.quick-gates a{display:flex;flex-direction:column;align-items:center;gap:6px;color:var(--qy-text-2);font-size:.78rem;text-decoration:none;flex:1 1 0;position:relative;transition:color var(--qy-t-fast) var(--qy-ease);padding:6px 0}
.quick-gates a::before{content:"";position:absolute;top:8px;bottom:8px;left:0;width:1px;background:var(--qy-border);opacity:.6}
.quick-gates a:first-child::before{display:none}
.quick-gates a svg{width:26px;height:26px;stroke:var(--qy-gold-d);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;transition:all var(--qy-t-fast) var(--qy-ease)}
.quick-gates a:hover{color:var(--qy-gold-ink)}
.quick-gates a:hover svg{stroke:var(--qy-gold);fill:color-mix(in srgb,var(--qy-gold) 12%,transparent)}
.quick-gates a.active{color:var(--qy-gold-ink)}
.quick-gates a.active svg{stroke:var(--qy-gold);fill:color-mix(in srgb,var(--qy-gold) 18%,transparent)}
.quick-gates a.active::after{content:"";position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:18px;height:2px;border-radius:1px;background:var(--qy-gold)}
@media(max-width:768px){.quick-gates a{font-size:.72rem}.quick-gates a svg{width:24px;height:24px}.quick-gates a::before{display:none}}
@media(max-width:480px){.quick-gates{flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start;padding:var(--qy-s2) var(--qy-s3);gap:0;-webkit-overflow-scrolling:touch}.quick-gates a{flex:none;flex-basis:48px}}
.page-fade{animation:page-fade-in .4s var(--qy-ease-out)}
@keyframes page-fade-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.result-reveal{filter:blur(8px);opacity:0;transition:filter .6s ease-out,opacity .6s ease-out}
.result-reveal.show{filter:none;opacity:1}

/* ========== v2.4 组件增补（师父选择 / 古籍背书 / 心愿供灯 / 线上香 / 免费配额） ========== */

/* ---------- 1) 师父选择 .master-selector ---------- */
.master-selector{margin:var(--qy-s6) auto var(--qy-s4);max-width:680px}
@media(min-width:769px){.master-selector{max-width:960px}}
@media(min-width:1024px){.master-selector{max-width:1100px}}
.master-title{font-family:var(--qy-font-serif);font-size:1rem;letter-spacing:2px;color:var(--qy-gold-ink);margin-bottom:var(--qy-s3);text-align:center}
@media(min-width:1024px){.master-title{font-size:1.1rem}}
.master-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--qy-s3)}
@media(max-width:500px){.master-grid{grid-template-columns:1fr}}
@media(min-width:1024px){.master-grid{gap:var(--qy-s4)}}
.master-card{display:flex;gap:var(--qy-s3);padding:var(--qy-s4);border:1.5px solid var(--qy-border);border-radius:var(--qy-r-card);background:var(--qy-card);cursor:pointer;transition:all var(--qy-t-fast) var(--qy-ease);text-align:left}
@media(min-width:1024px){.master-card{padding:var(--qy-s6)}}
.master-card:hover{border-color:var(--qy-gold-d);box-shadow:var(--qy-shadow-1);transform:translateY(-1px)}
.master-card.active{border-color:var(--qy-gold-d);background:linear-gradient(160deg,var(--qy-surface),var(--qy-card));box-shadow:var(--qy-glow-gold)}
.master-card.active::after{content:"";position:absolute;top:-6px;right:-6px;width:20px;height:20px;background:var(--qy-gold);color:#3a2f1c;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.7rem;font-weight:700}
.master-ic{width:44px;height:44px;flex:none;color:var(--qy-gold-d);background:var(--qy-surface);border:1px solid var(--qy-border);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.4rem}
.master-card.active .master-ic{background:linear-gradient(135deg,var(--qy-gold),var(--qy-gold-d));border-color:var(--qy-gold-d)}
.master-info{flex:1;min-width:0}
.master-name{font-family:var(--qy-font-serif);font-size:1rem;color:var(--qy-text);letter-spacing:1px}
@media(min-width:1024px){.master-name{font-size:1.1rem}}
.master-role{font-size:.72rem;color:var(--qy-text-2);margin-top:1px}
@media(min-width:1024px){.master-role{font-size:.8rem}}
.master-desc{font-size:.78rem;color:var(--qy-text-2);line-height:1.5;margin-top:6px;padding-top:6px;border-top:1px dashed var(--qy-border)}
@media(min-width:1024px){.master-desc{font-size:.88rem;line-height:1.7}}
.master-card.active .master-name{color:var(--qy-gold-ink)}

/* ---------- 2) 古籍背书 .classics-block ---------- */
.classics-block{margin:var(--qy-s8) auto 0;max-width:1100px}
.classics-title{font-family:var(--qy-font-serif);font-size:1.2rem;letter-spacing:3px;color:var(--qy-gold-ink);text-align:center;margin-bottom:var(--qy-s4)}
.classics-sub{font-size:.8rem;color:var(--qy-text-2);text-align:center;margin-bottom:var(--qy-s4)}
.classics-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--qy-s3)}
@media(min-width:769px){.classics-strip{grid-template-columns:repeat(6,1fr)}}
.classic-item{display:flex;flex-direction:column;align-items:center;gap:var(--qy-s2);padding:var(--qy-s4);border:1px solid var(--qy-border);border-radius:var(--qy-r-card);background:var(--qy-card);transition:all var(--qy-t-fast) var(--qy-ease);text-align:center}
.classic-item:hover{border-color:var(--qy-gold-d);box-shadow:var(--qy-shadow-1);transform:translateY(-2px)}
.classic-cover{width:48px;height:64px;border-radius:4px;background:linear-gradient(145deg,var(--qy-gold),var(--qy-gold-d));display:flex;align-items:center;justify-content:center;color:#3a2f1c;font-family:var(--qy-font-serif);font-size:.7rem;letter-spacing:1px;font-weight:700;box-shadow:0 2px 6px rgba(201,168,106,.3)}
.classic-cover .cls-title{writing-mode:vertical-rl;text-orientation:upright;letter-spacing:2px;font-size:.8rem}
.classic-name{font-family:var(--qy-font-serif);font-size:.82rem;color:var(--qy-text)}
.classic-author{font-size:.68rem;color:var(--qy-text-2)}
.classic-cite{font-size:.72rem;color:var(--qy-text-2);margin-top:var(--qy-s4);text-align:center;font-style:italic}

/* 页面底部免责声明（通用，各测算页复用） */
.disclaimer-bar{margin:var(--qy-s6) auto 0;max-width:680px;padding:var(--qy-s3) var(--qy-s4);border:1px dashed var(--qy-gold-d);border-radius:var(--qy-r-card);background:rgba(201,168,106,.06);text-align:center;font-size:.72rem;color:var(--qy-text-2);line-height:1.7}
.disclaimer-bar b{color:var(--qy-gold-ink);font-family:var(--qy-font-serif)}

/* ---------- 3) 心愿供灯 .wish-lamp ---------- */
.wish-lamp{margin:var(--qy-s6) auto 0;max-width:680px}
.wish-mode-bar{display:flex;gap:var(--qy-s2);margin-bottom:var(--qy-s4)}
.wish-mode-bar button{flex:1;padding:8px 12px;border:1.5px solid var(--qy-border);border-radius:var(--qy-r-pill);background:transparent;color:var(--qy-text-2);font-size:.88rem;font-weight:600;cursor:pointer;transition:all var(--qy-t-fast)}
.wish-mode-bar button.active{background:var(--qy-gold);color:#3a2f1c;border-color:var(--qy-gold-d)}
.wish-form{display:none}
.wish-form.active{display:block}
.wish-form .field{margin-bottom:var(--qy-s3)}
.wish-price-row{display:flex;align-items:center;justify-content:space-between;margin-top:var(--qy-s4);padding-top:var(--qy-s4);border-top:1px dashed var(--qy-border)}
.wish-price{font-family:var(--qy-font-serif);font-size:1.4rem;color:var(--qy-cta);font-weight:700}
.wish-price-note{font-size:.72rem;color:var(--qy-text-2);margin-top:2px}
.wish-wall{margin-top:var(--qy-s6)}
.wish-wall-title{font-family:var(--qy-font-serif);font-size:1rem;letter-spacing:2px;color:var(--qy-gold-ink);margin-bottom:var(--qy-s3);text-align:center}
.wish-wall-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:var(--qy-s3)}
.wish-lantern{display:flex;flex-direction:column;align-items:center;gap:var(--qy-s2);padding:var(--qy-s3);border:1px solid var(--qy-border);border-radius:var(--qy-r-card);background:var(--qy-card);text-align:center;font-size:.78rem}
.wish-lantern .w-ic{width:32px;height:32px;color:var(--qy-gold-d)}
.wish-lantern .w-name{color:var(--qy-text);font-family:var(--qy-font-serif)}
.wish-lantern .w-wish{color:var(--qy-text-2);font-size:.7rem;line-height:1.5}
.wish-lantern .w-time{font-size:.65rem;color:var(--qy-text-2)}

/* ---------- 4) 线上香 .incense ---------- */
.incense-wrap{max-width:680px;margin:0 auto;text-align:center}
.incense-status{margin:var(--qy-s4) 0 var(--qy-s6)}
.incense-stats{display:flex;justify-content:center;gap:var(--qy-s6);margin:var(--qy-s4) 0}
.incense-stat{text-align:center}
.incense-stat .v{font-family:var(--qy-font-serif);font-size:2rem;color:var(--qy-gold-ink);font-weight:700;line-height:1}
.incense-stat .l{font-size:.75rem;color:var(--qy-text-2);margin-top:4px}
.incense-btn{margin:var(--qy-s4) auto}
.incense-types{display:flex;justify-content:center;gap:var(--qy-s3);margin:var(--qy-s6) 0}
.incense-type{display:flex;flex-direction:column;align-items:center;gap:4px;padding:var(--qy-s3) var(--qy-s4);border:1.5px solid var(--qy-border);border-radius:var(--qy-r-pill);background:var(--qy-card);cursor:pointer;transition:all var(--qy-t-fast);font-size:.85rem;color:var(--qy-text-2)}
.incense-type:hover{border-color:var(--qy-gold-d)}
.incense-type.active{border-color:var(--qy-gold-d);background:linear-gradient(160deg,var(--qy-gold),var(--qy-gold-d));color:#3a2f1c;font-weight:600}
.incense-type .i-ic{font-size:1.2rem}
.incense-desc{font-size:.8rem;color:var(--qy-text-2);margin-top:var(--qy-s4)}

/* ---------- 5) 免费配额 .quota-bar ---------- */
.quota-bar{display:flex;align-items:center;justify-content:space-between;gap:var(--qy-s3);max-width:680px;margin:var(--qy-s4) auto;padding:var(--qy-s3) var(--qy-s4);border:1px solid var(--qy-border);border-radius:var(--qy-r-card);background:var(--qy-surface);font-size:.82rem}
.quota-bar.logged-in{display:flex}
.quota-bar:not(.logged-in){display:none}
.quota-bar .q-label{color:var(--qy-text-2)}
.quota-bar .q-val{font-family:var(--qy-font-serif);font-size:1rem;color:var(--qy-gold-ink);font-weight:700}
.quota-bar .q-val strong{color:var(--qy-cta)}
.quota-bar .q-cta{font-size:.78rem;color:var(--qy-gold-ink);font-weight:600}

/* ========== v2.5 组件增补（加载/页面淡入/手相指南） ========== */

/* ---------- 1) 加载 / 旋转器 / 遮罩 ---------- */
/* 注意：spin 动画已在 v2.2 定义，此处复用，不重复声明 */
.spinner{width:28px;height:28px;border:3px solid var(--qy-border);border-top-color:var(--qy-gold-d);border-radius:50%;animation:spin .8s linear infinite;display:inline-block}
.loading-overlay{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--qy-bg);z-index:9999}
.loading-overlay .spinner{margin:0}
.loading-overlay p{margin-top:var(--qy-s3);color:var(--qy-text-2);font-size:.9rem;letter-spacing:1px}
.loading-overlay.hidden{display:none}

/* ---------- 2) 页面淡入（增强 v2.2 的 .page-fade） ---------- */
/* body 级淡入：不依赖类名，直接通过 animation 实现 */
body{animation:fadeIn .4s ease forwards}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}

/* 日历网格翻页过渡 */
.calendar-grid{transition:opacity .3s var(--qy-ease)}
.calendar-grid.fading{opacity:.3}

/* ---------- 3) 手相指南 .palm-guide ---------- */
.palm-guide{margin:var(--qy-s6) auto 0;max-width:680px}
.palm-guide-title{font-family:var(--qy-font-serif);font-size:1.1rem;letter-spacing:2px;color:var(--qy-gold-ink);text-align:center;margin-bottom:var(--qy-s4)}
.palm-guide-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--qy-s4)}
.palm-guide-col{padding:var(--qy-s4);border:1px solid var(--qy-border);border-radius:var(--qy-r-card);background:var(--qy-card);display:flex;flex-direction:column;align-items:center;text-align:center}
.palm-guide-col .pg-icon{font-family:var(--qy-font-serif);font-size:1.6rem;color:var(--qy-gold-ink);margin-bottom:var(--qy-s2)}
.palm-guide-col .pg-label{font-family:var(--qy-font-serif);font-size:.95rem;color:var(--qy-text);letter-spacing:1px;margin-bottom:var(--qy-s2)}
.palm-guide-col .pg-desc{font-size:.78rem;color:var(--qy-text-2);line-height:1.6;margin-bottom:var(--qy-s3)}
.palm-guide-col svg.palm-ill{width:80px;height:110px}
.palm-guide-col svg.palm-ill .palm-stroke{stroke:var(--qy-gold-d);stroke-width:1.4;fill:none;stroke-linecap:round;stroke-linejoin:round}
.palm-guide-col svg.palm-ill .palm-fill{fill:color-mix(in srgb,var(--qy-gold) 14%,var(--qy-surface));stroke:var(--qy-gold-d);stroke-width:1.4}
.palm-guide-col svg.palm-ill .palm-anno{stroke:var(--qy-cta);stroke-width:1.2;stroke-dasharray:3 2;fill:none}
.palm-guide-col svg.palm-ill .palm-anno-lbl{fill:var(--qy-cta);font-family:var(--qy-font-serif);font-size:9px}
@media(max-width:500px){.palm-guide-row{grid-template-columns:1fr}}
.palm-tips{margin-top:var(--qy-s4);display:flex;flex-direction:column;gap:var(--qy-s3)}
.palm-tip{display:flex;align-items:flex-start;gap:var(--qy-s3);padding:var(--qy-s3) var(--qy-s4);border:1px dashed var(--qy-border);border-radius:var(--qy-r-btn);background:var(--qy-surface);font-size:.82rem;color:var(--qy-text-2);line-height:1.6}
.palm-tip .pt-num{flex:none;width:24px;height:24px;display:flex;align-items:center;justify-content:center;background:var(--qy-gold);color:#3a2f1c;border-radius:50%;font-family:var(--qy-font-serif);font-weight:700;font-size:.8rem}
.palm-tip b{color:var(--qy-gold-ink);font-family:var(--qy-font-serif)}
