.container {

    max-width: 430px;

    margin: 0 auto;

    padding: 20px;

}

.match-list {

    display: flex;

    flex-direction: column;

    gap: 20px;

    padding-bottom: 80px;

}

.match-card {

    background: white;

    border: 1px solid #ddd;

    border-radius: 8px;

    padding: 12px;

    cursor: pointer;

    transition: .2s;

}

.match-card:hover {

    box-shadow: 0 4px 12px rgba(0,0,0,.1);

}

.match-header{

    display:flex;

    gap:16px;

    font-size:16px;

    font-weight:600;

    margin-bottom:8px;

}

.match-body{

    display:flex;

    justify-content:space-between;

    align-items:center;

}

.match-player{

    font-size:18px;

    font-weight:600;

}

.match-score{

    font-size:42px;

    font-weight:bold;

}

.fab{

    position:fixed;

    right:24px;

    bottom:24px;

    width:56px;

    height:56px;

    border:none;

    border-radius:50%;

    font-size:28px;

    cursor:pointer;

}