:root { --pnl-card:#16131f; --pnl-border:rgba(255,255,255,.09); --pnl-accent:#7C5CFC; --pnl-accent2:#b6a6ff; --pnl-text:#ECEAF6; --pnl-mut:#A7A4BD; }
.pnl-wrap { max-width:1080px; margin:0 auto; padding:calc(var(--nav-h,72px) + 2rem) 1.25rem 4rem; color:var(--pnl-text); }
.pnl-head { display:flex; justify-content:space-between; align-items:flex-end; gap:1rem; flex-wrap:wrap; margin-bottom:2rem; }
.pnl-kicker { text-transform:uppercase; letter-spacing:.12em; font-size:.72rem; color:var(--pnl-accent2); margin:0 0 .25rem; }
.pnl-title { font-family:"Bricolage Grotesque",system-ui,sans-serif; font-size:clamp(1.6rem,3.5vw,2.1rem); margin:0; line-height:1.05; }
.pnl-sub { color:var(--pnl-accent2); font-weight:600; margin:.15rem 0 0; }
.pnl-session { display:flex; align-items:center; gap:.75rem; color:var(--pnl-mut); font-size:.9rem; }
.pnl-session form { margin:0; }
.pnl-back { display:inline-block; color:var(--pnl-mut); text-decoration:none; margin-bottom:1.25rem; font-size:.9rem; }
.pnl-back:hover { color:#fff; }
.pnl-btn { display:inline-flex; align-items:center; gap:.4rem; border-radius:10px; padding:.6rem 1rem; font-size:.9rem; font-weight:600; border:1px solid transparent; cursor:pointer; text-decoration:none; }
.pnl-btn--primary { background:linear-gradient(135deg,var(--pnl-accent),#6a4bf0); color:#fff; align-self:flex-start; }
.pnl-btn--primary:hover { filter:brightness(1.08); }
.pnl-btn--ghost { background:transparent; border-color:var(--pnl-border); color:var(--pnl-text); }
.pnl-btn--ghost:hover { border-color:var(--pnl-accent); }
.pnl-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:1.25rem; }
.pnl-card { display:flex; flex-direction:column; background:var(--pnl-card); border:1px solid var(--pnl-border); border-radius:14px; overflow:hidden; text-decoration:none; color:inherit; transition:.2s; }
.pnl-card:hover { border-color:var(--pnl-accent); transform:translateY(-2px); }
.pnl-card__cover { position:relative; aspect-ratio:16/10; background:#0b0911; }
.pnl-card__cover img { width:100%; height:100%; object-fit:cover; }
.pnl-card__ph { display:grid; place-items:center; height:100%; font-size:2.2rem; color:#4a4560; }
.pnl-badge { background:rgba(124,92,252,.22); color:var(--pnl-accent2); font-size:.7rem; padding:.22rem .6rem; border-radius:999px; text-transform:capitalize; border:1px solid rgba(124,92,252,.35); }
.pnl-badge--produccion { background:#f59e0b; color:#201400; border-color:transparent; font-weight:700; }
.pnl-badge--entregado { background:#16a34a; color:#fff; border-color:transparent; font-weight:700; }
.pnl-card__cover .pnl-badge { position:absolute; top:.55rem; right:.55rem; box-shadow:0 2px 8px rgba(0,0,0,.45); }
.pnl-card__body { padding:.85rem 1rem 1rem; display:flex; flex-direction:column; gap:.12rem; }
.pnl-card__artist { color:var(--pnl-accent2); font-size:.8rem; }
.pnl-card__title { font-weight:600; }
.pnl-card__meta { color:var(--pnl-mut); font-size:.8rem; margin-top:.2rem; }
.pnl-empty { color:var(--pnl-mut); }
.pnl-export { margin-top:2rem; } .pnl-export a { color:var(--pnl-accent2); }
.pnl-proj { display:flex; gap:1.5rem; align-items:center; margin-bottom:1.75rem; flex-wrap:wrap; }
.pnl-proj__cover { width:128px; height:128px; border-radius:12px; overflow:hidden; background:#0b0911; flex:none; border:1px solid var(--pnl-border); }
.pnl-proj__cover img { width:100%; height:100%; object-fit:cover; }
.pnl-tags { display:flex; gap:.6rem; align-items:center; margin-top:.6rem; flex-wrap:wrap; }
.pnl-tag { color:var(--pnl-accent2); text-decoration:none; font-size:.9rem; font-weight:600; }
.pnl-tag:hover { text-decoration:underline; color:#fff; }
.pnl-cols { display:grid; grid-template-columns:1fr 320px; gap:1.5rem; align-items:start; }
.pnl-box { background:var(--pnl-card); border:1px solid var(--pnl-border); border-radius:14px; padding:1.25rem 1.35rem; margin-bottom:1.25rem; }
.pnl-box__h { font-size:1.02rem; margin:0 0 .9rem; }
.pnl-muted { color:var(--pnl-mut); margin:0; font-size:.92rem; }
.pnl-upload { border:1px solid rgba(124,92,252,.4); background:linear-gradient(180deg,rgba(124,92,252,.08),transparent); }
.pnl-uploader { display:flex; flex-direction:column; gap:1rem; }
.pnl-drop { position:relative; display:flex; flex-direction:column; align-items:center; gap:.4rem; padding:1.6rem 1rem; border:2px dashed rgba(124,92,252,.45); border-radius:12px; cursor:pointer; text-align:center; transition:.2s; }
.pnl-drop:hover { border-color:var(--pnl-accent); background:rgba(124,92,252,.06); }
.pnl-drop input[type=file] { position:absolute; inset:0; opacity:0; cursor:pointer; }
.pnl-drop__icon { font-size:1.6rem; }
.pnl-drop__txt { color:var(--pnl-mut); font-size:.9rem; }
.pnl-drop__name { color:var(--pnl-accent2); font-weight:600; font-size:.9rem; }
.pnl-files { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.5rem; }
.pnl-file { display:flex; align-items:center; gap:.75rem; padding:.6rem .75rem; background:#0e0c15; border:1px solid var(--pnl-border); border-radius:10px; }
.pnl-file__name { font-weight:500; flex:1; word-break:break-word; }
.pnl-file__meta { color:var(--pnl-mut); font-size:.72rem; }
.pnl-file__dl { color:var(--pnl-accent2); text-decoration:none; font-size:.85rem; white-space:nowrap; }
.pnl-file__dl:hover { color:#fff; }
.pnl-dl { display:grid; grid-template-columns:auto 1fr; gap:.4rem .9rem; margin:0 0 1rem; font-size:.9rem; }
.pnl-dl dt { color:var(--pnl-mut); }
.pnl-dl dd { margin:0; text-align:right; word-break:break-word; }
.pnl-lock { color:var(--pnl-mut); font-size:.78rem; margin:1rem 0 0; }
@media (max-width:760px){ .pnl-cols{ grid-template-columns:1fr; } }
.pnl-player { position: relative; aspect-ratio: 16/9; border-radius: 12px; overflow: hidden; background: #000; }
.pnl-player iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.pnl-views { color: var(--pnl-mut); font-size: .85rem; margin: .6rem 0 0; }
.pnl-spotify { margin-top: 1rem; }
.pnl-spotify iframe { border-radius: 12px; display: block; }
.pnl-ico { width: 40px; height: 40px; border-radius: 10px; display: grid; place-items: center; background: rgba(124,92,252,.15); color: var(--pnl-accent2); font-size: 1.15rem; flex: none; }
.pnl-ico--audio::before { content: "\266A"; }
.pnl-ico--image::before { content: "\25A3"; }
.pnl-ico--pdf::before { content: "\25A4"; }
.pnl-ico--file::before { content: "\25A1"; }
.pnl-file { align-items: flex-start; }
.pnl-file__info { flex: 1; display: flex; flex-direction: column; gap: .3rem; min-width: 0; }
.pnl-flabel { background: rgba(124,92,252,.22); color: var(--pnl-accent2); font-size: .66rem; padding: .12rem .5rem; border-radius: 999px; border: 1px solid rgba(124,92,252,.4); text-transform: uppercase; letter-spacing: .04em; margin-left: .4rem; }
.pnl-audio { width: 100%; max-width: 340px; height: 34px; margin-top: .2rem; }
.pnl-fimg { max-width: 140px; border-radius: 8px; margin-top: .3rem; }
.pnl-banner { text-align: center; }
.pnl-banner__icon { font-size: 1.8rem; }
.pnl-banner__txt { font-size: 1rem; line-height: 1.5; color: var(--pnl-text); margin: .5rem 0 1rem; }
.pnl-uploader .pnl-btn { align-self: flex-start; }
.pnl-dl dd .pnl-svc { list-style: disc; margin: 0; padding: 0 0 0 1.1rem; text-align: left; }
.pnl-dl dd .pnl-svc li { margin: 0; }
.pnl-statusbox form { display: flex; flex-direction: column; gap: .7rem; align-items: flex-start; }
.pnl-statusbox .pnl-muted { margin: 0; }
.pnl-form { display: flex; flex-direction: column; gap: 1rem; max-width: 640px; }
.pnl-form label { display: flex; flex-direction: column; gap: .35rem; font-size: .82rem; color: var(--pnl-mut); }
.pnl-form input, .pnl-form textarea { background: #0e0c15; border: 1px solid var(--pnl-border); border-radius: 10px; padding: .6rem .8rem; color: var(--pnl-text); font-size: .95rem; font-family: inherit; }
.pnl-form input:focus, .pnl-form textarea:focus { outline: none; border-color: var(--pnl-accent); }
.pnl-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.pnl-form .pnl-btn--primary { align-self: flex-start; }
.pnl-formerr { background: rgba(239,68,68,.14); border: 1px solid rgba(239,68,68,.4); color: #fca5a5; padding: .7rem 1rem; border-radius: 10px; margin: 0 0 1rem; }
@media (max-width: 600px) { .pnl-form__row { grid-template-columns: 1fr; } }

.pnl-acc-intro { margin: 0 0 1.25rem; }

/* Botón "Seleccionar archivo" coherente con el formulario */
.pnl-form input[type=file] { padding: .4rem .55rem; cursor: pointer; }
.pnl-form input[type=file]::file-selector-button { font: inherit; margin-right: .85rem; padding: .45rem .9rem; border-radius: 8px; border: 1px solid var(--pnl-border); background: #1a1722; color: var(--pnl-text); cursor: pointer; transition: border-color .2s, background .2s; }
.pnl-form input[type=file]::-webkit-file-upload-button { font: inherit; margin-right: .85rem; padding: .45rem .9rem; border-radius: 8px; border: 1px solid var(--pnl-border); background: #1a1722; color: var(--pnl-text); cursor: pointer; }
.pnl-form input[type=file]::file-selector-button:hover { border-color: var(--pnl-accent); background: #221d2e; }

/* Campo manual de reproducciones (Spotify) */
.pnl-stat-lbl { display: flex; flex-direction: column; gap: .35rem; font-size: .82rem; color: var(--pnl-mut); margin-bottom: .7rem; }
.pnl-stat-lbl input { background: #0e0c15; border: 1px solid var(--pnl-border); border-radius: 10px; padding: .5rem .7rem; color: var(--pnl-text); font: inherit; }
.pnl-stat-lbl input:focus { outline: none; border-color: var(--pnl-accent); }
.pnl-hint { font-size: .72rem; margin: .5rem 0 0; }
