.public-page { padding-top: 28px; padding-bottom: 40px; }
.public-page h1 { font-size: clamp(2.1rem, 7vw, 3.6rem); line-height: 1.05; }
.public-page h2 { margin-top: 36px; }
.public-page p { max-width: 72ch; }
.public-links { display: flex; flex-wrap: wrap; gap: 12px 20px; margin: 24px 0; }
.public-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 245px), 1fr)); gap: 18px; }
.public-card { min-width: 0; overflow: hidden; background: white; border: 1px solid #d9d6ce; border-radius: 14px; }
.public-card img { width: 100%; height: auto; aspect-ratio: 1; object-fit: contain; background: white; }
.public-card-copy { padding: 18px; }
.public-card h3 { font-size: 1.1rem; overflow-wrap: anywhere; }
.public-card p { margin: 10px 0; }
.public-card a, .public-page li, .public-links a { overflow-wrap: anywhere; }
.public-video img { aspect-ratio: 16 / 9; object-fit: cover; }
.public-channel-list { padding-left: 20px; columns: 3 230px; }
.public-channel-list li { margin-bottom: 10px; break-inside: avoid; }
.public-example { overflow-x: auto; }
.public-example table { width: 100%; border-collapse: collapse; }
.public-example th, .public-example td { text-align: left; padding: 10px; border-bottom: 1px solid #d9d6ce; }
.public-page section { scroll-margin-top: 90px; }
@media (max-width: 520px) {
  .public-page { padding-inline: 18px; }
  .public-grid { grid-template-columns: minmax(0, 1fr); }
}