*{
            margin:0;
            padding:0;
            box-sizing:border-box;
        }

        :root{
            --primary:#0f172a;
            --secondary:#2563eb;
            --accent:#0ea5e9;
            --gold:#f59e0b;
            --light:#f8fafc;
            --white:#ffffff;
            --text:#1e293b;
            --muted:#64748b;
            --border:#dbeafe;
            --success:#16a34a;
            --danger:#dc2626;
            --shadow:0 12px 30px rgba(0,0,0,0.08);
            --radius:18px;
        }

        body{
            font-family:'Noto Sans Devanagari','Poppins',sans-serif;
            background:linear-gradient(to right,#f8fafc,#eff6ff);
            color:var(--text);
            overflow-x:hidden;
        }

        .container{
            width:92%;
            max-width:1250px;
            margin:auto;
        }

        /* TOP BAR */
        a {
            text-decoration:none;
        }
        .top-bar a{
            color:#e2e8f0;
            text-decoration:none;
            margin-left:15px;
            transition:.3s;
            font-size: 16px;
        }

        .top-bar a:hover{
            color:var(--gold);
        }
        .top-bar{
            background:#020617;
            color:#cbd5e1;
            padding:8px 0;
            font-size:14px;
        }

        .top-flex{
            display:flex;
            justify-content:space-between;
            align-items:center;
            flex-wrap:wrap;
            gap:10px;
        }

        .top-right a{
            color:#e2e8f0;
            text-decoration:none;
            margin-left:15px;
            transition:.3s;
            font-size: 14px;
        }

        .top-right a:hover{
            color:var(--gold);
        }

        /* HEADER */

        .main-header{
            background:linear-gradient(135deg,#0f172a,#1d4ed8);
            padding:25px 0;
            position:relative;
            overflow:hidden;
            border-bottom:4px solid var(--gold);
        }

        .main-header::before{
            content:'';
            position:absolute;
            width:260px;
            height:260px;
            background:rgba(255,255,255,0.06);
            border-radius:50%;
            top:-120px;
            right:-80px;
        }

        .header-grid{
            display:flex;
            justify-content:space-between;
            align-items:center;
            gap:20px;
        }

        .logo-area{
            display:flex;
            align-items:center;
            gap:18px;
        }

        .gov-logo{
            width:100px;
            height:100px;
            border-radius:50%;
            padding:10px;
            background:rgba(255,255,255,0.08);
            object-fit:contain;
        }

        .title-text h1{
            color:#fff;
            font-size:34px;
            font-weight:700;
        }

        .title-text h2{
            color:#dbeafe;
            margin-top:6px;
            font-size:22px;
            font-weight:500;
        }

        .title-text p{
            color:#bfdbfe;
            margin-top:6px;
            font-size:14px;
        }

        .header-icon{
            font-size:72px;
            color:rgba(255,255,255,0.15);
        }

        /* NOTICE */

        .notice-bar{
            background:linear-gradient(to right,#fee2e2,#fef2f2);
            padding:10px 0;
            border-bottom:1px solid #fecaca;
        }

        .notice-flex{
            display:flex;
            align-items:center;
            gap:15px;
        }

        .notice-badge{
            background:linear-gradient(to right,#dc2626,#b91c1c);
            color:#fff;
            padding:6px 15px;
            border-radius:40px;
            font-size:13px;
            font-weight:600;
            white-space:nowrap;
        }

        marquee{
            color:#991b1b;
            font-weight:600;
        }

        /* MAIN */

        .main-content{
            padding:45px 0;
        }

        .portal-grid{
            display:grid;
            grid-template-columns:1.2fr .9fr;
            gap:35px;
        }

        /* LEFT */

        .welcome-box{
            background:#fff;
            padding:30px;
            border-radius:var(--radius);
            box-shadow:var(--shadow);
            border-top:5px solid var(--secondary);
            margin-bottom:25px;
            position:relative;
            overflow:hidden;
        }

        .welcome-box::after{
            content:'';
            position:absolute;
            width:140px;
            height:140px;
            background:rgba(37,99,235,0.05);
            border-radius:50%;
            top:-40px;
            right:-40px;
        }

        .welcome-box h3{
            margin-bottom:14px;
            color:var(--primary);
            font-size:24px;
        }

        .welcome-box p{
            line-height:1.9;
            color:var(--muted);
        }

        /* STATS */

        .stats-grid{
            display:grid;
            grid-template-columns:repeat(2,1fr);
            gap:20px;
        }

        .stat-card{
            background:#fff;
            padding:24px;
            border-radius:var(--radius);
            box-shadow:var(--shadow);
            display:flex;
            align-items:center;
            gap:16px;
            transition:.3s;
            border:1px solid #e2e8f0;
        }

        .stat-card:hover{
            transform:translateY(-5px);
        }

        .stat-icon{
            width:68px;
            height:68px;
            border-radius:18px;
            background:linear-gradient(135deg,#2563eb,#0ea5e9);
            color:#fff;
            display:flex;
            justify-content:center;
            align-items:center;
            font-size:28px;
        }

        .stat-info h4{
            font-size:28px;
            color:var(--primary);
            margin-bottom:4px;
        }

        .stat-info p{
            color:var(--muted);
            font-size:14px;
        }

        /* LOGIN */

        .login-card{
            background:#fff;
            border-radius:24px;
            overflow:hidden;
            box-shadow:0 25px 45px rgba(0,0,0,0.12);
            border:1px solid #dbeafe;
        }

        .login-header{
            background:linear-gradient(135deg,#1e3a8a,#2563eb);
            padding:35px 25px;
            text-align:center;
            position:relative;
        }

        .login-header::before{
            content:'';
            position:absolute;
            width:180px;
            height:180px;
            background:rgba(255,255,255,0.06);
            border-radius:50%;
            top:-80px;
            right:-60px;
        }

        .login-header h3{
            color:#fff;
            font-size:30px;
        }

        .login-header p{
            color:#dbeafe;
            margin-top:8px;
        }

        .login-form{
            padding:35px;
        }

        /* FORM */

        .form-group{
            margin-bottom:20px;
        }

        .form-group label{
            display:block;
            margin-bottom:8px;
            font-weight:600;
            color:var(--text);
        }

        .form-control-asp,
        .input-group input,
        .input-group textarea,
        .input-group select{
            width:100%;
            height:45px;
            border:1px solid #cbd5e1;
            border-radius:12px;
            padding:0 15px 0 45px;
            font-size:15px;
            background:#f8fafc;
            transition:.3s;
            outline:none;
        }

        .form-control-asp{
            padding-left:15px !important;
        }

        .form-control-asp:focus,
        .input-group input:focus{
            border-color:#2563eb;
            background:#fff;
            box-shadow:0 0 0 4px rgba(37,99,235,0.15);
        }

        .input-group{
            position:relative;
            margin-bottom:18px;
        }

        .input-group i{
            position:absolute;
            left:15px;
            top:16px;
            color:#2563eb;
            font-size:16px;
            z-index:9;
        }

        /* CAPTCHA */

        .captcha-flex{
            display:flex;
            gap:10px;
            align-items:center;
            flex-wrap:wrap;
        }

        .captcha-canvas-box{
            border-radius:12px;
            overflow:hidden;
            border:1px solid #cbd5e1;
            background:#f1f5f9;
        }

        .refresh-btn{
            width:50px;
            height:50px;
            border-radius:12px;
            background:#eff6ff;
            color:#2563eb;
            border:1px solid #bfdbfe;
            display:flex;
            justify-content:center;
            align-items:center;
            text-decoration:none;
            transition:.3s;
        }

        .refresh-btn:hover{
            background:#2563eb;
            color:#fff;
        }

        .captcha-input{
            flex:1;
            min-width:180px;
        }

        /* BUTTON */

        .submit-btn,
        .login-btn{
            width:100%;
            height:54px;
            border:none;
            border-radius:14px;
            background:linear-gradient(to right,#16a34a,#15803d);
            color:#fff;
            font-size:18px;
            font-weight:700;
            cursor:pointer;
            transition:.3s;
            box-shadow:0 12px 24px rgba(22,163,74,0.25);
        }

        .submit-btn:hover,
        .login-btn:hover{
            transform:translateY(-2px);
            box-shadow:0 16px 30px rgba(22,163,74,0.35);
        }

        /* ALERT */

        .alert-panel{
            padding:12px;
            border-radius:12px;
            margin-bottom:18px;
        }

        .alert-danger{
            background:#fef2f2;
            color:#b91c1c;
            border:1px solid #fecaca;
        }

        .validation-error{
            color:#dc2626;
            font-size:13px;
            margin-top:5px;
            display:block;
        }

        /* LINKS */

        .form-links{
            margin-top:22px;
            display:flex;
            justify-content:space-between;
            flex-wrap:wrap;
            gap:10px;
        }

        .form-links a{
            text-decoration:none;
            color:#2563eb;
            font-weight:500;
            transition:.3s;
        }

        .form-links a:hover{
            color:#1e40af;
        }

        /* FOOTER */

        .main-footer{
            background:linear-gradient(135deg,#020617,#0f172a);
            color:#cbd5e1;
            padding:18px 0;
            border-top:4px solid var(--gold);
            margin-top:0px;
        }

        .footer-flex{
            display:flex;
            justify-content:space-between;
            align-items:center;
            flex-wrap:wrap;
            gap:10px;
        }

        .developer-credit{
            font-size:14px;
        }

        .developer-credit a{
            color:#fff;
            text-decoration:none;
        }

        .developer-credit a:hover{
            color:#fbbf24;
        }

        /* RESPONSIVE */

        @media(max-width:991px){

            .portal-grid{
                grid-template-columns:1fr;
            }
        }

        @media(max-width:768px){

            .header-grid,
            .logo-area,
            .top-flex,
            .footer-flex{
                flex-direction:column;
                text-align:center;
                gap:12px;
            }

            .stats-grid{
                grid-template-columns:1fr;
            }

            .title-text h1{
                font-size:24px;
            }

            .title-text h2{
                font-size:18px;
            }

            .header-icon{
                display:none;
            }

            .form-links{
                flex-direction:column;
                text-align:center;
            }
        }



           /* MOBILE + OTP DESIGN */

.mobile-otp-wrapper {
    display: flex;
    align-items: center;
    gap: 12px;
}

.mobile-input {
   /* flex: 1;*/
}

/* OTP BUTTON */

.otp-send-btn {
    min-width: 130px;
    height: 45px;
    border: none;
    border-radius: 12px;
    background: linear-gradient(135deg, #16a34a, #15803d);
    color: #fff;
    font-size: 17px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    padding: 0 18px;
    box-shadow: 0 6px 16px rgba(22,163,74,0.25);
}

.otp-send-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 18px rgba(22,163,74,0.35);
}

/* MOBILE VIEW */

@media (max-width:768px) {

    .mobile-otp-wrapper {
        flex-direction: column;
        align-items: stretch;
    }

    .otp-send-btn {
        width: 100%;
    }
}