/* ═══════════════════════════════════════════════════════════════════════════
   TSCWORLD AI™ — Finance AI module (หน้า 85–94)
   โหลดหลัง acc.css เสมอ · ใช้ระบบโทนสีเดิม (.c-* ตั้งค่า --c)
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── 1. GRID ────────────────────────────────────────────────────────── */
.g-fin{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr) minmax(0,1fr);gap:16px}
.g-fin2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:16px}

/* ── 2. อัตราส่วนทางการเงิน (การ์ดเล็ก 8 ช่อง) ──────────────────────── */
.rt{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px;text-align:center}
.rt article{padding:14px 9px;border-radius:12px;border:1px solid var(--line-soft);background:var(--bg-tile);
  transition:all .22s var(--ease)}
.rt article:hover{border-color:var(--line-hot);transform:translateY(-3px)}
.rt__k{font-size:11px;font-weight:700;color:var(--tx-2)}
.rt__s{font-size:9.5px;color:var(--tx-4);margin-top:3px;line-height:1.4;min-height:26px}
.rt__v{font-size:22px;font-weight:800;color:var(--c,var(--tx));margin:9px 0;font-variant-numeric:tabular-nums}
.rt__b{display:inline-block;padding:3px 11px;border-radius:7px;font-size:10px;font-weight:800;
  color:var(--c,#2ED47A);background:color-mix(in srgb,var(--c,#2ED47A) 15%,transparent)}

/* ── 3. การ์ดโมดูล Treasury (แถวละ 7) ───────────────────────────────── */
.tmod{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:12px}
.tmod article{padding:14px 11px;border-radius:12px;text-align:center;
  border:1px solid var(--line-soft);background:var(--bg-tile);border-top:2.5px solid var(--c,#3B6BFF)}
.tmod__n{font-size:10.5px;font-weight:700;color:var(--tx-2)}
.tmod__v{font-size:16px;font-weight:800;color:var(--c,var(--tx));margin-top:6px;font-variant-numeric:tabular-nums}
.tmod__x{font-size:9.5px;color:var(--tx-4);margin-top:3px}

/* ── 4. แผนที่ความเสี่ยง 5×5 ────────────────────────────────────────── */
.rhm{display:grid;grid-template-columns:auto repeat(5,minmax(0,1fr));gap:3px;align-items:center}
.rhm__ax{font-size:9px;color:var(--tx-4);text-align:right;padding-right:6px;white-space:nowrap}
.rhm i{display:grid;place-items:center;aspect-ratio:1.5;border-radius:5px;font-size:11px;font-weight:800;
  font-style:normal;color:#08131F;background:var(--c,#2FA85B)}
.rhm .k1{--c:#1E7F45} .rhm .k2{--c:#5BA84E} .rhm .k3{--c:#E8C547} .rhm .k4{--c:#E8944B} .rhm .k5{--c:#DF5A4B}
.rhm__b{font-size:9px;color:var(--tx-4);text-align:center;padding-top:4px}

/* ── 5. แถววงแหวนคะแนน ──────────────────────────────────────────────── */
.srow2{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;text-align:center}
.srow2 svg{width:100%;max-width:86px;height:auto;margin:0 auto}
.srow2__v{font-size:15px;font-weight:800;fill:#EAF2FF;text-anchor:middle}
.srow2__k{font-size:10.5px;font-weight:600;color:var(--tx-2);margin-top:6px}
.srow2__s{font-size:9.5px;color:var(--tx-4);margin-top:2px}

/* ── 6. RESPONSIVE ──────────────────────────────────────────────────── */
@media (max-width:1500px){ .tmod{grid-template-columns:repeat(4,minmax(0,1fr))} }
@media (max-width:1400px){ .g-fin{grid-template-columns:minmax(0,1fr) minmax(0,1fr)} .g-fin2{grid-template-columns:minmax(0,1fr)} }
@media (max-width:900px){ .rt,.tmod,.srow2{grid-template-columns:repeat(3,minmax(0,1fr))} }
@media (max-width:640px){
  .g-fin{grid-template-columns:minmax(0,1fr)}
  .rt,.tmod,.srow2{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* ── 7. ยูทิลิตี้ ────────────────────────────────────────────────────── */
.grow1{flex:1;min-width:0}
.tar{text-align:right;flex-shrink:0}
.srcl .grow1,.srcl .tar{display:flex;flex-direction:column}
.dotc{display:inline-block;width:8px;height:8px;border-radius:3px;margin-right:8px;
  vertical-align:1px;background:var(--c,#3B8CFF)}
.dt tfoot td{border-top:1.5px solid var(--line-hot);color:var(--tx-2)}