:root{--pink:#ff2e88;--muted:#666;color:#111;background:#f4f4f6;font-family:-apple-system,BlinkMacSystemFont,Helvetica Neue,Arial,sans-serif}*,:before,:after{box-sizing:border-box}body{margin:0}[hidden]{display:none!important}#ui{max-width:1100px;margin:0 auto;padding:24px 16px}header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}h1{margin:0}#account{align-items:center;gap:12px;display:flex}.row{flex-wrap:wrap;align-items:flex-end;gap:12px;margin:16px 0;display:flex}label{color:var(--muted);flex-direction:column;gap:4px;font-size:13px;display:flex}label.check{color:#111;flex-direction:row;align-items:center;font-size:14px}select,input[type=url],input[type=number]{font:inherit;background:#fff;border:1px solid #ccc;border-radius:8px;min-width:0;padding:8px 10px}#playlist{min-width:min(360px,80vw)}#base-url{width:min(320px,80vw)}.btn{font:inherit;color:#111;cursor:pointer;background:#fff;border:1px solid #ccc;border-radius:999px;padding:9px 16px;font-size:14px}.btn.primary{background:var(--pink);border-color:var(--pink);color:#fff}.btn.file{color:#111;flex-direction:row;font-size:14px}.muted{color:var(--muted)}.small{font-size:13px}.table-wrap{background:#fff;border-radius:12px;max-height:60vh;overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:14px}th,td{text-align:left;border-bottom:1px solid #eee;padding:6px 10px}th{color:var(--muted);background:#fff;font-size:12px;position:sticky;top:0}td img{border-radius:4px;width:36px;height:36px;display:block}.num{font-variant-numeric:tabular-nums}tr.excluded td{opacity:.35}input.year{width:4.5em;font:inherit;border:1px solid #ccc;border-radius:6px;padding:4px 6px}button.mb{font:inherit;cursor:pointer;color:var(--muted);background:0 0;border:0;border-radius:6px;padding:2px 6px}button.mb.earlier{color:#8a5a00;background:#fff1c2;font-weight:700}#sheets{flex-direction:column;align-items:center;gap:24px;padding-bottom:48px;display:flex}.sheet{background:#fff;place-content:center;width:210mm;height:297mm;display:grid;box-shadow:0 2px 12px #0000001f}.card{width:var(--size);height:var(--size);outline-offset:-.1mm;-webkit-print-color-adjust:exact;print-color-adjust:exact;outline:.2mm dashed #bbb;flex-direction:column;justify-content:center;align-items:center;display:flex;overflow:hidden}.card.front{background:radial-gradient(circle,#1d1033 0%,#0b0b1a 70%);position:relative}[data-front=light] .card.front{background:#fff}.card.front .rings{background:conic-gradient(from calc(var(--hue) * 1deg), hsl(var(--hue) 95% 60%), hsl(calc(var(--hue) + 60) 95% 60%), hsl(calc(var(--hue) + 140) 95% 60%), hsl(calc(var(--hue) + 220) 95% 60%), hsl(var(--hue) 95% 60%));-webkit-mask:repeating-radial-gradient(circle, transparent 0 calc(var(--size) * .017), #000 calc(var(--size) * .017) calc(var(--size) * .022)), radial-gradient(circle, transparent 0 calc(var(--size) * .37), #000 calc(var(--size) * .37) calc(var(--size) * .475), transparent calc(var(--size) * .475));-webkit-mask-composite:source-in;-webkit-mask:repeating-radial-gradient(circle, transparent 0 calc(var(--size) * .017), #000 calc(var(--size) * .017) calc(var(--size) * .022)), radial-gradient(circle, transparent 0 calc(var(--size) * .37), #000 calc(var(--size) * .37) calc(var(--size) * .475), transparent calc(var(--size) * .475));mask:repeating-radial-gradient(circle, transparent 0 calc(var(--size) * .017), #000 calc(var(--size) * .017) calc(var(--size) * .022)), radial-gradient(circle, transparent 0 calc(var(--size) * .37), #000 calc(var(--size) * .37) calc(var(--size) * .475), transparent calc(var(--size) * .475));opacity:.9;position:absolute;inset:0;-webkit-mask-composite:source-in;mask-composite:intersect}.card.front .qr{aspect-ratio:1;border-radius:calc(var(--size) * .04);width:54%;box-shadow:0 0 0 calc(var(--size) * .012) hsl(var(--hue) 95% 60%);background:#fff;padding:4.5%;position:relative}[data-front=light] .card.front .qr{box-shadow:none}.card.front .qr svg{width:100%;height:100%;display:block}.card.front .brand{bottom:calc(var(--size) * .035);font-size:calc(var(--size) * .055);letter-spacing:.25em;color:#fff;background:#0b0b1a;border-radius:999px;padding:.3em .6em .3em .85em;font-weight:900;position:absolute}[data-front=light] .card.front .brand{color:#111;background:#fff}.card.back{text-align:center;color:#fff;background:linear-gradient(135deg, hsl(var(--hue) 85% 55%), hsl(calc(var(--hue) + 40) 85% 42%));gap:2mm;padding:5mm}.card.back .artist{font-size:calc(var(--size) * .075);font-weight:700;line-height:1.15}.card.back .year{font-size:calc(var(--size) * .3);font-weight:900;line-height:1}.card.back .title{font-size:calc(var(--size) * .07);font-style:italic;line-height:1.15}@page{size:A4;margin:0}@media print{html,body{background:#fff}#ui{display:none}#sheets{padding:0;display:block}.sheet{box-shadow:none;break-after:page}}#builder{background:#fff;border-radius:12px;margin:16px 0 24px;padding:12px 16px}#builder summary{cursor:pointer;padding:4px 0;font-weight:700}label.wide{margin-top:8px}textarea{color:#111;border:1px solid #ccc;border-radius:8px;width:100%;padding:8px 10px;font:13px/1.5 ui-monospace,Menlo,monospace}input[type=text]{font:inherit;border:1px solid #ccc;border-radius:8px;padding:8px 10px}tr.uncertain td{background:#fff7dc}tr.missing td{background:#ffe8e8}.found-title{font-weight:600}.found-meta{color:var(--muted);font-size:12px}.notice{color:#6b4700;background:#fff1c2;border-radius:10px;margin-top:12px;padding:10px 14px}
