/* Shared Trivia layout: compact toolbar, centred title and right-hand portrait. */
.character-appearances.is-trivia{width:min(680px,calc(100vw - 24px))}
.character-appearances.is-trivia .character-info-header{display:grid;grid-template-columns:64px 40px minmax(0,1fr) 40px 144px;grid-template-rows:auto 1fr;gap:10px;padding:18px 20px 14px;align-items:start;border-bottom:1px solid #345027}
.is-trivia .character-info-toolbar,.is-trivia .character-info-arrows{display:contents}
.is-trivia .character-info-toolbar .character-info-back{grid-column:1;grid-row:1;margin:0;min-height:44px;font-size:1.15rem;padding:5px 7px}
.is-trivia #character-info-previous{grid-column:2;grid-row:1}
.is-trivia #character-info-next{grid-column:4;grid-row:1}
.is-trivia .character-info-arrows button{min-width:40px;min-height:44px}
.is-trivia .character-info-name{grid-column:3;grid-row:1;align-self:center;font-size:2rem;font-weight:700;line-height:1.15;text-align:center;margin:0;overflow-wrap:anywhere}
.is-trivia .character-info-icon{grid-column:5;grid-row:1 / span 2;align-self:start;width:144px;max-width:100%;height:auto}
.character-appearances.is-trivia .character-info-header h2{grid-column:2 / span 3;grid-row:2;align-self:start;margin:6px 0 0;border:0;padding:0;font:400 2rem/1.1 var(--pixel);text-align:center;text-transform:uppercase;color:#a3bd96}
.is-trivia .character-info-facts{display:none}
.is-trivia .character-appearances-content{padding:10px 22px 22px;max-height:calc(100dvh - 245px)}
.is-trivia .character-trivia-list{padding-left:18px;margin:0;list-style:disc}
.is-trivia .character-trivia-list li{padding:14px 2px 14px 4px;border-bottom:1px solid #29401f;font-size:1rem;line-height:1.65;color:#c6d1c0}
.is-trivia .character-trivia-list li::marker{font-size:.65em}
.is-trivia .character-trivia-list li:last-child{border:0;padding-bottom:4px}
@media(max-width:480px){
 .character-appearances.is-trivia .character-info-header{grid-template-columns:52px 44px minmax(0,1fr) 88px;grid-template-rows:auto 44px auto;gap:8px;padding:12px}
 .is-trivia .character-info-name{grid-column:2 / span 2;grid-row:1;font-size:1.65rem}
 .is-trivia .character-info-icon{grid-column:4;grid-row:1 / span 3;width:88px}
 .is-trivia #character-info-previous{grid-column:2;grid-row:2;justify-self:start}
 .is-trivia #character-info-next{grid-column:3;grid-row:2;justify-self:end}
 .is-trivia .character-info-arrows button{min-width:44px}
 .is-trivia .character-info-toolbar .character-info-back{font-size:1rem;padding:4px}
 .character-appearances.is-trivia .character-info-header h2{grid-column:2 / span 2;grid-row:3;font-size:1.6rem;margin:0}
 .is-trivia .character-appearances-content{padding:6px 14px 18px}
 .is-trivia .character-trivia-list li{font-size:.9375rem;padding-top:12px;padding-bottom:12px}
}

/* Every fact list uses the larger readable size, including longer lists. */
.character-appearances.is-trivia .character-trivia-list[data-density] li{font-size:clamp(1.4rem,1.8vw,1.7rem);padding-block:24px;line-height:1.6;overflow-wrap:anywhere}
@media(max-width:1000px){
 .character-appearances.is-trivia .character-trivia-list[data-density] li{font-size:1.25rem;padding-block:19px}
}
