.media-hero{align-items:flex-end}
.media-policy,.media-safety-note{display:flex;gap:14px;align-items:flex-start;border:1px solid #d9e4dd;background:#f3f8f4;border-radius:16px;padding:14px 16px;margin-bottom:20px;color:#34463f}
.media-policy b,.media-safety-note b{white-space:nowrap;color:#163c2e}
.media-policy span,.media-safety-note span{line-height:1.45}
.media-library-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.media-card{background:#fff;border:1px solid #e5e7e5;border-top:4px solid var(--brand);border-radius:18px;overflow:hidden;box-shadow:0 12px 30px rgba(20,39,32,.06)}
.media-preview{aspect-ratio:4/3;background:#e9eeeb;overflow:hidden}
.media-preview img{width:100%;height:100%;object-fit:cover;display:block}
.media-card-body{padding:16px}
.media-card-top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.media-card-top small{font-weight:800;letter-spacing:.08em;color:#73817b}
.media-status{font-size:11px;font-weight:800;letter-spacing:.05em;border-radius:999px;padding:5px 9px}
.media-status.approved{background:#e2f3e8;color:#17683c}
.media-status.draft{background:#f5edda;color:#8a641b}
.media-status.archived{background:#ecebea;color:#686460}
.media-card h3{font-size:18px;margin:13px 0 7px;color:#182720}
.media-card p{font-size:14px;line-height:1.45;color:#65716c;min-height:40px;margin:0}
.media-meta{display:flex;flex-wrap:wrap;gap:7px;margin-top:14px}
.media-meta span{font-size:11px;background:#f1f4f2;border-radius:8px;padding:5px 7px;color:#59655f}
.media-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.media-actions .button,.media-actions .ghost{padding:9px 11px;font-size:12px}
.media-empty{grid-column:1/-1;padding:60px 20px}
.media-dialog{width:min(720px,calc(100vw - 28px))}
.media-file-field input{padding:12px;background:#f5f7f6;border:1px dashed #9badA5}
.media-file-field small{display:block;margin-top:7px;color:#6b7771}
.media-picker-dialog{width:min(980px,calc(100vw - 28px))}
.media-picker-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;max-height:48vh;overflow:auto;padding:2px}
.media-pick-card{border:2px solid transparent;background:#fff;border-radius:15px;padding:0;overflow:hidden;text-align:left;box-shadow:0 7px 20px rgba(19,40,31,.08);cursor:pointer}
.media-pick-card img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;background:#edf1ef}
.media-pick-card span{display:block;padding:11px}
.media-pick-card b,.media-pick-card small{display:block}
.media-pick-card small{margin-top:4px;color:#718078}
.media-pick-card.selected{border-color:#1f6a4d;box-shadow:0 0 0 3px rgba(31,106,77,.13)}
.media-caption{display:block;margin-top:16px;font-weight:700;color:#25372f}
.media-caption textarea{display:block;width:100%;min-height:80px;margin-top:7px}
.detail-media-history{background:#f7f9f8;border:1px solid #e0e7e3;border-radius:16px;padding:15px;margin:18px 0}
.detail-media-history>div:first-child{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.detail-media-history h3{margin:0;font-size:16px}
.detail-media-history>div:last-child{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.detail-media-history article{background:#fff;border-radius:11px;overflow:hidden;border:1px solid #e1e5e3}
.detail-media-history article a{display:block;background:#edf1ef}
.detail-media-history img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}
.detail-media-history article span{display:block;padding:8px}
.detail-media-history article b,.detail-media-history article small{display:block;font-size:11px}
.detail-media-history article small{color:#718078;margin-top:3px}

@media(max-width:980px){
  .media-library-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:640px){
  .media-hero{align-items:stretch}
  .media-hero .button{width:100%}
  .media-policy,.media-safety-note{display:block}
  .media-policy b,.media-safety-note b{display:block;margin-bottom:5px;white-space:normal}
  .media-library-grid,.media-picker-grid{grid-template-columns:1fr}
  .media-picker-grid{max-height:42vh}
  .detail-media-history>div:last-child{grid-template-columns:repeat(2,minmax(0,1fr))}
  .media-actions>*{flex:1}
}