/* Final tidy-up layer: loaded last, so it can align and declutter without rewriting earlier files. */

/* Class cards line up: same photo height and title baseline across the row. */
@media(min-width:1101px){.class-card:nth-child(2),.class-card:nth-child(3){padding-top:0}}

/* Floating page dock: compact on desktop, just a "back to top" button on phones. */
.scroll-dock{gap:10px;padding:6px 6px 6px 14px;border-color:#ffffff26}
.scroll-chapter{min-width:0;color:#c4baac}
@media(max-width:850px){
 .scroll-dock{right:14px;bottom:14px;padding:0;gap:0;border:0;background:none;box-shadow:none;backdrop-filter:none}
 .scroll-dock .scroll-chapter,.scroll-dock button{display:none}
 .scroll-dock a{width:44px;height:44px;border-radius:50%;box-shadow:0 6px 20px #0008}
}

/* Stories: tidy counter row; keep the edge arrows clear of the cards' sound icons. */
.stories-controls{align-items:center}
.stories-controls p{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.story-card{border-radius:4px;overflow:hidden;transition:border-color .25s}
.story-card:has(.story-sound[aria-pressed=true]){border-color:var(--lime)}
@media(max-width:600px){
 .stories-controls{flex-wrap:nowrap}
 .stories-controls p{flex:1;min-width:0}
 .stories-stage .stories-arrow{top:calc(50% - 16px)}
}