/* The credit room borrows the game's dark-teal/gold visual language. */
#kka-root .credit-overlay{align-items:center;justify-content:center;background:radial-gradient(circle at 50% 28%,#31534b9e,#061b1ce8 72%);backdrop-filter:blur(9px)}
#kka-root .credit-panel{width:min(790px,100%);max-height:calc(100dvh - 28px - var(--safe-top,0px) - var(--safe-bottom,0px));display:flex;flex-direction:column;overflow:hidden;color:#f7f2e7;background:linear-gradient(155deg,#122f32,#092228 80%);border:1px solid #d4b97988;border-radius:24px;box-shadow:0 25px 90px #001416bd,inset 0 1px #ffffff14}
.credit-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:27px 34px 22px;border-bottom:1px solid #d4b97933;background:linear-gradient(110deg,#183a39,#0b2529)}
.credit-head .g-overline,.credit-kicker{display:block;color:#dbc48c;font-size:10px;font-weight:800;letter-spacing:2.6px}
.credit-head h2{font-size:clamp(27px,3vw,40px);margin:7px 0 4px;line-height:1.15;color:#fff9eb}
.credit-head p{margin:0;color:#b3c9c5;font-size:13px}
#kka-root .credit-close{flex:none;width:42px;height:42px;min-width:42px;border:1px solid #9ed7cb;border-radius:11px;background:#0b272b;color:#e7f4ed;font-size:28px;line-height:1;cursor:pointer}
.credit-body{padding:28px 34px 22px;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.credit-maker{display:flex;align-items:center;gap:24px;padding:20px 24px;background:#2b484b;border-radius:18px;border:1px solid #d9c18b5c}
.credit-portrait{display:block;width:118px;height:118px;flex:none;overflow:hidden;border:5px solid #dcc18a;border-radius:50%;background:#547478}
.credit-portrait img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 53%;transform:scale(1.72)}
.credit-maker h3{font-size:25px;line-height:1.2;margin:7px 0 5px;color:#fffaf0}
.credit-maker p{margin:0 0 10px;font-size:16px;color:#c9dad6}
.credit-maker nav{display:flex;flex-wrap:wrap;gap:7px 23px}
.credit-maker a,.credit-license a{color:#f3d397;text-decoration:underline;text-underline-offset:4px}
.credit-maker a{font-size:14px}
.credit-music,.credit-about{margin-top:29px}
.credit-section-heading h3,.credit-about h3{font-size:23px;margin:6px 0 7px;color:#faf6e9}
.credit-section-heading p,.credit-about p,.credit-note{font-size:14px;line-height:1.7;color:#bcd0ce;margin:0 0 14px}
.credit-tracks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:20px 0}
.credit-track{background:#18373a;border:1px solid #52716d;border-radius:14px;overflow:hidden;transition:background .2s,border-color .2s}
.credit-track.selected{border-color:#e4c886;background:#254c46;box-shadow:inset 0 0 0 1px #e4c88655}
#kka-root .credit-track button{display:flex;align-items:flex-start;gap:10px;width:100%;min-height:89px;padding:15px 13px;background:transparent;border:0;color:#f8f6ed;text-align:left;cursor:pointer}
.credit-track button>span:nth-child(2){flex:1;min-width:0}
.credit-track strong{display:block;font-size:14px;line-height:1.35}
.credit-track small{display:block;margin-top:5px;color:#b9cdc5;font-size:11px}
.track-number{color:#e1c98f;font-size:12px;letter-spacing:1px}
.track-state{font-size:9px;color:#efd395;white-space:nowrap;font-weight:800}
.credit-license{padding:0 13px 13px 36px;color:#b9ccc8;font-size:10px;line-height:1.7}
.credit-license a{color:#b9dace}
.credit-volume{display:flex;align-items:center;gap:15px;flex-wrap:wrap;padding:14px 17px;border-radius:12px;background:#0b292c;border:1px solid #5a777477}
.credit-volume label{font-size:12px;font-weight:800;letter-spacing:.4px;white-space:nowrap}
.credit-volume output{color:#e7d29d;font-weight:500;margin-left:6px}
.credit-volume input{flex:1;min-width:120px;accent-color:#e9c97f;cursor:pointer}
#kka-root .credit-volume button{padding:10px 13px;border:1px solid #d8c28b;border-radius:9px;background:#264845;color:#fff1ce;font-size:12px;cursor:pointer}
.credit-note{font-size:12px;margin:13px 0 0}
.credit-about{border-top:1px solid #b9dace33;padding-top:25px}
.credit-about p:last-child{margin-bottom:0}
.credit-foot{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:17px 34px;border-top:1px solid #d4b97933;background:#0b2529}
.credit-foot span{font-size:10px;letter-spacing:1.8px;color:#c2d0c2}
#kka-root .credit-foot .g-button{min-height:42px}
#kka-root .credit-panel a:focus-visible,#kka-root .credit-panel button:focus-visible,#kka-root .credit-panel input:focus-visible{outline:3px solid #f4d18b;outline-offset:2px}
@media(max-width:650px){.credit-head{padding:21px 20px 17px}.credit-body{padding:18px 19px}.credit-maker{padding:15px;gap:14px}.credit-portrait{width:75px;height:75px;border-width:3px}.credit-maker h3{font-size:18px}.credit-maker p{font-size:13px}.credit-maker a{font-size:12px}.credit-tracks{grid-template-columns:1fr;gap:9px}.credit-track button{min-height:64px!important}.credit-license{padding-left:45px}.credit-foot{padding:13px 19px}.credit-foot span{display:none}.credit-foot .g-button{width:100%}}
@media(max-width:390px){.credit-maker{align-items:flex-start}.credit-portrait{width:58px;height:58px}.credit-maker nav{gap:4px}.credit-maker a{overflow-wrap:anywhere}.credit-maker h3{font-size:15px}}
@media(max-height:500px) and (orientation:landscape){.credit-head{padding:10px 20px 8px;align-items:center}.credit-head .g-overline{font-size:7px}.credit-head h2{font-size:22px;margin:2px 0}.credit-head p{font-size:10px}.credit-close{width:36px!important;height:36px!important;min-width:36px!important;font-size:22px!important}.credit-body{padding-top:11px;padding-bottom:11px}.credit-maker{padding:11px}.credit-portrait{width:68px;height:68px}.credit-maker h3{font-size:17px;margin:2px 0}.credit-maker p{font-size:11px;margin-bottom:2px}.credit-maker a{font-size:10px}.credit-foot{padding:8px 20px}.credit-foot .g-button{min-height:34px!important}}
