/* ── contributor.css — shared styles for by-contributor pages ── */

/* ── BREADCRUMB ── */
.breadcrumb {
    font-family: 'Press Start 2P', monospace;
    font-size: 7px;
    color: var(--dim);
    letter-spacing: 0.1em;
    margin-top: -8px;
    margin-bottom: 16px;
    align-self: flex-start;
}
.breadcrumb a { color: var(--dim); text-decoration: none; transition: color 0.15s; }
.breadcrumb a:hover { color: var(--cyan); }
.breadcrumb .sep { margin: 0 8px; color: var(--cyan); opacity: 0.7; }
.breadcrumb .current { color: var(--cyan); }

/* ── HEADER ── */
.contrib-header {
    text-align: center;
    margin-bottom: 40px;
}
.contrib-name {
    font-family: 'Press Start 2P', monospace;
    font-size: 14px;
    color: var(--cyan);
    margin: 0 0 8px;
    letter-spacing: 0.05em;
}
.contrib-ids {
    font-family: 'Courier Prime', monospace;
    font-size: 11px;
    color: var(--dim);
    opacity: 0.6;
    margin-top: 6px;
}
.contrib-meta {
    font-family: 'Courier Prime', monospace;
    font-size: 11px;
    color: var(--dim);
    opacity: 0.6;
    margin-top: 4px;
    text-transform: capitalize;
}

/* ── SECTIONS ── */
.section {
    width: min(800px, 95vw);
    margin-bottom: 32px;
}
.section-divider {
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--cyan), transparent);
    margin-bottom: 24px;
    opacity: 0.4;
}
.section-title {
    font-family: 'Press Start 2P', monospace;
    font-size: 8px;
    color: var(--cyan);
    letter-spacing: 0.12em;
    margin-bottom: 16px;
    text-transform: uppercase;
}

