/* #region zone:desk.style.bonds-history-dialog — ประวัติตรงกลางจอและตารางประเทศกระชับ */
.desk-dialog.bond-history-dialog {
  width: min(960px, calc(100vw - 32px));
  max-height: calc(100dvh - 32px);
  padding: var(--sp-4);
  container-type: inline-size;
}
.bond-history-dialog .bond-hist-head {
  margin-bottom: var(--sp-3);
}
.bond-history-close {
  flex: none;
  font-size: var(--fs-2xl);
}
.bond-history-dialog .bond-range {
  width: fit-content;
  flex-wrap: wrap;
  margin-bottom: var(--sp-3);
}
.bond-history-dialog .num {
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.bond-history-skeleton {
  height: 260px;
  border-radius: var(--r-control);
  background: var(--panel2);
  border: 1px solid var(--line);
}
#bond-world-table {
  table-layout: fixed;
}
#bond-world-table th:first-child {
  width: 30%;
}
#bond-world-table th:nth-child(2),
#bond-world-table th:nth-child(3) {
  width: 17%;
}
.bond-h2 .bond-flag {
  margin-inline-end: var(--sp-2);
}
@media (max-width: 600px) {
  .desk-dialog.bond-history-dialog {
    width: calc(100vw - 32px);
    margin: auto;
    padding: var(--sp-3);
  }
  .bond-history-skeleton {
    height: 240px;
  }
}
@container (max-width: 600px) {
  #bond-world-table th:first-child {
    width: 46%;
  }
  #bond-world-table th:nth-child(2),
  #bond-world-table th:nth-child(3) {
    width: 27%;
  }
}
/* #endregion */