/* 九星盤（無料・有料共通）。パステル＋ゴールド。文字と色の両方で印を示す。 */
.kb{margin:8px 0 4px}
.kb-grid{position:relative;width:100%;max-width:400px;aspect-ratio:1;margin:0 auto;border-radius:18px;padding:3px;
  background:var(--gold-grad);background-size:200% 100%;box-shadow:0 6px 18px rgba(185,133,24,.28)}
.kb-cells{position:absolute;inset:3px;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:2px;
  border-radius:15px;overflow:hidden;background:#e9cf85}
.kb-cell{position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;min-width:0;min-height:0;
  padding:4px 4px 3px;margin:0;border:0;border-radius:0;cursor:pointer;font-family:inherit;text-align:left;color:var(--fg);
  background:linear-gradient(#fffdf8,#fff6e0)}
.kb-cell:nth-child(even){background:linear-gradient(#fffaf0,#fff1d2)}
.kb-cell[data-p="中"]{background:linear-gradient(#fff6d0,#ffe9a6)}
.kb-cell:hover{filter:brightness(.98)}
.kb-cell:focus-visible{outline:3px solid #6b3fc0;outline-offset:-3px;z-index:3}
.kb-cell.sel{box-shadow:inset 0 0 0 3px #8a5fd6}
.kb-cell.has-mark{background:linear-gradient(#fff4f5,#ffe3e8)}
.kb-cell.kichi-kichi{background:radial-gradient(circle at 50% 45%,#fff5c8,#fffaf0 75%)}
.kb-cell.kichi-saidai{background:radial-gradient(circle at 50% 45%,#ffe89a,#fff3c4 70%);box-shadow:inset 0 0 0 2px #e3a72f,inset 0 0 14px rgba(255,214,110,.8)}
.kb-cell.sel.kichi-saidai{box-shadow:inset 0 0 0 3px #8a5fd6,inset 0 0 14px rgba(255,214,110,.8)}
.kb-dir{font-size:.62rem;line-height:1.2;color:#6d5a66;font-weight:700;white-space:nowrap}
.kb-marks{display:flex;flex-wrap:wrap;gap:2px;margin-top:auto;width:100%;justify-content:center;position:relative;z-index:1}
.kb-mark{display:inline-block;font-size:.58rem;line-height:1.25;padding:0 4px;border-radius:5px;font-weight:700;border:1px solid;white-space:nowrap}
.k-sev{background:#b3213f;color:#fff;border-color:#8c1530}                       /* 五黄殺・暗剣殺 */
.k-ha{background:#fff0d6;color:#7a3f00;border-color:#c77a10;border-style:dashed} /* 歳破・月破 */
.k-me{background:#f3e6ff;color:#5a2a99;border-color:#8a5fd6}                     /* 本命殺・月命殺など */
.k-good{background:#fff3c4;color:#6b4300;border-color:#c48a10}
.k-you{background:#e4f6ea;color:#1d5a34;border-color:#3a9a5f}

.kb-path{position:absolute;inset:3px;width:calc(100% - 6px);height:calc(100% - 6px);pointer-events:none;z-index:1;overflow:visible}
.kb-path path{fill:none;stroke:#c98af0;stroke-width:.035;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:0;opacity:.3}
.kb-tokens{position:absolute;inset:3px;pointer-events:none;z-index:2}
.kb-tok{position:absolute;left:0;top:0;width:33.3333%;height:33.3333%;display:flex;align-items:flex-start;justify-content:center;
  will-change:transform,opacity}
.kb-chip{margin-top:20%;width:60%;max-width:64px;padding:2px 0 3px;border-radius:14px;text-align:center;line-height:1.1;border:2px solid;
  box-shadow:0 3px 8px rgba(90,58,6,.25);font-family:"Kiwi Maru",serif}
.kb-chip b{display:block;font-size:.9rem;font-weight:500}
.kb-chip small{display:block;font-size:.6rem;font-family:"Zen Maru Gothic",sans-serif;font-weight:700}
.e-ki{background:#dff5df;border-color:#5aa66a;color:#1e5a2c}
.e-hi{background:#ffe0e2;border-color:#e0646c;color:#8c1a26}
.e-tsu{background:#f6e7c4;border-color:#c49a48;color:#5e4108}
.e-kin{background:#f1f1f5;border-color:#a9a9bd;color:#3f3f55}
.e-mizu{background:#dcecff;border-color:#5e97d6;color:#164a86}
.kb-tok.you .kb-chip{box-shadow:0 0 0 3px #fff,0 0 0 5px #3a9a5f,0 3px 10px rgba(58,154,95,.4)}

.kb-compass{text-align:center;font-size:.7rem;color:var(--mute);margin:6px 0 0;line-height:1.5}
.kb-controls{text-align:center;margin:6px 0 0}
.kb-replay{border:0;background:none;color:#6b3fc0;font:inherit;font-size:.8rem;font-weight:700;text-decoration:underline;cursor:pointer;padding:6px 8px}
.kb-replay:focus-visible,.kb-tab:focus-visible{outline:3px solid #6b3fc0;outline-offset:2px}
.kb-detail{margin:8px 0 0;padding:10px 14px;border-radius:14px;background:#fff8e4;border:1px solid #ecd28a;min-height:3.4em;font-size:.84rem;line-height:1.75}
.kb-detail p{margin:0}.kb-dh{margin-bottom:2px !important}
.kb-hint{color:var(--mute)}
.kb-dt{font-size:.84rem;line-height:1.75;margin:2px 0 0}
.kb-list{list-style:none;margin:10px 0 0;padding:10px 14px;border-radius:14px;background:#fffdf8;border:1px dashed #ecd28a;font-size:.78rem;line-height:1.8}
.kb-list b{color:#5a4224}

.kb-tabs{display:flex;gap:6px;margin:0 0 10px;padding:4px;border-radius:999px;background:rgba(255,255,255,.7);border:1px solid #ecd28a}
.kb-tab{flex:1;min-width:0;border:0;background:none;padding:8px 4px;border-radius:999px;font-family:"Kiwi Maru",serif;font-size:.82rem;color:#6d5a66;cursor:pointer}
.kb-tab.on{background:var(--gold-grad);background-size:200% 100%;color:#5a3a06;box-shadow:0 3px 8px rgba(185,133,24,.35)}

.kb-summary{margin-top:14px}
.kb-sum-block{margin-bottom:12px}
.kb-sum-h{font-family:"Kiwi Maru",serif;font-size:.95rem;margin:0 0 6px;padding-left:8px;border-left:4px solid;font-weight:500}
@media (max-width:420px){.kb-sum-h{font-size:.82rem}}
.kb-sum-h.bad{border-color:#b3213f;color:#8c1530}
.kb-sum-h.good{border-color:#e3a72f;color:#6b4300}
.kb-sum-row{padding:8px 0;border-top:1px dashed #ecd28a}.kb-sum-row:first-of-type{border-top:0}
.kb-sum-t{margin:0;font-size:.86rem;font-weight:700}
.kb-note{font-size:.76rem;color:var(--mute);margin:6px 0 0}
.kb-lead{font-size:.88rem;line-height:1.8}

@media (max-width:380px){
  .kb-dir{font-size:.56rem}
  .kb-mark{font-size:.54rem;padding:0 3px}
  .kb-chip b{font-size:.8rem}
  .kb-tab{font-size:.74rem}
}
@media (prefers-reduced-motion:reduce){
  .kb-replay{display:none}
}