/* ── ENTRY CARDS ── */
.entry {
    border: 1px solid #1e1e2e;
    background: var(--deep);
    margin-bottom: 8px;
    transition: border-color 0.15s;
}
.entry:hover { border-color: #2a2a4a; }

.entry-header {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    cursor: pointer;
    user-select: none;
}
.entry-header:hover { background: rgba(0,245,255,0.03); }

.entry-arrow {
    font-family: 'Press Start 2P', monospace;
    font-size: 8px;
    color: var(--dim);
    transition: transform 0.2s;
    flex-shrink: 0;
}
details[open] > .entry-header .entry-arrow { transform: rotate(90deg); }

.entry-name {
    font-family: 'Press Start 2P', monospace;
    font-size: 9px;
    color: var(--white);
    letter-spacing: 0.05em;
    flex: 1;
}
.entry-name a {
    color: var(--white);
    text-decoration: none;
    transition: color 0.15s;
}
.entry-name a:hover { color: var(--cyan); }

.entry-dates {
    font-family: 'Courier Prime', monospace;
    font-size: 11px;
    color: var(--dim);
}

.entry-body {
    padding: 0 16px 14px 36px;
}
.entry-instruments {
    font-family: 'Courier Prime', monospace;
    font-size: 13px;
    color: var(--white);
    line-height: 1.6;
    opacity: 0.8;
}
.entry-instruments .label {
    font-family: 'Press Start 2P', monospace;
    font-size: 6px;
    color: var(--dim);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin-bottom: 4px;
}
.instrument-tag {
    display: inline-block;
    background: #1a1a2e;
    border: 1px solid #2a2a4a;
    padding: 2px 8px;
    margin: 2px 4px 2px 0;
    font-family: 'Courier Prime', monospace;
    font-size: 11px;
    color: var(--cyan);
}
.entry-role {
    font-family: 'Press Start 2P', monospace;
    font-size: 6px;
    color: var(--dim);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin-bottom: 8px;
}

/* ── SIMPLE LIST ── */
.simple-list {
    list-style: none;
    padding: 0;
    margin: 0;
}
.simple-list li {
    padding: 8px 0;
    border-bottom: 1px solid #1a1a1e;
}
.simple-list li:last-child { border-bottom: none; }
.simple-list a {
    font-family: 'Press Start 2P', monospace;
    font-size: 9px;
    color: var(--white);
    text-decoration: none;
    transition: color 0.15s;
}
.simple-list a:hover { color: var(--cyan); }

/* ── CREDIT SECTIONS ── */
.credit-section {
    width: min(800px, 95vw);
    margin-bottom: 32px;
}
.credit-header {
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    user-select: none;
    padding: 8px 0;
}
.credit-header:hover .section-title { color: var(--white); }
.credit-arrow {
    font-family: 'Press Start 2P', monospace;
    font-size: 8px;
    color: var(--dim);
    transition: transform 0.2s;
}
details[open] > .credit-header .credit-arrow { transform: rotate(90deg); }
.credit-count {
    font-family: 'Courier Prime', monospace;
    font-size: 11px;
    color: var(--dim);
}
.credit-list {
    list-style: none;
    padding: 0 0 0 18px;
    margin: 0;
}
.credit-list li {
    font-family: 'Courier Prime', monospace;
    font-size: 12px;
    color: var(--white);
    padding: 4px 0;
    border-bottom: 1px solid #1a1a1e;
    opacity: 0.85;
}
.credit-list li:last-child { border-bottom: none; }
.credit-list a {
    color: var(--white);
    text-decoration: none;
    transition: color 0.15s;
}
.credit-list a:hover { color: var(--cyan); }
.credit-sub {
    color: var(--dim);
    font-size: 10px;
    margin-left: 6px;
}
.credit-versions {
    color: var(--cyan);
    opacity: 0.7;
}

/* ── LOADING / ERROR ── */
.loading {
    font-family: 'Press Start 2P', monospace;
    font-size: 8px;
    color: var(--dim);
    letter-spacing: 0.1em;
    padding: 40px 0;
    text-align: center;
}
.loading::after {
    content: '';
    animation: dots 1.5s steps(4, end) infinite;
}
@keyframes dots {
    0% { content: ''; }
    25% { content: '.'; }
    50% { content: '..'; }
    75% { content: '...'; }
    100% { content: ''; }
}
.error-msg {
    font-family: 'Press Start 2P', monospace;
    font-size: 8px;
    color: var(--rose);
    text-align: center;
    padding: 40px 0;
}

/* ── LINK TO MB ── */
.mb-link {
    display: inline-block;
    margin-top: 40px;
    font-family: 'Press Start 2P', monospace;
    font-size: 7px;
    color: var(--dim);
    text-decoration: none;
    border: 1px solid #2a2a4a;
    padding: 8px 14px;
    letter-spacing: 0.08em;
    transition: color 0.15s, border-color 0.15s;
}
.mb-link:hover { color: var(--cyan); border-color: var(--cyan); }

/* ── STATIC ENTRY DESCRIPTION ── */
.entry-description {
    margin-top: 6px;
    font-size: 8px;
    opacity: 0.8;
}
.entry-description a {
    color: var(--cyan);
}
.entry-description .tag {
    display: inline-block;
    font-family: 'Press Start 2P', monospace;
    font-size: 6px;
    padding: 2px 6px;
    margin-right: 4px;
    border: 1px solid var(--dim);
    opacity: 0.7;
}

/* ── TMDB PROFILE PHOTO ── */
.contrib-profile-photo {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid #2a2a4a;
    margin-bottom: 12px;
    filter: saturate(0.85) brightness(0.9);
    transition: filter 0.2s, border-color 0.2s;
}
.contrib-profile-photo:hover {
    filter: saturate(1) brightness(1);
    border-color: var(--cyan);
}

/* ── TMDB LINK ── */
.tmdb-link {
    margin-left: 10px;
}
.tmdb-link:hover { color: #01b4e4; border-color: #01b4e4; }