body.pj-media-open { overflow: hidden; }
.pj-media-nav-button svg { width: 1.25rem; height: 1.25rem; flex: 0 0 auto; }
.pj-media-overlay { position: fixed; inset: 0; z-index: 10000; padding: 1rem; background: rgba(2, 6, 23, .78); backdrop-filter: blur(6px); overflow: auto; }
.pj-media-overlay[hidden] { display: none; }
.pj-media-panel { width: min(1180px, 100%); min-height: calc(100vh - 2rem); margin: 0 auto; border-radius: 1.25rem; background: #f8fafc; color: #0f172a; box-shadow: 0 24px 80px rgba(0,0,0,.35); overflow: hidden; }
.pj-media-panel > header { display: flex; justify-content: space-between; gap: 1rem; padding: 1.5rem 1.75rem; background: linear-gradient(135deg, #0f766e, #115e59); color: white; }
.pj-media-panel > header span { font-size: .72rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: #99f6e4; }
.pj-media-panel h1 { margin: .2rem 0; font-size: clamp(1.4rem, 3vw, 2rem); font-weight: 800; }
.pj-media-panel header p { margin: 0; color: rgba(255,255,255,.78); }
.pj-media-close { width: 2.75rem; height: 2.75rem; flex: 0 0 auto; border: 1px solid rgba(255,255,255,.3); border-radius: 999px; background: rgba(255,255,255,.1); color: white; font-size: 1.8rem; line-height: 1; }
.pj-media-toolbar { display: flex; gap: .75rem; padding: 1rem 1.5rem; border-bottom: 1px solid #e2e8f0; background: white; }
.pj-media-toolbar input { min-width: 0; flex: 1; min-height: 2.75rem; padding: 0 .9rem; border: 1px solid #cbd5e1; border-radius: .7rem; }
.pj-media-toolbar button, .pj-media-replace { min-height: 2.65rem; padding: .6rem 1rem; border-radius: .65rem; background: #0f766e; color: white; font-weight: 700; }
.pj-media-message { margin: 1rem 1.5rem 0; padding: .8rem 1rem; border-radius: .7rem; font-size: .9rem; }
.pj-media-message.success { background: #dcfce7; color: #166534; }.pj-media-message.error { background: #fee2e2; color: #991b1b; }.pj-media-message.info { background: #e0f2fe; color: #075985; }
.pj-media-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(245px, 1fr)); gap: 1rem; padding: 1.5rem; }
.pj-media-card { overflow: hidden; border: 1px solid #e2e8f0; border-radius: .9rem; background: white; box-shadow: 0 5px 18px rgba(15,23,42,.06); }
.pj-media-card[hidden] { display: none; }.pj-media-card > img { width: 100%; height: 170px; object-fit: cover; background: #e2e8f0; }
.pj-media-card-body { padding: 1rem; }.pj-media-category { color: #0f766e; font-size: .68rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.pj-media-card h3 { margin: .25rem 0; font-size: 1rem; font-weight: 800; }.pj-media-card code { display: block; overflow: hidden; color: #64748b; font-size: .72rem; text-overflow: ellipsis; white-space: nowrap; }
.pj-media-card p { margin: .45rem 0 .8rem; color: #64748b; font-size: .75rem; }.pj-media-file { display: block; margin-bottom: .55rem; padding: .65rem; border: 1px dashed #94a3b8; border-radius: .6rem; color: #334155; font-size: .78rem; cursor: pointer; }
.pj-media-file input { display: block; width: 100%; margin-top: .4rem; font-size: .72rem; }.pj-media-replace { width: 100%; }.pj-media-replace:disabled { cursor: not-allowed; opacity: .45; }
.pj-media-empty { grid-column: 1 / -1; padding: 3rem; text-align: center; color: #64748b; }
@media (max-width: 640px) { .pj-media-overlay { padding: 0; }.pj-media-panel { min-height: 100vh; border-radius: 0; }.pj-media-panel > header { padding: 1.1rem; }.pj-media-toolbar { padding: .8rem; }.pj-media-grid { grid-template-columns: 1fr; padding: .8rem; }.pj-media-message { margin: .8rem .8rem 0; } }