.media-library .page-header { margin-bottom: 18px; }
.media-library .media__tabs { margin-bottom: 22px; }
.media-library__summary { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-bottom:22px; }
.media-library__stat { display:flex; align-items:center; gap:13px; padding:17px 18px; border:1px solid #c7d8de; border-radius:16px; background:var(--md-sys-color-surface-container-lowest); min-width:0; }
.media-library__stat-icon { display:grid; place-items:center; width:42px; height:42px; flex:none; border-radius:12px; color:var(--md-sys-color-primary); background:#e7f4f8; }
.media-library__stat > div { display:grid; gap:3px; min-width:0; }
.media-library__stat-value { color:#193e4a; font-size:23px; line-height:1.2; font-weight:650; white-space:nowrap; }
.media-library__toolbar { padding:18px; margin-bottom:22px; border:1px solid #c7d8de; border-radius:18px; background:var(--md-sys-color-surface-container-lowest); }
.media-library__search-row { display:grid; grid-template-columns:minmax(200px,1fr) 190px 218px; gap:14px; align-items:end; }
.media-library__search-row .md-field { min-width:0; margin:0; }
.media-library__select { display:grid; gap:6px; }
.media-library__select > label { color:var(--md-sys-color-on-surface-variant); font-size:12px; font-weight:600; }
.media-library__select > select { min-width:0; height:48px; width:100%; border:1px solid #a7c0c9; border-radius:10px; background:var(--md-sys-color-surface-container-lowest); padding:0 12px; font:inherit; font-size:13px; color:var(--md-sys-color-on-surface); }
.media-library__filter-row { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-top:16px; padding-top:15px; border-top:1px solid #e1eaee; }
.media-library__filter-row > .text-muted { margin-left:auto; }
.media-library__filter-count { display:inline-flex; align-items:center; justify-content:center; min-width:20px; min-height:20px; padding:0 5px; border-radius:6px; font-size:11px; background:#1834400d; }
.media-library .grid--media { grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:20px; align-items:stretch; }
.media-library .media-card { border:1px solid #b9cfd7; border-radius:18px; overflow:hidden; background:var(--md-sys-color-surface-container-lowest); box-shadow:0 2px 5px #173e4f06; min-width:0; }
.media-library .media-card[data-origin="program"] { border-color:#88b8c8; }
.media-library .media-card__thumb { aspect-ratio:16 / 10; border:0; border-bottom:1px solid #c7d8de; background:radial-gradient(ellipse at center,#213e4b,#112832); }
.media-library .media-card__thumb-image,.media-library .media-card__thumb-video { object-fit:contain; width:100%; height:100%; display:block; }
.media-library .media-card__type { left:10px; bottom:10px; border-radius:7px; padding:4px 8px; font-size:11px; background:#0c263be0; border:1px solid #a2bfd329; }
.media-library__duration { position:absolute; right:10px; bottom:10px; border-radius:7px; padding:4px 7px; color:#edf7fd; background:#0c263be0; font-variant-numeric:tabular-nums; }
.media-library__preview-hint { position:absolute; inset:0; display:flex; gap:8px; align-items:center; justify-content:center; color:white; background:#08293866; opacity:0; transition:opacity 150ms; font-size:13px; font-weight:600; }
.media-library .media-card__thumb:hover .media-library__preview-hint,.media-library .media-card__thumb:focus-visible .media-library__preview-hint { opacity:1; }
.media-library .media-card__body { gap:10px; padding:17px 17px 14px; }
.media-library__origin { display:flex; align-items:center; gap:6px; color:#406373; }
.media-library__origin > .icon { width:15px; height:15px; }
.media-library__program-state { margin-left:auto; color:#176b45; border-radius:5px; background:#e5f5ec; padding:2px 6px; font-size:10px; }
.media-library__program-state--failed { color:#9d2323; background:#ffeded; }
.media-library__program-state--queued,.media-library__program-state--running { color:#7b5b09; background:#fff4d4; }
.media-library .media-card__name { margin:0; line-height:1.45; min-height:2.9em; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; overflow-wrap:anywhere; }
.media-library .media-card__meta { margin:0; gap:7px; font-size:12px; }
.media-library__program-meta { color:#16566b; background:#edf7fb; border:1px solid #c6e0e9; border-radius:8px; padding:8px 9px; margin:0; line-height:1.5; }
.media-library .media-card__badges { gap:5px; }
.media-library .media-card__badges:empty { display:none; }
.media-library .variant-badge,.media-library .derived-badge,.media-library .slicing-badge { font-size:10px; line-height:1.45; }
.media-library__usage { display:flex; align-items:flex-start; gap:7px; padding-top:11px; border-top:1px solid #e1eaee; color:#577269; }
.media-library__usage .icon { flex:none; margin-top:2px; }
.media-library__usage > span { font-size:11px; line-height:1.5; }
.media-library__usage.is-protected { color:#6d5b37; }
.media-library__date { margin:0; font-size:10px; color:#70818a; }
.media-library .media-card__actions { border-top:1px solid #e1eaee; padding:9px 12px; gap:3px; justify-content:flex-start; }
.media-library .media-card__actions .md-button { padding-left:9px; padding-right:9px; font-size:12px; }
.media-library .media-card__actions button:disabled { opacity:.35; }
.media-library__program-note { display:flex; align-items:flex-start; gap:12px; padding:16px; border:1px solid #abcbd7; background:#edf7fb; border-radius:12px; }
.media-library__program-note > .icon { flex:none; color:var(--md-sys-color-primary); }
.media-library__program-note > div { flex:1; }
.media-library__program-note p { margin:0; }
.media-library__program-note p + p { margin-top:4px; }
.media-preview--library .media-preview__stage { min-height:180px; background:#122b36; border:1px solid #375765; }
.media-preview--library .media-preview__facts dd { overflow-wrap:anywhere; }
.media-upload__steps { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; list-style:none; padding:0; margin:0 0 22px; }
.media-upload__steps > li { display:flex; align-items:flex-start; gap:12px; padding:17px; border:1px solid #c7d8de; border-radius:16px; background:var(--md-sys-color-surface-container-lowest); }
.media-upload__step-number { display:grid; place-items:center; width:29px; height:29px; flex:none; border-radius:9px; color:#096079; background:#e0f1f7; font-size:13px; font-weight:700; }
.media-upload__steps p { margin:0; }
.media-upload__steps p + p { margin-top:5px; line-height:1.45; }
.media-library .dropzone { border-color:#82afbf; border-radius:20px; padding:32px 22px; background:#f3fbfe; }
.media-library .dropzone__art { width:56px; height:56px; border-radius:16px; }
.media-library .upload-panel { border:1px solid #b9cfd7; border-radius:18px; background:var(--md-sys-color-surface-container-lowest); }
.media-library .upload-panel .md-card__head { border-bottom:1px solid #e1eaee; }
.media-library .upload-panel .md-card__head p { margin-top:5px; }
.media-library .upload-queue { max-height:560px; padding:0; gap:12px; }
.media-library .upload-queue__item { padding:17px; border-radius:14px; align-items:flex-start; }
.media-library .upload-queue__icon { background:#e9f3f7; color:#17647b; width:42px; height:42px; border-radius:12px; }
.media-library .upload-queue__meta { flex-wrap:wrap; margin:0; font-size:12px; align-items:flex-start; }
.media-library .upload-queue__status { font-size:12px; line-height:1.5; overflow-wrap:anywhere; }
.media-upload__filename { overflow-wrap:anywhere; margin:0; line-height:1.5; }
.media-upload__measure { margin:0; font-size:11px; }
.media-upload__advanced { font-size:11px; color:#55707b; }
.media-upload__advanced > summary { cursor:pointer; padding:5px 0; }
.media-upload__advanced > div { padding-top:7px; display:grid; gap:7px; }
.media-upload__advanced .variant-chip { justify-self:start; }
.media-upload__advanced p { margin:0; max-width:70ch; line-height:1.5; font-size:11px; }
.media-upload__row-actions { display:flex; align-items:center; align-self:center; flex:none; }
.media-library .upload-queue__item[data-phase="processing"] { border-color:#64a7bd; background:#f1fbff; }
.media-library .upload-queue__item.is-done { border-color:#89bba0; background:#f4fcf7; }
.media-library .upload-queue__item.is-error { border-color:#d69494; background:#fff7f7; }
.media-upload__rejections { padding:0; margin:18px 0 0; list-style:none; display:grid; gap:9px; }
.media-upload__rejections > li { display:flex; gap:12px; padding:15px 17px; border:1px solid #d69a92; border-radius:12px; color:#8c3327; background:#fff6f4; }
.media-upload__rejections .icon { flex:none; }
.media-upload__rejections p { margin:0; overflow-wrap:anywhere; }
.media-upload__rejections p + p { margin-top:4px; }
.media-upload__next { display:flex; gap:14px; flex-wrap:wrap; align-items:center; margin-top:20px; padding:20px; border:1px solid #8ebba5; border-radius:16px; background:#f0fbf5; }
.media-upload__next-icon { display:grid; place-items:center; width:42px; height:42px; color:#26704e; background:#d9f0e2; border-radius:12px; }
.media-upload__next > div { flex:1; min-width:200px; }
.media-upload__next h3,.media-upload__next p { margin:0; }
.media-upload__next p { margin-top:5px; color:#476959; line-height:1.5; }
.media-upload__next-actions { display:flex; flex-wrap:wrap; gap:10px; flex-basis:100% !important; margin-left:56px; }
@media (max-width:1100px) { .media-library__search-row { grid-template-columns:minmax(180px,1fr) 165px 185px; } .media-library__stat { padding:14px 12px; gap:9px; } .media-library__stat-icon { width:34px; height:34px; } .media-library__stat-value { font-size:21px; } }
@media (max-width:850px) { .media-library__summary { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; } .media-library__search-row { grid-template-columns:1fr 1fr; } .media-library__search-row > .md-field { grid-column:1 / -1; } .media-upload__steps { grid-template-columns:1fr; gap:9px; } .media-upload__steps > li { padding:13px 15px; } }
@media (max-width:560px) { .media-library .grid--media { grid-template-columns:minmax(0,1fr); } .media-library__toolbar { padding:14px; } .media-library__search-row { gap:10px; } .media-library__select > select { font-size:12px; padding:0 7px; } .media-library__filter-row { gap:9px; } .media-library__filter-row > .text-muted { margin-left:0; flex-basis:100%; } .media-library__program-note { flex-wrap:wrap; } .media-library .upload-queue__item { flex-wrap:wrap; padding:13px; gap:10px; } .media-library .upload-queue__content { min-width:calc(100% - 55px); } .media-upload__row-actions { margin-left:auto; } .media-upload__next-actions { margin-left:0; } .media-library .dropzone { padding:25px 14px; } }
