body {
            font-family: 'Google Sans', Arial, sans-serif;
            background:#f1f3f4;
            margin:0;
            padding:0;
            display:flex;
            justify-content:center;
            align-items:center;
            min-height:100vh;
        }
        .form-container {
            width:90%;
            max-width:800px;
            margin: 24px auto;
            background: white;
            border: 18px dashed whitesmoke;
            border-radius:8px;
            box-shadow:0 4px 10px rgba(0,0,0,0.1);
        }
        
        h2 {
            font-weight:500;
            color:#202124;
            margin-bottom:20px;
            text-align:center;
        }
        label {
            font-size:14px;
            color:#5f6368;
            margin-bottom:6px;
            margin: auto;
            display:block;
            text-align: left;
            width: 93%;
        }
        ::placeholder {
            color: #999; /* A light grey color */
            opacity: 0.8; /* Fixes Firefox's default lower opacity */
        }
        input[type="text"], 
        input[type="email"], 
        input[type="password"], 
        input[type="file"] {
            width:90%;
            margin:0 auto 20px auto;
            display:block;
            padding:12px;
            border:1px solid #dadce0;
            border-radius:4px;
            font-size:14px;
            transition:border-color 0.2s;
        }
        input:focus { border-color:#1a73e8; outline:none; }
        .password-wrapper {
            width:80%; margin:0 auto 20px auto; position:relative;
        }
        .password-wrapper input {
            width:100%; padding-right:40px;
        }
        .toggle-eye {
            position:absolute; right:10px; top:50%; transform:translateY(-50%);
            cursor:pointer; font-size:18px; color:#000; display:none;
        }
        button {
            background:#1a73e8;
            color:#fff;
            padding:12px 20px;
            border:none;
            border-radius:4px;
            cursor:pointer;
            font-size:14px;
            font-weight:500;
            width:84%;
            display:block;
            margin:20px auto;
        }
        button:hover { background:#1669c1; }
        .notice {
            background:#fff3cd;
            color:#856404;
            padding:10px;
            border-radius:4px;
            margin:0 auto 20px auto;
            width:80%;
            text-align:left;
            font-size:13px;
        }
        .popup {
            display:none; position:fixed; top:0; left:0; width:100%; height:100%;
            background:rgba(0,0,0,0.4); justify-content:center; align-items:center;
        }
        .popup-content {
            background:#fff; padding:20px; border-radius:8px; text-align:center;
            box-shadow:0 4px 12px rgba(0,0,0,0.2); max-width:400px;
        }
        .popup-content p { margin-bottom:15px; font-size:14px; }
        .popup-content button {
            background:#1a73e8; color:#fff; border:none; padding:8px 16px;
            border-radius:4px; cursor:pointer;
        }
        .popup-content button:hover { background:#1558c0; }
        .success-msg { color:#137333; }
        .error-msg { color:#c5221f; }
        
        
        
        @media (max-width: 600px) {
 .form-container {
            width: 84%;
            border-color: #FBF6F6;
            box-shadow: none;
        }
}