.compatibility-page .compatibility-article {
  width: 100%;
  border: 1px solid var(--m3-outline);
  border-radius: var(--m3-radius);
  background: var(--m3-surface);
  box-shadow: var(--m3-shadow);
}

.compatibility-hero {
  display: grid;
  gap: 14px;
  padding-bottom: clamp(22px, 4vw, 38px);
  border-bottom: 1px solid var(--m3-outline);
}

.compatibility-kicker {
  margin: 0 !important;
  color: var(--m3-primary) !important;
  font-size: .82rem !important;
  font-weight: 800;
  line-height: 1.2 !important;
  text-transform: uppercase;
}

.compatibility-hero h1 { max-width: 22ch !important; }
.compatibility-hero .lead { margin: 0 !important; max-width: 68ch !important; }

.compatibility-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 6px;
}

.compatibility-button {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 18px;
  border: 1px solid var(--m3-outline-strong);
  border-radius: 999px;
  color: var(--m3-text);
  background: var(--m3-surface-2);
  font-size: .92rem;
  font-weight: 800;
  text-decoration: none;
}

.compatibility-button--primary {
  border-color: var(--m3-primary);
  color: #1a0e12;
  background: var(--m3-primary);
}

.compatibility-toc {
  margin: clamp(22px, 4vw, 36px) 0 0;
  padding: 18px;
  border: 1px solid var(--m3-outline);
  border-radius: calc(var(--m3-radius) - 4px);
  background: var(--m3-surface-2);
}

.compatibility-toc h2 { margin: 0 0 10px !important; font-size: 1.08rem !important; }
.compatibility-toc ol { margin: 0; display: grid; gap: 4px; }
.compatibility-toc a { color: var(--m3-secondary); font-weight: 700; text-decoration: none; }

.compatibility-section,
.compatibility-answer,
.compatibility-example,
.compatibility-caution,
.compatibility-steps,
.compatibility-links,
.compatibility-faq {
  margin: clamp(28px, 5vw, 50px) 0 0;
}

.compatibility-answer,
.compatibility-example,
.compatibility-caution {
  padding: clamp(18px, 3vw, 26px);
  border: 1px solid var(--m3-outline);
  border-radius: calc(var(--m3-radius) - 4px);
  background: var(--m3-surface-2);
}

.compatibility-answer { border-left: 4px solid var(--m3-primary); }
.compatibility-example { border-left: 4px solid var(--m3-secondary); }
.compatibility-caution { border-left: 4px solid var(--m3-tertiary, #9fd8d0); }
.compatibility-answer h2,
.compatibility-example h2,
.compatibility-caution h2 { margin-top: 0 !important; }

.compatibility-section p,
.compatibility-answer p,
.compatibility-example p,
.compatibility-caution p { max-width: 72ch !important; }

.compatibility-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-top: 18px;
}

.compatibility-card {
  min-width: 0;
  min-height: 100%;
  display: grid;
  align-content: start;
  gap: 8px;
  padding: 18px;
  border: 1px solid var(--m3-outline);
  border-radius: calc(var(--m3-radius) - 4px);
  color: var(--m3-text);
  background: var(--m3-surface-2);
  text-decoration: none;
}

.compatibility-card:hover { border-color: var(--m3-primary); }
.compatibility-card strong { color: var(--m3-text); font-size: 1.05rem; line-height: 1.3; }
.compatibility-card span { color: var(--m3-text-soft); font-size: .93rem; line-height: 1.55; }

.compatibility-links ul {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  padding: 0 !important;
  list-style: none;
}

.compatibility-links li { margin: 0 !important; }
.compatibility-links a {
  min-height: 48px;
  display: flex;
  align-items: center;
  padding: 12px 14px;
  border: 1px solid var(--m3-outline);
  border-radius: 10px;
  color: var(--m3-secondary);
  background: var(--m3-surface-2);
  font-weight: 700;
  text-decoration: none;
}

.compatibility-faq details {
  margin: 10px 0;
  padding: 14px 16px;
  border: 1px solid var(--m3-outline);
  border-radius: 10px;
  background: var(--m3-surface-2);
}

.compatibility-faq summary { color: var(--m3-text); font-weight: 800; cursor: pointer; }
.compatibility-faq details p { margin-bottom: 0; }

.compatibility-page .site-links{display:flex!important;flex-wrap:wrap!important;align-items:center!important;justify-content:flex-start!important;gap:10px!important;margin:clamp(22px,3.2vw,34px) 0 16px!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
.compatibility-page .site-links a{flex:0 1 auto!important;width:auto!important;min-width:0!important;min-height:44px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;padding:0 18px!important;border:1px solid rgba(255,128,132,.24)!important;border-radius:999px!important;color:var(--m3-primary,#ff8084)!important;background:color-mix(in srgb,var(--m3-surface-2,#1e1f26) 72%,transparent)!important;text-decoration:none!important;font-size:clamp(.86rem,1vw,.96rem)!important;font-weight:800!important;line-height:1.15!important;text-align:center!important;overflow-wrap:anywhere!important;transition:transform 160ms ease,border-color 160ms ease,background 160ms ease,color 160ms ease,box-shadow 160ms ease!important}
.compatibility-page .site-links a:hover{color:var(--m3-primary-on,#180b10)!important;border-color:transparent!important;background:linear-gradient(135deg,var(--m3-primary,#ff8084),color-mix(in srgb,var(--m3-secondary,#f2bd7e) 58%,var(--m3-primary,#ff8084)))!important;box-shadow:0 10px 24px rgba(215,187,255,.16)!important;transform:translateY(-1px)!important}
.compatibility-page .footer{display:flex!important;flex-wrap:wrap!important;align-items:center!important;justify-content:space-between!important;gap:10px!important;border-top:1px solid rgba(255,255,255,.10)!important;margin:0 0 .5rem!important;padding:18px 0 0!important;text-align:left!important;color:var(--m3-text-soft,#bbb8ca)!important;background:transparent!important}
.compatibility-page .footer-copy,.compatibility-page .footer-credit{display:inline-flex!important;width:auto!important;min-width:0!important;min-height:30px!important;align-items:center!important;justify-content:center!important;padding:6px 10px!important;border:0!important;border-radius:999px!important;background:color-mix(in srgb,var(--m3-surface-2,#1e1f26) 76%,transparent)!important;color:var(--m3-text-soft,#bbb8ca)!important;font-size:.78rem!important;font-weight:800!important;line-height:1.2!important}
.compatibility-page .footer-credit a{color:var(--m3-secondary,#f2bd7e)!important;text-decoration:none!important;border-bottom:0!important}

@media (max-width: 720px) {
  .compatibility-grid,
  .compatibility-links ul { grid-template-columns: 1fr; }
  .compatibility-actions { display: grid; }
  .compatibility-button { width: 100%; }
  .compatibility-page .compatibility-article { border-radius: 14px; }
  .compatibility-page .site-links{gap:8px!important}
  .compatibility-page .site-links a{min-height:40px!important;padding:0 13px!important;font-size:.84rem!important}
  .compatibility-page .footer{align-items:flex-start!important;flex-direction:column!important}
}