.myimages-app { --mi-accent: #1d5f8a; --mi-surface: #fff; --mi-muted: #65707a; color: inherit; }
.myimages-app .screen-reader-text { clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; word-wrap: normal !important; }
.myimages-breadcrumbs { color: var(--mi-muted); font-size: .9rem; margin-bottom: 1rem; }
.myimages-breadcrumbs a { text-decoration: none; }
.myimages-browser-header h2 { margin: 0 0 1.1rem; }
.myimages-category-header { align-items: flex-start; display: flex; gap: 1.25rem; margin-bottom: 2rem; }
.myimages-category-header h2 { margin-top: 0; }
.myimages-category-logo { border-radius: 8px; height: auto; max-height: 180px; max-width: min(220px, 35vw); object-fit: contain; }
.myimages-category-tiles { display: grid; gap: 1.15rem; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); margin-bottom: 2rem; }
.myimages-category-tile { background: var(--mi-surface); border: 1px solid #dfe4e8; border-radius: 12px; box-shadow: 0 2px 8px rgba(20, 35, 50, .06); color: inherit; display: flex; flex-direction: column; min-width: 0; overflow: hidden; text-decoration: none; transition: box-shadow .16s ease, transform .16s ease; }
.myimages-category-tile:hover, .myimages-category-tile:focus-visible { box-shadow: 0 10px 28px rgba(20, 35, 50, .16); transform: translateY(-2px); }
.myimages-category-tile-visual { align-items: center; aspect-ratio: 16 / 10; background: #eef3f6; display: flex; justify-content: center; overflow: hidden; width: 100%; }
.myimages-category-tile-image { height: 100%; object-fit: cover; width: 100%; }
.myimages-category-tile-folder { color: #dba617; font-size: 74px; height: 74px; width: 74px; }
.myimages-category-tile-copy { display: flex; flex: 1; flex-direction: column; padding: .8rem .9rem .9rem; }
.myimages-category-tile-copy strong { color: #1d2327; display: block; font-size: 1.08rem; font-weight: 700; line-height: 1.25; overflow-wrap: anywhere; }
.myimages-category-tile-copy small { color: var(--mi-muted); display: block; font-size: .8rem; line-height: 1.4; margin-top: .4rem; }
.myimages-grid { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); }
.myimages-item { background: var(--mi-surface); border: 1px solid #dfe4e8; border-radius: 9px; margin: 0; overflow: hidden; }
.myimages-open { background: #eef1f3; border: 0; cursor: zoom-in; display: block; padding: 0; width: 100%; }
.myimages-open img { aspect-ratio: 1; display: block; height: auto; object-fit: cover; transition: transform .2s; width: 100%; }
.myimages-open:hover img { transform: scale(1.025); }
.myimages-item figcaption { align-items: start; display: grid; gap: .2rem; padding: .5rem .65rem .6rem; }
.myimages-item figcaption strong { font-size: .78rem; font-weight: 600; line-height: 1.3; overflow-wrap: anywhere; white-space: normal; }
.myimages-rating-summary { color: #9b6700; font-size: .7rem; line-height: 1.2; }
.myimages-lightbox { align-items: center; background: rgba(5, 9, 13, .94); display: none; inset: 0; justify-content: center; padding: 4rem 5rem 2rem; position: fixed; z-index: 100000; }
.myimages-lightbox.is-open { display: flex; }
.myimages-lightbox-content { align-items: center; display: flex; flex-direction: column; height: 100%; justify-content: center; max-width: min(1100px, 100%); }
.myimages-lightbox-content > img { max-height: calc(100vh - 14rem); max-width: 100%; object-fit: contain; }
.myimages-lightbox-meta { color: #fff; max-width: 760px; text-align: center; }
.myimages-lightbox-meta h3 { color: inherit; margin: .8rem 0 .3rem; }
.myimages-lightbox-author, .myimages-lightbox-description, .myimages-stats { color: #d9e0e5; margin: .25rem 0; }
.myimages-lightbox-author { font-weight: 600; }
.myimages-close, .myimages-prev, .myimages-next { background: rgba(255,255,255,.12); border: 0; border-radius: 50%; color: #fff; cursor: pointer; font-size: 2.4rem; height: 48px; line-height: 1; position: absolute; width: 48px; }
.myimages-close { right: 1.2rem; top: 1.2rem; }
.myimages-prev { left: 1rem; top: 50%; }
.myimages-next { right: 1rem; top: 50%; }
.myimages-stars { display: inline-flex; margin-top: .45rem; }
.myimages-stars button { background: none; border: 0; color: #858b90; cursor: pointer; font-size: 1.7rem; padding: 0 .12rem; }
.myimages-stars button.is-selected, .myimages-stars button:hover { color: #ffc438; }
.myimages-rating-status { color: #cfe5f4; display: block; font-size: .85rem; min-height: 1.3em; }
.myimages-message { border-left: 4px solid var(--mi-accent, #1d5f8a); padding: .8rem 1rem; }
.myimages-message-error { border-color: #b32d2e; }
.myimages-no-scroll { overflow: hidden; }

@media (max-width: 700px) {
  .myimages-category-header { flex-direction: column; }
  .myimages-lightbox { padding: 4rem 1rem 2rem; }
  .myimages-prev, .myimages-next { bottom: 1rem; top: auto; }
  .myimages-lightbox-content > img { max-height: calc(100vh - 17rem); }
}
