.family-media{color:#203d5b;background:#fff;border:1px solid #dce7ee;border-radius:16px;min-width:0;margin-block:20px;padding:20px;font-size:16px}.media-heading{justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.family-media h3{margin:0;font-size:20px}.family-media p{margin:8px 0;font-size:14px;line-height:1.7}.family-media .button{white-space:normal;min-height:42px;font-size:14px}.media-upload{background:#f5fafb;border:1px dashed #a9c7cd;border-radius:12px;margin-block:16px;padding:16px}.media-actions{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.media-upload label{gap:8px;margin-block:14px;font-size:14px;display:grid}.media-upload input{box-sizing:border-box;width:100%;font:inherit;border:1px solid #a9c7cd;border-radius:8px;padding:10px}.media-pending{gap:8px;margin:12px 0;padding:0;list-style:none;display:grid}.media-pending li{overflow-wrap:anywhere;justify-content:space-between;align-items:center;gap:8px;display:flex}.media-pending strong{color:#a32f37;font-size:14px;display:block}.media-grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,200px),1fr));gap:14px;margin-block:16px;display:grid}.media-card{border:1px solid #dce7ee;border-radius:12px;min-width:0;overflow:hidden}.media-preview{color:#377185;background:#eff4f7;place-items:center;height:170px;display:grid}.media-preview img{object-fit:cover;width:100%;height:100%}.media-preview>span{justify-items:center;gap:8px;display:grid}.media-details{overflow-wrap:anywhere;gap:8px;padding:12px;display:grid}.media-details strong{font-size:16px}.media-details>span{color:#596e7c;font-size:14px}.media-notice{background:#edf8f3;border-radius:8px;padding:12px}.media-error{color:#9d2735}.media-empty{color:#596e7c;padding-block:16px}.media-target{border:2px solid #b7d5d8;border-radius:14px;margin-block:16px;padding:12px}.media-target>.family-media{border:0;margin:0;padding:8px}.media-target>.button{margin-bottom:12px}.media-attachment-button{justify-self:start;margin-top:10px}.family-media .icon-button{min-width:40px;min-height:40px}@media (max-width:600px){.family-media{padding:14px}.media-upload{padding:12px}.media-heading{flex-wrap:wrap}.media-actions>.button{flex:auto}.media-grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,150px),1fr))}}