/* ============================================================
 * 生肖配对页样式 peidui.css
 * 包含：配对表单、配对矩阵、六合三合卡片
 * ============================================================ */

.match-form{
  display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:12px;
  padding:20px;
  background:linear-gradient(135deg,#fff5d2,#fbeac5);
  border:2px dashed #d4a017;border-radius:8px;
}
.match-form label{font-size:16px;color:#5a2a1a}
.match-form select{
  font-family:inherit;font-size:16px;padding:8px 14px;
  border:1px solid #c9a45c;border-radius:4px;
  background:#fff;color:#5a2a1a;min-width:120px;
}
.match-form .vs{font-size:24px;color:#c0392b;font-weight:bold;padding:0 8px}
.match-form button{
  font-family:inherit;font-size:16px;padding:8px 24px;
  background:#c0392b;color:#fff;border:none;border-radius:4px;
  cursor:pointer;letter-spacing:2px;
}
.match-form button:hover{background:#8b0000}

/* 配对结果 */
.result{margin-top:20px;display:none}
.result.show{display:block}
.result .pair{text-align:center;font-size:22px;color:#8b0000;margin-bottom:12px;letter-spacing:2px}
.result .level{text-align:center;font-size:18px;color:#c0392b;margin-bottom:14px}
.result .stars{text-align:center;font-size:26px;color:#d4a017;margin-bottom:10px;letter-spacing:4px}
.result p{font-size:16px;text-indent:2em;margin-bottom:10px}

/* 配对矩阵 */
.matrix{overflow-x:auto}
table.matrix-table{
  border-collapse:collapse;font-size:14px;
  width:100%;min-width:680px;background:#fff;
}
table.matrix-table th,table.matrix-table td{
  border:1px solid #e6c98a;padding:8px 4px;text-align:center;
}
table.matrix-table thead th{background:#8b0000;color:#fff7d6}
table.matrix-table th.row-head{background:#fbeac5;color:#8b0000}
table.matrix-table td.l5{background:#ffe2e2;color:#8b0000;font-weight:bold}
table.matrix-table td.l4{background:#ffefc8;color:#a35f12}
table.matrix-table td.l3{background:#f5f5dc;color:#5a4a2a}
table.matrix-table td.l2{background:#e9eef7;color:#3a4a5a}
table.matrix-table td.l1{background:#e6e6e6;color:#666}
table.matrix-table a{display:block;padding:2px 0}

.legend{margin:10px 0;font-size:14px;color:#5a2a1a;text-align:center}
.legend span{display:inline-block;padding:2px 10px;margin:0 4px;border-radius:3px}

/* 六合 / 三合 / 六冲卡片 */
.combo{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:10px}
.combo .card{
  background:#fff;border:1px solid #e6c98a;
  border-radius:6px;padding:14px;
}
.combo .card h3{font-size:17px;color:#8b0000;margin-bottom:6px}
.combo .card p{font-size:14px;color:#3a2b1a;line-height:1.7}

@media(max-width:768px){
  .combo{grid-template-columns:1fr}
  .match-form select{min-width:90px}
}