<style>
.tvri-dashboard{
    max-width:1200px;
    margin:40px auto;
    font-family:'Segoe UI', sans-serif;
}

/* GRID 4 BOX */
.tvri-stats-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
    gap:20px;
    margin-bottom:30px;
}

/* CARD STAT */
.tvri-stat-card{
    padding:25px;
    border-radius:18px;
    color:white;
    position:relative;
    overflow:hidden;
    transition:0.3s ease;
}

.tvri-stat-card:hover{
    transform:translateY(-5px);
    box-shadow:0 15px 30px rgba(0,0,0,0.15);
}

/* WARNA BRANDING TVRI */
.tvri-blue{
    background:linear-gradient(135deg,#0033A0,#0057D9);
}

.tvri-yellow{
    background:linear-gradient(135deg,#FDB913,#FFC72C);
    color:#0033A0;
}

.tvri-darkblue{
    background:linear-gradient(135deg,#001F5B,#0033A0);
}

.tvri-sky{
    background:linear-gradient(135deg,#009FE3,#00BFFF);
}

.tvri-stat-title{
    font-size:14px;
    opacity:0.9;
}

.tvri-stat-number{
    font-size:32px;
    font-weight:700;
    margin-top:5px;
}

.tvri-icon{
    position:absolute;
    right:20px;
    bottom:15px;
    font-size:48px;
    opacity:0.15;
}

/* CHART CARD */
.tvri-chart-card{
    background:white;
    border-radius:20px;
    padding:30px;
    box-shadow:0 10px 30px rgba(0,0,0,0.08);
}

.tvri-chart-title{
    color:#0033A0;
    font-weight:600;
    margin-bottom:20px;
}

.tvri-chart-card{
    height:350px;
}
.canvas{
    height:300px !important;
}
</style>