
:root{--bg:#090806;--panel:#15110e;--line:#3a2d23;--text:#f5efe5;--muted:#a99c8d;--copper:#b56533;--gold:#d69a5b}
*{box-sizing:border-box}
body{margin:0;background:radial-gradient(circle at 50% 0,#3c21132b,transparent 34%),var(--bg);color:var(--text);font-family:Arial,Helvetica,sans-serif;min-height:100vh}
header{padding:16px 5vw;border-bottom:1px solid var(--line);background:#090806e8;position:sticky;top:0;z-index:20}
.brand{display:flex;align-items:center;gap:12px;color:inherit;text-decoration:none}.brand img{width:58px;height:58px;object-fit:cover;border-radius:50%;border:1px solid #6b4a35}.brand b{display:block}.brand span{display:block;color:var(--gold);font-size:10px;letter-spacing:3px;margin-top:3px}
main{width:min(1050px,92vw);margin:38px auto 80px}.card{background:linear-gradient(145deg,#17120e,#0e0b09);border:1px solid var(--line);border-radius:24px;padding:24px;box-shadow:0 20px 55px #0005}.loginCard{width:min(480px,100%);margin:10vh auto}.eyebrow{color:var(--gold);font-size:11px;letter-spacing:3px;font-weight:900}.muted,.uploadCard p{color:var(--muted);line-height:1.6}h1{font-size:clamp(42px,7vw,72px);margin:0 0 12px;font-family:Impact,"Arial Black",sans-serif;font-weight:400;text-transform:uppercase}h2{margin:5px 0 10px}
label{display:block;margin:16px 0 6px;font-size:12px;font-weight:800}input{width:100%;padding:14px;border-radius:12px;border:1px solid #443427;background:#090806;color:#fff;font-size:16px}input[type=file]{padding:12px;background:#100d0a}
.primary,.secondary{border:0;border-radius:999px;min-height:48px;padding:0 20px;font-weight:900;cursor:pointer}.primary{width:100%;background:linear-gradient(135deg,var(--copper),var(--gold));color:#160c06;margin-top:14px}.secondary{display:inline-flex;align-items:center;justify-content:center;background:#17120e;border:1px solid #4b392b;color:#fff;text-decoration:none}
.status{min-height:20px;font-size:13px;color:#d5c4ad}.hidden{display:none!important}.panelTop,.libraryHead{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:24px}.topActions{display:flex;gap:9px}.uploadGrid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.uploadCard{text-align:center}.bigIcon{font-size:54px}.progressWrap{height:9px;background:#090806;border:1px solid #2e241d;border-radius:999px;overflow:hidden;margin-top:15px}.progressWrap div{height:100%;width:0;background:linear-gradient(90deg,var(--copper),var(--gold));transition:width .15s}
.libraryCard{margin-top:22px}.mediaList{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.mediaItem{border:1px solid #30261e;border-radius:16px;overflow:hidden;background:#0b0907}.mediaPreview{height:160px;background:#050505;display:grid;place-items:center}.mediaPreview img,.mediaPreview video{width:100%;height:100%;object-fit:cover}.mediaInfo{padding:12px}.mediaInfo small{color:#887a6c}.deleteBtn{width:100%;margin-top:9px;background:#321516;border:1px solid #5b2628;color:#ffb0b0;border-radius:9px;padding:9px;cursor:pointer}
@media(max-width:720px){main{margin-top:22px}.uploadGrid{grid-template-columns:1fr}.panelTop,.libraryHead{align-items:flex-start;flex-direction:column}.mediaList{grid-template-columns:1fr 1fr}.topActions{width:100%}.topActions>*{flex:1}.card{padding:18px}}
@media(max-width:450px){.mediaList{grid-template-columns:1fr}.brand b{font-size:13px}}


/* V15 */
.publishBanner{
  display:grid;
  grid-template-columns:1fr auto;
  gap:18px;
  align-items:center;
  margin-bottom:22px;
  border-color:#71401f;
}
.publishBanner .status{grid-column:1/-1;margin:0}
.publishBtn{
  border:0;
  border-radius:999px;
  min-height:58px;
  padding:0 24px;
  font-size:15px;
  font-weight:1000;
  cursor:pointer;
  background:linear-gradient(135deg,#d06c28,#f0a04f);
  color:#160b05;
  box-shadow:0 10px 30px #d06c2833;
}
.mediaItem{position:relative}
.stateBadge{
  position:absolute;
  z-index:3;
  top:8px;
  left:8px;
  border-radius:999px;
  padding:6px 9px;
  font-size:10px;
  font-weight:1000;
  letter-spacing:.8px;
  background:#71361b;
  color:#ffd2aa;
  border:1px solid #aa5c2e;
}
.stateBadge.published{
  background:#17361e;
  color:#b9f5c8;
  border-color:#2e7740;
}
.itemActions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:7px;
  margin-top:10px;
}
.moveBtn{
  min-height:40px;
  border:1px solid #4b392b;
  border-radius:10px;
  background:#17120e;
  color:#fff;
  cursor:pointer;
  font-size:19px;
}
.moveBtn:disabled{opacity:.25;cursor:default}
.deleteBtn{grid-column:1/-1}
@media(max-width:720px){
  .publishBanner{grid-template-columns:1fr}
  .publishBtn{width:100%}
}
.mediaInfo{
    overflow: visible !important;
}

.itemActions{
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 7px !important;
    margin-top: 10px !important;
}

.deleteBtn{
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    grid-column: 1 / -1 !important;
    min-height: 40px !important;
}

.mediaItem{
    overflow: visible !important;
    height: auto !important;
}
/* CORRECCIÓN DEFINITIVA TARJETAS DE VIDEO */
.mediaItem{
    display:flex !important;
    flex-direction:column !important;
    height:auto !important;
    min-height:0 !important;
    overflow:visible !important;
}

.mediaPreview{
    position:relative !important;
    inset:auto !important;
    width:100% !important;
    height:280px !important;
    min-height:280px !important;
    max-height:280px !important;
    overflow:hidden !important;
    flex:none !important;
}

.mediaPreview img,
.mediaPreview video{
    position:static !important;
    width:100% !important;
    height:100% !important;
    max-height:280px !important;
    object-fit:cover !important;
    display:block !important;
}

.mediaInfo{
    position:relative !important;
    display:block !important;
    width:100% !important;
    height:auto !important;
    min-height:120px !important;
    overflow:visible !important;
    padding:12px !important;
    z-index:20 !important;
}

.itemActions{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:8px !important;
    margin-top:12px !important;
}

.deleteBtn{
    display:block !important;
    visibility:visible !important;
    opacity:1 !important;
    grid-column:1 / -1 !important;
    min-height:42px !important;
}