/* 起卦 / 铜钱动画 / 爻象 / 结果展示。
   来源：原站第一个 <style> 块（index.html:85-151）。
   说明：.face-yin / .face-yang 引用铜钱 PNG，已改为 /yigua/assets/ 绝对前缀，
   以在 /yigua/ 子路径下正确加载（原文件用相对文档位置的 url('铜钱-...png')）。 */
#casting{text-align:center}
.cast-progress{color:var(--ink-3);font-size:14px;letter-spacing:3px;margin-bottom:6px}
.cast-progress b{color:var(--cinnabar)}
.cast-hint{color:var(--ink-2);font-size:15px;margin-bottom:24px;min-height:22px}
.coins{display:flex;gap:30px;justify-content:center;perspective:700px;margin:10px 0 18px}
.coin{
  width:84px;height:84px;border-radius:50%;position:relative;
  transform-style:preserve-3d;transition:transform .9s cubic-bezier(.3,1.2,.4,1);
}
.coin.show-yang{transform:rotateY(180deg)}
.coin-face{
  position:absolute;inset:0;border-radius:50%;
  backface-visibility:hidden;
  background-repeat:no-repeat;
  background-position:center;
  background-size:cover;
}
.face-yin{
  background-image:url('/yigua/assets/coin-back.png');
}
.face-yang{
  background-image:url('/yigua/assets/coin-front.png');
  transform:rotateY(180deg);
}
.coin-hole{
  display:none;
}
.coin-result{color:var(--ink-2);font-size:15px;min-height:22px;margin-bottom:14px;letter-spacing:1px}
.coin-result b{color:var(--cinnabar)}
.yao-stack{display:flex;flex-direction:column-reverse;gap:7px;align-items:center;margin:22px auto;max-width:240px}
.yao-row{
  width:220px;height:16px;display:flex;justify-content:center;align-items:center;
  animation:yaoIn .5s ease;
}
@keyframes yaoIn{from{opacity:0;transform:scaleX(.3)}to{opacity:1;transform:none}}
.yao-yang{height:14px;width:210px;background:var(--ink)}
.yao-yin{display:flex;gap:18px}
.yao-yin i{display:block;height:14px;width:96px;background:var(--ink)}
.yao-row .mark{font-size:11px;color:var(--cinnabar);margin-left:8px;letter-spacing:1px}
.yao-row .pos{font-size:11px;color:var(--ink-3);margin-right:8px;width:28px;text-align:right}
#result{}
.result-head{text-align:center;margin-bottom:22px}
.hex-label{font-size:13px;color:var(--ink-3);letter-spacing:4px}
.hex-name{font-size:42px;color:var(--ink);letter-spacing:6px;margin:6px 0 2px;margin-left:6px}
.hex-name .nature{font-size:20px;color:var(--ink-2);letter-spacing:2px;margin-left:10px}
.result-grid{display:flex;gap:30px;align-items:flex-start}
.hex-figure{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:4px;padding:18px 16px;background:rgba(255,250,238,.5);border:1px solid var(--line)}
.trigram-sym{font-size:38px;color:var(--ink);line-height:1}
.trigram-sym.sub{font-size:26px;color:var(--ink-2)}
.fig-divider{width:120px;height:1px;background:var(--line);margin:6px 0}
.fig-yao{display:flex;justify-content:center;align-items:center;width:120px;height:14px}
.fig-yao .yy{height:12px;width:110px;background:var(--ink)}
.fig-yao .yn{display:flex;gap:12px}
.fig-yao .yn i{height:12px;width:48px;background:var(--ink)}
.fig-yao .ch{color:var(--cinnabar);font-size:10px;margin-left:6px}
.result-body{flex:1}
.judgment-box{margin-bottom:18px}
.sec-label{font-size:13px;color:var(--cinnabar);letter-spacing:3px;margin-bottom:4px}
.judgment-text{font-size:20px;color:var(--ink);line-height:1.6;letter-spacing:1px}
.reading-text{font-size:16px;color:var(--ink-2);line-height:1.95;letter-spacing:.5px}
.change-block{margin-top:22px;padding-top:18px;border-top:1px dashed var(--line)}
.change-flow{display:flex;align-items:center;gap:16px;margin:10px 0 4px;flex-wrap:wrap}
.change-flow .hn{font-size:24px;color:var(--ink);letter-spacing:3px}
.change-flow .arrow{color:var(--cinnabar);font-size:22px}
.change-hint{color:var(--ink-3);font-size:14px;line-height:1.8}
.result-foot{text-align:center;margin-top:30px}
.foot-note{color:var(--ink-3);font-size:13px;line-height:1.9;max-width:520px;margin:0 auto 22px;letter-spacing:.5px}