/* Rayne-Lab 五行観測モデル 記事図版 v1 */
.wuxing-figure{
  --wf-gold:#d2aa4d;
  --wf-gold-soft:#e3bf68;
  --wf-ink:#0d0d10;
  --wf-panel:rgba(255,255,255,.018);
  --wf-line:rgba(210,170,77,.62);
  --wf-line-soft:rgba(210,170,77,.28);
  --wf-text:var(--fg,#f0eee9);
  --wf-muted:var(--muted,#aaa7a0);
  margin:2.4rem 0 2.6rem;
  padding:1.25rem 1.3rem 1.15rem;
  border:1px solid rgba(210,170,77,.25);
  border-radius:14px;
  background:radial-gradient(circle at 88% 6%,rgba(210,170,77,.06),transparent 15rem),rgba(255,255,255,.012);
  overflow:hidden;
}
.wuxing-figure__kicker{margin:0 0 .35rem;color:var(--wf-gold);font-size:.64rem;letter-spacing:.16em;text-transform:uppercase}
.wuxing-figure__title{margin:0 0 .45rem;font-family:"Shippori Mincho",serif;font-size:clamp(1.08rem,2.8vw,1.42rem);line-height:1.55;color:var(--wf-text)}
/* WEB-179: 図解のリード文は読ませる文章なので、13.1px→15.2px へ。 */
.wuxing-figure__lead{margin:0 0 1.15rem;color:var(--wf-muted);font-size:.95rem;line-height:1.8}
.wuxing-figure__svg{display:block;width:100%;height:auto;max-height:520px;margin:0 auto}
.wuxing-figure__legend{display:flex;flex-wrap:wrap;gap:.55rem 1.1rem;margin:1rem 0 0;padding:.75rem .85rem;border-top:1px solid rgba(210,170,77,.15);border-bottom:1px solid rgba(210,170,77,.12);color:var(--wf-muted);font-size:.74rem;line-height:1.65}
.wuxing-figure__legend b{color:var(--wf-gold-soft);font-weight:600}
.wuxing-figure__note{margin:.8rem 0 0;color:var(--wf-muted);font-size:.72rem;line-height:1.75}
.wuxing-figure__caption{margin:.75rem 0 0;color:var(--wf-muted);font-size:.72rem;line-height:1.8}
.wuxing-figure svg text{font-family:"Shippori Mincho",serif;fill:var(--wf-text)}
.wuxing-figure svg .wf-label{font-size:18px;font-weight:600}
.wuxing-figure svg .wf-sub{font-size:12px;fill:var(--wf-muted)}
.wuxing-figure svg .wf-node{fill:rgba(13,13,16,.94);stroke:var(--wf-line);stroke-width:1.6}
.wuxing-figure svg .wf-main{fill:none;stroke:rgba(227,191,104,.82);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.wuxing-figure svg .wf-control{fill:none;stroke:rgba(207,104,82,.66);stroke-width:1.55;stroke-dasharray:7 6;stroke-linecap:round;stroke-linejoin:round}
.wuxing-figure svg .wf-alt{fill:none;stroke:rgba(227,191,104,.58);stroke-width:2;stroke-dasharray:3 7;stroke-linecap:round;stroke-linejoin:round}
.wuxing-figure svg .wf-guide{fill:none;stroke:rgba(255,255,255,.14);stroke-width:1.2}
.wuxing-figure svg .wf-gate{fill:rgba(210,170,77,.08);stroke:rgba(210,170,77,.7);stroke-width:1.2}
.wuxing-figure svg .wf-bar-bg{fill:rgba(255,255,255,.045)}
.wuxing-figure svg .wf-what{fill:rgba(227,191,104,.78)}
.wuxing-figure svg .wf-how{fill:rgba(207,104,82,.66)}
.wuxing-figure svg .wf-why{fill:rgba(174,178,191,.5)}
.wuxing-figure svg .wf-box{fill:rgba(13,13,16,.94);stroke:rgba(210,170,77,.48);stroke-width:1.35}
.wuxing-figure svg .wf-box-strong{fill:rgba(210,170,77,.07);stroke:rgba(227,191,104,.78);stroke-width:1.55}
.wuxing-figure__sp-flow{display:none}
.wuxing-flow-sp__inputs{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:.5rem}
.wuxing-flow-sp__node{padding:.7rem .55rem;border:1px solid rgba(210,170,77,.32);border-radius:9px;background:rgba(255,255,255,.018);text-align:center;color:var(--wf-text);font-size:.75rem;line-height:1.45}
.wuxing-flow-sp__node b{display:block;color:var(--wf-gold-soft);font-size:.82rem;margin-bottom:.12rem}
.wuxing-flow-sp__arrow{text-align:center;color:var(--wf-gold);padding:.27rem 0;font-size:1rem}
.wuxing-flow-sp__node--strong{border-color:rgba(227,191,104,.7);background:rgba(210,170,77,.06)}
@media(max-width:680px){
  .wuxing-figure{margin:1.8rem 0 2rem;padding:1rem .85rem}
  .wuxing-figure__lead{font-size:.78rem}
  .wuxing-figure__legend{display:grid;gap:.4rem;padding:.7rem .2rem;border-left:0;border-right:0}
  .wuxing-figure__svg{max-height:420px}
}
@media(max-width:480px){
  .wuxing-figure--flow .wuxing-figure__svg{display:none}
  .wuxing-figure--flow .wuxing-figure__sp-flow{display:block}
}
