.school-media { margin: 1.5rem 0; padding: 1.25rem; border: 1px solid #ccd8d8; border-radius: 1rem; background: #fff; min-width: 0; }
.school-media--compact { width: 100%; max-width: 54rem; margin: 1.5rem auto; }
.school-media h2 { margin: 0 0 .35rem; font-size: 1.25rem; }
.school-media h3 { font-size: 1.08rem; margin: .6rem 0; overflow-wrap: anywhere; }
.school-media p { margin: .4rem 0; }
.school-media__heading p, .school-media__attribution { color: #52636a; font-size: .9rem; }
.school-media__school { margin: 0; font-size: .9rem; font-weight: 700; }
.school-media__school a { color: #245f86; }
.school-media__add-school { margin-top: .8rem; max-width: 32rem; }
.school-media--all { max-width: 72rem; margin-inline: auto; }
.media-library-heading { max-width: 72rem; margin-inline: auto; }
.media-library-heading p { max-width: 52rem; }
.school-media__filters, .school-media__actions { display: flex; flex-wrap: wrap; align-items: end; gap: .5rem; margin: .8rem 0; }
.school-media__filters > label, .school-media__actions > button { white-space: nowrap; }
.school-media__view-toggle { display: inline-flex; gap: .2rem; margin: .15rem 0 .8rem; padding: .2rem; border: 1px solid #c7d5d9; border-radius: .65rem; background: #f2f6f7; }
.school-media__view-toggle button { min-height: 38px; padding: .35rem .65rem; border-color: transparent; background: transparent; }
.school-media__view-toggle button[aria-pressed="true"] { border-color: #174f59; background: #fff; color: #174f59; box-shadow: 0 1px 3px rgba(23, 45, 53, .12); }
.school-media label { display: flex; flex-direction: column; gap: .3rem; font-size: .9rem; font-weight: 600; min-width: 0; }
.school-media input, .school-media select, .school-media textarea { width: 100%; min-width: 0; padding: .55rem; border: 1px solid #85969d; border-radius: .4rem; background: #fff; color: #172d35; font: inherit; }
.school-media__item { padding: 1rem 0; border-top: 1px solid #dde4e7; }
.school-media__visual { display: none; }
.school-media__browse-label { display: none; }
.school-media__badges { display: flex; flex-wrap: wrap; gap: .35rem; }
.school-media__badges span { font-size: .75rem; background: #eef3f4; color: #384f59; padding: .2rem .5rem; border-radius: .35rem; }
.school-media button { border: 1px solid #879ca6; border-radius: .5rem; background: #fff; color: #244653; padding: .5rem .7rem; min-height: 44px; font-size: .875rem; }
.school-media button:hover { background: #edf4f5; }
.school-media button[aria-pressed="true"] { background: #174f59; border-color: #174f59; color: #fff; }
.school-media button:disabled { opacity: .6; cursor: wait; }
.school-media :is(button, input, select, textarea, summary, a):focus-visible { outline: 3px solid #007e96; outline-offset: 3px; }
.school-media summary { cursor: pointer; padding: .65rem 0; font-weight: 600; min-height: 44px; }
.school-media__add { border-top: 1px solid #dde4e7; margin-top: .75rem; }
.school-media__fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; margin: .8rem 0; }
.school-media__wide { grid-column: 1 / -1; }
.school-media__message:not(:empty) { border-left: 3px solid #247181; padding: .5rem .75rem; background: #eef6f7; }
.school-media [hidden] { display: none !important; }

.school-media[data-media-view="browse"] .school-media__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.school-media[data-media-view="browse"] .school-media__item { display: flex; flex-direction: column; min-width: 0; padding: 0 0 1rem; overflow: hidden; border: 1px solid #d6e0e2; border-radius: .9rem; background: #fff; box-shadow: 0 4px 14px rgba(23, 45, 53, .07); }
.school-media[data-media-view="browse"] .school-media__item > :not(.school-media__visual) { margin-left: 1rem; margin-right: 1rem; }
.school-media[data-media-view="browse"] .school-media__visual { position: relative; display: block; width: 100%; aspect-ratio: 16 / 9; overflow: hidden; background: linear-gradient(135deg, #e7f0f1, #f6f1e7); color: #173e48; }
.school-media__visual-fallback { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .7rem; padding: 1.25rem; text-align: center; }
.school-media__visual-logo { position: relative; display: grid; place-items: center; width: 4.5rem; height: 4.5rem; overflow: hidden; border: 1px solid rgba(36, 95, 134, .2); border-radius: 50%; background: #fff; font-weight: 800; letter-spacing: .04em; }
.school-media__visual-logo img { position: absolute; inset: 0; width: 100%; height: 100%; padding: .55rem; object-fit: contain; background: #fff; }
.school-media__visual-topic { max-width: 85%; font-size: 1rem; font-weight: 750; }
.school-media__thumbnail { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; background: #e7eef0; }
.school-media__visual-format { position: absolute; right: .65rem; bottom: .65rem; z-index: 2; padding: .25rem .5rem; border-radius: 999px; background: rgba(15, 39, 47, .88); color: #fff; font-size: .72rem; font-weight: 700; }
.school-media[data-media-view="browse"] .school-media__school { display: flex; align-items: center; min-height: 1.4rem; margin-top: .8rem; }
.school-media[data-media-view="browse"] .school-media__badges { margin-top: .45rem; }
.school-media[data-media-view="browse"] .school-media__badges span:nth-child(2) { display: none; }
.school-media[data-media-view="browse"] h3 { margin-top: .7rem; margin-bottom: .25rem; font-size: 1.12rem; line-height: 1.35; }
.school-media[data-media-view="browse"] .school-media__description { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; color: #3e545d; }
.school-media[data-media-view="browse"] .school-media__attribution { margin-top: auto; padding-top: .55rem; font-size: .78rem; }
.school-media[data-media-view="browse"] .school-media__actions { align-items: center; margin-top: .5rem; margin-bottom: 0; }
.school-media[data-media-view="browse"] .school-media__actions button { min-height: 40px; padding: .4rem .6rem; }
.school-media[data-media-view="browse"] .school-media__browse-label { display: inline; }
.school-media[data-media-view="browse"] .school-media__list-label { display: none; }
.school-media[data-media-view="browse"] .school-media__edit { margin-top: .45rem; }

@media (max-width: 899px) {
    .school-media[data-media-view="browse"] .school-media__list { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 600px) {
    .school-media { padding: 1rem; }
    .school-media__fields { grid-template-columns: minmax(0, 1fr); }
    .school-media__filters > label { flex: 1 1 120px; }
    .school-media[data-media-view="browse"] .school-media__item > :not(.school-media__visual) { margin-left: .85rem; margin-right: .85rem; }
}