﻿
        /* Scoped, non-invasive modern login styles */
        #login-screen { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 2000; background: radial-gradient(1200px 600px at 10% 20%, rgba(255,255,255,0.06), transparent), linear-gradient(180deg,#0f4ef0 0%, #1c77ff 60%); }
        #login-screen .login-wrap { display:flex; align-items:center; justify-content:center; width:100%; height:100%; padding:32px; }
        #login-screen .login-card { width:100%; max-width:1200px; border-radius:20px; padding:0; overflow:visible; display:flex; box-shadow: none; background: transparent; border: none; color: #ffffff; }
        #login-screen .login-left { width: 56%; padding:48px 44px; background: transparent; }
        #login-screen .login-right { width:44%; background: transparent; padding:40px; display:flex; flex-direction:column; gap:18px; align-items:center; justify-content:center; }
        #login-screen .login-logo { display:flex; align-items:center; gap:12px; font-size:0; margin-bottom:6px; }
        #login-screen .login-subtitle { color: rgba(17,24,39,0.9); margin-bottom: 18px; font-size:15px; }
        /* Hero (left) styles to match sample */
        #login-screen .hero { position: relative; padding: 6px 0 12px 0; }
        #login-screen .hero-blob { position: absolute; left: -80px; top: -80px; width: 420px; height: 420px; background: radial-gradient(circle at 30% 30%, #ff5f5f 0%, #1c77ff 35%, transparent 60%); border-radius: 48%; filter: blur(28px); opacity: 0.95; transform: rotate(-12deg); pointer-events: none; }
        #login-screen .hero-title { font-size:64px; line-height:0.95; color: #ffffff; font-weight:800; margin: 28px 0 12px 0; }
        #login-screen .hero-sub { font-size:20px; color: rgba(255,255,255,0.92); margin-bottom:18px; }
        #login-screen .hero-ctas { display:flex; gap:14px; margin-top:6px; }
        #login-screen .hero-btn { padding:14px 22px; border-radius:999px; font-weight:800; font-size:15px; cursor:pointer; border: 2px solid rgba(255,255,255,0.12); }
        #login-screen .hero-btn-outline { background: transparent; color: #fff; border: 2px solid rgba(255,255,255,0.18); }
        #login-screen .hero-btn-solid { background: #fff; color: var(--primary-blue); border: none; box-shadow: 0 12px 36px rgba(2,6,23,0.06); }
        @media (max-width: 900px) { #login-screen .hero-title { font-size:34px; } }
        #login-screen .form-group { margin-top:10px; text-align:left; width:100%; }
        #login-screen .form-label { color: rgba(15,23,42,0.7); font-size:13px; margin-bottom:6px; display:block; }
        #login-screen .input-icon { display:flex; align-items:center; gap:12px; background: #fbfdff; padding:12px 14px; border-radius:12px; border: 1px solid rgba(15,23,42,0.06); transition: box-shadow 0.16s ease, border-color 0.16s ease, transform 0.12s ease; }
        #login-screen .input-icon i { color: rgba(15,23,42,0.56); width:20px; text-align:center; }
        #login-screen .input-icon input, #login-screen select.login-select { background: transparent; border: none; outline: none; color: #0f172a; font-size:15px; width:100%; }
        #login-screen .input-icon input::placeholder { color: rgba(15,23,42,0.45); }
        #login-screen .login-hidden { display:none !important; }
        #login-screen .form-group:focus-within .input-icon { border-color: var(--primary-blue); box-shadow: 0 10px 30px rgba(28,119,255,0.12); transform: translateY(-2px); }
        #login-screen select.login-select { -webkit-appearance: none; appearance: none; }
        #login-screen .login-btn { margin-top:16px; padding:14px 18px; border-radius:12px; background: var(--primary-blue); color:#ffffff; font-weight:800; border:none; cursor:pointer; box-shadow: 0 10px 30px rgba(28,119,255,0.18); transition: transform 0.12s ease, box-shadow 0.12s ease; }
        #login-screen .login-btn:hover { transform: translateY(-2px); box-shadow: 0 20px 50px rgba(28,119,255,0.18); }
        #login-screen .login-note { font-size:13px; color: rgba(15,23,42,0.6); margin-top:8px; }
        #login-screen #login-error { color: #9b1111; background: rgba(255,235,235,0.8); padding:8px 12px; border-radius:10px; margin-top:12px; display:none; border:1px solid rgba(155,17,17,0.08); }
        #login-screen .brand-tag { font-weight:700; color: rgba(15,23,42,0.9); font-size:13px; }
        #login-screen .decor-circles { position:absolute; inset: -10% -10% auto auto; pointer-events:none; }
        #login-screen .login-left::before { content: ''; position: absolute; left: 44px; top: 24px; bottom: 24px; width: 4px; border-radius:4px; background: linear-gradient(180deg, rgba(28,119,255,0.12), rgba(28,119,255,0.04)); pointer-events:none; }
        #login-screen .login-card { position: relative; overflow: visible; }
        #login-screen .decor-circles span { position:absolute; border-radius:50%; opacity:0.12; filter: blur(30px); }
        #login-screen .decor-circles .c1 { width:420px; height:420px; right:4%; top:6%; background: #fff; }
        #login-screen .decor-circles .c2 { width:260px; height:260px; right:22%; top:40%; background:#ffd05b; opacity:0.08; }
        @media (max-width: 900px) {
            #login-screen .login-card { flex-direction:column; width:92%; }
            #login-screen .login-left, #login-screen .login-right { width:100%; }
            #login-screen .login-left { padding:28px; }
            #login-screen .login-right { padding:20px; }
        }

        #idgov-screen { position: fixed; inset: 0; z-index: 2001; display:none; background: radial-gradient(1200px 600px at 10% 20%, rgba(255,255,255,0.06), transparent), linear-gradient(180deg,#0f4ef0 0%, #1c77ff 60%); }
        #idgov-screen .wrap { display:flex; align-items:center; justify-content:center; width:100%; height:100%; padding:32px; }
        #idgov-screen .card { width:100%; max-width:920px; background: rgba(255,255,255,0.96); border-radius: 20px; padding: 22px; color: #0f172a; box-shadow: 0 20px 40px rgba(0,0,0,0.2); }
        #idgov-screen .top { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom: 12px; }
        #idgov-screen .title { font-weight: 900; font-size: 18px; }
        #idgov-screen .step { display:none; }
        #idgov-screen .step.active { display:block; }
        #idgov-screen .btnrow { display:flex; gap:10px; justify-content:flex-end; margin-top: 14px; }
        #idgov-screen .list { display:flex; flex-direction:column; gap:8px; max-height: 340px; overflow:auto; padding-top: 8px; }
        #idgov-screen .list-item { padding:10px 12px; background: #fff; border: 1px solid rgba(15,23,42,0.08); border-radius: 12px; cursor:pointer; font-weight: 700; }
        #idgov-screen .list-item:hover { border-color: rgba(28,119,255,0.35); box-shadow: 0 12px 30px rgba(28,119,255,0.10); }
    
