.hmsc-collection { max-width: 900px; margin: 32px auto; color: #3f3a37; }
.hmsc-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; align-items: stretch; }
.hmsc-sort { display: flex; align-items: center; justify-content: flex-end; gap: 10px; margin: 0 0 16px; color: #8e7770; font-size: 13px; }
.hmsc-sort-select { width: auto; min-width: 110px; padding: 7px 30px 7px 12px; border: 1px solid #efd9d1; border-radius: 999px; background-color: #fff; color: #665c58; font: inherit; }
.hmsc-card { display: flex; min-width: 0; flex-direction: column; overflow: hidden; border: 1px solid #f0dcd4; border-radius: 18px; background: #fff; box-shadow: 0 8px 24px rgba(100, 70, 58, .07); }
.hmsc-photo { position: relative; aspect-ratio: 1 / 1; overflow: hidden; background: #fbf1ec; }
.hmsc-photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
.hmsc-photo > span { display: grid; width: 100%; height: 100%; place-items: center; color: #b78e80; font-size: 13px; }
.hmsc-body { display: flex; flex: 1; flex-direction: column; justify-content: flex-start; padding: 17px 18px 20px; }
.hmsc-body h3 { min-height: 2.9em; margin: 0 0 9px !important; padding: 0 !important; color: #d47676; font-size: 19px; line-height: 1.45; }
.hmsc-body p { margin-top: 0; }
.hmsc-period { margin: 0 0 10px; color: #9b8279; font-size: 12px; }
.hmsc-note { margin: 0; padding-top: 10px; border-top: 1px solid #f3e5df; color: #665c58; font-size: 14px; line-height: 1.8; }
.hmsc-empty { padding: 24px; border-radius: 14px; background: #fff5f0; color: #8c7770; text-align: center; }
@media (max-width: 700px) {
    .hmsc-collection { margin: 24px auto; }
    .hmsc-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    .hmsc-card { border-radius: 12px; box-shadow: none; }
    .hmsc-body { padding: 11px 10px 14px; }
    .hmsc-body h3 { min-height: 3.2em; margin: 0 0 6px !important; font-size: 14px; line-height: 1.55; }
    .hmsc-period { font-size: 10px; }
    .hmsc-note { font-size: 11px; line-height: 1.65; }
    .hmsc-sort { margin-bottom: 12px; font-size: 11px; }
    .hmsc-sort-select { min-width: 96px; padding: 6px 26px 6px 10px; }
}