/* #region zone:account.details-design — ตารางสิทธิ์และประวัติที่อ่านตัวเลขง่าย */
.comparison-panel {
  margin-top: var(--sp-6);
}
.comparison-panel h2 {
  margin-top: 6px;
}
.table-note {
  font-size: var(--fs-sm);
  color: var(--muted);
  line-height: 1.7;
  margin: var(--sp-4) 0 0;
  max-width: 90ch;
}
.usage-heading {
  margin-bottom: var(--sp-6);
}
.usage-heading h2 {
  margin-top: var(--sp-2);
}
.mobile-table-hint {
  display: none;
  font-size: var(--fs-sm);
  color: var(--muted);
  margin: 10px 0 0;
}
.table-wrap:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 3px;
}
#plans .plan-card {
  background: var(--panel);
  border-top: 3px solid var(--accent);
}
#plans .plan-card h3 {
  font-size: 22px;
  margin: 0;
}
#plans .plan-card .price {
  color: var(--accent-text);
  line-height: 1.3;
}
#plans .plan-card ul {
  line-height: 1.9;
}
#plans .plan-card button {
  width: 100%;
}
#plans table,
#usage table {
  font-size: var(--fs-md);
}
#plans th,
#usage th {
  font-weight: 600;
  vertical-align: middle;
}
#plans td,
#usage td {
  vertical-align: middle;
}
#plans .numeric,
#usage .numeric {
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.comparison-panel th:not(:first-child),
.comparison-panel td:not(:first-child) {
  text-align: center;
  min-width: 155px;
  font-variant-numeric: tabular-nums;
}
.comparison-panel td:first-child {
  font-weight: 500;
  min-width: 190px;
}
.comparison-panel tbody tr:nth-child(-n + 6) {
  background: var(--panel2);
}
.comparison-panel tbody tr:nth-child(6) {
  border-bottom: 2px solid var(--line);
}
.usage-history tbody tr:first-child {
  background: var(--acc-soft);
}
#usage .panel {
  padding: var(--sp-6);
}
#plans .table-wrap,
#usage .table-wrap {
  border: 1px solid var(--line);
  border-radius: var(--r-control);
  margin-top: var(--sp-4);
  max-width: 100%;
}
#plans tr:last-child td,
#usage tr:last-child td {
  border-bottom: 0;
}
@media (max-width: 700px) {
  #usage .panel {
    padding: 18px;
  }
  .comparison-panel {
    padding: 18px;
  }
  .table-note {
    font-size: var(--fs-sm);
  }
  .mobile-table-hint {
    display: block;
  }
}
/* #endregion */
