.zpm-model-explorer { min-width: 0; }
.zpm-model-cards { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; margin-top: 18px; }
.zpm-model-cards.is-single { grid-template-columns: minmax(160px, 240px); }
.zpm-model-card-button { display: grid; align-content: start; gap: 8px; min-width: 0; padding: 10px; border: 1px solid #d7e0e7; border-radius: 8px; background: #fff; color: #0d2b44; text-align: left; cursor: pointer; transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease; }
.zpm-model-card-button:hover,
.zpm-model-card-button:focus-visible { border-color: #f97316; box-shadow: 0 7px 18px rgba(13, 43, 68, .10); outline: none; transform: translateY(-1px); }
.zpm-model-card-button.is-active { border-color: #f97316; box-shadow: inset 0 0 0 1px #f97316; }
.zpm-model-card-button strong { font-size: .92rem; line-height: 1.25; }
.zpm-model-card-image { display: grid; place-items: center; width: 100%; aspect-ratio: 1; overflow: hidden; border-radius: 5px; background: #f4f7f9; }
.zpm-model-card-image img { width: 100%; height: 100%; object-fit: contain; }
.zpm-image-empty { display: grid; place-items: center; width: 100%; height: 100%; padding: 10px; color: #647789; font-size: .8rem; text-align: center; }
.zpm-model-description { color: #526678; font-size: .8rem; line-height: 1.4; }
.zpm-model-gallery[hidden] { display: none !important; }
.zpm-gallery-empty { display: grid; place-items: center; gap: 8px; width: 100%; aspect-ratio: 1; padding: 24px; border: 1px dashed #c6d2dc; border-radius: 8px; background: #f7f9fb; color: #5e7182; text-align: center; }
.zpm-gallery-empty strong { color: #0d2b44; font-size: 1.1rem; }
.zpm-spec-note { margin: 0 0 12px; padding: 10px 14px; border-left: 3px solid #f97316; background: #fff7ed; color: #69401c; font-size: .88rem; line-height: 1.5; }
.zpm-spec-scroll-hint { display: none; margin: 0 0 8px; color: #526678; font-size: .82rem; font-weight: 600; }
.zpm-spec-table { max-width: 100%; overflow-x: auto; overscroll-behavior-inline: contain; -webkit-overflow-scrolling: touch; }
.zpm-spec-table table { min-width: 900px; }
@media (max-width: 1024px) { .zpm-model-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 640px) { .zpm-model-cards { display: flex; gap: 10px; max-width: 100%; overflow-x: auto; scroll-snap-type: x proximity; } .zpm-model-card-button { flex: 0 0 142px; scroll-snap-align: start; } .zpm-spec-scroll-hint { display: block; } .zpm-spec-table { width: 100%; } }
