/* modal.css — 详情/贴士弹层 */
#modalMask {
  position: fixed; inset: 0; z-index: 50;
  background: rgba(0, 0, 0, .62);
  display: flex; align-items: center; justify-content: center;
  padding: 16px;
}
.modal {
  width: 100%; max-width: 560px; max-height: 86vh;
  overflow-y: auto;
  background: #1f1f24;
  border: 1px solid #3a3a42; border-left: 3px solid #f0a030;
  border-radius: 12px;
  padding: 18px 20px 20px;
}
.modal h2 { font-size: 18px; color: #f0c060; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.modal .sub { color: #999; font-size: 13px; margin: 2px 0 12px; }
.modal .sec { margin-top: 14px; }
.modal .sec h3 {
  font-size: 13px; color: #f0a030; font-weight: 600;
  margin-bottom: 5px;
}
.modal .sec p, .modal .sec li { font-size: 14px; color: #ccc; }
.modal .sec ul { padding-left: 18px; }
.modal .redtext {
  font-size: 13.5px; color: #ff9c6a; font-style: italic;
  margin-bottom: 4px;
}
.modal-close {
  position: sticky; top: 0; float: right;
  width: 32px; height: 32px; margin: -6px -8px 0 0;
  border-radius: 8px; color: #999; font-size: 18px; line-height: 1;
}
.modal-close:hover { background: #2e2e35; color: #e0e0e4; }

/* 贴士 */
.tips-list { list-style: none; counter-reset: tip; }
.tips-list li {
  counter-increment: tip;
  position: relative;
  padding: 10px 0 10px 34px;
  border-bottom: 1px solid #2a2a30;
  font-size: 14px; color: #ccc;
}
.tips-list li:last-child { border-bottom: none; }
.tips-list li::before {
  content: counter(tip);
  position: absolute; left: 0; top: 12px;
  width: 22px; height: 22px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 50%;
  background: #3d2a10; color: #ffd08a; font-size: 12px; font-weight: 700;
}
.tips-list b { color: #f0c060; }