/*
t8‑tournament-system/friendly-match/nikkan-1/sub-page/sub.css
常時ダークモード
*/




/* h1 タイトル */
.t8-nikkan1-match-title {
    align-self: center !important;
    text-align: center !important;

}



/*
========================================
CURRENT SCORE（勝利カウンター）
========================================
*/

.t8-nikkan1-current-score {

    margin-bottom:30px;
    padding:20px;

    border:1px solid #ddd;
    border-radius:12px;

    text-align:center;

}


.t8-nikkan1-score-title {

    font-size:12px;
    letter-spacing:2px;
    color:#888;
    margin-bottom:10px;

}


.t8-nikkan1-score-board {

    display:flex;
    justify-content:center;
    align-items:center;
    gap:18px;

}


.t8-nikkan1-score-team {
    font-size:18px;
    font-weight:700;
    transform: translateY(4px); /* ← チーム名だけ少し下げる */
}


/* 勝利カウンターの数字：ゆっくり浮かび上がる */
.t8-nikkan1-score-number {
    font-size:36px;
    font-weight:900;
    opacity: 0;
    animation: t8Nikkan1ScoreFadeUp 1.3s ease-out forwards;
}

@keyframes t8Nikkan1ScoreFadeUp {
    0% { opacity: 0; transform: translateY(14px); }
    40% { opacity: 0.6; transform: translateY(7px); }
    100% { opacity: 1; transform: translateY(0); }
}


.t8-nikkan1-score-vs {

    font-size:22px;
    color:#999;

}



/* 結果の文字 上 */

.t8-nikkan1-match-number {
    display:inline-block;
    padding:4px 12px 2px;
    font-size:12px;
    letter-spacing:1px;
    color:#777;
    border:1px solid #ddd;
    border-radius:20px;
    margin-bottom:10px;
}




/* ○ × をゆっくり浮かび上がる */
.t8-nikkan1-result-mark {
    font-weight:800;
    opacity: 0;
    animation: t8Nikkan1ResultFadeUp 1.3s ease-out forwards;
    animation-delay: 0.4s; /* ← 好きに調整可能（score より少し遅らせると綺麗） */
}

@keyframes t8Nikkan1ResultFadeUp {
    0%   { opacity: 0; transform: translateY(14px); }
    40%  { opacity: 0.6; transform: translateY(7px); }
    100% { opacity: 1; transform: translateY(0); }
}



/*
========================================
Game結果（1行）
========================================
*/

.t8-nikkan1-game-row {

}

/*
========================================
Game番号
========================================
*/

.t8-nikkan1-game-number {

    display:inline-block;

    min-width:56px;

    font-size:13px;
    font-weight:600;

    color:#888;

}


/*
========================================
試合最終結果
========================================
*/

.t8-nikkan1-match-final-result {


}


/*
========================================
最終スコア
========================================
*/

.t8-nikkan1-final-score {

    font-size:20px;
    font-weight:700;

    letter-spacing:1px;

}




/* 参加者名前 */
.t8-nikkan1-player-name {
    display: block;
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 2px;
}

/* 使用キャラ名 */
.t8-nikkan1-player-char {
    display: block;
    font-size: 14px;
    opacity: 0.8;
}


/*
========================================
MATCH LIST （試合一覧）
========================================
*/

.t8-nikkan1-match-list {

    display:flex;
    flex-direction:column;
    gap:18px;

}


.t8-nikkan1-match-card {

    padding:20px;

    border:1px solid #ddd;
    border-radius:12px;


}


.t8-nikkan1-match-header {

    text-align:center;
    margin-bottom:0px;

}


.t8-nikkan1-match-body {

    display:flex;
    justify-content:space-between;
    align-items:flex-start;

    gap:30px;

}


.t8-nikkan1-match-player {

    flex:1;
    text-align:center;

}


.t8-nikkan1-game-result {

    min-width:180px;
    text-align:center;

}


/* スマホ用（画面幅 768px 以下） */
@media screen and (max-width: 768px) {



    /* 勝利カウンターの数字を少し小さく */
    .t8-nikkan1-score-number {
        font-size: 28px;
    }

    /* VS の文字も少し小さく */
    .t8-nikkan1-score-vs {
        font-size: 18px;
    }

    /* チーム名のフォントサイズ調整 */
    .t8-nikkan1-score-team {
        font-size: 16px;
    }

    /* スコアボードの間隔を縮める */
    .t8-nikkan1-score-board {
        gap: 10px;
    }

    /* 試合カードの余白を少し減らす */
    .t8-nikkan1-match-card {
        padding: 14px;
    }

    /* 試合結果の横幅を縮める */
    .t8-nikkan1-game-result {
        min-width: 120px;
    }

    /* 試合の左右配置を縦並びにする（スマホで見やすい） */
    .t8-nikkan1-match-body {
        flex-direction: column;
        gap: 14px;
        align-items: center;
    }

    /* プレイヤー名のフォントサイズ調整 */
    .t8-nikkan1-player-name {
        font-size: 16px;
    }

    .t8-nikkan1-player-char {
        font-size: 13px;
    }
}
