/* /beats: the portfolio player (base.css) on a catalogue of beats */
html{--lime:#EDFF00}
.bt{cursor:default}
@media (max-width:900px){
  .bt{margin-top:0;background:#000;padding-top:calc(var(--nav-h) + 28px)}
  .bt .pl-win{animation:none;filter:none}
}
.pl-row{cursor:pointer}
.pl-row.sold{opacity:.55}
.bt-r{align-self:stretch;display:flex;align-items:center;justify-content:flex-end;gap:clamp(12px,1.4vw,22px)}
.pl.bt .pl-row{padding-right:0}
.bt-buy{align-self:stretch;display:flex;align-items:center;justify-content:center;margin:-1px -1px -1px 0;padding:0 clamp(22px,2.4vw,36px);background:var(--lime);color:#050505;font-family:"OffBit Bold",ui-monospace,monospace;font-size:clamp(17px,1.6vw,22px);line-height:1;letter-spacing:.22em;text-indent:.22em;white-space:nowrap;text-transform:uppercase;cursor:pointer;border:0;transition:background .15s,color .15s}
.bt-buy:hover,.bt-buy:focus-visible{background:#fafafa;outline:0}
.pl-row.sold .bt-r{padding-right:clamp(14px,1.5vw,24px)}
.bt-sold{font-size:12px;letter-spacing:.14em;color:rgba(255,255,255,.6)}
@media (max-width:520px){.bt-r .pl-rd{display:none}}
.item.cur .t{color:var(--violet)}

/* licence picker */
.bt-modal{position:fixed;inset:0;z-index:80;display:grid;place-items:center;padding:20px;font-family:"OffBit Bold",ui-monospace,monospace;text-transform:uppercase;letter-spacing:.12em;color:#fff}
.bt-modal[hidden]{display:none}
.bt-scrim{position:absolute;inset:0;background:rgba(5,5,5,.72);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.bt-card{position:relative;width:min(560px,100%);max-height:calc(100svh - 40px);overflow:auto;padding:clamp(22px,3vw,34px);background:rgba(5,5,5,.94);border:1px solid rgba(162,96,255,.6)}
.bt-c{position:absolute;width:18px;height:18px;border:solid var(--violet);border-width:0}
.bt-c.tl{left:-1px;top:-1px;border-width:3px 0 0 3px}.bt-c.tr{right:-1px;top:-1px;border-width:3px 3px 0 0}
.bt-c.bl{left:-1px;bottom:-1px;border-width:0 0 3px 3px}.bt-c.br{right:-1px;bottom:-1px;border-width:0 3px 3px 0}
.bt-mtop{display:flex;align-items:center;gap:14px;font-size:12px}
.bt-mtop em{flex:1;height:1px;background:rgba(162,96,255,.45)}
.bt-chip{display:inline-block;background:var(--violet);color:#050505;padding:9px 14px}
.bt-chip b{font-weight:400}
.bt-x{color:var(--violet);font:inherit;letter-spacing:inherit;cursor:pointer;background:none;border:0;padding:0}
.bt-x:hover{color:#fff}
.bt-mt{margin:clamp(18px,3vh,28px) 0 0;font-family:"Neutral Face",system-ui,sans-serif;font-weight:400;font-size:clamp(30px,5vw,48px);line-height:1.02;letter-spacing:-.02em;text-transform:none;overflow-wrap:anywhere}
.bt-mm{margin:12px 0 0;font-size:12px;color:var(--violet)}
.bt-opts{display:grid;gap:10px;margin-top:clamp(18px,3vh,26px)}
.bt-opt{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:16px;row-gap:6px;align-items:center;text-align:left;padding:14px 16px;color:#fff;background:rgba(162,96,255,.04);border:1px solid rgba(162,96,255,.32);cursor:pointer;font:inherit;letter-spacing:inherit;text-transform:uppercase;transition:background .15s,border-color .15s,color .15s}
.bt-opt:hover{border-color:rgba(162,96,255,.85);background:rgba(162,96,255,.12)}
.bt-opt:focus-visible{outline:2px solid #fff;outline-offset:2px}
.bt-opt.on{background:var(--violet);border-color:var(--violet);color:#050505}
.bt-ot{font-size:clamp(18px,2.2vw,22px);line-height:1;text-transform:none}
.bt-op{grid-row:1/3;grid-column:2;font-size:clamp(20px,2.4vw,26px);line-height:1}
.bt-od{grid-column:1;font-size:11px;line-height:1.35;color:rgba(255,255,255,.62)}
.bt-opt.on .bt-od{color:rgba(5,5,5,.75)}
.bt-sum{display:flex;align-items:baseline;justify-content:space-between;margin-top:clamp(18px,3vh,26px);font-size:12px;color:var(--violet)}
.bt-sum b{font-family:"Neutral Face",system-ui,sans-serif;font-weight:400;font-size:clamp(28px,4vw,40px);color:#fff;text-transform:none}
.bt-go{width:100%;height:52px;margin-top:14px;display:grid;place-items:center;background:var(--lime);color:#050505;font:inherit;font-size:14px;letter-spacing:.16em;text-transform:uppercase;cursor:pointer;border:0;transition:background .15s}
.bt-go:hover,.bt-go:focus-visible{background:#fafafa;outline:0}
.bt-go:disabled{opacity:.6;cursor:wait}
.bt-note{margin:14px 0 0;font-size:11px;line-height:1.5;color:rgba(255,255,255,.62);text-transform:none;letter-spacing:.06em;min-height:1.5em}
.bt-note.err{color:var(--lime)}
.bt-open{overflow:hidden}
