/* ── the whole discography ───────────────────────────────────────────────
   The artist page's "All". Nearly all of it is the app's own parts — .sec,
   .segtabs, .row, .eds/.ed, .more-link, .btn — so what is here is the head,
   the year written into the list where the desktop has a sticky rail, the
   editions line under a record, and the editions themselves widened out of
   the record page's 210px rail into the width this list already has. */
.dg-head { display: flex; align-items: center; gap: 12px; padding: 12px var(--pad) 6px; }
.dg-head .b { flex: 1; min-width: 0; }
.dg-head .t { font-size: 18px; font-weight: 800; letter-spacing: -0.2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dg-head .m { font-size: 12.5px; color: var(--text-muted); margin-top: 2px; }
.dg-por {
    width: 44px; height: 44px;
    border-radius: 50%;
    overflow: hidden;
    flex: none;
    background: var(--surface);
    box-shadow: var(--ring);
    display: grid;
    place-items: center;
    color: var(--text-muted);
}
.dg-por img { width: 100%; height: 100%; object-fit: cover; }
.dg-sec { padding-top: 12px; }
/* the year. A phone list is read top to bottom, so the span the desktop's
   rail jumps to is simply written into it. */
.dg-group {
    padding: 16px var(--pad) 5px;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.4px;
    color: var(--text-secondary);
    font-variant-numeric: tabular-nums;
}
.dg-group em { font-style: normal; font-weight: 650; letter-spacing: 0; color: var(--text-muted); }
/* both of these line up under the row's TITLE, not under its cover: the
   pad, the 46px cover and the row's 12px gap */
.dg-eline {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 0 var(--pad) 9px calc(var(--pad) + 58px);
    font-size: 12px;
    font-weight: 750;
    color: var(--accent-hover);
}
.dg-eds { display: flex; flex-direction: column; gap: 6px; padding: 0 var(--pad) 12px calc(var(--pad) + 58px); }
.dg-eds .ed { width: 100%; }