/* Jacket gallery — 2026.10.08 */
.developer-detail-page { width:min(100%,1640px); }
.works-section { display:block; padding-top:40px; }
.works-heading { display:flex; align-items:end; justify-content:space-between; gap:24px; margin-bottom:28px; }
.works-heading h2 { color:var(--text-main); font-size:clamp(30px,4vw,48px); letter-spacing:.04em; line-height:1.15; }
.works-eyebrow { margin:0 0 10px; font-size:11px; letter-spacing:.2em; color:var(--text-sub); }
.works-heading p { color:var(--text-sub); margin:8px 0 0; font-size:13px; }
.works-count { white-space:nowrap; font-size:12px; color:var(--text-sub); }
.works-toolbar { display:flex; flex-wrap:wrap; justify-content:space-between; gap:16px; margin-bottom:28px; }
.works-search { width:min(100%,340px); border:1px solid #555; padding:12px 14px; background:#101010; color:var(--text-main); font:inherit; font-size:14px; border-radius:4px; }
.works-filters { display:flex; gap:8px; flex-wrap:wrap; }
.works-filter { border:1px solid #444; border-radius:3px; padding:9px 15px; background:transparent; color:var(--text-sub); font:inherit; font-size:13px; cursor:pointer; }
.works-filter[aria-pressed="true"] { background:var(--text-main); color:#111; border-color:var(--text-main); }
.works-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:30px 20px; }
.work-card { min-width:0; }
.work-card[hidden] { display:none; }
.work-open { display:block; width:100%; border:0; padding:0; text-align:left; background:transparent; color:inherit; font:inherit; cursor:pointer; }
.work-art { position:relative; display:flex; align-items:center; justify-content:center; aspect-ratio:1; background:#1b1b1b; border:1px solid #333; border-radius:4px; overflow:hidden; }
.work-art img { width:100%; height:100%; object-fit:contain; transition:transform .3s ease,opacity .3s ease; }
.work-open:hover img { transform:scale(1.025); opacity:.85; }
.work-art::after { content:'↗'; position:absolute; right:10px; bottom:10px; width:28px; height:28px; display:grid; place-items:center; background:#090909cf; color:#fff; border-radius:50%; opacity:0; transition:opacity .2s; }
.work-open:hover .work-art::after,.work-open:focus-visible .work-art::after { opacity:1; }
.work-fallback { padding:24px; text-align:center; width:100%; }
.work-fallback small { display:block; color:#a5a5a5; font-size:10px; letter-spacing:.18em; margin-bottom:16px; }
.work-fallback strong { font-weight:500; font-size:19px; overflow-wrap:anywhere; }
.work-artist { display:block; margin-top:12px; color:#aaa; font-size:12px; line-height:1.5; }
.work-title { display:block; font-size:16px; font-weight:600; line-height:1.5; margin-top:4px; overflow-wrap:anywhere; }
.work-credit { display:block; color:#bfb7a9; font-size:11px; margin-top:5px; letter-spacing:.04em; }
.works-empty { padding:40px 0; color:var(--text-sub); }
.work-dialog { box-sizing:border-box; width:min(860px,calc(100% - 32px)); max-height:calc(100dvh - 32px); padding:48px 32px 32px; border:1px solid #555; border-radius:8px; background:#111; color:var(--text-main); overflow:auto; }
.work-dialog::backdrop { background:#000c; backdrop-filter:blur(6px); }
.work-dialog-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:32px; align-items:center; }
.work-dialog-close { position:absolute; right:12px; top:8px; background:transparent; border:0; color:#fff; font-size:28px; width:40px; height:40px; cursor:pointer; }
.work-dialog h2 { font-size:26px; line-height:1.5; margin:8px 0 20px; }
.work-dialog p { color:#bbb; font-size:13px; line-height:1.8; overflow-wrap:anywhere; }
.work-dialog .dialog-credit { color:#fff; font-size:15px; padding:14px 0; border-top:1px solid #444; border-bottom:1px solid #444; }
body.work-dialog-open { overflow:hidden; }
:where(.work-open,.works-filter,.works-search,.work-dialog-close):focus-visible { outline:2px solid #ead7a9; outline-offset:5px; }
@media(max-width:980px) { .works-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(max-width:640px) { .works-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px 14px; } .works-heading { align-items:start; } .works-toolbar { display:block; } .works-search { width:100%; margin-bottom:14px; } .works-filter { padding:8px 12px; } .work-title { font-size:14px; } .work-artist { font-size:11px; } .work-dialog-layout { grid-template-columns:1fr; gap:20px; } .work-dialog { padding:48px 22px 24px; } .work-dialog .work-art { max-width:300px; width:100%; margin:auto; } .work-fallback { padding:15px; } .work-fallback strong { font-size:16px; } }
.works-section { scroll-margin-top:110px; }

.works-sort-label { display:flex; align-items:center; gap:10px; font-size:12px; color:var(--text-sub); }
.works-sort { padding:10px; border:1px solid #555; border-radius:4px; background:#101010; color:var(--text-main); font:inherit; }
.works-sort:focus-visible { outline:2px solid #ead7a9; outline-offset:5px; }
.work-date { display:block; margin-top:7px; color:#aaa; font-size:11px; }
.works-sort-note { color:var(--text-sub); font-size:12px; margin:-12px 0 24px; }
@media(max-width:640px) { .works-sort-label { margin-bottom:14px; } }
/* Release information and credited tracks */
.work-dialog-layout { align-items:start; }
.dialog-info { min-width:0; }
.work-dialog .dialog-label { margin:0 0 6px; font-size:11px; color:#aaa; letter-spacing:.12em; }
.work-dialog h2 { font-size:clamp(18px,2.2vw,26px); margin:0 0 14px; overflow-wrap:anywhere; }
.work-dialog .dialog-artist { margin:0 0 18px; }
.work-dialog .dialog-catalog { font-size:12px; margin:0 0 24px; }
.dialog-catalog[hidden] { display:none; }
.dialog-tracks { list-style:none; margin:10px 0 0; padding:0; }
.dialog-tracks li { border-top:1px solid #444; padding:14px 0; }
.work-dialog .dialog-track-title { margin:0 0 7px; color:#fff; font-size:15px; line-height:1.65; }
.dialog-track-number { display:block; color:#bfb7a9; font-size:11px; letter-spacing:.06em; margin-bottom:4px; }
.work-dialog .dialog-track-credit { margin:0; font-size:13px; color:#d0c9bb; }
.work-dialog .dialog-track-artist { margin:5px 0 0; font-size:11px; }
/* Jackets for different catalogue editions */
.work-release { display:block; margin-top:5px; color:#aaa; font-size:11px; line-height:1.5; overflow-wrap:anywhere; }
.dialog-visual { min-width:0; }
.dialog-variants { display:flex; flex-wrap:wrap; gap:10px; margin-top:16px; }
.dialog-variants[hidden] { display:none; }
.dialog-variant { width:calc((100% - 20px)/3); min-width:0; padding:6px; border:1px solid #444; border-radius:4px; color:#aaa; background:transparent; font:inherit; cursor:pointer; text-align:left; }
.dialog-variant[aria-pressed="true"] { border-color:#ead7a9; color:#fff; background:#24211d; }
.dialog-variant img { width:100%; height:auto; aspect-ratio:1; object-fit:contain; display:block; background:#1b1b1b; }
.dialog-variant span { display:block; font-size:10px; line-height:1.5; margin-top:6px; overflow-wrap:anywhere; }
.dialog-variant:focus-visible { outline:2px solid #ead7a9; outline-offset:3px; }
.work-dialog .dialog-edition { font-size:12px; color:#d0c9bb; margin:0 0 5px; }
.dialog-edition[hidden] { display:none; }
@media(max-width:640px) { .dialog-visual { width:100%; max-width:300px; margin:auto; } }