/* 選手名まとめページ（ef_player_name）。表とカードは same-name-matrix.css / same-name.css を再利用する。 */

.efpd-name-page__matrix,
.efpd-name-page__cards {
    margin: 1.2rem 0 2rem;
}

/* ---- 全カード比較表（same-name-matrix の表を、まとめページ用に一回り大きくする） ----
   表の構造・sticky・縦横スクロールは same-name-matrix.css のまま（行＝カード、ヘッダ行と左端のカード列を固定）。
   ここは寸法だけを上書きする。選手詳細の同名トグル表（同じ class）には影響しないよう、必ず .efpd-name-page__matrix 配下に限る。
   幅の切り替えはビューポートではなく本文の実幅（コンテナクエリ）。 */

.efpd-name-page__matrix {
    container-type: inline-size;
    container-name: efnamematrix;
}

.efpd-name-page__matrix .efpd-same-name-matrix .efpd-same-name-matrix__scroll {
    /* 高さは制限しない（ユーザー指定）。表の中の縦スクロールは無く、動くのは横だけ。ページ側が縦に伸びる。
       sticky のヘッダは縦には効かなくなるが、左端のカード列は横スクロールで固定されたまま */
    max-height: none;
    /* 縦は表の中に持たないので、ホイール・タッチの縦の動きはページへ渡す */
    overscroll-behavior-y: auto;
}

.efpd-name-page__matrix .efpd-same-name-matrix .efpd-same-name-matrix__table {
    font-size: 0.84rem;
    line-height: 1.3;
}

.efpd-name-page__matrix .efpd-same-name-matrix .efpd-same-name-matrix__table th,
.efpd-name-page__matrix .efpd-same-name-matrix .efpd-same-name-matrix__table td {
    padding: 0.42rem 0.55rem;
}

.efpd-name-page__matrix .efpd-same-name-matrix .efpd-same-name-matrix__table thead th {
    font-size: 0.76rem;
}

.efpd-name-page__matrix .efpd-same-name-matrix .efpd-same-name-matrix__table tr > :first-child {
    min-width: 11rem;
    max-width: 14rem;
}

.efpd-name-page__matrix .efpd-same-name-matrix .efpd-same-name-matrix__rowhead {
    gap: 0.6rem;
    padding: 0.45rem 0.6rem;
}

/* カード画像は正方形だとカードが小さく見えるので、カードの縦横比（約1:1.4）の枠にする */
.efpd-name-page__matrix .efpd-same-name-matrix .efpd-same-name-matrix__row-thumb {
    width: 3.2rem;
    height: 4.5rem;
}

.efpd-name-page__matrix .efpd-same-name-matrix .efpd-same-name-matrix__rowlabel {
    font-size: 0.86rem;
}

.efpd-name-page__matrix .efpd-same-name-matrix .efpd-same-name-matrix__rowsub {
    font-size: 0.72rem;
}

.efpd-name-page__matrix .efpd-same-name-matrix .efpd-same-name-matrix__cell.is-text {
    font-size: 0.78rem;
}

/* 本文が狭い（スマホ）ときは、固定する左端の列が画面の半分を占めないよう縮める */
@container efnamematrix (max-width: 30rem) {
    .efpd-name-page__matrix .efpd-same-name-matrix .efpd-same-name-matrix__table tr > :first-child {
        min-width: 8.5rem;
        max-width: 9.5rem;
    }

    .efpd-name-page__matrix .efpd-same-name-matrix .efpd-same-name-matrix__row-thumb {
        width: 2.7rem;
        height: 3.8rem;
    }

    .efpd-name-page__matrix .efpd-same-name-matrix .efpd-same-name-matrix__rowlabel {
        font-size: 0.78rem;
    }

    .efpd-name-page__matrix .efpd-same-name-matrix .efpd-same-name-matrix__rowsub {
        font-size: 0.66rem;
    }
}

/* ---- 小さなカード画像の並び（育成できないカード・同値のほかのカード） ---- */

.efpd-name-page__mini-lead {
    margin: 0.4rem 0 0;
    font-size: 0.86rem;
    font-weight: 700;
}


/* SWELL の .post_content ul（マーカー・左余白）に負けないよう .post_content 付きの2クラスで書く */
.efpd-name-page__mini,
.post_content .efpd-name-page__mini {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 9.5rem), 1fr));
    gap: 0.5rem;
    margin: 0.6rem 0 1.4rem;
    padding: 0;
    list-style: none;
}

.post_content .efpd-name-page__mini > li {
    margin: 0;
    padding: 0;
    list-style: none;
}

.post_content .efpd-name-page__mini > li::before {
    content: none;
}

.efpd-name-page__mini a {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.35rem 0.5rem;
    border: 1px solid var(--efpd-border);
    border-radius: 0.5rem;
    background: var(--efpd-surface);
    color: inherit;
    text-decoration: none;
}

.efpd-name-page__mini-thumb {
    display: block;
    flex-shrink: 0;
    width: 2.2rem;
    height: 3.1rem;
    overflow: hidden;
    border-radius: 0.3rem;
    background: var(--efpd-surface-muted);
}

.efpd-name-page__mini-thumb img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.efpd-name-page__mini-text {
    min-width: 0;
    font-size: 0.76rem;
    font-weight: 700;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

/* ---- 当たり度の順: ガチャ詳細の当たり選手ランキング（.efpd-prank）にカード画像の列を足す ---- */

.post_content .efpd-prank-list .efpd-prank-item.has-thumb,
.efpd-prank-list .efpd-prank-item.has-thumb {
    grid-template-columns: 2.2rem 2.6rem minmax(0, 1fr) auto;
    align-items: center;
}

.efpd-prank-item__thumb {
    display: block;
    width: 2.6rem;
    height: 3.6rem;
    overflow: hidden;
    border-radius: 0.3rem;
    background: var(--efpd-surface-muted);
}

.efpd-prank-item__thumb img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

/* 幅が狭いときは gacha-odds.css が「順位 / 本文」の2列に折る。画像は順位の下ではなく本文の左に置く */
@container efprank (max-width: 26rem) {
    .post_content .efpd-prank-list .efpd-prank-item.has-thumb,
    .efpd-prank-list .efpd-prank-item.has-thumb {
        grid-template-columns: 2.2rem 2.6rem minmax(0, 1fr);
    }

    .efpd-prank-item.has-thumb .efpd-prank-item__score {
        grid-column: 2 / -1;
    }
}

/* ---- 育成セクションの選手項目（ガチャ詳細と同じ部品）: まとめページではポジション適性マップを出さない ----
   ガチャ詳細の視覚部品をそのまま使うが、マップを外して「カード / 能力値」の2列のままにする
   （ガチャ詳細の広い幅で3列になる規則を、.efpd-name-page__group 付きで打ち消す）。gacha-odds.css の後に読まれる。 */

.efpd-name-page__group .efpd-gacha-auto__viz {
    grid-template-columns: var(--efpd-card-w) minmax(0, 1fr);
    gap: 0.6rem 0.9rem;
    margin: 0.4rem 0 0.4rem;
    padding: 0.7rem 0.8rem;
}
