[hidden]{display:none!important}
.bar-title{background:var(--red);color:var(--paper);font:bold 12px/1.4 var(--mono);letter-spacing:0}
.record-bar{display:grid;grid-template-columns:minmax(114px,1fr) minmax(0,3fr) minmax(114px,1fr);gap:8px;padding:8px 10px;min-height:60px}
.record-left,.record-right{display:flex;align-items:center;gap:6px;min-width:0}
.record-right{justify-content:flex-end;position:relative}
.title-stripes{min-width:0;align-self:stretch;background:repeating-linear-gradient(to bottom,transparent 0,transparent 2px,#fff9e980 2px,#fff9e980 3px);display:flex;align-items:center;justify-content:center}
.title-stripes .bar-title{display:block;max-width:100%;padding:5px 8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:center}
#card-position{font:10px var(--mono);white-space:nowrap;letter-spacing:0}
.hand-button{display:flex;align-items:center;justify-content:center;width:44px;height:40px;flex:none;border:1px solid var(--ink);padding:3px;background:var(--paper);box-shadow:2px 2px 0 var(--ink)}
.hand-button img{width:34px;height:auto;display:block;image-rendering:pixelated}
.previous-hand img{transform:scaleX(-1)}
.hand-button:hover:not(:disabled){background:var(--yellow)}
.hand-button:disabled{opacity:.35;cursor:default;box-shadow:none}
.film-entry{min-width:0;text-align:left;border:0;background:none;padding:0;color:inherit}
.film-entry:hover .film-name{text-decoration:underline}
.film-name{display:block}
button.film-year{border:0;cursor:pointer;align-self:start;font:bold 13px var(--mono)}
.film-year:hover{text-decoration:underline;outline:2px solid var(--ink)}
.linked-meta .year-link{font:inherit}
.credits-section{border-top:1px solid #b7ad98;padding:0;margin:0}
.credits-section>summary{font:bold 12px var(--mono);color:var(--blue);padding:15px 0;cursor:pointer;min-height:45px}
.credits-section>summary:hover{color:var(--red)}
.cast-list{font-size:14px;line-height:1.9;padding:0 0 18px}
.crew-jobs{margin:0 0 18px}
.crew-jobs>div{display:grid;grid-template-columns:minmax(110px,32%) minmax(0,1fr);border-top:1px solid #ddd3bd;padding:11px 0;gap:15px;font-size:13px;line-height:1.65}
.crew-jobs dt{color:#504953;font:11px/1.6 var(--mono)}
.crew-jobs dd{margin:0;overflow-wrap:anywhere}
.credit-source{padding-bottom:18px;font-size:12px;color:#504953}
.credit-source>summary{cursor:pointer;font:11px var(--mono)}
.credit-source p{white-space:pre-wrap;line-height:1.7;overflow-wrap:anywhere}
.coverage-note{font:11px/1.6 var(--mono);color:#504953;margin:0 0 15px}
.unresolved-credit small{font:10px var(--mono);color:#6a6264}
.album-list li{display:grid;grid-template-columns:54px minmax(0,1fr);gap:14px;align-items:start;padding:14px 0}
.album-thumbnail{border:1px solid var(--ink);padding:0;aspect-ratio:1;background:var(--paper);box-shadow:2px 2px 0 var(--ink);width:54px;height:54px;overflow:hidden}
.album-thumbnail img{display:block;width:100%;height:100%;object-fit:contain}
.album-thumbnail .cover-placeholder{font-size:24px;text-shadow:none}
.album-thumbnail:hover{outline:2px solid var(--red);outline-offset:2px}
.disc-type{display:block;font:10px/1.6 var(--mono);color:var(--blue);margin-top:4px}
.window-bar .bar-title{font-size:10px;padding:1px 4px}
@media(max-width:600px){
 .record-bar{grid-template-columns:82px minmax(0,1fr) 82px;gap:5px;padding:7px 6px;min-height:66px}
 .record-right{gap:5px;align-self:stretch}
 #card-position{position:absolute;right:26px;bottom:-3px;font-size:8px}
 .title-stripes .bar-title{font-size:10px;padding:4px;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
 .hand-button{height:40px;width:44px;margin-bottom:5px}
 #card-close{align-self:center;margin-bottom:5px}
 .crew-jobs>div{grid-template-columns:minmax(85px,30%) minmax(0,1fr);gap:12px;font-size:12px}
 .crew-jobs dt{font-size:10px}
 .album-list li{grid-template-columns:48px minmax(0,1fr);gap:12px}
 .album-thumbnail{width:48px;height:48px}
 button.film-year{font-size:10px}
 .film-entry .film-name{font-size:18px}
}
.cairo-toy{position:absolute;right:16px;bottom:4px;width:156px;height:156px;transform:rotate(12deg);z-index:0;background:var(--orange);border:2px solid var(--ink);box-shadow:5px 5px 0 var(--ink);display:flex;align-items:center;justify-content:center;padding:25px;isolation:isolate}
.cairo-toy:before{content:"";position:absolute;inset:-17px;background-image:radial-gradient(var(--red) 1px,transparent 1px);background-size:5px 5px;z-index:-1;pointer-events:none}
.cairo-toy img{width:100%;height:100%;object-fit:contain;image-rendering:pixelated;pointer-events:none}
.cairo-toy:hover{background:var(--pink)}
.cairo-toy:focus-visible{outline:3px solid var(--blue);outline-offset:8px}
@media(min-width:1400px){.cairo-toy{right:25px;bottom:0;width:173px;height:173px}}
@media(max-width:1100px){.cairo-toy{width:122px;height:122px;right:0;bottom:0;padding:20px}}
@media(max-width:820px){.cairo-toy{position:relative;margin:5px 15px 18px auto;width:90px;height:90px;padding:17px;bottom:auto;right:auto}.cairo-toy:before{inset:-10px}}
#card-close{display:flex;align-items:center;justify-content:center;flex:none;width:24px;height:29px;padding:0;background:var(--paper);border:2px solid var(--ink);color:var(--ink);box-shadow:2px 2px 0 var(--ink);font:24px/1 var(--mono)}
#card-close:hover{background:var(--yellow)}
/* Five staff lines, shared by the library and record title bars. */
.window-bar .stripe,.record-bar .title-stripes{background-image:repeating-linear-gradient(to bottom,#fff9e9b0 0,#fff9e9b0 1px,transparent 1px,transparent 6px);background-size:100% 25px;background-position:center;background-repeat:no-repeat}
.window-bar .stripe{height:25px}
#card-dialog{position:fixed;top:min(5dvh,40px);bottom:auto;margin:0 auto;max-height:calc(100dvh - min(5dvh,40px) - 20px);scrollbar-gutter:stable}
.record-toolbar{position:sticky;top:0;z-index:3;background:var(--paper)}
.record-bar{position:relative;top:auto;display:grid;grid-template-columns:190px minmax(0,1fr) 190px;gap:8px;padding:8px 10px;min-height:60px}
.record-bar:before{content:""}
.record-bar .title-stripes{align-self:stretch}
.record-right{gap:6px;position:static;align-self:center;justify-content:flex-end}
.hand-button,#card-close{height:40px;width:40px;margin:0;border:2px solid var(--ink);box-shadow:2px 2px 0 var(--ink)}
.hand-button img{width:32px}
#card-position{position:static;font:10px var(--mono);min-width:50px;text-align:center}
.record-tabs{display:flex;gap:0;border-bottom:2px solid var(--ink);background:var(--blue)}
.record-tabs button{padding:8px 17px;border:0;border-right:2px solid var(--ink);background:var(--blue);color:var(--paper);font:bold 12px var(--mono)}
.record-tabs button.active{background:var(--yellow);color:var(--ink)}
.english-title{font-weight:normal;font-size:.68em;display:block;line-height:1.35;letter-spacing:0;margin-top:5px}
.linked-list .english-title{font-size:.9em}
.year-link[data-era]{color:var(--era,var(--blue))}
[data-era="1960"]{--era:#163ca1}
[data-era="1970"]{--era:#c51f30}
[data-era="1980"]{--era:#60378b}
[data-era="1990"]{--era:#236342}
.film-list .film-row .film-year[data-era]{background:var(--era,var(--blue));color:var(--paper)}
.decade[data-era]{color:var(--era,var(--blue));border-color:var(--era,var(--blue))}
.decade[data-era].active,.decade[data-era]:hover{background:var(--era,var(--blue));color:var(--paper)}
.cairo-toy{z-index:5;touch-action:manipulation;cursor:pointer}
@media(max-width:600px){
 .record-bar{grid-template-columns:minmax(0,1fr) 140px;gap:8px;padding:8px;min-height:62px}
 .record-bar:before{display:none}
 .record-right{display:grid;grid-template-columns:40px 40px 40px;gap:6px;position:relative;padding-bottom:10px}
 .record-right #card-position{position:absolute;bottom:-3px;right:0;font-size:8px;width:100%;line-height:10px}
 .record-right #card-close{margin:0;align-self:auto}
 .title-stripes .bar-title{font-size:10px;padding:4px 5px}
 .record-tabs button{padding:8px 14px;font-size:11px}
}

.cairo-scene{width:100%;height:100%;overflow:visible;pointer-events:none;color:#181723;image-rendering:pixelated}.cairo-toy{overflow:visible}.cairo-toy img[hidden]{display:none}.disc-icon.silver{color:#7d8794}

#translate-title{font:inherit;letter-spacing:inherit;line-height:inherit;text-align:left;color:inherit;background:none;border:0;padding:0;cursor:pointer}#translate-title:focus-visible{outline:3px dashed var(--blue);outline-offset:8px}.headline-word{display:inline-block;white-space:nowrap}.headline-char{display:inline-block;backface-visibility:hidden}.album-grid{align-items:start}.album{display:flex;flex-direction:column;justify-content:flex-start;align-self:start;min-width:0;text-align:left}.album-art{width:100%;flex:none;aspect-ratio:1;display:flex;align-items:center;justify-content:center}.album-art img{width:100%;height:100%;object-fit:contain}.album-title,.album-meta{width:100%}.agent-notes{color:#625b61;font-size:12px}.agent-notes summary{font:12px var(--mono);cursor:pointer}.agent-notes p{white-space:pre-wrap;line-height:1.6}.disc-actions{align-items:center}.icon-button svg{stroke-width:1.8}#new-arrivals svg path{fill:var(--yellow);stroke:currentColor}#sort-direction svg path{fill:var(--red);stroke:var(--ink);stroke-width:2}#sort-direction.descending svg{transform:rotate(180deg)}#sort-direction{flex:none}.page-footer{gap:20px;justify-content:flex-start;flex-wrap:wrap}#sound-toggle{margin-right:auto}@media(max-width:720px){#sort-direction{width:34px;height:34px;padding:6px!important}.controls .disc-actions{margin-left:auto}.headline-word{max-width:100%}}

.composer-name{border:0;padding:0;background:none;color:inherit;font:inherit;letter-spacing:inherit;text-transform:uppercase;cursor:pointer;text-align:left}.composer-name:focus-visible{outline:2px dashed var(--red);outline-offset:6px}
.film-list .film-row{grid-template-columns:70px minmax(0,1fr) auto 28px}.film-row>.disc-icons{margin:0 8px;align-self:center}
.record-right{display:flex;align-items:center;padding-bottom:0}.record-right #card-position{position:static;width:auto;min-width:60px;font:10px var(--mono);line-height:normal}.record-bar{grid-template-columns:220px minmax(0,1fr) 220px}
@media(max-width:720px){.film-list .film-row{grid-template-columns:40px minmax(0,1fr) auto 15px;gap:8px}.film-row>.disc-icons{margin:0;gap:3px;flex-wrap:wrap;max-width:37px}.record-bar{grid-template-columns:minmax(0,1fr) auto}.record-right{display:flex;gap:4px;padding-bottom:0}.record-right #card-position{position:static;min-width:46px;font-size:8px;width:auto}.record-right .hand-button{width:32px}.record-right #card-close{width:25px}}

.top-credits{display:flex;flex-direction:column;gap:7px;min-width:0}.orchestra-credit{display:block;font-size:10px;letter-spacing:1.1px}.eyebrow #sound-toggle{margin:0 0 0 auto;flex-shrink:0;font:10px var(--mono);letter-spacing:.5px;align-self:center;padding:10px 0 10px 12px}.eyebrow .disc-mark{align-self:center}@media(max-width:720px){.orchestra-credit{font-size:8px;letter-spacing:.2px}.eyebrow #sound-toggle{font-size:8px;padding-left:7px}.top-credits{gap:5px}}

/* Keep record titles at the left edge; staff lines fill the space to the hands. */
.record-bar{grid-template-columns:minmax(0,1fr) auto}.record-bar:before{display:none;content:none}.record-bar .title-stripes{justify-content:flex-start}.record-bar .title-stripes .bar-title{text-align:left;padding-left:0;padding-right:10px}

/* Film information already opens the card; omit the redundant arrow column. */
.film-list .film-row{grid-template-columns:70px minmax(0,1fr) auto}
@media(max-width:720px){
 .album-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 18px}.album-title{font-size:13px}.album-meta{font-size:10px}
 .film-list .film-row{grid-template-columns:40px minmax(0,1fr) auto}
 .masthead:has(#translate-title) h1{font-size:clamp(26px,7.3vw,42px);letter-spacing:-1px;line-height:1.08;height:3.24em}
 #translate-title{display:block;width:100%;height:3.24em;white-space:nowrap}
 .record-bar{display:flex;flex-direction:column;align-items:stretch;gap:10px;background:var(--paper);color:var(--ink);border-bottom:1px solid #b7ad98;padding:14px;min-height:0}
 .record-bar .title-stripes{background:none;display:block}
 .record-bar .title-stripes .bar-title{background:none;color:var(--ink);font-size:13px;padding:0;display:block;white-space:normal;overflow:visible;text-overflow:clip}
 .record-right{justify-content:flex-end;align-self:stretch}
 .window-bar{background:var(--paper);color:var(--ink)}.window-bar .bar-title{background:none;color:inherit}.window-bar .stripe{display:none}.window-bar #record-count{margin-left:auto}
}

/* The heading receives programmatic focus for screen readers, without a Safari outline. */
#card-title:focus{outline:none}
@media(max-width:720px){
 .record-bar{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;background:var(--red);color:var(--paper);border-bottom:3px solid var(--ink);padding:10px;min-height:60px}
 .record-bar .title-stripes{align-self:center;background:none}
 .record-bar .title-stripes .bar-title{color:var(--paper);font-size:12px;line-height:1.4;padding:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
 .record-right{align-self:center;align-items:center;gap:6px}
 .record-right #card-position{display:none}
 .window-bar{background:var(--red);color:var(--paper)}
}

@media(max-width:720px){.masthead #cairo-toy{display:none}}

@media(max-width:720px){.masthead:has(#translate-title) h1{width:100%;max-width:none;font-size:clamp(30px,10.5vw,64px);letter-spacing:-1.4px}}

[data-era="2000"]{--era:#141414}
