.cbtn {
    border-radius: 7px;
    padding: 5px 20px;
    display: inline-block;
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap;
    text-decoration: none;
}

.cbtn-normal {
    border: 2px solid #77F2A1;
    background-color: #1F2B37;
    color: white;
}

    .cbtn-normal:hover {
        box-shadow: inset 0 2px 5px rgba(255, 255, 255, 0.3), 0 0 12px rgba(119, 242, 161, 0.8);
        color: white;
    }

    .cbtn-normal:active {
        box-shadow: inset 0 5px 10px #333, 0 0 8px rgba(119, 242, 161, 0.6);
    }

.cbtn-bright {
    background: linear-gradient(to bottom, #77F2A1, #4CB97D); /* 淺綠到深綠 */
    color: white;
    border: 2px solid #66D193;
    box-shadow: inset 0 0 4px #333, 0 0 8px rgba(119, 242, 161, 0.6);
    transition: all 0.2s ease-in-out;
}

    .cbtn-bright:hover {
        box-shadow: inset 0 2px 5px rgba(255, 255, 255, 0.3), 0 0 12px rgba(119, 242, 161, 0.8);
    }

    .cbtn-bright:active {
        box-shadow: inset 0 5px 10px rgba(0, 0, 0, 0.4), 0 0 4px rgba(77, 152, 112, 0.3);
    }