
.mbxr-wrap{
  --gold:#d8aa46;--red:#a71919;--cream:#f3ead3;--ink:#17110d;
  width:100%;box-sizing:border-box;padding:52px 16px 80px;color:#fff;
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  background:
    linear-gradient(180deg,rgba(0,0,0,.72),rgba(0,0,0,.90)),
    var(--mbxr-bg) center top/cover fixed no-repeat,
    radial-gradient(circle at 50% 0,#4a1414 0,#150808 34%,#050505 72%);
}
.mbxr-shell{width:min(1050px,100%);margin:auto}
.mbxr-heading{text-align:center;margin-bottom:28px}
.mbxr-kicker{margin:0 0 6px;color:#e5c77a;font-size:.76rem;font-weight:900;letter-spacing:.22em}
.mbxr-subtitle{margin:4px auto 4px;max-width:680px;font-size:1.05rem;color:#f5f0e4}
.mbxr-note{margin:0 auto;max-width:760px;font-size:.82rem;color:#c8bfae}

.mbxr-jukebox{position:relative;width:min(900px,100%);margin:auto;filter:drop-shadow(0 28px 38px rgba(0,0,0,.55))}
.mbxr-arch{
  position:relative;padding:66px 54px 28px;border:10px solid #a7792e;border-bottom-width:7px;
  border-radius:46% 46% 9% 9%/25% 25% 8% 8%;
  background:
    linear-gradient(90deg,#2b150d 0 3%,#e6b858 3% 5%,#512215 5% 8%,transparent 8% 92%,#512215 92% 95%,#e6b858 95% 97%,#2b150d 97%),
    linear-gradient(180deg,#38160f 0,#6b2a17 16%,#17100d 44%,#0b0908 100%);
  box-shadow:inset 0 0 0 3px #2a140d,inset 0 0 34px rgba(255,190,72,.26);
}
.mbxr-arch:before{
  content:"";position:absolute;left:7%;right:7%;top:13px;height:38px;border-radius:50% 50% 0 0;
  background:linear-gradient(90deg,#ee5343,#ffca4d,#62c5aa,#58b6ef,#df4d8a,#f35d43);
  box-shadow:0 0 18px rgba(255,193,77,.7);opacity:.9
}
.mbxr-arch-light{
  position:absolute;left:50%;top:25px;transform:translateX(-50%);width:52%;height:28px;border-radius:40px;
  background:linear-gradient(#f8e7b5,#d7a442);box-shadow:0 0 20px #f0c55c;
}

.mbxr-cover-window{
  position:relative;display:flex;align-items:center;gap:9px;min-height:150px;margin-bottom:18px;
  padding:13px 42px;border:4px solid #c69b51;border-radius:16px;background:linear-gradient(#efe0b5,#b58b50 5%,#30241b 10%,#120f0c 100%);
  box-shadow:inset 0 0 20px #000;
}
.mbxr-cover-track{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;width:100%}
.mbxr-cover-card{position:relative;aspect-ratio:1/1;overflow:hidden;border:2px solid #d8b66c;border-radius:4px;background:#211812;box-shadow:0 6px 14px #000}
.mbxr-cover-card img{width:100%;height:100%;object-fit:cover;display:block}
.mbxr-cover-fallback{height:100%;display:grid;place-items:center;padding:7px;text-align:center;background:radial-gradient(circle,#9d1b1b 0 9%,#1a1a1a 10% 22%,#050505 23% 100%);color:#fff;font-family:"Courier New",monospace;font-size:.65rem;font-weight:700}
.mbxr-cover-nav{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:30px;height:58px;border:1px solid #e3c988;border-radius:8px;background:#3f2517;color:#fff;font-size:2rem;cursor:pointer}
.mbxr-cover-prev{left:7px}.mbxr-cover-next{right:7px}

.mbxr-title-rack{
  position:relative;padding:14px;border:5px solid #6b5848;border-radius:9px;
  background:linear-gradient(#9d8a72,#5d4c3d 7%,#291f19 8%,#15100d 100%);
  box-shadow:inset 0 0 22px #000;
}
.mbxr-rack-head{display:flex;justify-content:space-between;gap:12px;margin-bottom:8px;color:#e8d6aa;font:700 .72rem/1 "Courier New",monospace;letter-spacing:.12em}
.mbxr-title-pages{display:grid;grid-template-columns:1fr 1fr;gap:9px 11px;min-height:288px}
.mbxr-disc-card{position:relative;min-height:82px;padding:7px 8px 8px;border:1px solid #9c876e;border-radius:4px;background:repeating-linear-gradient(180deg,rgba(0,0,0,.035) 0 1px,transparent 1px 18px),linear-gradient(90deg,#e5d9bd,#fff8e8 18%,#f5ead0 82%,#ddcba7);color:#1c1712;font-family:"Courier New",monospace;box-shadow:inset 0 0 0 1px rgba(255,255,255,.65)}
.mbxr-disc-card.is-blank{opacity:.42}
.mbxr-disc-artist{text-align:center;margin:-1px 28px 5px;padding-bottom:4px;border-bottom:1px solid rgba(92,70,45,.35);font-size:.72rem;font-weight:900;line-height:1.05;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:.03em}
.mbxr-side-row{position:relative;display:grid;grid-template-columns:26px 1fr 44px;align-items:center;gap:6px;min-height:24px}
.mbxr-side-row+.mbxr-side-row{border-top:1px dashed rgba(107,81,50,.28)}
.mbxr-side-letter{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#6d1717;color:#fff;font-size:.72rem;font-weight:900;border:1px solid #b59256}
.mbxr-song-title{font-size:.70rem;font-weight:900;line-height:1.05;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mbxr-side-code{text-align:right;font-size:.58rem;font-weight:900;color:#7d6241}
.mbxr-side-row.is-empty .mbxr-song-title{color:#988b78;font-style:italic;font-weight:700}
.mbxr-page-controls{display:flex;justify-content:center;align-items:center;gap:16px;margin-top:11px}
.mbxr-page-btn{width:42px;height:30px;border:2px solid #c99d43;border-radius:5px;background:#8f1515;color:#fff;font-weight:900;cursor:pointer;box-shadow:inset 0 0 0 2px #4a0b0b}
.mbxr-page-label{font:800 .72rem "Courier New",monospace;color:#ead9ab}

.mbxr-control-panel{position:relative;margin-top:16px;padding:14px;border:4px solid #78604a;border-radius:8px;background:linear-gradient(#4a392c,#1d1712)}
.mbxr-display{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:11px;padding:8px 12px;border:2px inset #8d6b35;background:#160b08;color:#ffcd67;font:700 .75rem "Courier New",monospace}
.mbxr-display strong{color:#f8e7b6;text-align:right}
.mbxr-bank{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.mbxr-main-btn{min-height:62px;border:2px solid #ad8b55;border-radius:6px;background:linear-gradient(#f7f0de,#bdb09b);color:#251b13;cursor:pointer;box-shadow:inset 0 -7px 10px rgba(0,0,0,.18);font-family:"Courier New",monospace}
.mbxr-main-btn span{display:block;font-size:.72rem;color:#781414;font-weight:900}
.mbxr-main-btn strong{display:block;margin-top:3px;font-size:.75rem}
.mbxr-main-btn.is-active{background:linear-gradient(#ffd87b,#bc792c);box-shadow:0 0 13px rgba(255,192,79,.55),inset 0 -7px 10px rgba(0,0,0,.12)}
.mbxr-filter-drawer{display:none;margin-top:12px;padding:12px;border:2px solid #7d6752;border-radius:7px;background:#0d0907}
.mbxr-filter-drawer.is-open{display:block}
.mbxr-filter-search{display:none;width:100%;max-width:420px;margin:0 auto 10px;padding:9px 12px;border:1px solid #a88a5e;border-radius:5px;background:#f4ead6;color:#241a12;font:700 .78rem "Courier New",monospace}.mbxr-filter-values{display:flex;flex-wrap:wrap;gap:7px;justify-content:center;max-height:210px;overflow:auto;padding:2px}
.mbxr-filter-value{border:1px solid #bd9b62;border-radius:5px;background:#eee5d2;color:#231b14;padding:7px 10px;font:800 .72rem "Courier New",monospace;cursor:pointer}
.mbxr-filter-value.is-active{background:#9b1717;color:#fff;border-color:#e2c16e}

.mbxr-speaker{position:relative;height:210px;margin:-3px 52px 0;border:8px solid #805f38;border-top-width:5px;border-radius:0 0 42% 42%/0 0 16% 16%;background:linear-gradient(90deg,#32180e,#b28042 5%,#251914 8%,#251914 92%,#b28042 95%,#32180e);overflow:hidden}
.mbxr-speaker-grid{position:absolute;inset:18px 42px 24px;border:3px solid #a47c47;background:repeating-linear-gradient(45deg,#2e2823 0 3px,#171310 3px 7px);box-shadow:inset 0 0 25px #000}
.mbxr-emblem{position:absolute;left:50%;bottom:20px;transform:translateX(-50%);width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:#8f1b1b;border:5px double #d4a64e;color:#f6d576;font-size:1.7rem}

@media(max-width:760px){
  .mbxr-wrap{padding:34px 8px 54px}
  .mbxr-arch{padding:56px 17px 22px;border-width:6px;border-bottom-width:5px}
  .mbxr-cover-window{padding:10px 34px;min-height:116px}
  .mbxr-cover-track{grid-template-columns:repeat(4,1fr);gap:6px}
  .mbxr-title-pages{grid-template-columns:1fr;min-height:520px}
  .mbxr-strip{min-height:42px}
  .mbxr-bank{grid-template-columns:repeat(2,1fr)}
  .mbxr-speaker{margin-left:18px;margin-right:18px;height:155px}
}

/* v0.4: las fichas A/B también sirven para abrir el artista */
.mbxr-disc-artist.mbxr-artist-select{
  display:block;width:calc(100% - 56px);margin:-1px auto 5px;padding:0 0 4px;border:0;border-bottom:1px solid rgba(92,70,45,.35);
  background:transparent;color:#1c1712;font:900 .72rem/1.05 "Courier New",monospace;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:.03em;cursor:pointer
}
.mbxr-side-row.mbxr-song-select{
  width:100%;padding:0;border:0;background:transparent;color:#1c1712;font-family:"Courier New",monospace;text-align:left;cursor:pointer
}
.mbxr-side-row.mbxr-song-select:hover,.mbxr-disc-artist.mbxr-artist-select:hover{background:rgba(143,27,27,.09)}
.mbxr-side-row.mbxr-song-select:focus-visible,.mbxr-disc-artist.mbxr-artist-select:focus-visible{outline:2px solid #9b1717;outline-offset:1px}
