.modal.end-credits-modal{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;border-radius:0;background:#26344a;color:#fff;box-shadow:none;overflow:hidden}
.end-credits{position:relative;height:100%;width:100%;background:#26344a;color:#fff;font-family:"Hiragino Kaku Gothic ProN","Noto Sans JP",sans-serif;overflow:hidden}
.credits-slideshow{position:absolute;inset:0;z-index:0;overflow:hidden}
.credits-slideshow figure{position:absolute;inset:0;margin:0;opacity:0;transition:opacity 1.5s ease;overflow:hidden}
.credits-slideshow figure.is-active{opacity:1}
.credits-slideshow figure::before{content:"";position:absolute;inset:-25px;background-image:var(--credits-image);background-position:center;background-size:cover;filter:blur(18px);opacity:.85}
.credits-slideshow img{position:relative;display:block;width:100%;height:100%;object-fit:contain}
.credits-readability{position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,#17253a26,#142238ad 28%,#142238ad 72%,#17253a26)}
.credits-columns{position:absolute;inset:0 20% 82px;z-index:2;display:block;opacity:0;transition:opacity 1.2s;text-shadow:0 2px 4px #091321,0 0 12px #091321}
.credits-ready .credits-columns{opacity:var(--credits-opacity,1)}
.credits-roll-viewport{position:relative;height:100%;overflow:hidden;mask-image:linear-gradient(transparent,#000 8%,#000 92%,transparent)}
.credits-roll{position:absolute;top:0;left:0;right:0;text-align:center;will-change:transform;padding:0 1vw;line-height:1.8}
.credits-roll header{margin-bottom:12vh}.credits-roll header small{letter-spacing:.25em;color:#e0e5f0;font-size:13px}.credits-roll h3{font-size:clamp(22px,3vw,40px);font-weight:500;line-height:1.5;margin:20px 0}.credits-roll header p{font-size:11px;letter-spacing:.3em;color:#d7deea}
.credits-person{margin-bottom:9vh}.credits-person p,.credits-roll footer>p{font-size:clamp(12px,1.2vw,16px);color:#e0e5f0;letter-spacing:.12em;margin:0 0 16px}.credits-person b,.credits-roll footer>b{font-size:clamp(20px,2vw,29px);font-weight:400;letter-spacing:.15em}.credits-song{margin-top:14vh}.credits-roll footer{padding:8vh 0 20vh}.credits-roll footer h3{margin-top:18vh}
.credits-thanks{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;opacity:0;transition:opacity 2s}.credits-thanks small{font-size:12px;color:#e0e5f0;letter-spacing:.15em}.credits-thanks p{font-size:clamp(20px,3vw,36px);line-height:1.8}.credits-thanks b{font-size:18px;font-weight:400;letter-spacing:.15em}.credits-finale .credits-thanks{opacity:1}
.credits-loading{position:absolute;inset:0;z-index:3;display:flex;align-items:center;justify-content:center;text-align:center;padding:30px;color:#fff;font-size:14px;background:#14223855;text-shadow:0 2px 4px #091321}.credits-loading[hidden]{display:none}
.credits-controls{position:absolute;z-index:4;bottom:0;left:0;right:0;min-height:70px;padding:12px max(4vw,env(safe-area-inset-left)) max(12px,env(safe-area-inset-bottom));display:flex;gap:12px;justify-content:space-between;align-items:center;border-top:1px solid #ffffff33;background:#162238e8;backdrop-filter:blur(8px)}.credits-controls>div{display:flex;flex-direction:column;gap:4px}.credits-controls span{font-size:12px;letter-spacing:.08em}.credits-controls small{font-size:10px;color:#d7deea}.credits-controls nav{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.credits-controls button{background:#24344b;color:#fff;border:1px solid #a3b1c1;padding:9px 12px;font-size:11px;cursor:pointer;border-radius:4px}.credits-controls button:focus-visible{outline:2px solid #fff;outline-offset:3px}.credits-controls button[hidden]{display:none}
.credits-name{display:block;margin:10px 0}.credits-song h3{overflow-wrap:normal;word-break:normal}
@media(max-width:600px){.credits-columns{inset:0 8% 126px}.credits-readability{background:#14223888}.credits-roll h3{font-size:24px}.credits-person b{font-size:21px}.credits-person p{font-size:12px;letter-spacing:0}.credits-controls{padding-left:12px;padding-right:12px;flex-direction:column;align-items:stretch;gap:8px}.credits-controls>div{flex-direction:row;justify-content:space-between;align-items:center}.credits-controls nav{gap:5px;justify-content:space-between}.credits-controls button{flex:1;padding:8px;font-size:10px}.credits-thanks p{font-size:22px}}

/* Keep every true-ending credit readable over bright illustrations. */
.credits-true .credits-roll,.credits-true .credits-thanks{-webkit-text-stroke:1.2px #000;paint-order:stroke fill;text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000,0 2px 5px #000}
.credits-true .credits-roll p,.credits-true .credits-roll small,.credits-true .credits-thanks small{-webkit-text-stroke:.7px #000}

.end-credits.credits-bad{background:#000}.credits-bad .credits-readability{background:none}.credits-bad .credits-columns{background:none}
