/* Token-driven so every theme inherits its own palette. */
.licence-page { background: var(--paper); padding-block: clamp(2rem, 6vw, 4.5rem); }
.licence-wrap { width: 100%; max-width: 44rem; margin-inline: auto; padding-inline: 1rem; }
.licence-title { font-size: clamp(1.75rem, 5vw, 2.75rem); color: var(--ink); margin: 0 0 .5rem; }
.licence-intro, .licence-disclaimer, .licence-unreadable { color: var(--ink-2); line-height: 1.6; }

/* The one sentence the page's honesty rests on — set apart as a card, not
   just another paragraph, but no alarm colors: this is a routine disclosure,
   not a warning. */
.licence-disclaimer {
  margin-top: 1.5rem; font-size: .95rem;
  background: var(--paper-2); border: 1px solid var(--rule); border-radius: .5rem;
  padding: .875rem 1rem;
}

.licence-facts {
  display: grid; grid-template-columns: minmax(8rem, max-content) 1fr;
  gap: .5rem 1.5rem; margin: 2rem 0 0;
}
.licence-facts dt { color: var(--ink-2); font-weight: 600; }
.licence-facts dd { margin: 0; color: var(--ink); overflow-wrap: anywhere; }

/* One column below 480px: a long domain must wrap, never be clipped.
   px, not rem, matching every other page's breakpoints in assets/css/pages/. */
@media (max-width: 480px) {
  .licence-facts { grid-template-columns: 1fr; gap: .125rem 0; }
  .licence-facts dd { margin-bottom: .75rem; }
}

.licence-verify-btn {
  display: inline-block; margin-top: 1.5rem; padding: .75rem 1.25rem;
  border: 1px solid var(--rule); border-radius: .5rem;
  background: var(--ink); color: var(--paper); text-decoration: none;
  font-weight: 600; line-height: 1.3;
}
.licence-verify-btn:hover { opacity: .9; }
