.nnp-container {
    font-family: 'Poppins', sans-serif;
    max-width: 600px;
    margin: 40px auto;
    color: #333;
}
.nnp-card {
    background: #fff;
    padding: 30px;
    border-radius: 20px;
    box-shadow: 0 15px 35px rgba(0,0,0,0.1);
    background: linear-gradient(145deg, #ffffff, #f0f0f0);
}
.nnp-card h2 { text-align: center; color: #4a148c; margin-bottom: 25px; }
.nnp-field { margin-bottom: 15px; }
.nnp-field label { display: block; font-weight: 600; margin-bottom: 5px; font-size: 14px; }
.nnp-field input { 
    width: 100%; padding: 12px; border: 2px solid #e0e0e0; border-radius: 10px; transition: 0.3s;
}
.nnp-field input:focus { border-color: #6a1b9a; outline: none; }
#nnp-submit {
    width: 100%; padding: 15px; background: linear-gradient(45deg, #6a1b9a, #8e24aa);
    color: #fff; border: none; border-radius: 10px; font-weight: 700; cursor: pointer; transition: 0.3s;
}
#nnp-submit:hover { transform: translateY(-2px); box-shadow: 0 5px 15px rgba(106, 27, 154, 0.4); }

.nnp-report-card { margin-top: 30px; animation: fadeIn 0.5s ease-in; }
.nnp-alert { padding: 15px; border-radius: 10px; margin-bottom: 20px; font-weight: 600; text-align: center; }
.nnp-success { background: #e8f5e9; color: #2e7d32; }
.nnp-warning { background: #fff3e0; color: #ef6c00; }

.nnp-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 20px; }
.nnp-stat { background: #f5f5f5; padding: 15px; border-radius: 12px; text-align: center; }
.nnp-stat span { display: block; font-size: 11px; text-transform: uppercase; color: #777; }
.nnp-stat strong { font-size: 24px; color: #4a148c; }

.progress-bar { background: #eee; height: 10px; border-radius: 5px; margin: 5px 0 15px; overflow: hidden; }
.progress { background: #8e24aa; height: 100%; transition: width 1s ease; }

@keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }