.terms-page {
  background: var(--color-canvas);
}

.terms-page__layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
}

.terms-page__layout > * {
  min-width: 0;
}

.terms-page__document-column {
  width: min(100%, 53.75rem);
  min-width: 0;
}

.terms-page__intro {
  padding-block-end: var(--space-12);
}

.terms-page__lead {
  width: min(100%, 46.25rem);
  color: var(--color-muted-ink);
  font-size: var(--text-lg);
  line-height: var(--leading-lg);
}

.terms-page__lead strong {
  color: var(--color-ink);
}

.terms-page__scope-card,
.terms-page__acceptance,
.terms-page__important-note,
.terms-page__refresh-note,
.terms-page__ownership-note,
.terms-page__third-party-note,
.terms-page__current-version-note,
.terms-page__contact-card {
  display: flex;
  min-width: 0;
  align-items: flex-start;
  gap: var(--space-4);
}

.terms-page__scope-card {
  margin-block: var(--space-8) var(--space-6);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-lg);
  background: var(--color-surface);
  padding: var(--space-6);
  box-shadow: var(--shadow-card);
}

.terms-page__scope-icon,
.terms-page__document-mark,
.terms-page__refresh-symbol {
  position: relative;
  display: block;
  flex: 0 0 2.5rem;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: var(--radius-md);
  background: var(--color-emerald-wash);
}

.terms-page__scope-icon::before,
.terms-page__document-mark::before {
  position: absolute;
  inset: 0.56rem 0.73rem;
  border: 2px solid var(--color-emerald);
  border-radius: 0.22rem;
  content: "";
}

.terms-page__scope-icon::after,
.terms-page__document-mark::after {
  position: absolute;
  top: 1.3rem;
  left: 1rem;
  width: 0.54rem;
  height: 0.12rem;
  background: var(--color-emerald);
  box-shadow: 0 0.35rem 0 var(--color-emerald);
  content: "";
}

.terms-page__scope-content {
  display: flex;
  min-width: 0;
  flex: 1 1 auto;
  flex-direction: column;
  gap: var(--space-3);
}

.terms-page__scope-content h2,
.terms-page__scope-content ul,
.terms-page__acceptance p,
.terms-page__important-note h3,
.terms-page__important-note p,
.terms-page__refresh-note h3,
.terms-page__refresh-note p,
.terms-page__ownership-note h3,
.terms-page__ownership-note p,
.terms-page__third-party-note h3,
.terms-page__third-party-note p,
.terms-page__current-version-note h3,
.terms-page__current-version-note p,
.terms-page__contact-card h3,
.terms-page__contact-card p,
.terms-page__rule-card h3,
.terms-page__rule-card p,
.terms-page__permission-card h3,
.terms-page__permission-card p,
.terms-page__guide-card h3,
.terms-page__guide-card p,
.terms-page__reliability-card h3,
.terms-page__reliability-card p,
.terms-page__change-card h3,
.terms-page__change-card p,
.terms-page__external-card h3,
.terms-page__external-card p {
  margin: 0;
}

.terms-page__scope-content h2 {
  font-size: var(--text-xl);
}

.terms-page__acceptance {
  width: 100%;
  border-radius: var(--radius-lg);
  background: var(--color-emerald-wash);
  padding: var(--space-4) var(--space-6);
  color: var(--color-muted-ink);
}

.terms-page__acceptance > * {
  min-width: 0;
}

.terms-page__section {
  padding-block: var(--section-space);
}

.terms-page__section-heading {
  width: min(100%, 45rem);
  margin-block-end: var(--space-6);
}

.terms-page__section-heading > :last-child {
  margin-block-end: 0;
}

.terms-page__section-heading p:not(.eyebrow) {
  color: var(--color-muted-ink);
}

.terms-page__card-stack,
.terms-page__changes-stack,
.terms-page__contact-stack {
  display: flex;
  min-width: 0;
  flex-direction: column;
}

.terms-page__card-stack {
  gap: var(--space-4);
}

.terms-page__changes-stack {
  width: min(100%, 47.5rem);
  gap: var(--space-4);
}

.terms-page__contact-stack {
  width: min(100%, 40rem);
  gap: var(--space-4);
}

.terms-page__card-stack > *,
.terms-page__changes-stack > *,
.terms-page__contact-stack > * {
  width: 100%;
  min-width: 0;
}

.terms-page__rule-card,
.terms-page__permission-card,
.terms-page__guide-card,
.terms-page__external-card,
.terms-page__reliability-card,
.terms-page__change-card {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: var(--space-4);
}

.terms-page__rule-card p,
.terms-page__permission-card p,
.terms-page__guide-card p,
.terms-page__external-card p,
.terms-page__reliability-card p,
.terms-page__change-card p {
  width: min(100%, 45rem);
}

.terms-page__section-number {
  display: inline-flex;
  width: max-content;
  min-width: 0;
  align-items: center;
  border-radius: var(--radius-sm);
  background: var(--color-emerald-wash);
  color: var(--color-emerald-deep);
  padding: 0.25rem 0.5rem;
  font-size: var(--text-xs);
  font-weight: 700;
  line-height: var(--leading-xs);
}

.terms-page__marker-list,
.terms-page__topic-list {
  display: grid;
  min-width: 0;
  margin: 0;
  padding: 0;
}

.terms-page__marker-list {
  width: min(100%, 42.5rem);
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-3);
}

.terms-page__marker-list > li,
.terms-page__topic-list > li {
  position: relative;
  min-width: 0;
  padding-inline-start: 1.35rem;
  color: var(--color-muted-ink);
}

.terms-page__marker-list > li::before,
.terms-page__topic-list > li::before {
  position: absolute;
  top: 0.62em;
  left: 0;
  width: 0.48rem;
  height: 0.48rem;
  border-radius: 50%;
  background: var(--color-emerald);
  content: "";
}

.terms-page__marker-list--pink > li::before {
  background: var(--color-pink);
}

.terms-page__topic-list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-3) var(--space-6);
}

.terms-page__important-note,
.terms-page__refresh-note,
.terms-page__ownership-note,
.terms-page__third-party-note,
.terms-page__current-version-note {
  border: 1px solid var(--color-line);
  border-radius: var(--radius-lg);
  background: var(--color-emerald-wash);
  padding: var(--space-6);
}

.terms-page__important-note > *,
.terms-page__refresh-note > *,
.terms-page__ownership-note > *,
.terms-page__third-party-note > *,
.terms-page__current-version-note > * {
  min-width: 0;
}

.terms-page__important-note > div,
.terms-page__refresh-note > div {
  display: flex;
  min-width: 0;
  flex: 1 1 auto;
  flex-direction: column;
  gap: var(--space-2);
}

.terms-page__important-note .badge {
  flex: 0 0 auto;
}

.terms-page__permission-label {
  display: inline-flex;
  width: max-content;
  min-width: 0;
  align-items: center;
  border-radius: var(--radius-sm);
  padding: 0.25rem 0.5rem;
  font-size: var(--text-xs);
  font-weight: 700;
  line-height: var(--leading-xs);
}

.terms-page__permission-label--allowed {
  background: var(--color-emerald-wash);
  color: var(--color-emerald-deep);
}

.terms-page__permission-label--restricted {
  background: #fce7f3;
  color: #be185d;
}

.terms-page__access-note,
.terms-page__decision-note {
  width: min(100%, 45rem);
  border-top: 1px solid var(--color-line);
  padding-block-start: var(--space-6);
}

.terms-page__access-note p,
.terms-page__decision-note p {
  margin: 0;
  color: var(--color-muted-ink);
}

.terms-page__refresh-symbol::before {
  position: absolute;
  inset: 0.63rem;
  border: 2px solid var(--color-emerald);
  border-right-color: transparent;
  border-radius: 50%;
  content: "";
}

.terms-page__refresh-symbol::after {
  position: absolute;
  top: 0.48rem;
  right: 0.46rem;
  width: 0;
  height: 0;
  border-width: 0.3rem 0 0.3rem 0.42rem;
  border-style: solid;
  border-color: transparent transparent transparent var(--color-emerald);
  content: "";
}

.terms-page__app-id {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: var(--space-3);
  overflow-x: auto;
  border: 1px solid var(--color-line);
  border-radius: var(--radius-sm);
  background: var(--color-emerald-wash);
  padding: var(--space-3);
}

.terms-page__app-id > * {
  min-width: 0;
}

.terms-page__app-id span {
  flex: 0 0 auto;
  color: var(--color-muted-ink);
  font-size: var(--text-sm);
  font-weight: 700;
}

.terms-page__app-id code {
  flex: 0 0 auto;
  background: var(--color-surface);
  color: var(--color-ink);
  white-space: nowrap;
}

.terms-page__decision-note--separated {
  margin-block-start: var(--space-2);
}

.terms-page__contact-card {
  flex-direction: column;
  border: 1px solid var(--color-line);
  border-radius: var(--radius-lg);
  background: var(--color-emerald-wash);
  padding: var(--space-6);
}

.terms-page__contact-card > * {
  min-width: 0;
}

.terms-page__email-link {
  width: max-content;
  max-width: 100%;
  overflow-wrap: anywhere;
  color: var(--color-emerald-deep);
  font-weight: 700;
}

.terms-page__closing {
  width: min(100%, 40rem);
  margin: 0;
  color: var(--color-muted-ink);
}

.terms-page__section--last {
  padding-block-end: var(--space-28);
}

@media (max-width: 56.25rem) {
  .terms-page__document-column {
    width: 100%;
  }
}

@media (max-width: 38.75rem) {
  .terms-page__topic-list {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 51.25rem) {
  .terms-page__intro {
    padding-block-end: var(--space-8);
  }

  .terms-page__scope-card,
  .terms-page__important-note,
  .terms-page__refresh-note,
  .terms-page__ownership-note,
  .terms-page__third-party-note,
  .terms-page__current-version-note,
  .terms-page__contact-card {
    padding: var(--space-5, 1.25rem);
  }

  .terms-page__acceptance {
    padding: var(--space-4) var(--space-5, 1.25rem);
  }

  .terms-page__section-heading {
    width: 100%;
  }
}

@media (max-width: 30rem) {
  .terms-page__scope-card,
  .terms-page__acceptance,
  .terms-page__important-note,
  .terms-page__refresh-note {
    flex-direction: column;
  }

  .terms-page__scope-icon,
  .terms-page__document-mark,
  .terms-page__refresh-symbol {
    flex-basis: 2.5rem;
  }

  .terms-page__app-id {
    align-items: flex-start;
    flex-direction: column;
  }
}
