/* ... جميع الأكواد كما هي ... */
        body {
            background: linear-gradient(120deg, #151627 60%, #1a1833 100%);
            min-height: 100vh;
            margin: 0;
            font-family: 'Cairo', sans-serif;
            color: #fff;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        .sub-form {
            background: rgba(31, 34, 66, 0.97);
            border-radius: 20px;
            box-shadow: 0 8px 24px 0 rgba(32,40,86,0.17), 0 1.5px 16px 0 rgba(45,56,140,0.10);
            padding: 38px 28px 22px 28px;
            max-width: 410px;
            width: 90%;
            margin: 0 auto;
            border: 1.5px solid #282d55;
            position: relative;
            overflow: hidden;
        }
        .sub-form::before {
            content: "";
            position: absolute;
            right: -40px;
            top: -30px;
            width: 120px;
            height: 120px;
            background: radial-gradient(circle at 30% 40%, #5e72e4 10%, #15162700 90%);
            opacity: 0.28;
            z-index: 0;
        }
        .sub-form h3 {
            text-align: center;
            color: #d4d7fa;
            letter-spacing: 1.2px;
            font-weight: 800;
            font-size: 1.34em;
            margin-bottom: 22px;
            z-index: 1;
            position: relative;
        }
        .sub-form input, .sub-form select {
            width: 100%;
            margin-bottom: 18px;
            padding: 12px 12px;
            border: 1.5px solid #252962;
            border-radius: 8px;
            background: #23264a;
            color: #fff;
            font-family: 'Cairo',sans-serif;
            font-size: 1.08em;
            transition: border 0.2s, background 0.2s;
            box-shadow: 0 1px 8px 0 rgba(38, 41, 81, 0.06);
            outline: none;
            z-index: 1;
            position: relative;
        }
        .sub-form input:focus, .sub-form select:focus {
            border: 1.5px solid #5e72e4;
            background: #252962;
        }
        .sub-form select {
            appearance: none;
            background-image: url('data:image/svg+xml;utf8,<svg fill="white" height="18" viewBox="0 0 20 20" width="18" xmlns="http://www.w3.org/2000/svg"><path d="M7.293 7.707a1 1 0 0 1 1.414 0L10 9.586l1.293-1.879a1 1 0 1 1 1.414 1.415l-2 2.879a1 1 0 0 1-1.414 0l-2-2.879a1 1 0 0 1 0-1.415z"/></svg>');
            background-repeat: no-repeat;
            background-position: left 12px center;
            padding-left: 36px;
        }
        .sub-form button {
            width: 100%;
            background: linear-gradient(100deg, #5e72e4 60%, #8066f8 100%);
            color: #fff;
            border: none;
            border-radius: 9px;
            padding: 15px 0;
            font-size: 1.14em;
            font-weight: 700;
            cursor: pointer;
            box-shadow: 0 2px 18px 0 rgba(94, 114, 228, 0.15);
            transition: background 0.18s, transform 0.15s;
            margin-top: 5px;
            margin-bottom: 10px;
            z-index: 1;
            position: relative;
        }
        .sub-form button:hover {
            background: linear-gradient(90deg, #3541a1 70%, #5e72e4 100%);
            transform: translateY(-2px) scale(1.022);
        }
        .msg {
            text-align: center;
            font-weight: bold;
            font-size: 1.05em;
            border-radius: 9px;
            margin-bottom: 14px;
            box-shadow: 0 0.5px 7px 0 rgba(49, 63, 170, 0.12);
            padding: 9px 19px;
            z-index: 1;
            position: relative;
            animation: popin 0.6s;
        }
        .payment-note {
            color: #ffdf85;
            text-align: center;
            font-size: 0.97em;
            margin-top: 18px;
            margin-bottom: 4px;
            z-index: 1;
            position: relative;
            letter-spacing: 0.2px;
        }
        @media (max-width: 480px) {
            .sub-form {
                padding: 18px 5%;
                max-width: 95vw;
            }
            .sub-form h3 {
                font-size: 1.2em;
            }
            .sub-form input,
            .sub-form select,
            .sub-form button {
                font-size: 1em;
            }
        }
        @keyframes popin {
            0% {transform: scale(0.93); opacity: 0;}
            75% {transform: scale(1.04);}
            100% {transform: scale(1); opacity: 1;}
        }
        .sub-form input, .sub-form select {
            box-sizing: border-box;
        }
        .sub-form button:active {
            transform: scale(0.98);
        }