/*
 * My Comics — front-end styles
 * DOM IDs/classes mirror Comic Easel so your existing theme CSS (comicpress) keeps working.
 * Extend freely here for v1.1+ aesthetic upgrades.
 */

#comic-wrap { margin: 0 auto; text-align: center; max-width: 100%; }
#comic img { max-width: 100%; height: auto; display: inline-block; }

#comic-nav-wrapper { margin: 0.75rem auto; border-collapse: collapse; width: 100%; max-width: 760px; }
#comic-nav-wrapper td.comic-nav { padding: 0.4rem 0.6rem; text-align: center; }
#comic-nav-wrapper td.comic-nav a {
    display: inline-block;
    padding: 0.35rem 0.8rem;
    background: #2b2b2b;
    color: #fff;
    text-decoration: none;
    border-radius: 4px;
    transition: background .15s ease;
}
#comic-nav-wrapper td.comic-nav a:hover { background: #444; }
#comic-nav-wrapper td.comic-nav-void span { color: #999; }

.comic-chapter { font-size: 0.9rem; color: #555; margin: 0.25rem 0; }
.comic-transcript { margin-top: 1.5rem; padding: 1rem; background: #f6f6f6; border-left: 4px solid #333; }

.my-comics-cast { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 0.5rem; }
.my-comics-cast .cast-item a { display: block; padding: 0.25rem 0.5rem; background: #eee; border-radius: 4px; }

.my-comics-archive .my-comics-chapter { margin-top: 1rem; font-size: 1.15rem; }