.jukebox-screen .jb-body{grid-template-columns:94px minmax(0,1fr)}#app .jb-deck{position:relative;align-content:start;gap:1px;padding:5px 4px 4px;overflow:hidden;background:radial-gradient(circle at 50% 24%,color-mix(in srgb,var(--c) 30%,transparent),transparent 64%),var(--ui-surface)}.jb-disc{position:relative;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--c) 55%,#1a1830) 0 48%,#16131f 49% 100%)}.jb-disc:before{content:"";position:absolute;inset:2px;border-radius:50%;opacity:.5;background:conic-gradient(from 0deg,transparent 0 20%,rgba(255,255,255,.16) 25%,transparent 32% 70%,rgba(255,255,255,.1) 75%,transparent 82%)}.jb-disc.spin:before{animation:jb-spin 3.2s linear infinite}.jb-disc img{position:relative;width:30px;height:30px;image-rendering:auto}@keyframes jb-spin{to{transform:rotate(1turn)}}.jb-deck b{margin-top:2px;font-size:8px;line-height:9px}#app .jb-deck small{color:var(--silver);font-size:6px;line-height:7px}#app .jb-deck small.jb-meta{opacity:.75}#app .jb-deck small.jb-price{display:inline-flex;align-items:center;gap:2px;color:var(--sky)}.jb-deck .jb-act{width:100%;min-height:12px;margin-top:3px}.jb-list{display:flex;flex-wrap:wrap;justify-content:center;gap:2px;margin-top:4px;padding-top:3px;border-top:1px solid var(--ui-edge)}.jb-list img{width:11px;height:11px;image-rendering:auto}.jb-list img.now{transform:translateY(-1px)}.jb-shelf{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:3px;min-height:0;height:100%}.jb-rec{position:relative;display:grid;grid-template-rows:minmax(0,1fr) auto auto;justify-items:center;align-items:center;gap:1px;min-width:0;min-height:12px;padding:2px 2px 3px;font:inherit;font-size:6px;line-height:7px;color:var(--chalk);background:#10101099;border:1px solid var(--stone);border-radius:2px;cursor:pointer}.jb-wash{display:grid;place-items:center;width:100%;height:100%;min-height:0;background:radial-gradient(circle,color-mix(in srgb,var(--c) 40%,transparent) 0,transparent 66%)}.jb-wash img{width:24px;height:24px;max-height:100%;object-fit:contain;image-rendering:auto}.jb-rec b{max-width:100%;font-weight:400;text-align:center;overflow-wrap:anywhere}.jb-rec em{display:inline-flex;align-items:center;gap:1px;font-style:normal;color:var(--silver)}.jb-rec em.in{color:var(--gold)}.jb-rec em .glim-gem,.jb-deck .glim-gem{width:5px;height:5px;box-shadow:none}#app .jb-rec.on{border-color:var(--ash);background:var(--slate)}.jb-rec.locked{opacity:var(--quiet)}.jb-eq{position:absolute;top:2px;right:2px;display:flex;align-items:flex-end;gap:1px;height:5px}.jb-eq i{width:1px;height:5px;background:var(--c);transform-origin:bottom;animation:jb-eq .9s ease-in-out infinite alternate}.jb-eq i:nth-child(2){animation-delay:-.3s}.jb-eq i:nth-child(3){animation-delay:-.6s}@keyframes jb-eq{0%{transform:scaleY(.3)}to{transform:scaleY(1)}}@media(hover:hover){.jb-rec:hover{transform:translateY(-1px)}}.jb-rec:active{transform:translateY(1px)}@media(prefers-reduced-motion:reduce){.jb-disc.spin:before,.jb-eq i{animation:none}}
