#game-container {
display: grid;
grid-template-columns: repeat(3, 100px);
gap: 5px;
margin-bottom: 5px;
}
/* タイルのスタイル */
.tile {
    width: 100px;
    height: 100px;
    background: linear-gradient(145deg, #e0b085, #f5d6b4); /* 夕焼け系の温かみあるグラデーション */
    border: 2px solid #e0b085; /* 柔らかな茶色・アンバー系 */
    border-radius: 12px;
    box-shadow: 4px 4px 8px rgba(120, 72, 35, 0.3), /* 夕焼けに合う深めの影色 */
                inset -2px -2px 4px rgba(255, 245, 230, 0.3);
    cursor: pointer;
    transition: all 0.3s ease-in-out;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 26px;
    font-weight: bold;
    color: #fff5eb; /* 優しく読みやすい白 */
    font-family: "Playfair Display", serif;
padding: 0; /* ← 余白を消す */
}

.tile:hover {
    background: linear-gradient(145deg, #f5d6b4, #e0b085);
    box-shadow: 6px 6px 12px rgba(120, 72, 35, 0.4),
                inset -3px -3px 5px rgba(255, 245, 230, 0.4);
    transform: scale(1.05);
}


/* 空白タイルのデザイン */

.tile:disabled {
background-color: #ccc;
}
/* 空白のタイルのスタイル */
.tile.empty {
    background: linear-gradient(145deg, #222, #444);
    border: 2px solid #111;
    box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.5);
    cursor: default;
}
/* メッセージ表示のスタイル */
#messagexc {
margin: 10px 0;
font-weight: bold;
color: #4caf50;
}
/* ボタンのスタイル */
#newGame {
    background: linear-gradient(145deg, #b29562, #e6c68e); /* ゴールドの光沢 */
    border: 2px solid #8b6f47; /* 深みのあるゴールドの枠 */
    color: white;
    font-size: 22px;
    font-weight: bold;
    font-family: "Playfair Display", serif; /* エレガントなフォント */
    padding: 12px 24px;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease-in-out;
    box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.3), 
                inset -2px -2px 4px rgba(255, 255, 255, 0.2);
    text-transform: uppercase;
}

/* ホバー時 */
#newGame:hover {
    background: linear-gradient(145deg, #e6c68e, #b29562);
    box-shadow: 6px 6px 12px rgba(0, 0, 0, 0.4),
                inset -3px -3px 5px rgba(255, 255, 255, 0.3);
    transform: scale(1.05);
}

/* クリック時 */
#newGame:active {
    background: linear-gradient(145deg, #a07d4d, #d4af75);
    box-shadow: inset 2px 2px 6px rgba(0, 0, 0, 0.4);
    transform: scale(0.98);
}