body.custom-bg {
    min-height: 100vh;
    background: linear-gradient(135deg, #e0eafc 0%, #cfdef3 100%);
}
.navbar {
    background: linear-gradient(90deg, #007bff 0%, #00c6ff 100%) !important;
}
.card {
    border-radius: 18px;
    border: none;
    background: #fff;
}
.btn-gradient {
    background: linear-gradient(90deg, #007bff 0%, #00c6ff 100%);
    color: #fff;
    border: none;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    transition: transform 0.1s, box-shadow 0.1s;
}
.btn-gradient:hover, .btn-gradient:focus {
    transform: translateY(-2px) scale(1.04);
    box-shadow: 0 4px 16px rgba(0,0,0,0.12);
    color: #fff;
}
.ratio {
    border-radius: 12px;
    overflow: hidden;
    background: #222;
}


.card {
    border-radius: 16px;
    border: none;
}
.bg-secondary {
    border-radius: 12px;
}
.btn {
    min-width: 100px;
    font-weight: 500;
}