/* Native, keyboard-accessible offer and sample dialogs with scroll-safe sizing.
   Trial details explicitly reflect the unconnected payment state. */
dialog {
  width: min(600px, calc(100% - 32px));
  max-height: calc(100svh - 40px);
  overflow: auto;
  padding: 30px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: var(--paper);
  color: var(--ink);
}
dialog::backdrop {
  background: #1a2c23bb;
  backdrop-filter: blur(5px);
}
dialog[open] {
  animation: enter .2s both;
}
.dialog-heading {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 15px;
}
.dialog-close {
  font-size: 30px;
  width: 44px;
  height: 44px;
}
.dialog-price {
  display: block;
  font-size: 74px;
  letter-spacing: -.065em;
  color: #66825c;
  margin: 5px 0 20px;
}
dialog h2 {
  font-size: 36px;
}
dialog > p {
  margin: 24px 0;
  font-size: 13px;
  color: var(--muted);
}
.dialog-concept {
  width: 100%;
  max-height: 40svh;
  object-fit: contain;
  margin-top: 20px;
}
.dialog-actions {
  display: flex;
  gap: 22px;
  flex-wrap: wrap;
  align-items: center;
}
.noscript {
  padding: 20px;
  text-align: center;
  font-size: 13px;
}